@superset-ui/core/esm/hooks/useTruncation/useCSSTextTruncation.js

Superset UI core

function _EMOTION_STRINGIFIED_CSS_ERROR__() {return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop).";} /**
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *   http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing,
 * software distributed under the License is distributed on an
 * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
 * KIND, either express or implied.  See the License for the
 * specific language governing permissions and limitations
 * under the License.
 */

import { css } from '@emotion/react';
import { useEffect, useRef, useState } from 'react';

/**
 * Importable CSS that enables text truncation on fixed-width block
 * elements.
 */
export const truncationCSS = process.env.NODE_ENV === "production" ? { name: "l8l8b8", styles: "white-space:nowrap;overflow:hidden;text-overflow:ellipsis" } : { name: "u6p4lb-truncationCSS", styles: "white-space:nowrap;overflow:hidden;text-overflow:ellipsis;label:truncationCSS;", map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9ob29rcy91c2VUcnVuY2F0aW9uL3VzZUNTU1RleHRUcnVuY2F0aW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQTBCZ0MiLCJmaWxlIjoiLi4vLi4vLi4vc3JjL2hvb2tzL3VzZVRydW5jYXRpb24vdXNlQ1NTVGV4dFRydW5jYXRpb24udHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIExpY2Vuc2VkIHRvIHRoZSBBcGFjaGUgU29mdHdhcmUgRm91bmRhdGlvbiAoQVNGKSB1bmRlciBvbmVcbiAqIG9yIG1vcmUgY29udHJpYnV0b3IgbGljZW5zZSBhZ3JlZW1lbnRzLiAgU2VlIHRoZSBOT1RJQ0UgZmlsZVxuICogZGlzdHJpYnV0ZWQgd2l0aCB0aGlzIHdvcmsgZm9yIGFkZGl0aW9uYWwgaW5mb3JtYXRpb25cbiAqIHJlZ2FyZGluZyBjb3B5cmlnaHQgb3duZXJzaGlwLiAgVGhlIEFTRiBsaWNlbnNlcyB0aGlzIGZpbGVcbiAqIHRvIHlvdSB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGVcbiAqIFwiTGljZW5zZVwiKTsgeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZVxuICogd2l0aCB0aGUgTGljZW5zZS4gIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLFxuICogc29mdHdhcmUgZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW5cbiAqIFwiQVMgSVNcIiBCQVNJUywgV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZXG4gKiBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLiAgU2VlIHRoZSBMaWNlbnNlIGZvciB0aGVcbiAqIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmQgbGltaXRhdGlvbnNcbiAqIHVuZGVyIHRoZSBMaWNlbnNlLlxuICovXG5cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IHVzZUVmZmVjdCwgdXNlUmVmLCB1c2VTdGF0ZSwgUmVmT2JqZWN0IH0gZnJvbSAncmVhY3QnO1xuXG4vKipcbiAqIEltcG9ydGFibGUgQ1NTIHRoYXQgZW5hYmxlcyB0ZXh0IHRydW5jYXRpb24gb24gZml4ZWQtd2lkdGggYmxvY2tcbiAqIGVsZW1lbnRzLlxuICovXG5leHBvcnQgY29uc3QgdHJ1bmNhdGlvbkNTUyA9IGNzc2BcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgb3ZlcmZsb3c6IGhpZGRlbjtcbiAgdGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7XG5gO1xuXG4vKipcbiAqIFRoaXMgaG9vayBlbmNhcHN1bGF0ZXMgbG9naWMgc3VwcG9ydGluZyB0cnVuY2F0aW9uIG9mIHRleHQgdmlhXG4gKiB0aGUgQ1NTIFwidGV4dC1vdmVyZmxvdzogZWxsaXBzaXM7XCIgZmVhdHVyZS4gIEdpdmVuIHRoZSB0ZXh0IGNvbnRlbnRcbiAqIHRvIGJlIGRpc3BsYXllZCwgdGhpcyBob29rIHJldHVybnMgYSByZWYgdG8gYXR0YWNoIHRvIHRoZSB0ZXh0XG4gKiBlbGVtZW50IGFuZCBhIGJvb2xlYW4gZm9yIHdoZXRoZXIgdGhhdCBlbGVtZW50IGlzIGN1cnJlbnRseSB0cnVuY2F0ZWQuXG4gKi9cbmNvbnN0IHVzZUNTU1RleHRUcnVuY2F0aW9uID0gPFQgZXh0ZW5kcyBIVE1MRWxlbWVudD4oKTogW1xuICBSZWZPYmplY3Q8VD4sXG4gIGJvb2xlYW4sXG5dID0+IHtcbiAgY29uc3QgW2lzVHJ1bmNhdGVkLCBzZXRJc1RydW5jYXRlZF0gPSB1c2VTdGF0ZSh0cnVlKTtcbiAgY29uc3QgcmVmID0gdXNlUmVmPFQ+KG51bGwpO1xuICBjb25zdCBbb2Zmc2V0V2lkdGgsIHNldE9mZnNldFdpZHRoXSA9IHVzZVN0YXRlKDApO1xuICBjb25zdCBbc2Nyb2xsV2lkdGgsIHNldFNjcm9sbFdpZHRoXSA9IHVzZVN0YXRlKDApO1xuXG4gIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSByZWFjdC1ob29rcy9leGhhdXN0aXZlLWRlcHNcbiAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICBzZXRPZmZzZXRXaWR0aChyZWYuY3VycmVudD8ub2Zmc2V0V2lkdGggPz8gMCk7XG4gICAgc2V0U2Nyb2xsV2lkdGgocmVmLmN1cnJlbnQ/LnNjcm9sbFdpZHRoID8/IDApO1xuICB9KTtcblxuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIHNldElzVHJ1bmNhdGVkKG9mZnNldFdpZHRoIDwgc2Nyb2xsV2lkdGgpO1xuICB9LCBbb2Zmc2V0V2lkdGgsIHNjcm9sbFdpZHRoXSk7XG5cbiAgcmV0dXJuIFtyZWYsIGlzVHJ1bmNhdGVkXTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IHVzZUNTU1RleHRUcnVuY2F0aW9uO1xuIl19 */", toString: _EMOTION_STRINGIFIED_CSS_ERROR__ };





/**
 * This hook encapsulates logic supporting truncation of text via
 * the CSS "text-overflow: ellipsis;" feature.  Given the text content
 * to be displayed, this hook returns a ref to attach to the text
 * element and a boolean for whether that element is currently truncated.
 */
const useCSSTextTruncation = () =>


{
  const [isTruncated, setIsTruncated] = useState(true);
  const ref = useRef(null);
  const [offsetWidth, setOffsetWidth] = useState(0);
  const [scrollWidth, setScrollWidth] = useState(0);

  // eslint-disable-next-line react-hooks/exhaustive-deps
  useEffect(() => {var _ref$current$offsetWi, _ref$current, _ref$current$scrollWi, _ref$current2;
    setOffsetWidth((_ref$current$offsetWi = (_ref$current = ref.current) == null ? void 0 : _ref$current.offsetWidth) != null ? _ref$current$offsetWi : 0);
    setScrollWidth((_ref$current$scrollWi = (_ref$current2 = ref.current) == null ? void 0 : _ref$current2.scrollWidth) != null ? _ref$current$scrollWi : 0);
  });

  useEffect(() => {
    setIsTruncated(offsetWidth < scrollWidth);
  }, [offsetWidth, scrollWidth]);

  return [ref, isTruncated];
};

export default useCSSTextTruncation;
//# sourceMappingURL=useCSSTextTruncation.js.map