@bioturing/components 0.34.0 → 0.35.2

package/dist/components/table/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/table/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  default as AntTable,\n  type ColumnType,\n  type TableProps as AntTableProps,\n  type TableRef,\n} from \"antd/es/table\";\nimport { CaretDownIcon, CaretUpIcon, FunnelIcon } from \"@bioturing/assets\";\nimport { clsx, useCls } from \"../utils\";\nimport Empty from \"../empty/component\";\nimport { SpinProps } from \"antd/es/spin\";\nimport {\n  useState,\n  useEffect,\n  forwardRef,\n  Ref,\n  ForwardedRef,\n  useCallback,\n  useRef,\n} from \"react\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\n// Define interface with all the generic type parameters from AntTable without any\nexport interface TableProps<RecordType extends object = object>\n  extends AntTableProps<RecordType> {\n  /**\n   * Add empty description for the table\n   */\n  emptyDescription?: React.ReactNode;\n  /**\n   * Table ref\n   */\n  tableRef?: React.Ref<HTMLDivElement>;\n  /**\n   * Table style\n   */\n  variant?: \"default\" | \"zebra\";\n}\n\n// Simple wrapper component with proper generics\nconst InnerInternalTable = <RecordType extends object = object>(\n  {\n    columns,\n    locale,\n    emptyDescription,\n    loading,\n    virtual,\n    scroll: scrollProp = {},\n    className,\n    variant,\n    ...rest\n  }: TableProps<RecordType>,\n  ref: Ref<TableRef>\n) => {\n  const cls = useCls();\n  \n  const [scroll, setScroll] = useState<TableProps[\"scroll\"]>(\n    virtual\n      ? {}\n      : {\n          x: \"fit-content\",\n        }\n  );\n\n  const innerRef = useRef<TableRef>(null);\n  const tablePaginationHeight = useRef<number>(0);\n\n  useEffect(() => {\n    if (!innerRef.current || !virtual) return;\n    const tableEl = innerRef.current?.nativeElement;\n    const parentEl = tableEl?.parentElement;\n    if (!parentEl) return;\n    const thead = tableEl?.querySelector(\n      `.${cls(\"table-thead\")}`\n    ) as HTMLElement;\n    const tpagination = tableEl?.querySelector(\n      `.${cls(\"table-pagination\")}`\n    ) as HTMLElement;\n    if (tpagination) {\n      const mt = getComputedStyle(tpagination).marginTop;\n      const mb = getComputedStyle(tpagination).marginBottom;\n      tablePaginationHeight.current =\n        tpagination.offsetHeight + parseInt(mt) + parseInt(mb);\n    }\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (entry.target) {\n          setScroll({\n            y:\n              parentEl.offsetHeight -\n              (thead ? thead?.offsetHeight : 0) -\n              tablePaginationHeight.current,\n          });\n        }\n      }\n    });\n    if (parentEl && virtual) {\n      resizeObserver.observe(parentEl);\n    }\n    return () => {\n      if (parentEl && virtual) {\n        resizeObserver.disconnect();\n      }\n    };\n  }, [virtual, cls]);\n\n  const modifiedColumns = columns\n    ? columns.map((column: ColumnType<RecordType>): ColumnType<RecordType> => {\n        return {\n          sortIcon: ({ sortOrder }) => {\n            return (\n              <span\n                className={cls(\n                  \"table-column-sort-icon\",\n                  sortOrder\n                    ? `table-column-sort-icon-${sortOrder}`\n                    : `table-column-sort-icon-none`\n                )}\n              >\n                {!sortOrder ? (\n                  <>\n                    <CaretUpIcon weight=\"fill\" />{\" \"}\n                    <CaretDownIcon weight=\"fill\" />\n                  </>\n                ) : sortOrder === \"ascend\" ? (\n                  <CaretUpIcon weight=\"fill\" />\n                ) : (\n                  <CaretDownIcon weight=\"fill\" />\n                )}\n              </span>\n            );\n          },\n          filterIcon: (_filtered) => {\n            return (\n              <span className={cls(\"table-column-filter-icon\")}>\n                <FunnelIcon weight=\"fill\" />\n              </span>\n            );\n          },\n          ...column,\n        };\n      })\n    : undefined;\n  const modifiedLocale = {\n    emptyText: <Empty description={emptyDescription} />,\n    ...locale,\n  };\n  let spinProps: SpinProps | undefined;\n  if (typeof loading === \"boolean\") {\n    spinProps = {\n      spinning: loading,\n      indicator: <span className={cls(\"spin-loader\")} />,\n    };\n  } else if (typeof loading === \"object\") {\n    spinProps = {\n      spinning: true,\n      indicator: <span className={cls(\"spin-loader\")} />,\n      ...loading,\n    };\n  }\n  const callbackRef = useCallback(\n    (tableRef: TableRef) => {\n      if (tableRef) {\n        if (typeof ref === \"function\") {\n          ref(tableRef);\n        }\n        if (ref && typeof ref === \"object\" && \"current\" in ref) {\n          ref.current = tableRef;\n        }\n        innerRef.current = tableRef;\n      }\n    },\n    [ref]\n  );\n\n  return (\n    <AntTable\n      ref={callbackRef}\n      columns={modifiedColumns}\n      loading={spinProps}\n      locale={modifiedLocale}\n      virtual={virtual}\n      scroll={{ ...scroll, ...scrollProp }}\n      className={clsx(variant === \"zebra\" ? cls(\"table-zebra\") : \"\", className)}\n      {...rest}\n    />\n  );\n};\n\nconst InternalTable = forwardRef(InnerInternalTable) as <\n  RecordType extends object = object\n>(\n  props: TableProps<RecordType> & { ref?: ForwardedRef<TableRef> }\n) => ReturnType<typeof InnerInternalTable>;\n\n// Create the final component with all static properties\nexport const Table = Object.assign(InternalTable, {\n  Column: AntTable.Column,\n  ColumnGroup: AntTable.ColumnGroup,\n  SELECTION_COLUMN: AntTable.SELECTION_COLUMN,\n  EXPAND_COLUMN: AntTable.EXPAND_COLUMN,\n  SELECTION_ALL: AntTable.SELECTION_ALL,\n  SELECTION_INVERT: AntTable.SELECTION_INVERT,\n  SELECTION_NONE: AntTable.SELECTION_NONE,\n  Summary: AntTable.Summary,\n}) as typeof InternalTable & {\n  Column: typeof AntTable.Column;\n  ColumnGroup: typeof AntTable.ColumnGroup;\n  SELECTION_COLUMN: typeof AntTable.SELECTION_COLUMN;\n  EXPAND_COLUMN: typeof AntTable.EXPAND_COLUMN;\n  SELECTION_ALL: typeof AntTable.SELECTION_ALL;\n  SELECTION_INVERT: typeof AntTable.SELECTION_INVERT;\n  SELECTION_NONE: typeof AntTable.SELECTION_NONE;\n  Summary: typeof AntTable.Summary;\n};\n"],"names":["InnerInternalTable","columns","locale","emptyDescription","loading","virtual","scrollProp","className","variant","rest","ref","cls","useCls","scroll","setScroll","useState","innerRef","useRef","tablePaginationHeight","useEffect","tableEl","parentEl","thead","tpagination","mt","mb","resizeObserver","entries","entry","modifiedColumns","column","sortOrder","jsx","CaretUpIcon","CaretDownIcon","jsxs","Fragment","_filtered","FunnelIcon","modifiedLocale","Empty","spinProps","callbackRef","useCallback","tableRef","AntTable","clsx","InternalTable","forwardRef","Table"],"mappings":"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"}
+{"version":3,"file":"component.js","sources":["../../../src/components/table/component.tsx"],"sourcesContent":["\"use client\";\nimport {\n  default as AntTable,\n  type ColumnType,\n  type TableProps as AntTableProps,\n  type TableRef,\n} from \"antd/es/table\";\nimport { CaretDownIcon, CaretUpIcon, FunnelIcon } from \"@bioturing/assets\";\nimport { clsx, useCls } from \"../utils\";\nimport Empty from \"../empty/component\";\nimport { SpinProps } from \"antd/es/spin\";\nimport {\n  useState,\n  useEffect,\n  forwardRef,\n  Ref,\n  ForwardedRef,\n  useCallback,\n  useRef,\n} from \"react\";\n\n// Import component-specific styles\nimport \"./style.css\";\n\n// Define interface with all the generic type parameters from AntTable without any\nexport interface TableProps<RecordType extends object = object>\n  extends AntTableProps<RecordType> {\n  /**\n   * Add empty description for the table\n   */\n  emptyDescription?: React.ReactNode;\n  /**\n   * Table ref\n   */\n  tableRef?: React.Ref<HTMLDivElement>;\n  /**\n   * Table style\n   */\n  variant?: \"default\" | \"zebra\";\n}\n\n// Simple wrapper component with proper generics\nconst InnerInternalTable = <RecordType extends object = object>(\n  {\n    columns,\n    locale,\n    emptyDescription,\n    loading,\n    virtual,\n    scroll: scrollProp = {},\n    className,\n    variant,\n    ...rest\n  }: TableProps<RecordType>,\n  ref: Ref<TableRef>\n) => {\n  const cls = useCls();\n\n  const [scroll, setScroll] = useState<TableProps[\"scroll\"]>(\n    virtual\n      ? {}\n      : {\n          x: \"fit-content\",\n        }\n  );\n\n  const innerRef = useRef<TableRef>(null);\n  const tablePaginationHeight = useRef<number>(0);\n\n  useEffect(() => {\n    if (!innerRef.current || !virtual) return;\n    const tableEl = innerRef.current?.nativeElement;\n    const parentEl = tableEl?.parentElement;\n    if (!parentEl) return;\n    const thead = tableEl?.querySelector(\n      `.${cls(\"table-thead\")}`\n    ) as HTMLElement;\n    const tpagination = tableEl?.querySelector(\n      `.${cls(\"table-pagination\")}`\n    ) as HTMLElement;\n    if (tpagination) {\n      const mt = getComputedStyle(tpagination).marginTop;\n      const mb = getComputedStyle(tpagination).marginBottom;\n      tablePaginationHeight.current =\n        tpagination.offsetHeight + parseInt(mt) + parseInt(mb);\n    }\n    const resizeObserver = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        if (entry.target) {\n          setScroll({\n            y:\n              parentEl.offsetHeight -\n              (thead ? thead?.offsetHeight : 0) -\n              tablePaginationHeight.current,\n          });\n        }\n      }\n    });\n    if (parentEl && virtual) {\n      resizeObserver.observe(parentEl);\n    }\n    return () => {\n      if (parentEl && virtual) {\n        resizeObserver.disconnect();\n      }\n    };\n  }, [virtual, cls]);\n\n  const modifiedColumns = columns\n    ? columns.map((column: ColumnType<RecordType>): ColumnType<RecordType> => {\n        return {\n          sortIcon: ({ sortOrder }) => {\n            return (\n              <span\n                className={cls(\n                  \"table-column-sort-icon\",\n                  sortOrder\n                    ? `table-column-sort-icon-${sortOrder}`\n                    : `table-column-sort-icon-none`\n                )}\n              >\n                {!sortOrder ? (\n                  <>\n                    <CaretUpIcon weight=\"fill\" />{\" \"}\n                    <CaretDownIcon weight=\"fill\" />\n                  </>\n                ) : sortOrder === \"ascend\" ? (\n                  <CaretUpIcon weight=\"fill\" />\n                ) : (\n                  <CaretDownIcon weight=\"fill\" />\n                )}\n              </span>\n            );\n          },\n          filterIcon: (_filtered) => {\n            return (\n              <span className={cls(\"table-column-filter-icon\")}>\n                <FunnelIcon weight=\"fill\" />\n              </span>\n            );\n          },\n          title: (props) => {\n            return (\n              <span className={cls(\"table-column-custom-title\")}>\n                {typeof column.title === \"function\"\n                  ? column.title(props)\n                  : column.title}\n              </span>\n            );\n          },\n          ...column,\n        };\n      })\n    : undefined;\n  const modifiedLocale = {\n    emptyText: <Empty description={emptyDescription} />,\n    ...locale,\n  };\n  let spinProps: SpinProps | undefined;\n  if (typeof loading === \"boolean\") {\n    spinProps = {\n      spinning: loading,\n      indicator: <span className={cls(\"spin-loader\")} />,\n    };\n  } else if (typeof loading === \"object\") {\n    spinProps = {\n      spinning: true,\n      indicator: <span className={cls(\"spin-loader\")} />,\n      ...loading,\n    };\n  }\n  const callbackRef = useCallback(\n    (tableRef: TableRef) => {\n      if (tableRef) {\n        if (typeof ref === \"function\") {\n          ref(tableRef);\n        }\n        if (ref && typeof ref === \"object\" && \"current\" in ref) {\n          ref.current = tableRef;\n        }\n        innerRef.current = tableRef;\n      }\n    },\n    [ref]\n  );\n\n  return (\n    <AntTable\n      ref={callbackRef}\n      columns={modifiedColumns}\n      loading={spinProps}\n      locale={modifiedLocale}\n      virtual={virtual}\n      scroll={{ ...scroll, ...scrollProp }}\n      className={clsx(variant === \"zebra\" ? cls(\"table-zebra\") : \"\", className)}\n      {...rest}\n    />\n  );\n};\n\nconst InternalTable = forwardRef(InnerInternalTable) as <\n  RecordType extends object = object\n>(\n  props: TableProps<RecordType> & { ref?: ForwardedRef<TableRef> }\n) => ReturnType<typeof InnerInternalTable>;\n\n// Create the final component with all static properties\nexport const Table = Object.assign(InternalTable, {\n  Column: AntTable.Column,\n  ColumnGroup: AntTable.ColumnGroup,\n  SELECTION_COLUMN: AntTable.SELECTION_COLUMN,\n  EXPAND_COLUMN: AntTable.EXPAND_COLUMN,\n  SELECTION_ALL: AntTable.SELECTION_ALL,\n  SELECTION_INVERT: AntTable.SELECTION_INVERT,\n  SELECTION_NONE: AntTable.SELECTION_NONE,\n  Summary: AntTable.Summary,\n}) as typeof InternalTable & {\n  Column: typeof AntTable.Column;\n  ColumnGroup: typeof AntTable.ColumnGroup;\n  SELECTION_COLUMN: typeof AntTable.SELECTION_COLUMN;\n  EXPAND_COLUMN: typeof AntTable.EXPAND_COLUMN;\n  SELECTION_ALL: typeof AntTable.SELECTION_ALL;\n  SELECTION_INVERT: typeof AntTable.SELECTION_INVERT;\n  SELECTION_NONE: typeof AntTable.SELECTION_NONE;\n  Summary: typeof AntTable.Summary;\n};\n"],"names":["InnerInternalTable","columns","locale","emptyDescription","loading","virtual","scrollProp","className","variant","rest","ref","cls","useCls","scroll","setScroll","useState","innerRef","useRef","tablePaginationHeight","useEffect","tableEl","parentEl","thead","tpagination","mt","mb","resizeObserver","entries","entry","modifiedColumns","column","sortOrder","jsx","CaretUpIcon","CaretDownIcon","jsxs","Fragment","_filtered","FunnelIcon","props","modifiedLocale","Empty","spinProps","callbackRef","useCallback","tableRef","AntTable","clsx","InternalTable","forwardRef","Table"],"mappings":"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"}

package/dist/components/theme-provider/style.css

@@ -1 +1 @@
-@layer components{@keyframes ds-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ds-theme-provider{--ds-modal-padding: 24px;--ds-modal-edge-padding: 16px;--ds-popup-panel-padding: 16px;--ds-scrollbar-width: auto;--ds-scrollbar-width-legacy: 15;--ds-box-shadow-popover-arrow: 0px 0px 1px 0px var(--ds-modal-color-border), 2px 2px 5px rgba(0, 0, 0, .05);--ds-control-border-radius: 6px;--ds-control-transition: all .2s;--ds-control-padding-small: 1px 8px;--ds-control-padding-middle: 5px 12px;--ds-control-padding-large: 9px 12px;--ds-control-min-height-small: 24px;--ds-control-min-height-middle: 32px;--ds-control-min-height-large: 40px;--ds-control-line-height: 20px;--ds-control-color-border-hover: var(--ds-color-primary-hover);--ds-control-color-border-focus: var(--ds-color-primary);--ds-control-color-bg-disabled: var(--ds-color-bg-container-disabled);--ds-control-color-text-disabled: var(--ds-color-text-disabled);--ds-control-icon-size: 12px;--ds-control-color-bg: var(--ds-color-bg-container);--ds-control-color-border: var(--ds-color-border);--ds-control-color-border-active: var(--ds-color-primary);--ds-control-color-border-error-active: var(--ds-color-error);--ds-control-color-border-warning-active: var(--ds-color-warning);--ds-control-color-icon: var(--ds-color-text-quaternary);--ds-control-color-icon-hover: var(--ds-color-icon-hover);--ds-control-border: 1px solid var(--ds-control-color-border);--ds-control-border-active: 1px solid var(--ds-control-color-border-active);--ds-control-border-error-active: 1px solid var(--ds-control-color-border-error-active);--ds-control-border-warning-active: 1px solid var(--ds-control-color-border-warning-active);--ds-control-shadow-active: 0 0 0 2px color-mix(in oklab, var(--ds-color-primary) 20%, transparent);--ds-form-label-required-mark-color: var(--ds-color-error);--ds-control-shadow-error-active: 0 0 0 2px color-mix(in oklab, var(--ds-color-error) 20%, transparent);--ds-control-shadow-warning-active: 0 0 0 2px color-mix(in oklab, var(--ds-color-warning) 20%, transparent);--ds-control-color-text-placeholder: var(--ds-color-text-placeholder);--ds-inter: "Inter", Helvetica, Arial, sans-serif;--ds-roboto-mono: "Roboto Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--ds-animate-spin: ds-spin 1s linear infinite;--ds-z-index-base: 0;--ds-z-index-modal: 1000;--ds-z-index-modal-mask: 1000;--ds-z-index-message: 1010;--ds-z-index-notification: 1010;--ds-z-index-popover: 1030;--ds-z-index-dropdown: 1050;--ds-z-index-picker: 1050;--ds-z-index-popconfirm: 1060;--ds-z-index-tooltip: 1070;--ds-z-index-toast: 2000;--ds-segment-color-bg-active: #ffffff;--ds-scrollbar-color-thumb: rgba(0, 0, 0, .2);--ds-scrollbar-color-track: rgba(0, 0, 0, 0);--ds-color-base-solid: #000000;--ds-color-table-fixed-column-shadow: rgb(0 0 0 / 10%);--ds-modal-color-border: rgba(0, 0, 0, .24)}@supports (font-variation-settings: normal){.ds-theme-provider{--ds-inter: "InterVariable", Inter, Helvetica, Arial, sans-serif;--ds-roboto-mono: "Roboto Mono Variable", Roboto Mono, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-optical-sizing:auto}}.ds-theme-provider.dark{--ds-modal-color-border: rgba(255, 255, 255, .55);--ds-segment-color-bg-active: #424248;--ds-scrollbar-color-thumb: rgba(255, 255, 255, .2);--ds-scrollbar-color-track: rgba(0, 0, 0, 0);--ds-color-base-solid: #ffffff;--ds-color-table-fixed-column-shadow: rgb(0 0 0 / 20%)}}
+@layer components{@keyframes ds-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ds-theme-provider{--ds-modal-padding: 24px;--ds-modal-edge-padding: 16px;--ds-popup-panel-padding: 16px;--ds-scrollbar-width: auto;--ds-scrollbar-width-legacy: 15;--ds-box-shadow-popover-arrow: 0px 0px 1px 0px var(--ds-modal-color-border), 2px 2px 5px rgba(0, 0, 0, .05);--ds-control-border-radius: 6px;--ds-control-transition: all .2s;--ds-control-padding-small: 1px 8px;--ds-control-padding-middle: 5px 12px;--ds-control-padding-large: 9px 12px;--ds-control-padding-inline-small: 8px;--ds-control-padding-block-small: 1px;--ds-control-padding-inline-middle: 12px;--ds-control-padding-block-middle: 5px;--ds-control-padding-inline-large: 12px;--ds-control-padding-block-large: 9px;--ds-control-min-height-small: 24px;--ds-control-min-height-middle: 32px;--ds-control-min-height-large: 40px;--ds-control-line-height: 20px;--ds-control-color-border-hover: var(--ds-color-primary-hover);--ds-control-color-border-focus: var(--ds-color-primary);--ds-control-color-bg-disabled: var(--ds-color-bg-container-disabled);--ds-control-color-text-disabled: var(--ds-color-text-disabled);--ds-control-icon-size: 12px;--ds-control-color-bg: var(--ds-color-bg-container);--ds-control-color-border: var(--ds-color-border);--ds-control-color-border-active: var(--ds-color-primary);--ds-control-color-border-error-active: var(--ds-color-error);--ds-control-color-border-warning-active: var(--ds-color-warning);--ds-control-color-icon: var(--ds-color-text-quaternary);--ds-control-color-icon-hover: var(--ds-color-icon-hover);--ds-control-border: 1px solid var(--ds-control-color-border);--ds-control-border-active: 1px solid var(--ds-control-color-border-active);--ds-control-border-error-active: 1px solid var(--ds-control-color-border-error-active);--ds-control-border-warning-active: 1px solid var(--ds-control-color-border-warning-active);--ds-control-shadow-active: 0 0 0 2px color-mix(in oklab, var(--ds-color-primary) 20%, transparent);--ds-form-label-required-mark-color: var(--ds-color-error);--ds-control-shadow-error-active: 0 0 0 2px color-mix(in oklab, var(--ds-color-error) 20%, transparent);--ds-control-shadow-warning-active: 0 0 0 2px color-mix(in oklab, var(--ds-color-warning) 20%, transparent);--ds-control-color-text-placeholder: var(--ds-color-text-placeholder);--ds-inter: "Inter", Helvetica, Arial, sans-serif;--ds-roboto-mono: "Roboto Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--ds-animate-spin: ds-spin 1s linear infinite;--ds-z-index-base: 0;--ds-z-index-modal: 1000;--ds-z-index-modal-mask: 1000;--ds-z-index-message: 1010;--ds-z-index-notification: 1010;--ds-z-index-popover: 1030;--ds-z-index-dropdown: 1050;--ds-z-index-picker: 1050;--ds-z-index-popconfirm: 1060;--ds-z-index-tooltip: 1070;--ds-z-index-toast: 2000;--ds-segment-color-bg-active: #ffffff;--ds-scrollbar-color-thumb: rgba(0, 0, 0, .2);--ds-scrollbar-color-track: rgba(0, 0, 0, 0);--ds-color-base-solid: #000000;--ds-color-table-fixed-column-shadow: rgb(0 0 0 / 10%);--ds-modal-color-border: rgba(0, 0, 0, .24)}@supports (font-variation-settings: normal){.ds-theme-provider{--ds-inter: "InterVariable", Inter, Helvetica, Arial, sans-serif;--ds-roboto-mono: "Roboto Mono Variable", Roboto Mono, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-optical-sizing:auto}}.ds-theme-provider.dark{--ds-modal-color-border: rgba(255, 255, 255, .55);--ds-segment-color-bg-active: #424248;--ds-scrollbar-color-thumb: rgba(255, 255, 255, .2);--ds-scrollbar-color-track: rgba(0, 0, 0, 0);--ds-color-base-solid: #ffffff;--ds-color-table-fixed-column-shadow: rgb(0 0 0 / 20%)}}

package/dist/components/truncate/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../src/components/truncate/component.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAQ9E,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG,KAAK,CAAC;AAEhD,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC7D,mCAAmC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,iDAAiD;IACjD,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAIxB,SAAS,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;CACxD;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAiL5C,CAAC"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../src/components/truncate/component.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyD,MAAM,OAAO,CAAC;AAK9E,OAAO,aAAa,CAAC;AAErB,MAAM,MAAM,gBAAgB,GAAG,QAAQ,GAAG,KAAK,CAAC;AAEhD,MAAM,WAAW,aACf,SAAQ,IAAI,CAAC,KAAK,CAAC,wBAAwB,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC7D,mCAAmC;IACnC,QAAQ,EAAE,MAAM,CAAC;IACjB,iDAAiD;IACjD,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAIxB,SAAS,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;CACxD;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAqL5C,CAAC"}

package/dist/components/truncate/component.js

@@ -1,108 +1,112 @@
 "use client";
-import { jsx as y } from "react/jsx-runtime";
-import { useRef as L, useState as M, useCallback as g, useLayoutEffect as k } from "react";
-import { calculateAvailableHeight as z, checkIfTextTruncated as b, getMiddleTruncatedString as A } from "./helpers.js";
+import { jsx as T } from "react/jsx-runtime";
+import { useRef as M, useState as L, useCallback as h, useLayoutEffect as z } from "react";
+import { calculateAvailableHeight as A, getMiddleTruncatedString as F } from "./helpers.js";
+import { useOverflowDetection as g } from "./useOverflowDetection.js";
 import './style.css';/* empty css          */
-import { useCls as F } from "../utils/antdUtils.js";
-import { clsx as O } from "../utils/cn.js";
-const N = ({
-  children: x,
-  position: d = "end",
-  lines: r = 1,
-  className: C,
+import { useCls as R } from "../utils/antdUtils.js";
+import { clsx as k } from "../utils/cn.js";
+const J = ({
+  children: w,
+  position: i = "end",
+  lines: e = 1,
+  className: b,
   style: f,
-  container: l,
-  ...E
+  container: o,
+  ...x
 }) => {
-  const u = F(), m = L(null), [S, h] = M(!1), [p, v] = M(x), c = x, H = g(() => r !== "auto" ? {
+  const s = R(), l = M(null), [m, p] = L(w), r = w, O = g({
+    container: l,
+    additionalElements: [l.current?.parentElement].filter(Boolean),
+    type: "vertical",
+    text: r,
+    enabled: e === "auto"
+  }), C = g({
+    container: l,
+    type: "vertical",
+    text: r,
+    enabled: typeof e == "number" && e > 1
+  }), E = g({
+    container: l,
+    type: "horizontal",
+    enabled: i === "end" && e === 1
+  }), S = e === "auto" && O.isOverflowing || typeof e == "number" && e > 1 && C.isOverflowing || i === "end" && e === 1 && E.isOverflowing || i === "middle" && r !== m, H = h(() => e !== "auto" ? {
     ...f,
-    ...r > 1 ? { "--ds-line-clamp": r } : {}
+    ...e > 1 ? { "--ds-line-clamp": e } : {}
   } : {
     ...f,
     // Set a temporary high value to ensure it fits the parent
     "--ds-line-clamp": 999
-  }, [r, f]), w = g(() => {
-    const e = m.current;
-    if (!e) return;
-    const t = window.getComputedStyle(e), s = parseFloat(t.fontSize), n = t.lineHeight === "normal" ? s * 1.2 : parseFloat(t.lineHeight), a = z(e), o = Math.max(1, Math.floor(a / n));
-    e.style.setProperty("--ds-line-clamp", String(o));
-    const T = b(c, e, a);
-    h(T);
-  }, [c]), i = g(
-    (e, t, s) => {
-      const n = e.filter(Boolean);
-      if (n.length === 0) return;
-      window.document.fonts?.ready?.then(t);
-      const a = new ResizeObserver(() => {
-        window.requestAnimationFrame(t);
+  }, [e, f]), y = h(() => {
+    const t = l.current;
+    if (!t) return;
+    const n = window.getComputedStyle(t), a = parseFloat(n.fontSize), u = n.lineHeight === "normal" ? a * 1.2 : parseFloat(n.lineHeight), c = A(t), d = Math.max(1, Math.floor(c / u));
+    t.style.setProperty("--ds-line-clamp", String(d));
+  }, [r]), v = h(
+    (t, n, a) => {
+      const u = t.filter(Boolean);
+      if (u.length === 0) return;
+      window.document.fonts?.ready?.then(n);
+      const c = new ResizeObserver(() => {
+        window.requestAnimationFrame(n);
       });
-      return n.forEach((o) => a.observe(o)), () => {
-        a.disconnect(), s && s();
+      return u.forEach((d) => c.observe(d)), () => {
+        c.disconnect(), a && a();
       };
     },
     []
   );
-  return k(() => {
-    const e = m.current;
-    let t = l instanceof HTMLElement ? l : l && "current" in l ? l.current : null;
-    if (!e || (t || (t = e.closest("[data-truncate-container]")), typeof l < "u" && !t)) return;
-    if (v(c), r === "auto")
-      return i(
-        [e, e.parentElement],
-        w
-      );
-    if (typeof r == "number" && r > 1)
-      return i([e], () => {
-        const a = b(c, e);
-        h(a);
-      });
-    if (d == "middle") {
-      let n = { cancelled: !1 };
-      return i(
-        [t || e],
-        () => {
-          n && (n.cancelled = !0);
-          const o = { cancelled: !1 };
-          n = o;
-          const T = A(c, "…", e);
-          o.cancelled || v(T);
-        },
-        () => {
-          n.cancelled = !0;
-        }
-      );
-    }
-    return i(
-      [t || e],
-      () => {
-        e.scrollWidth > e.clientWidth && h(!0);
+  return z(() => {
+    const t = l.current;
+    let n = o instanceof HTMLElement ? o : o && "current" in o ? o.current : null;
+    if (t && (n || (n = t.closest("[data-truncate-container]")), !(typeof o < "u" && !n))) {
+      if (p(r), e === "auto")
+        return v(
+          [t, t.parentElement],
+          y
+        );
+      if (i === "middle") {
+        let a = { cancelled: !1 };
+        return v(
+          [n || t],
+          () => {
+            a && (a.cancelled = !0);
+            const c = { cancelled: !1 };
+            a = c;
+            const d = F(r, "…", t);
+            c.cancelled || p(d);
+          },
+          () => {
+            a.cancelled = !0;
+          }
+        );
       }
-    );
+    }
   }, [
-    c,
-    d,
     r,
-    l,
-    w,
-    i
-  ]), /* @__PURE__ */ y(
+    i,
+    e,
+    o,
+    y,
+    v
+  ]), /* @__PURE__ */ T(
     "span",
     {
-      ref: m,
+      ref: l,
       style: H(),
-      className: O(
-        u(r === 1 ? "truncate" : "truncate-multiline"),
-        u(d === "middle" ? "truncate-middle" : "truncate-end"),
-        C
+      className: k(
+        s(e === 1 ? "truncate" : "truncate-multiline"),
+        s(i === "middle" ? "truncate-middle" : "truncate-end"),
+        b
       ),
-      title: S ? c : void 0,
+      title: S ? r : void 0,
       "data-truncate-text-node": !0,
-      ...E,
-      children: c === p ? c : /* @__PURE__ */ y("span", { children: p })
+      ...x,
+      children: r === m ? r : /* @__PURE__ */ T("span", { children: m })
     }
   );
 };
 export {
-  N as Truncate
+  J as Truncate
 };
 //# sourceMappingURL=component.js.map

package/dist/components/truncate/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sources":["../../../src/components/truncate/component.tsx"],"sourcesContent":["\"use client\";\nimport React, { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport {\n  calculateAvailableHeight,\n  checkIfTextTruncated,\n  getMiddleTruncatedString,\n} from \"./helpers\";\n\nimport \"./style.css\";\n\nexport type TruncatePosition = \"middle\" | \"end\";\n\nexport interface TruncateProps\n  extends Omit<React.ComponentPropsWithoutRef<\"span\">, \"title\"> {\n  /** Text content to be truncated */\n  children: string;\n  /** Position where the truncation should occur */\n  position?: TruncatePosition;\n  /**\n   * Number of lines to display before truncating\n   * @default 1\n   * @remarks Use 'auto' to fit parent height\n   */\n  lines?: number | \"auto\";\n  /*\n   * Ref to the container element of the truncated text. It will have resize observer attached to it.\n   */\n  container?: HTMLElement | React.RefObject<HTMLElement>;\n}\n\nexport const Truncate: React.FC<TruncateProps> = ({\n  children,\n  position = \"end\",\n  lines = 1,\n  className,\n  style,\n  container: containerProp,\n  ...rest\n}) => {\n  const cls = useCls();\n  const containerRef = useRef<HTMLElement>(null);\n  const [isTruncated, setIsTruncated] = useState(false);\n  const [truncatedText, setTruncatedText] = useState(children);\n\n  const text = children;\n\n  // Get appropriate container styles based on position and lines\n  const getContainerStyles = useCallback(() => {\n    // For explicit line numbers or single line\n    if (lines !== \"auto\") {\n      return {\n        ...style,\n        ...(lines > 1 ? { \"--ds-line-clamp\": lines } : {}),\n      } as React.CSSProperties;\n    }\n\n    // For auto line calculation, we'll let the useLayoutEffect handle it\n    return {\n      ...style,\n      // Set a temporary high value to ensure it fits the parent\n      \"--ds-line-clamp\": 999,\n    } as React.CSSProperties;\n  }, [lines, style]);\n\n  // Handle auto line calculation\n  const handleAutoLineCalculation = useCallback(() => {\n    const container = containerRef.current;\n    if (!container) return;\n\n    const styles = window.getComputedStyle(container);\n    const fontSize = parseFloat(styles.fontSize);\n    const lineHeight =\n      styles.lineHeight === \"normal\"\n        ? fontSize * 1.2\n        : parseFloat(styles.lineHeight);\n\n    const availableHeight = calculateAvailableHeight(container);\n    const maxLines = Math.max(1, Math.floor(availableHeight / lineHeight));\n\n    container.style.setProperty(\"--ds-line-clamp\", String(maxLines));\n    const isTruncated = checkIfTextTruncated(text, container, availableHeight);\n    setIsTruncated(isTruncated);\n  }, [text]);\n\n  const observe = useCallback(\n    (\n      elements: (HTMLElement | null)[],\n      callback: () => void,\n      cleanup?: () => void\n    ) => {\n      const validElements = elements.filter(Boolean) as HTMLElement[];\n      if (validElements.length === 0) return;\n\n      window.document.fonts?.ready?.then(callback);\n\n      const observer = new ResizeObserver(() => {\n        window.requestAnimationFrame(callback);\n      });\n\n      validElements.forEach((el) => observer.observe(el));\n      return () => {\n        observer.disconnect();\n        if (cleanup) cleanup();\n      };\n    },\n    []\n  );\n\n  useLayoutEffect(() => {\n    const container = containerRef.current;\n    let flexContainer =\n      containerProp instanceof HTMLElement\n        ? containerProp\n        : containerProp && \"current\" in containerProp\n        ? containerProp.current\n        : null;\n    if (!container) return;\n    if (!flexContainer) {\n      flexContainer = container.closest(\"[data-truncate-container]\");\n    }\n    if (typeof containerProp !== \"undefined\" && !flexContainer) return;\n\n    // reset\n    setTruncatedText(text);\n\n    // Handle auto-height calculation\n    if (lines === \"auto\") {\n      return observe(\n        [container, container.parentElement],\n        handleAutoLineCalculation\n      );\n    }\n\n    // Skip custom truncation logic for multi-line mode\n    if (typeof lines === \"number\" && lines > 1) {\n      // Check if text is truncated by comparing heights\n      const handleMultilineTruncation = () => {\n        const isTruncated = checkIfTextTruncated(text, container);\n        setIsTruncated(isTruncated);\n      };\n\n      return observe([container], handleMultilineTruncation);\n    }\n\n    if (position == \"middle\") {\n      // Middle truncate\n      let cancellationToken = { cancelled: false };\n\n      const handleMiddleTruncate = () => {\n        if (cancellationToken) cancellationToken.cancelled = true;\n\n        const requestCancellationToken = { cancelled: false };\n        cancellationToken = requestCancellationToken;\n\n        const truncated = getMiddleTruncatedString(text, \"\\u2026\", container);\n\n        if (requestCancellationToken.cancelled) return;\n\n        setTruncatedText(truncated);\n      };\n      // to do: optimize resize observer here to avoid re-calculate\n      return observe(\n        [flexContainer ? flexContainer : container],\n        handleMiddleTruncate,\n        () => {\n          cancellationToken.cancelled = true;\n        }\n      );\n    }\n\n    // End truncate\n    const handleEndTruncate = () => {\n      const isOverflowing = container.scrollWidth > container.clientWidth;\n      if (isOverflowing) {\n        setIsTruncated(true);\n      }\n    };\n\n    return observe(\n      [flexContainer ? flexContainer : container],\n      handleEndTruncate\n    );\n  }, [\n    text,\n    position,\n    lines,\n    containerProp,\n    handleAutoLineCalculation,\n    observe,\n  ]);\n\n  return (\n    <span\n      ref={containerRef}\n      style={getContainerStyles()}\n      className={clsx(\n        lines === 1 ? cls(\"truncate\") : cls(\"truncate-multiline\"),\n        position === \"middle\" ? cls(\"truncate-middle\") : cls(\"truncate-end\"),\n        className\n      )}\n      title={isTruncated ? text : undefined}\n      data-truncate-text-node\n      {...rest}\n    >\n      {text === truncatedText ? text : <span>{truncatedText}</span>}\n    </span>\n  );\n};\n"],"names":["Truncate","children","position","lines","className","style","containerProp","rest","cls","useCls","containerRef","useRef","isTruncated","setIsTruncated","useState","truncatedText","setTruncatedText","text","getContainerStyles","useCallback","handleAutoLineCalculation","container","styles","fontSize","lineHeight","availableHeight","calculateAvailableHeight","maxLines","checkIfTextTruncated","observe","elements","callback","cleanup","validElements","observer","el","useLayoutEffect","flexContainer","cancellationToken","requestCancellationToken","truncated","getMiddleTruncatedString","jsx","clsx"],"mappings":"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"}
+{"version":3,"file":"component.js","sources":["../../../src/components/truncate/component.tsx"],"sourcesContent":["\"use client\";\nimport React, { useCallback, useLayoutEffect, useRef, useState } from \"react\";\nimport { clsx, useCls } from \"../utils\";\nimport { calculateAvailableHeight, getMiddleTruncatedString } from \"./helpers\";\nimport { useOverflowDetection } from \"./useOverflowDetection\";\n\nimport \"./style.css\";\n\nexport type TruncatePosition = \"middle\" | \"end\";\n\nexport interface TruncateProps\n  extends Omit<React.ComponentPropsWithoutRef<\"span\">, \"title\"> {\n  /** Text content to be truncated */\n  children: string;\n  /** Position where the truncation should occur */\n  position?: TruncatePosition;\n  /**\n   * Number of lines to display before truncating\n   * @default 1\n   * @remarks Use 'auto' to fit parent height\n   */\n  lines?: number | \"auto\";\n  /*\n   * Ref to the container element of the truncated text. It will have resize observer attached to it.\n   */\n  container?: HTMLElement | React.RefObject<HTMLElement>;\n}\n\nexport const Truncate: React.FC<TruncateProps> = ({\n  children,\n  position = \"end\",\n  lines = 1,\n  className,\n  style,\n  container: containerProp,\n  ...rest\n}) => {\n  const cls = useCls();\n  const containerRef = useRef<HTMLElement>(null);\n  const [truncatedText, setTruncatedText] = useState(children);\n\n  const text = children;\n\n  // Overflow detection for different scenarios\n  const autoLineOverflow = useOverflowDetection({\n    container: containerRef,\n    additionalElements: [containerRef.current?.parentElement].filter(Boolean),\n    type: \"vertical\",\n    text,\n    enabled: lines === \"auto\",\n  });\n\n  const multilineOverflow = useOverflowDetection({\n    container: containerRef,\n    type: \"vertical\",\n    text,\n    enabled: typeof lines === \"number\" && lines > 1,\n  });\n\n  const endTruncateOverflow = useOverflowDetection({\n    container: containerRef,\n    type: \"horizontal\",\n    enabled: position === \"end\" && lines === 1,\n  });\n\n  // Determine if content is truncated based on the active mode\n  const isTruncated =\n    (lines === \"auto\" && autoLineOverflow.isOverflowing) ||\n    (typeof lines === \"number\" &&\n      lines > 1 &&\n      multilineOverflow.isOverflowing) ||\n    (position === \"end\" && lines === 1 && endTruncateOverflow.isOverflowing) ||\n    (position === \"middle\" && text !== truncatedText);\n\n  // Get appropriate container styles based on position and lines\n  const getContainerStyles = useCallback(() => {\n    // For explicit line numbers or single line\n    if (lines !== \"auto\") {\n      return {\n        ...style,\n        ...(lines > 1 ? { \"--ds-line-clamp\": lines } : {}),\n      } as React.CSSProperties;\n    }\n\n    // For auto line calculation, we'll let the useLayoutEffect handle it\n    return {\n      ...style,\n      // Set a temporary high value to ensure it fits the parent\n      \"--ds-line-clamp\": 999,\n    } as React.CSSProperties;\n  }, [lines, style]);\n\n  // Handle auto line calculation\n  const handleAutoLineCalculation = useCallback(() => {\n    const container = containerRef.current;\n    if (!container) return;\n\n    const styles = window.getComputedStyle(container);\n    const fontSize = parseFloat(styles.fontSize);\n    const lineHeight =\n      styles.lineHeight === \"normal\"\n        ? fontSize * 1.2\n        : parseFloat(styles.lineHeight);\n\n    const availableHeight = calculateAvailableHeight(container);\n    const maxLines = Math.max(1, Math.floor(availableHeight / lineHeight));\n\n    container.style.setProperty(\"--ds-line-clamp\", String(maxLines));\n  }, [text]);\n\n  const observe = useCallback(\n    (\n      elements: (HTMLElement | null)[],\n      callback: () => void,\n      cleanup?: () => void\n    ) => {\n      const validElements = elements.filter(Boolean) as HTMLElement[];\n      if (validElements.length === 0) return;\n\n      window.document.fonts?.ready?.then(callback);\n\n      const observer = new ResizeObserver(() => {\n        window.requestAnimationFrame(callback);\n      });\n\n      validElements.forEach((el) => observer.observe(el));\n      return () => {\n        observer.disconnect();\n        if (cleanup) cleanup();\n      };\n    },\n    []\n  );\n\n  useLayoutEffect(() => {\n    const container = containerRef.current;\n    let flexContainer =\n      containerProp instanceof HTMLElement\n        ? containerProp\n        : containerProp && \"current\" in containerProp\n        ? containerProp.current\n        : null;\n    if (!container) return;\n    if (!flexContainer) {\n      flexContainer = container.closest(\"[data-truncate-container]\");\n    }\n    if (typeof containerProp !== \"undefined\" && !flexContainer) return;\n\n    // reset\n    setTruncatedText(text);\n\n    // Handle auto-height calculation\n    if (lines === \"auto\") {\n      return observe(\n        [container, container.parentElement],\n        handleAutoLineCalculation\n      );\n    }\n\n    // Handle middle truncation with resize observer\n    if (position === \"middle\") {\n      let cancellationToken = { cancelled: false };\n\n      const handleMiddleTruncate = () => {\n        if (cancellationToken) cancellationToken.cancelled = true;\n\n        const requestCancellationToken = { cancelled: false };\n        cancellationToken = requestCancellationToken;\n\n        const truncated = getMiddleTruncatedString(text, \"\\u2026\", container);\n\n        if (requestCancellationToken.cancelled) return;\n\n        setTruncatedText(truncated);\n      };\n\n      return observe(\n        [flexContainer ? flexContainer : container],\n        handleMiddleTruncate,\n        () => {\n          cancellationToken.cancelled = true;\n        }\n      );\n    }\n  }, [\n    text,\n    position,\n    lines,\n    containerProp,\n    handleAutoLineCalculation,\n    observe,\n  ]);\n\n  return (\n    <span\n      ref={containerRef}\n      style={getContainerStyles()}\n      className={clsx(\n        lines === 1 ? cls(\"truncate\") : cls(\"truncate-multiline\"),\n        position === \"middle\" ? cls(\"truncate-middle\") : cls(\"truncate-end\"),\n        className\n      )}\n      title={isTruncated ? text : undefined}\n      data-truncate-text-node\n      {...rest}\n    >\n      {text === truncatedText ? text : <span>{truncatedText}</span>}\n    </span>\n  );\n};\n"],"names":["Truncate","children","position","lines","className","style","containerProp","rest","cls","useCls","containerRef","useRef","truncatedText","setTruncatedText","useState","text","autoLineOverflow","useOverflowDetection","multilineOverflow","endTruncateOverflow","isTruncated","getContainerStyles","useCallback","handleAutoLineCalculation","container","styles","fontSize","lineHeight","availableHeight","calculateAvailableHeight","maxLines","observe","elements","callback","cleanup","validElements","observer","el","useLayoutEffect","flexContainer","cancellationToken","requestCancellationToken","truncated","getMiddleTruncatedString","jsx","clsx"],"mappings":"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"}

package/dist/components/truncate/helpers.d.ts

@@ -14,4 +14,13 @@ export declare const createMeasurementClone: (text: string, container: HTMLEleme
 export declare const checkIfTextTruncated: (text: string, container: HTMLElement, availableHeight?: number) => boolean;
 export declare const calculateAvailableHeight: (container: HTMLElement) => number;
 export declare const calculateAvailableWidth: (container: HTMLElement) => number;
+export type OverflowType = "horizontal" | "vertical" | "both";
+export interface OverflowCheckOptions {
+    type?: OverflowType;
+    availableHeight?: number;
+    text?: string;
+}
+export declare const checkHorizontalOverflow: (container: HTMLElement) => boolean;
+export declare const checkVerticalOverflow: (container: HTMLElement, availableHeight?: number) => boolean;
+export declare const checkOverflow: (container: HTMLElement, options?: OverflowCheckOptions) => boolean;
 //# sourceMappingURL=helpers.d.ts.map

package/dist/components/truncate/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/truncate/helpers.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,wBAAgB,2BAA2B,CACzC,OAAO,EAAE,WAAW,GACnB,WAAW,GAAG,IAAI,CAqBpB;AAED,wBAAgB,qBAAqB,CACnC,aAAa,EAAE,WAAW,EAC1B,aAAa,GAAE,WAAW,GAAG,CAAC,CAAC,CAAC,EAAE,WAAW,KAAK,OAAO,CAAQ,UA2ClE;AAED,eAAO,MAAM,WAAW,GAAI,WAAW,WAAW;oBAuB9B,MAAM;;CASzB,CAAC;AAEF,eAAO,MAAM,wBAAwB,GACnC,MAAM,MAAM,EACZ,UAAU,MAAM,EAChB,WAAW,WAAW,KACrB,MAgEF,CAAC;AAGF,eAAO,MAAM,sBAAsB,GACjC,MAAM,MAAM,EACZ,WAAW,WAAW,oBAavB,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAC/B,MAAM,MAAM,EACZ,WAAW,WAAW,EACtB,kBAAkB,MAAM,YAQzB,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,WAAW,WAAW,WAiB9D,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,WAAW,WAAW,WAiB7D,CAAC"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/truncate/helpers.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,wBAAgB,2BAA2B,CACzC,OAAO,EAAE,WAAW,GACnB,WAAW,GAAG,IAAI,CAqBpB;AAED,wBAAgB,qBAAqB,CACnC,aAAa,EAAE,WAAW,EAC1B,aAAa,GAAE,WAAW,GAAG,CAAC,CAAC,CAAC,EAAE,WAAW,KAAK,OAAO,CAAQ,UA2ClE;AAED,eAAO,MAAM,WAAW,GAAI,WAAW,WAAW;oBAuB9B,MAAM;;CASzB,CAAC;AAEF,eAAO,MAAM,wBAAwB,GACnC,MAAM,MAAM,EACZ,UAAU,MAAM,EAChB,WAAW,WAAW,KACrB,MAgEF,CAAC;AAGF,eAAO,MAAM,sBAAsB,GACjC,MAAM,MAAM,EACZ,WAAW,WAAW,oBAavB,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAC/B,MAAM,MAAM,EACZ,WAAW,WAAW,EACtB,kBAAkB,MAAM,YAQzB,CAAC;AAEF,eAAO,MAAM,wBAAwB,GAAI,WAAW,WAAW,WAiB9D,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,WAAW,WAAW,WAiB7D,CAAC;AAGF,MAAM,MAAM,YAAY,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CAAC;AAE9D,MAAM,WAAW,oBAAoB;IACnC,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,uBAAuB,GAAI,WAAW,WAAW,KAAG,OAEhE,CAAC;AAEF,eAAO,MAAM,qBAAqB,GAChC,WAAW,WAAW,EACtB,kBAAkB,MAAM,KACvB,OAGF,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,WAAW,WAAW,EACtB,UAAS,oBAAyB,KACjC,OAyCF,CAAC"}

package/dist/components/truncate/helpers.js

@@ -1,53 +1,83 @@
-const f = (n) => {
-  const e = document.createElement("span");
-  e.style.opacity = "0", e.style.position = "absolute", e.style.top = "-1000px", e.style.left = "-1000px", e.style.whiteSpace = "nowrap", e.style.pointerEvents = "none";
-  const o = n.getBoundingClientRect(), t = n.cloneNode(!0);
-  return t.style.maxWidth = `${o.width}px`, t.style.position = "absolute", t.style.pointerEvents = "none", t.style.top = "-99px", t.style.left = "-99px", t.style.zIndex = "-1", n.parentElement?.appendChild(t), t.appendChild(e), {
-    measure: (l) => (e.innerText = l, e.clientWidth),
+const b = (t) => {
+  const o = document.createElement("span");
+  o.style.opacity = "0", o.style.position = "absolute", o.style.top = "-1000px", o.style.left = "-1000px", o.style.whiteSpace = "nowrap", o.style.pointerEvents = "none";
+  const l = t.getBoundingClientRect(), e = t.cloneNode(!0);
+  return e.style.maxWidth = `${l.width}px`, e.style.position = "absolute", e.style.pointerEvents = "none", e.style.top = "-99px", e.style.left = "-99px", e.style.zIndex = "-1", t.parentElement?.appendChild(e), e.appendChild(o), {
+    measure: (r) => (o.innerText = r, o.clientWidth),
     destroy: () => {
-      t.removeChild(e), n.parentElement?.removeChild(t);
+      e.removeChild(o), t.parentElement?.removeChild(e);
     }
   };
-}, b = (n, e, o) => {
-  if (!n) return n;
-  const { measure: t, destroy: l } = f(o), d = t(n), i = o.clientWidth, h = Math.floor(
-    i / d * n.length
+}, H = (t, o, l) => {
+  if (!t) return t;
+  const { measure: e, destroy: r } = b(l), s = e(t), n = l.clientWidth, f = Math.floor(
+    n / s * t.length
   );
-  if (d <= i)
-    return l(), n;
-  let s = h;
-  const r = {}, u = 20, m = 4;
-  for (; Object.values(r).length <= u && !r[s]; ) {
-    if (s <= 1) {
-      r[0] = [0, e];
+  if (s <= n)
+    return r(), t;
+  let i = f;
+  const c = {}, g = 20, m = 4;
+  for (; Object.values(c).length <= g && !c[i]; ) {
+    if (i <= 1) {
+      c[0] = [0, o];
       break;
     }
-    const c = n.slice(0, Math.ceil((s - e.length) / 2 - 1)).trimEnd(), y = n.slice(Math.floor((s - e.length) / 2) - s).trimStart(), p = c + e + y, a = t(p);
-    if (r[s] = [a, p], a >= i)
-      s = s - 2;
+    const d = t.slice(0, Math.ceil((i - o.length) / 2 - 1)).trimEnd(), y = t.slice(Math.floor((i - o.length) / 2) - i).trimStart(), p = d + o + y, a = e(p);
+    if (c[i] = [a, p], a >= n)
+      i = i - 2;
     else {
-      if (i - a < m) break;
-      s = s + 2;
+      if (n - a < m) break;
+      i = i + 2;
     }
   }
-  return l(), Object.values(r).reverse().find(([c]) => c < i)?.[1] ?? Object.values(r)[0][1];
-}, g = (n, e) => {
-  const o = window.getComputedStyle(e), t = document.createElement("span");
-  return t.style.visibility = "hidden", t.style.position = "absolute", t.style.width = `${e.clientWidth}px`, t.style.fontSize = o.fontSize, t.style.fontFamily = o.fontFamily, t.style.lineHeight = o.lineHeight, t.textContent = n, document.body.appendChild(t), t;
-}, C = (n, e, o) => {
-  const t = g(n, e), l = o ? t.scrollHeight > o : t.scrollHeight > (e.clientHeight || e.offsetHeight);
-  return document.body.removeChild(t), l;
-}, T = (n) => {
-  const e = n.parentElement;
-  if (!e) return 0;
-  const o = window.getComputedStyle(e), t = parseFloat(o.paddingTop) || 0, l = parseFloat(o.paddingBottom) || 0, d = parseFloat(o.borderTopWidth) || 0, i = parseFloat(o.borderBottomWidth) || 0;
-  return e.clientHeight - t - l - d - i;
+  return r(), Object.values(c).reverse().find(([d]) => d < n)?.[1] ?? Object.values(c)[0][1];
+}, v = (t, o) => {
+  const l = window.getComputedStyle(o), e = document.createElement("span");
+  return e.style.visibility = "hidden", e.style.position = "absolute", e.style.width = `${o.clientWidth}px`, e.style.fontSize = l.fontSize, e.style.fontFamily = l.fontFamily, e.style.lineHeight = l.lineHeight, e.textContent = t, document.body.appendChild(e), e;
+}, W = (t) => {
+  const o = t.parentElement;
+  if (!o) return 0;
+  const l = window.getComputedStyle(o), e = parseFloat(l.paddingTop) || 0, r = parseFloat(l.paddingBottom) || 0, s = parseFloat(l.borderTopWidth) || 0, n = parseFloat(l.borderBottomWidth) || 0;
+  return o.clientHeight - e - r - s - n;
+}, h = (t) => t.scrollWidth > t.clientWidth, u = (t, o) => {
+  const l = o ?? (t.clientHeight || t.offsetHeight);
+  return t.scrollHeight > l;
+}, w = (t, o = {}) => {
+  const { type: l = "horizontal", availableHeight: e, text: r } = o;
+  if (r) {
+    const s = v(r, t);
+    let n = !1;
+    switch (l) {
+      case "horizontal":
+        n = s.scrollWidth > t.clientWidth;
+        break;
+      case "vertical":
+        n = e ? s.scrollHeight > e : s.scrollHeight > (t.clientHeight || t.offsetHeight);
+        break;
+      case "both":
+        n = s.scrollWidth > t.clientWidth || (e ? s.scrollHeight > e : s.scrollHeight > (t.clientHeight || t.offsetHeight));
+        break;
+    }
+    return document.body.removeChild(s), n;
+  }
+  switch (l) {
+    case "horizontal":
+      return h(t);
+    case "vertical":
+      return u(t, e);
+    case "both":
+      return h(t) || u(t, e);
+    default:
+      return h(t);
+  }
 };
 export {
-  T as calculateAvailableHeight,
-  C as checkIfTextTruncated,
-  g as createMeasurementClone,
-  b as getMiddleTruncatedString,
-  f as measureText
+  W as calculateAvailableHeight,
+  h as checkHorizontalOverflow,
+  w as checkOverflow,
+  u as checkVerticalOverflow,
+  v as createMeasurementClone,
+  H as getMiddleTruncatedString,
+  b as measureText
 };
 //# sourceMappingURL=helpers.js.map

package/dist/components/truncate/helpers.js.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.js","sources":["../../../src/components/truncate/helpers.ts"],"sourcesContent":["/**\n * Finds the closest parent element that has inline flex display\n * @param element - The starting HTMLElement\n * @returns The closest inline flex parent or null if not found\n */\nexport function findClosestInlineFlexParent(\n  element: HTMLElement\n): HTMLElement | null {\n  if (!element) return null;\n\n  let currentElement = element.parentElement;\n  let attempts = 0;\n  const maxAttempts = 10;\n\n  while (currentElement && attempts < maxAttempts) {\n    const computedStyle = window.getComputedStyle(currentElement);\n\n    // Check if display is inline-flex\n    if (computedStyle.display === \"inline-flex\") {\n      return currentElement;\n    }\n\n    // Move to the next parent\n    currentElement = currentElement.parentElement;\n    attempts++;\n  }\n\n  return null;\n}\n\nexport function getFlexRemainingSpace(\n  flexContainer: HTMLElement,\n  ignoreElement: HTMLElement | ((e: HTMLElement) => boolean) = null\n) {\n  const style = window.getComputedStyle(flexContainer);\n  const isRow =\n    style.flexDirection === \"row\" || style.flexDirection === \"row-reverse\";\n  const containerSize = isRow\n    ? flexContainer.offsetWidth\n    : flexContainer.offsetHeight;\n  const gap = parseFloat(style.gap) || 0;\n  const paddingStart =\n    parseFloat(isRow ? style.paddingLeft : style.paddingTop) || 0;\n  const paddingEnd =\n    parseFloat(isRow ? style.paddingRight : style.paddingBottom) || 0;\n\n  let totalItemSize = 0;\n  const items: HTMLElement[] = (\n    [...flexContainer.children] as HTMLElement[]\n  ).filter(\n    (child) =>\n      child instanceof HTMLElement &&\n      (typeof ignoreElement === \"function\"\n        ? !ignoreElement(child)\n        : child !== ignoreElement)\n  );\n  for (let i = 0; i < items.length; i++) {\n    const itemStyle = window.getComputedStyle(items[i]);\n    const marginStart =\n      parseFloat(isRow ? itemStyle.marginLeft : itemStyle.marginTop) || 0;\n    const marginEnd =\n      parseFloat(isRow ? itemStyle.marginRight : itemStyle.marginBottom) || 0;\n    totalItemSize +=\n      (isRow ? items[i].offsetWidth : items[i].offsetHeight) +\n      marginStart +\n      marginEnd;\n  }\n\n  // Add gaps (n-1 gaps for n items)\n  totalItemSize += gap * (items.length - 1);\n\n  // Calculate remaining space\n  const remainingSpace =\n    containerSize - totalItemSize - paddingStart - paddingEnd;\n  return Math.max(0, remainingSpace);\n}\n\nexport const measureText = (container: HTMLElement) => {\n  const span = document.createElement(\"span\");\n  span.style.opacity = \"0\";\n  span.style.position = \"absolute\";\n  span.style.top = \"-1000px\";\n  span.style.left = \"-1000px\";\n  span.style.whiteSpace = \"nowrap\";\n  span.style.pointerEvents = \"none\";\n\n  const nodeRect = container.getBoundingClientRect();\n\n  const containerClone = container.cloneNode(true) as HTMLElement;\n  containerClone.style.maxWidth = `${nodeRect.width}px`;\n  containerClone.style.position = \"absolute\";\n  containerClone.style.pointerEvents = \"none\";\n  containerClone.style.top = \"-99px\";\n  containerClone.style.left = \"-99px\";\n  containerClone.style.zIndex = \"-1\";\n\n  container.parentElement?.appendChild(containerClone);\n  containerClone.appendChild(span);\n\n  return {\n    measure: (text: string) => {\n      span.innerText = text;\n      return span.clientWidth;\n    },\n    destroy: () => {\n      containerClone.removeChild(span);\n      container.parentElement?.removeChild(containerClone);\n    },\n  };\n};\n\nexport const getMiddleTruncatedString = (\n  text: string,\n  ellipsis: string,\n  container: HTMLElement\n): string => {\n  if (!text) return text;\n\n  const { measure: getTextWidth, destroy: destroyMeasure } =\n    measureText(container);\n\n  const textWidth = getTextWidth(text);\n\n  const containerWidthToCompare = container.clientWidth;\n\n  const initialOffset = Math.floor(\n    (containerWidthToCompare / textWidth) * text.length\n  );\n\n  if (textWidth <= containerWidthToCompare) {\n    destroyMeasure();\n    return text;\n  }\n\n  let offset = initialOffset;\n  const attempts: Record<number, [number, string]> = {};\n  const maxAttempts = 20;\n  const buffer = 4;\n\n  while (Object.values(attempts).length <= maxAttempts) {\n    // If we have already tried this offset, stop\n    if (attempts[offset]) break;\n\n    // If we are at the beginning of the string, just return the ellipsis\n    if (offset <= 1) {\n      attempts[0] = [0, ellipsis];\n      break;\n    }\n\n    const start = text\n      .slice(0, Math.ceil((offset - ellipsis.length) / 2 - 1))\n      .trimEnd();\n    const end = text\n      .slice(Math.floor((offset - ellipsis.length) / 2) - offset)\n      .trimStart();\n    const truncatedStr = start + ellipsis + end;\n    const width = getTextWidth(truncatedStr);\n\n    attempts[offset] = [width, truncatedStr];\n\n    if (width >= containerWidthToCompare) {\n      offset = offset - 2;\n    } else {\n      // If we are close to the container width, stop\n      if (containerWidthToCompare - width < buffer) break;\n      offset = offset + 2;\n    }\n  }\n\n  // Remove the span element used for measuring text\n  destroyMeasure();\n\n  // Find the closest attempt that is smaller than the container width\n  return (\n    Object.values(attempts)\n      .reverse()\n      .find(([width]) => width < containerWidthToCompare)?.[1] ??\n    Object.values(attempts)[0][1]\n  );\n};\n\n// Utility functions for measurements\nexport const createMeasurementClone = (\n  text: string,\n  container: HTMLElement\n) => {\n  const styles = window.getComputedStyle(container);\n  const clone = document.createElement(\"span\");\n  clone.style.visibility = \"hidden\";\n  clone.style.position = \"absolute\";\n  clone.style.width = `${container.clientWidth}px`;\n  clone.style.fontSize = styles.fontSize;\n  clone.style.fontFamily = styles.fontFamily;\n  clone.style.lineHeight = styles.lineHeight;\n  clone.textContent = text;\n  document.body.appendChild(clone);\n  return clone;\n};\n\nexport const checkIfTextTruncated = (\n  text: string,\n  container: HTMLElement,\n  availableHeight?: number\n) => {\n  const clone = createMeasurementClone(text, container);\n  const isTruncated = availableHeight\n    ? clone.scrollHeight > availableHeight\n    : clone.scrollHeight > (container.clientHeight || container.offsetHeight);\n  document.body.removeChild(clone);\n  return isTruncated;\n};\n\nexport const calculateAvailableHeight = (container: HTMLElement) => {\n  const parent = container.parentElement;\n  if (!parent) return 0;\n\n  const parentStyles = window.getComputedStyle(parent);\n  const paddingTop = parseFloat(parentStyles.paddingTop) || 0;\n  const paddingBottom = parseFloat(parentStyles.paddingBottom) || 0;\n  const borderTopWidth = parseFloat(parentStyles.borderTopWidth) || 0;\n  const borderBottomWidth = parseFloat(parentStyles.borderBottomWidth) || 0;\n\n  return (\n    parent.clientHeight -\n    paddingTop -\n    paddingBottom -\n    borderTopWidth -\n    borderBottomWidth\n  );\n};\n\nexport const calculateAvailableWidth = (container: HTMLElement) => {\n  const parent = container.parentElement;\n  if (!parent) return 0;\n\n  const parentStyles = window.getComputedStyle(parent);\n  const paddingLeft = parseFloat(parentStyles.paddingLeft) || 0;\n  const paddingRight = parseFloat(parentStyles.paddingRight) || 0;\n  const borderLeftWidth = parseFloat(parentStyles.borderLeftWidth) || 0;\n  const borderRightWidth = parseFloat(parentStyles.borderRightWidth) || 0;\n\n  return (\n    parent.clientWidth -\n    paddingLeft -\n    paddingRight -\n    borderLeftWidth -\n    borderRightWidth\n  );\n};\n"],"names":["measureText","container","span","nodeRect","containerClone","text","getMiddleTruncatedString","ellipsis","getTextWidth","destroyMeasure","textWidth","containerWidthToCompare","initialOffset","offset","attempts","maxAttempts","buffer","start","end","truncatedStr","width","createMeasurementClone","styles","clone","checkIfTextTruncated","availableHeight","isTruncated","calculateAvailableHeight","parent","parentStyles","paddingTop","paddingBottom","borderTopWidth","borderBottomWidth"],"mappings":"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"}
+{"version":3,"file":"helpers.js","sources":["../../../src/components/truncate/helpers.ts"],"sourcesContent":["/**\n * Finds the closest parent element that has inline flex display\n * @param element - The starting HTMLElement\n * @returns The closest inline flex parent or null if not found\n */\nexport function findClosestInlineFlexParent(\n  element: HTMLElement\n): HTMLElement | null {\n  if (!element) return null;\n\n  let currentElement = element.parentElement;\n  let attempts = 0;\n  const maxAttempts = 10;\n\n  while (currentElement && attempts < maxAttempts) {\n    const computedStyle = window.getComputedStyle(currentElement);\n\n    // Check if display is inline-flex\n    if (computedStyle.display === \"inline-flex\") {\n      return currentElement;\n    }\n\n    // Move to the next parent\n    currentElement = currentElement.parentElement;\n    attempts++;\n  }\n\n  return null;\n}\n\nexport function getFlexRemainingSpace(\n  flexContainer: HTMLElement,\n  ignoreElement: HTMLElement | ((e: HTMLElement) => boolean) = null\n) {\n  const style = window.getComputedStyle(flexContainer);\n  const isRow =\n    style.flexDirection === \"row\" || style.flexDirection === \"row-reverse\";\n  const containerSize = isRow\n    ? flexContainer.offsetWidth\n    : flexContainer.offsetHeight;\n  const gap = parseFloat(style.gap) || 0;\n  const paddingStart =\n    parseFloat(isRow ? style.paddingLeft : style.paddingTop) || 0;\n  const paddingEnd =\n    parseFloat(isRow ? style.paddingRight : style.paddingBottom) || 0;\n\n  let totalItemSize = 0;\n  const items: HTMLElement[] = (\n    [...flexContainer.children] as HTMLElement[]\n  ).filter(\n    (child) =>\n      child instanceof HTMLElement &&\n      (typeof ignoreElement === \"function\"\n        ? !ignoreElement(child)\n        : child !== ignoreElement)\n  );\n  for (let i = 0; i < items.length; i++) {\n    const itemStyle = window.getComputedStyle(items[i]);\n    const marginStart =\n      parseFloat(isRow ? itemStyle.marginLeft : itemStyle.marginTop) || 0;\n    const marginEnd =\n      parseFloat(isRow ? itemStyle.marginRight : itemStyle.marginBottom) || 0;\n    totalItemSize +=\n      (isRow ? items[i].offsetWidth : items[i].offsetHeight) +\n      marginStart +\n      marginEnd;\n  }\n\n  // Add gaps (n-1 gaps for n items)\n  totalItemSize += gap * (items.length - 1);\n\n  // Calculate remaining space\n  const remainingSpace =\n    containerSize - totalItemSize - paddingStart - paddingEnd;\n  return Math.max(0, remainingSpace);\n}\n\nexport const measureText = (container: HTMLElement) => {\n  const span = document.createElement(\"span\");\n  span.style.opacity = \"0\";\n  span.style.position = \"absolute\";\n  span.style.top = \"-1000px\";\n  span.style.left = \"-1000px\";\n  span.style.whiteSpace = \"nowrap\";\n  span.style.pointerEvents = \"none\";\n\n  const nodeRect = container.getBoundingClientRect();\n\n  const containerClone = container.cloneNode(true) as HTMLElement;\n  containerClone.style.maxWidth = `${nodeRect.width}px`;\n  containerClone.style.position = \"absolute\";\n  containerClone.style.pointerEvents = \"none\";\n  containerClone.style.top = \"-99px\";\n  containerClone.style.left = \"-99px\";\n  containerClone.style.zIndex = \"-1\";\n\n  container.parentElement?.appendChild(containerClone);\n  containerClone.appendChild(span);\n\n  return {\n    measure: (text: string) => {\n      span.innerText = text;\n      return span.clientWidth;\n    },\n    destroy: () => {\n      containerClone.removeChild(span);\n      container.parentElement?.removeChild(containerClone);\n    },\n  };\n};\n\nexport const getMiddleTruncatedString = (\n  text: string,\n  ellipsis: string,\n  container: HTMLElement\n): string => {\n  if (!text) return text;\n\n  const { measure: getTextWidth, destroy: destroyMeasure } =\n    measureText(container);\n\n  const textWidth = getTextWidth(text);\n\n  const containerWidthToCompare = container.clientWidth;\n\n  const initialOffset = Math.floor(\n    (containerWidthToCompare / textWidth) * text.length\n  );\n\n  if (textWidth <= containerWidthToCompare) {\n    destroyMeasure();\n    return text;\n  }\n\n  let offset = initialOffset;\n  const attempts: Record<number, [number, string]> = {};\n  const maxAttempts = 20;\n  const buffer = 4;\n\n  while (Object.values(attempts).length <= maxAttempts) {\n    // If we have already tried this offset, stop\n    if (attempts[offset]) break;\n\n    // If we are at the beginning of the string, just return the ellipsis\n    if (offset <= 1) {\n      attempts[0] = [0, ellipsis];\n      break;\n    }\n\n    const start = text\n      .slice(0, Math.ceil((offset - ellipsis.length) / 2 - 1))\n      .trimEnd();\n    const end = text\n      .slice(Math.floor((offset - ellipsis.length) / 2) - offset)\n      .trimStart();\n    const truncatedStr = start + ellipsis + end;\n    const width = getTextWidth(truncatedStr);\n\n    attempts[offset] = [width, truncatedStr];\n\n    if (width >= containerWidthToCompare) {\n      offset = offset - 2;\n    } else {\n      // If we are close to the container width, stop\n      if (containerWidthToCompare - width < buffer) break;\n      offset = offset + 2;\n    }\n  }\n\n  // Remove the span element used for measuring text\n  destroyMeasure();\n\n  // Find the closest attempt that is smaller than the container width\n  return (\n    Object.values(attempts)\n      .reverse()\n      .find(([width]) => width < containerWidthToCompare)?.[1] ??\n    Object.values(attempts)[0][1]\n  );\n};\n\n// Utility functions for measurements\nexport const createMeasurementClone = (\n  text: string,\n  container: HTMLElement\n) => {\n  const styles = window.getComputedStyle(container);\n  const clone = document.createElement(\"span\");\n  clone.style.visibility = \"hidden\";\n  clone.style.position = \"absolute\";\n  clone.style.width = `${container.clientWidth}px`;\n  clone.style.fontSize = styles.fontSize;\n  clone.style.fontFamily = styles.fontFamily;\n  clone.style.lineHeight = styles.lineHeight;\n  clone.textContent = text;\n  document.body.appendChild(clone);\n  return clone;\n};\n\nexport const checkIfTextTruncated = (\n  text: string,\n  container: HTMLElement,\n  availableHeight?: number\n) => {\n  // Use the new checkOverflow utility for consistency\n  return checkOverflow(container, {\n    type: \"vertical\",\n    availableHeight,\n    text,\n  });\n};\n\nexport const calculateAvailableHeight = (container: HTMLElement) => {\n  const parent = container.parentElement;\n  if (!parent) return 0;\n\n  const parentStyles = window.getComputedStyle(parent);\n  const paddingTop = parseFloat(parentStyles.paddingTop) || 0;\n  const paddingBottom = parseFloat(parentStyles.paddingBottom) || 0;\n  const borderTopWidth = parseFloat(parentStyles.borderTopWidth) || 0;\n  const borderBottomWidth = parseFloat(parentStyles.borderBottomWidth) || 0;\n\n  return (\n    parent.clientHeight -\n    paddingTop -\n    paddingBottom -\n    borderTopWidth -\n    borderBottomWidth\n  );\n};\n\nexport const calculateAvailableWidth = (container: HTMLElement) => {\n  const parent = container.parentElement;\n  if (!parent) return 0;\n\n  const parentStyles = window.getComputedStyle(parent);\n  const paddingLeft = parseFloat(parentStyles.paddingLeft) || 0;\n  const paddingRight = parseFloat(parentStyles.paddingRight) || 0;\n  const borderLeftWidth = parseFloat(parentStyles.borderLeftWidth) || 0;\n  const borderRightWidth = parseFloat(parentStyles.borderRightWidth) || 0;\n\n  return (\n    parent.clientWidth -\n    paddingLeft -\n    paddingRight -\n    borderLeftWidth -\n    borderRightWidth\n  );\n};\n\n// Overflow detection utilities\nexport type OverflowType = \"horizontal\" | \"vertical\" | \"both\";\n\nexport interface OverflowCheckOptions {\n  type?: OverflowType;\n  availableHeight?: number;\n  text?: string;\n}\n\nexport const checkHorizontalOverflow = (container: HTMLElement): boolean => {\n  return container.scrollWidth > container.clientWidth;\n};\n\nexport const checkVerticalOverflow = (\n  container: HTMLElement,\n  availableHeight?: number\n): boolean => {\n  const compareHeight = availableHeight ?? (container.clientHeight || container.offsetHeight);\n  return container.scrollHeight > compareHeight;\n};\n\nexport const checkOverflow = (\n  container: HTMLElement,\n  options: OverflowCheckOptions = {}\n): boolean => {\n  const { type = \"horizontal\", availableHeight, text } = options;\n\n  // If text is provided, use measurement clone for more accurate detection\n  if (text) {\n    const clone = createMeasurementClone(text, container);\n    let isOverflowing = false;\n\n    switch (type) {\n      case \"horizontal\":\n        isOverflowing = clone.scrollWidth > container.clientWidth;\n        break;\n      case \"vertical\":\n        isOverflowing = availableHeight\n          ? clone.scrollHeight > availableHeight\n          : clone.scrollHeight > (container.clientHeight || container.offsetHeight);\n        break;\n      case \"both\":\n        isOverflowing =\n          clone.scrollWidth > container.clientWidth ||\n          (availableHeight\n            ? clone.scrollHeight > availableHeight\n            : clone.scrollHeight > (container.clientHeight || container.offsetHeight));\n        break;\n    }\n\n    document.body.removeChild(clone);\n    return isOverflowing;\n  }\n\n  // Use direct container measurements\n  switch (type) {\n    case \"horizontal\":\n      return checkHorizontalOverflow(container);\n    case \"vertical\":\n      return checkVerticalOverflow(container, availableHeight);\n    case \"both\":\n      return checkHorizontalOverflow(container) || checkVerticalOverflow(container, availableHeight);\n    default:\n      return checkHorizontalOverflow(container);\n  }\n};\n"],"names":["measureText","container","span","nodeRect","containerClone","text","getMiddleTruncatedString","ellipsis","getTextWidth","destroyMeasure","textWidth","containerWidthToCompare","initialOffset","offset","attempts","maxAttempts","buffer","start","end","truncatedStr","width","createMeasurementClone","styles","clone","calculateAvailableHeight","parent","parentStyles","paddingTop","paddingBottom","borderTopWidth","borderBottomWidth","checkHorizontalOverflow","checkVerticalOverflow","availableHeight","compareHeight","checkOverflow","options","type","isOverflowing"],"mappings":"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"}

package/dist/components/truncate/index.d.ts

@@ -1,2 +1,3 @@
 export * from './component';
+export * from './useOverflowDetection';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/truncate/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/truncate/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/truncate/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,wBAAwB,CAAC"}

package/dist/components/truncate/useOverflowDetection.d.ts

@@ -0,0 +1,19 @@
+import { OverflowCheckOptions } from './helpers';
+export interface UseOverflowDetectionOptions extends OverflowCheckOptions {
+    /** Element to observe for size changes */
+    container?: HTMLElement | React.RefObject<HTMLElement> | null;
+    /** Additional elements to observe (e.g., parent containers) */
+    additionalElements?: (HTMLElement | null)[];
+    /** Whether to enable the overflow detection */
+    enabled?: boolean;
+}
+export interface UseOverflowDetectionResult {
+    /** Whether the content is currently overflowing */
+    isOverflowing: boolean;
+    /** Function to manually check overflow */
+    checkOverflowNow: () => boolean;
+    /** Function to manually trigger a recheck */
+    recheckOverflow: () => void;
+}
+export declare const useOverflowDetection: (options?: UseOverflowDetectionOptions) => UseOverflowDetectionResult;
+//# sourceMappingURL=useOverflowDetection.d.ts.map

package/dist/components/truncate/useOverflowDetection.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useOverflowDetection.d.ts","sourceRoot":"","sources":["../../../src/components/truncate/useOverflowDetection.ts"],"names":[],"mappings":"AACA,OAAO,EAAiB,oBAAoB,EAAE,MAAM,WAAW,CAAC;AAEhE,MAAM,WAAW,2BAA4B,SAAQ,oBAAoB;IACvE,0CAA0C;IAC1C,SAAS,CAAC,EAAE,WAAW,GAAG,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,IAAI,CAAC;IAC9D,+DAA+D;IAC/D,kBAAkB,CAAC,EAAE,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC;IAC5C,+CAA+C;IAC/C,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,0BAA0B;IACzC,mDAAmD;IACnD,aAAa,EAAE,OAAO,CAAC;IACvB,0CAA0C;IAC1C,gBAAgB,EAAE,MAAM,OAAO,CAAC;IAChC,6CAA6C;IAC7C,eAAe,EAAE,MAAM,IAAI,CAAC;CAC7B;AAED,eAAO,MAAM,oBAAoB,GAC/B,UAAS,2BAAgC,KACxC,0BAyFF,CAAC"}