@veeqo/ui 14.10.0-beta-1 → 14.10.0-beta-2

package/dist/components/LegacyDataTable/styled.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"styled.cjs","sources":["../../../src/components/LegacyDataTable/styled.tsx"],"sourcesContent":["import React, { createContext, useContext, useRef } from 'react';\nimport { buildClassnames, assignCssVars } from '../../utils';\nimport styles from './LegacyDataTable.module.scss';\nimport { ScrollPosition } from './utils/constants';\n\n/* --- Instance ID for scoped styles --- */\n\nlet legacyTableIdCounter = 0;\n\nfunction useLegacyTableId(): string {\n  const idRef = useRef<string | null>(null);\n\n  if (idRef.current === null) {\n    legacyTableIdCounter += 1;\n    idRef.current = `ldt-${legacyTableIdCounter}`;\n  }\n\n  return idRef.current;\n}\n\n/**\n * Reset the counter between test runs for deterministic snapshots.\n * @internal Test utility only.\n */\nexport function resetLegacyTableIdCounter(): void {\n  legacyTableIdCounter = 0;\n}\n\nconst TableIdContext = createContext<string>('');\n\n/* --- Wrapper --- */\n\ntype WrapperPropTypes = {\n  scrollDisabled: boolean;\n  scrollPosition?: ScrollPosition;\n  lastStartFixedColumnsIndex?: number;\n  firstEndFixedColumnsIndex?: number;\n  showScrollbar?: boolean;\n  children?: React.ReactNode;\n  className?: string;\n  style?: React.CSSProperties;\n};\n\nfunction useScopedShadowCss({\n  scrollDisabled,\n  scrollPosition,\n  lastStartFixedColumnsIndex,\n  firstEndFixedColumnsIndex,\n}: Pick<WrapperPropTypes, 'scrollDisabled' | 'scrollPosition' | 'lastStartFixedColumnsIndex' | 'firstEndFixedColumnsIndex'>): string {\n  if (scrollDisabled) return '';\n  if (!lastStartFixedColumnsIndex && !firstEndFixedColumnsIndex) return '';\n\n  const fixedColumnShadow = `\n    position: absolute;\n    top: 0;\n    bottom: -1px;\n    width: 30px;\n    content: \"\";\n    pointer-events: none;\n    box-sizing: border-box;\n    transition: box-shadow .3s;\n  `;\n\n  const startShadowVisible =\n    scrollPosition === ScrollPosition.middle || scrollPosition === ScrollPosition.end;\n  const endShadowVisible =\n    scrollPosition === ScrollPosition.start || scrollPosition === ScrollPosition.middle;\n\n  const startShadow = startShadowVisible\n    ? 'box-shadow: inset 10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n  const endShadow = endShadowVisible\n    ? 'box-shadow: inset -10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n\n  const startBlock = lastStartFixedColumnsIndex ? `\n    td:nth-child(${lastStartFixedColumnsIndex}):after,\n    th:nth-child(${lastStartFixedColumnsIndex}):after {\n      right: 0;\n      transform: translate(100%);\n      ${fixedColumnShadow}\n      ${startShadow}\n    }\n  ` : '';\n\n  const endBlock = firstEndFixedColumnsIndex ? `\n    td:nth-last-child(${firstEndFixedColumnsIndex}):after,\n    th:nth-last-child(${firstEndFixedColumnsIndex}):after {\n      left: 0;\n      transform: translate(-100%);\n      ${fixedColumnShadow}\n      ${endShadow}\n    }\n  ` : '';\n\n  return `${startBlock}${endBlock}`;\n}\n\nexport const Wrapper = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (\n    {\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n      showScrollbar,\n      className,\n      children,\n      ...rest\n    },\n    ref,\n  ) => {\n    const tableId = useLegacyTableId();\n    const scopedCss = useScopedShadowCss({\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n    });\n\n    return (\n      <div\n        ref={ref}\n        data-legacy-table-id={tableId}\n        className={buildClassnames([\n          styles.wrapper,\n          scrollDisabled ? styles.wrapperScrollDisabled : styles.wrapperScrollEnabled,\n          showScrollbar && styles.wrapperShowScrollbar,\n          className,\n        ])}\n        {...rest}\n      >\n        {scopedCss && <style>{`[data-legacy-table-id=\"${tableId}\"] { ${scopedCss} }`}</style>}\n        <TableIdContext.Provider value={tableId}>\n          {children}\n        </TableIdContext.Provider>\n      </div>\n    );\n  },\n);\n\nWrapper.displayName = 'Wrapper';\n\nexport const WrapperBordered = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (props, ref) => (\n    <Wrapper ref={ref} {...props} className={buildClassnames([styles.wrapperBordered, props.className])} />\n  ),\n);\n\nWrapperBordered.displayName = 'WrapperBordered';\n\n/* --- TooltipContent --- */\n\nexport const TooltipContent = ({ children, ...rest }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={styles.tooltipContent} {...rest}>\n    {children}\n  </div>\n);\n\n/* --- Head --- */\n\nexport const Head = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <thead className={styles.head} {...rest}>\n    {children}\n  </thead>\n);\n\n/* --- Body --- */\n\ninterface BodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Body = ({ fixedColumnsStyle, className, children, ...rest }: BodyProps) => {\n  const tableId = useContext(TableIdContext);\n  const scopeSelector = tableId ? `[data-legacy-table-id=\"${tableId}\"]` : '';\n  return (\n    <tbody className={buildClassnames([styles.body, styles.bodyBorderTop, className])} {...rest}>\n      {/* SAFETY: fixedColumnsStyle is internally generated by convertFixedColumnInlineStyleToStyled. Do not pass user-controlled strings. */}\n      {fixedColumnsStyle && <style>{`${scopeSelector} .${styles.body} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tbody>\n  );\n};\n\n/* --- Foot --- */\n\nexport const Foot = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <tfoot className={styles.foot} {...rest}>\n    {children}\n  </tfoot>\n);\n\n/* --- Row --- */\n\nexport interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {\n  accentColor?: string;\n}\n\nexport const Row = ({ accentColor, className, children, style, ...rest }: RowProps) => (\n  <tr\n    className={buildClassnames([styles.row, accentColor && styles.rowAccentColor, className])}\n    style={{\n      ...assignCssVars({ rowAccentColor: accentColor }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </tr>\n);\n\n/* --- Cell --- */\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const Cell = ({ align, grow, className, children, style, ...rest }: CellProps) => (\n  <td\n    className={buildClassnames([styles.cell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </td>\n);\n\n/* --- HeaderCell --- */\n\nexport interface HeaderCellProps extends React.ThHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const HeaderCell = ({ align, grow, className, children, style, ...rest }: HeaderCellProps) => (\n  <th\n    className={buildClassnames([styles.headerCell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </th>\n);\n\n/* --- HeaderCellLayout --- */\n\nconst alignmentMap: Record<string, string> = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n};\n\nexport interface HeaderCellLayoutProps extends React.HTMLAttributes<HTMLDivElement> {\n  align?: 'left' | 'center' | 'right';\n}\n\nexport const HeaderCellLayout = ({ align, className, children, style, ...rest }: HeaderCellLayoutProps) => (\n  <div\n    className={buildClassnames([styles.headerCellLayout, className])}\n    style={{\n      ...assignCssVars({ layoutAlign: align ? alignmentMap[align] : undefined }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </div>\n);\n\n/* --- Table --- */\n\ninterface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {\n  striped?: boolean;\n  noWrap?: boolean;\n  tableLoading?: boolean;\n  isFixedLayout?: boolean;\n}\n\nexport const Table = React.forwardRef<HTMLTableElement, TableProps>(\n  ({ striped, noWrap, tableLoading, isFixedLayout, className, children, ...rest }, ref) => (\n    <table\n      ref={ref}\n      className={buildClassnames([\n        styles.table,\n        isFixedLayout && styles.tableFixedLayout,\n        tableLoading && styles.tableLoading,\n        striped && styles.tableStriped,\n        noWrap && styles.tableNoWrap,\n        className,\n      ])}\n      {...rest}\n    >\n      {children}\n    </table>\n  ),\n);\n\nTable.displayName = 'Table';\n\n/* --- Footer --- */\n\ninterface FooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Footer = ({ fixedColumnsStyle, className, children, ...rest }: FooterProps) => {\n  const tableId = useContext(TableIdContext);\n  const scopeSelector = tableId ? `[data-legacy-table-id=\"${tableId}\"]` : '';\n  return (\n    <tfoot className={buildClassnames([styles.footer, className])} {...rest}>\n      {fixedColumnsStyle && <style>{`${scopeSelector} .${styles.footer} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tfoot>\n  );\n};\n\n/* --- StickyHeaderWrapper --- */\n\nexport const StickyHeaderWrapper = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, children, ...rest }, ref) => (\n    <div ref={ref} className={buildClassnames([styles.stickyHeaderWrapper, className])} {...rest}>\n      {children}\n    </div>\n  ),\n);\n\nStickyHeaderWrapper.displayName = 'StickyHeaderWrapper';\n\n/* --- FakeHeaderTable (same as Table) --- */\n\nexport const FakeHeaderTable = Table;\n"],"names":["useRef","createContext","ScrollPosition","React","buildClassnames","styles","useContext","assignCssVars"],"mappings":"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"}
+{"version":3,"file":"styled.cjs","sources":["../../../src/components/LegacyDataTable/styled.tsx"],"sourcesContent":["import React, { createContext, useContext, useRef } from 'react';\nimport { buildClassnames, assignCssVars } from '../../utils';\nimport styles from './LegacyDataTable.module.scss';\nimport { ScrollPosition } from './utils/constants';\n\n/* --- Instance ID for scoped styles --- */\n\nlet legacyTableIdCounter = 0;\n\nfunction useLegacyTableId(): string {\n  const idRef = useRef<string | null>(null);\n\n  if (idRef.current === null) {\n    legacyTableIdCounter += 1;\n    idRef.current = `ldt-${legacyTableIdCounter}`;\n  }\n\n  return idRef.current;\n}\n\n/**\n * Reset the counter between test runs for deterministic snapshots.\n * @internal Test utility only.\n */\nexport function resetLegacyTableIdCounter(): void {\n  legacyTableIdCounter = 0;\n}\n\nconst TableIdContext = createContext<string>('');\n\n/* --- Wrapper --- */\n\ntype WrapperPropTypes = {\n  scrollDisabled: boolean;\n  scrollPosition?: ScrollPosition;\n  lastStartFixedColumnsIndex?: number;\n  firstEndFixedColumnsIndex?: number;\n  showScrollbar?: boolean;\n  children?: React.ReactNode;\n  className?: string;\n  style?: React.CSSProperties;\n};\n\nfunction getScopedShadowRules({\n  scrollDisabled,\n  scrollPosition,\n  lastStartFixedColumnsIndex,\n  firstEndFixedColumnsIndex,\n}: Pick<WrapperPropTypes, 'scrollDisabled' | 'scrollPosition' | 'lastStartFixedColumnsIndex' | 'firstEndFixedColumnsIndex'>): string[] {\n  if (scrollDisabled) return [];\n  if (!lastStartFixedColumnsIndex && !firstEndFixedColumnsIndex) return [];\n\n  const fixedColumnShadow = 'position: absolute; top: 0; bottom: -1px; width: 30px; content: \"\"; pointer-events: none; box-sizing: border-box; transition: box-shadow .3s;';\n\n  const startShadowVisible =\n    scrollPosition === ScrollPosition.middle || scrollPosition === ScrollPosition.end;\n  const endShadowVisible =\n    scrollPosition === ScrollPosition.start || scrollPosition === ScrollPosition.middle;\n\n  const startShadow = startShadowVisible\n    ? 'box-shadow: inset 10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n  const endShadow = endShadowVisible\n    ? 'box-shadow: inset -10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n\n  const rules: string[] = [];\n\n  if (lastStartFixedColumnsIndex) {\n    rules.push(\n      `td:nth-child(${lastStartFixedColumnsIndex}):after, th:nth-child(${lastStartFixedColumnsIndex}):after { right: 0; transform: translate(100%); ${fixedColumnShadow} ${startShadow} }`,\n    );\n  }\n\n  if (firstEndFixedColumnsIndex) {\n    rules.push(\n      `td:nth-last-child(${firstEndFixedColumnsIndex}):after, th:nth-last-child(${firstEndFixedColumnsIndex}):after { left: 0; transform: translate(-100%); ${fixedColumnShadow} ${endShadow} }`,\n    );\n  }\n\n  return rules;\n}\n\nexport const Wrapper = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (\n    {\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n      showScrollbar,\n      className,\n      children,\n      ...rest\n    },\n    ref,\n  ) => {\n    const tableId = useLegacyTableId();\n    const shadowRules = getScopedShadowRules({\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n    });\n    const scopeSelector = `[data-legacy-table-id=\"${tableId}\"]`;\n    const scopedStyle = shadowRules.length > 0\n      ? shadowRules.map((rule) => {\n        const braceIndex = rule.indexOf('{');\n        if (braceIndex === -1) return `${scopeSelector} ${rule}`;\n        const selectorPart = rule.slice(0, braceIndex).trim();\n        const bodyPart = rule.slice(braceIndex);\n        const scopedSelectors = selectorPart\n          .split(',')\n          .map((sel) => `${scopeSelector} ${sel.trim()}`)\n          .join(', ');\n        return `${scopedSelectors} ${bodyPart}`;\n      }).join('\\n')\n      : '';\n\n    return (\n      <div\n        ref={ref}\n        data-legacy-table-id={tableId}\n        className={buildClassnames([\n          styles.wrapper,\n          scrollDisabled ? styles.wrapperScrollDisabled : styles.wrapperScrollEnabled,\n          showScrollbar && styles.wrapperShowScrollbar,\n          className,\n        ])}\n        {...rest}\n      >\n        {scopedStyle && <style>{scopedStyle}</style>}\n        <TableIdContext.Provider value={tableId}>\n          {children}\n        </TableIdContext.Provider>\n      </div>\n    );\n  },\n);\n\nWrapper.displayName = 'Wrapper';\n\nexport const WrapperBordered = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (props, ref) => (\n    <Wrapper ref={ref} {...props} className={buildClassnames([styles.wrapperBordered, props.className])} />\n  ),\n);\n\nWrapperBordered.displayName = 'WrapperBordered';\n\n/* --- TooltipContent --- */\n\nexport const TooltipContent = ({ children, ...rest }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={styles.tooltipContent} {...rest}>\n    {children}\n  </div>\n);\n\n/* --- Head --- */\n\nexport const Head = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <thead className={styles.head} {...rest}>\n    {children}\n  </thead>\n);\n\n/* --- Body --- */\n\ninterface BodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Body = ({ fixedColumnsStyle, className, children, ...rest }: BodyProps) => {\n  const tableId = useContext(TableIdContext);\n  const shouldRenderStyle = fixedColumnsStyle && tableId;\n  return (\n    <tbody className={buildClassnames([styles.body, styles.bodyBorderTop, className])} {...rest}>\n      {/* Style rendered inside tbody: technically invalid HTML but browsers handle it correctly.\n          This feature (fixedColumnsStyle) has zero production usage. Moving to a portal or\n          hoisting to Wrapper would require API changes for a dead feature. */}\n      {shouldRenderStyle && <style>{`[data-legacy-table-id=\"${tableId}\"] .${styles.body} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tbody>\n  );\n};\n\n/* --- Foot --- */\n\nexport const Foot = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <tfoot className={styles.foot} {...rest}>\n    {children}\n  </tfoot>\n);\n\n/* --- Row --- */\n\nexport interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {\n  accentColor?: string;\n}\n\nexport const Row = ({ accentColor, className, children, style, ...rest }: RowProps) => (\n  <tr\n    className={buildClassnames([styles.row, accentColor && styles.rowAccentColor, className])}\n    style={{\n      ...assignCssVars({ rowAccentColor: accentColor }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </tr>\n);\n\n/* --- Cell --- */\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const Cell = ({ align, grow, className, children, style, ...rest }: CellProps) => (\n  <td\n    className={buildClassnames([styles.cell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </td>\n);\n\n/* --- HeaderCell --- */\n\nexport interface HeaderCellProps extends React.ThHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const HeaderCell = ({ align, grow, className, children, style, ...rest }: HeaderCellProps) => (\n  <th\n    className={buildClassnames([styles.headerCell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </th>\n);\n\n/* --- HeaderCellLayout --- */\n\nconst alignmentMap: Record<string, string> = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n};\n\nexport interface HeaderCellLayoutProps extends React.HTMLAttributes<HTMLDivElement> {\n  align?: 'left' | 'center' | 'right';\n}\n\nexport const HeaderCellLayout = ({ align, className, children, style, ...rest }: HeaderCellLayoutProps) => (\n  <div\n    className={buildClassnames([styles.headerCellLayout, className])}\n    style={{\n      ...assignCssVars({ layoutAlign: align ? alignmentMap[align] : undefined }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </div>\n);\n\n/* --- Table --- */\n\ninterface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {\n  striped?: boolean;\n  noWrap?: boolean;\n  tableLoading?: boolean;\n  isFixedLayout?: boolean;\n}\n\nexport const Table = React.forwardRef<HTMLTableElement, TableProps>(\n  ({ striped, noWrap, tableLoading, isFixedLayout, className, children, ...rest }, ref) => (\n    <table\n      ref={ref}\n      className={buildClassnames([\n        styles.table,\n        isFixedLayout && styles.tableFixedLayout,\n        tableLoading && styles.tableLoading,\n        striped && styles.tableStriped,\n        noWrap && styles.tableNoWrap,\n        className,\n      ])}\n      {...rest}\n    >\n      {children}\n    </table>\n  ),\n);\n\nTable.displayName = 'Table';\n\n/* --- Footer --- */\n\ninterface FooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Footer = ({ fixedColumnsStyle, className, children, ...rest }: FooterProps) => {\n  const tableId = useContext(TableIdContext);\n  const shouldRenderStyle = fixedColumnsStyle && tableId;\n  return (\n    <tfoot className={buildClassnames([styles.footer, className])} {...rest}>\n      {shouldRenderStyle && <style>{`[data-legacy-table-id=\"${tableId}\"] .${styles.footer} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tfoot>\n  );\n};\n\n/* --- StickyHeaderWrapper --- */\n\nexport const StickyHeaderWrapper = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, children, ...rest }, ref) => (\n    <div ref={ref} className={buildClassnames([styles.stickyHeaderWrapper, className])} {...rest}>\n      {children}\n    </div>\n  ),\n);\n\nStickyHeaderWrapper.displayName = 'StickyHeaderWrapper';\n\n/* --- FakeHeaderTable (same as Table) --- */\n\nexport const FakeHeaderTable = Table;\n"],"names":["useRef","createContext","ScrollPosition","React","buildClassnames","styles","useContext","assignCssVars"],"mappings":"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"}

package/dist/components/LegacyDataTable/styled.js

@@ -16,21 +16,12 @@ function useLegacyTableId() {
     return idRef.current;
 }
 const TableIdContext = createContext('');
-function useScopedShadowCss({ scrollDisabled, scrollPosition, lastStartFixedColumnsIndex, firstEndFixedColumnsIndex, }) {
+function getScopedShadowRules({ scrollDisabled, scrollPosition, lastStartFixedColumnsIndex, firstEndFixedColumnsIndex, }) {
     if (scrollDisabled)
-        return '';
+        return [];
     if (!lastStartFixedColumnsIndex && !firstEndFixedColumnsIndex)
-        return '';
-    const fixedColumnShadow = `
-    position: absolute;
-    top: 0;
-    bottom: -1px;
-    width: 30px;
-    content: "";
-    pointer-events: none;
-    box-sizing: border-box;
-    transition: box-shadow .3s;
-  `;
+        return [];
+    const fixedColumnShadow = 'position: absolute; top: 0; bottom: -1px; width: 30px; content: ""; pointer-events: none; box-sizing: border-box; transition: box-shadow .3s;';
     const startShadowVisible = scrollPosition === ScrollPosition.middle || scrollPosition === ScrollPosition.end;
     const endShadowVisible = scrollPosition === ScrollPosition.start || scrollPosition === ScrollPosition.middle;
     const startShadow = startShadowVisible
@@ -39,41 +30,45 @@ function useScopedShadowCss({ scrollDisabled, scrollPosition, lastStartFixedColu
     const endShadow = endShadowVisible
         ? 'box-shadow: inset -10px 0 10px -8px rgb(0 0 0 / 25%);'
         : '';
-    const startBlock = lastStartFixedColumnsIndex ? `
-    td:nth-child(${lastStartFixedColumnsIndex}):after,
-    th:nth-child(${lastStartFixedColumnsIndex}):after {
-      right: 0;
-      transform: translate(100%);
-      ${fixedColumnShadow}
-      ${startShadow}
+    const rules = [];
+    if (lastStartFixedColumnsIndex) {
+        rules.push(`td:nth-child(${lastStartFixedColumnsIndex}):after, th:nth-child(${lastStartFixedColumnsIndex}):after { right: 0; transform: translate(100%); ${fixedColumnShadow} ${startShadow} }`);
     }
-  ` : '';
-    const endBlock = firstEndFixedColumnsIndex ? `
-    td:nth-last-child(${firstEndFixedColumnsIndex}):after,
-    th:nth-last-child(${firstEndFixedColumnsIndex}):after {
-      left: 0;
-      transform: translate(-100%);
-      ${fixedColumnShadow}
-      ${endShadow}
+    if (firstEndFixedColumnsIndex) {
+        rules.push(`td:nth-last-child(${firstEndFixedColumnsIndex}):after, th:nth-last-child(${firstEndFixedColumnsIndex}):after { left: 0; transform: translate(-100%); ${fixedColumnShadow} ${endShadow} }`);
     }
-  ` : '';
-    return `${startBlock}${endBlock}`;
+    return rules;
 }
 const Wrapper = React__default.forwardRef(({ scrollDisabled, scrollPosition, lastStartFixedColumnsIndex, firstEndFixedColumnsIndex, showScrollbar, className, children, ...rest }, ref) => {
     const tableId = useLegacyTableId();
-    const scopedCss = useScopedShadowCss({
+    const shadowRules = getScopedShadowRules({
         scrollDisabled,
         scrollPosition,
         lastStartFixedColumnsIndex,
         firstEndFixedColumnsIndex,
     });
+    const scopeSelector = `[data-legacy-table-id="${tableId}"]`;
+    const scopedStyle = shadowRules.length > 0
+        ? shadowRules.map((rule) => {
+            const braceIndex = rule.indexOf('{');
+            if (braceIndex === -1)
+                return `${scopeSelector} ${rule}`;
+            const selectorPart = rule.slice(0, braceIndex).trim();
+            const bodyPart = rule.slice(braceIndex);
+            const scopedSelectors = selectorPart
+                .split(',')
+                .map((sel) => `${scopeSelector} ${sel.trim()}`)
+                .join(', ');
+            return `${scopedSelectors} ${bodyPart}`;
+        }).join('\n')
+        : '';
     return (React__default.createElement("div", { ref: ref, "data-legacy-table-id": tableId, className: buildClassnames([
             styles.wrapper,
             scrollDisabled ? styles.wrapperScrollDisabled : styles.wrapperScrollEnabled,
             showScrollbar && styles.wrapperShowScrollbar,
             className,
         ]), ...rest },
-        scopedCss && React__default.createElement("style", null, `[data-legacy-table-id="${tableId}"] { ${scopedCss} }`),
+        scopedStyle && React__default.createElement("style", null, scopedStyle),
         React__default.createElement(TableIdContext.Provider, { value: tableId }, children)));
 });
 Wrapper.displayName = 'Wrapper';
@@ -85,9 +80,9 @@ const TooltipContent = ({ children, ...rest }) => (React__default.createElement(
 const Head = ({ children, ...rest }) => (React__default.createElement("thead", { className: styles.head, ...rest }, children));
 const Body = ({ fixedColumnsStyle, className, children, ...rest }) => {
     const tableId = useContext(TableIdContext);
-    const scopeSelector = tableId ? `[data-legacy-table-id="${tableId}"]` : '';
+    const shouldRenderStyle = fixedColumnsStyle && tableId;
     return (React__default.createElement("tbody", { className: buildClassnames([styles.body, styles.bodyBorderTop, className]), ...rest },
-        fixedColumnsStyle && React__default.createElement("style", null, `${scopeSelector} .${styles.body} tr { ${fixedColumnsStyle} }`),
+        shouldRenderStyle && React__default.createElement("style", null, `[data-legacy-table-id="${tableId}"] .${styles.body} tr { ${fixedColumnsStyle} }`),
         children));
 };
 const Row = ({ accentColor, className, children, style, ...rest }) => (React__default.createElement("tr", { className: buildClassnames([styles.row, accentColor && styles.rowAccentColor, className]), style: {
@@ -123,9 +118,9 @@ const Table = React__default.forwardRef(({ striped, noWrap, tableLoading, isFixe
 Table.displayName = 'Table';
 const Footer = ({ fixedColumnsStyle, className, children, ...rest }) => {
     const tableId = useContext(TableIdContext);
-    const scopeSelector = tableId ? `[data-legacy-table-id="${tableId}"]` : '';
+    const shouldRenderStyle = fixedColumnsStyle && tableId;
     return (React__default.createElement("tfoot", { className: buildClassnames([styles.footer, className]), ...rest },
-        fixedColumnsStyle && React__default.createElement("style", null, `${scopeSelector} .${styles.footer} tr { ${fixedColumnsStyle} }`),
+        shouldRenderStyle && React__default.createElement("style", null, `[data-legacy-table-id="${tableId}"] .${styles.footer} tr { ${fixedColumnsStyle} }`),
         children));
 };
 /* --- StickyHeaderWrapper --- */

package/dist/components/LegacyDataTable/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../src/components/LegacyDataTable/styled.tsx"],"sourcesContent":["import React, { createContext, useContext, useRef } from 'react';\nimport { buildClassnames, assignCssVars } from '../../utils';\nimport styles from './LegacyDataTable.module.scss';\nimport { ScrollPosition } from './utils/constants';\n\n/* --- Instance ID for scoped styles --- */\n\nlet legacyTableIdCounter = 0;\n\nfunction useLegacyTableId(): string {\n  const idRef = useRef<string | null>(null);\n\n  if (idRef.current === null) {\n    legacyTableIdCounter += 1;\n    idRef.current = `ldt-${legacyTableIdCounter}`;\n  }\n\n  return idRef.current;\n}\n\n/**\n * Reset the counter between test runs for deterministic snapshots.\n * @internal Test utility only.\n */\nexport function resetLegacyTableIdCounter(): void {\n  legacyTableIdCounter = 0;\n}\n\nconst TableIdContext = createContext<string>('');\n\n/* --- Wrapper --- */\n\ntype WrapperPropTypes = {\n  scrollDisabled: boolean;\n  scrollPosition?: ScrollPosition;\n  lastStartFixedColumnsIndex?: number;\n  firstEndFixedColumnsIndex?: number;\n  showScrollbar?: boolean;\n  children?: React.ReactNode;\n  className?: string;\n  style?: React.CSSProperties;\n};\n\nfunction useScopedShadowCss({\n  scrollDisabled,\n  scrollPosition,\n  lastStartFixedColumnsIndex,\n  firstEndFixedColumnsIndex,\n}: Pick<WrapperPropTypes, 'scrollDisabled' | 'scrollPosition' | 'lastStartFixedColumnsIndex' | 'firstEndFixedColumnsIndex'>): string {\n  if (scrollDisabled) return '';\n  if (!lastStartFixedColumnsIndex && !firstEndFixedColumnsIndex) return '';\n\n  const fixedColumnShadow = `\n    position: absolute;\n    top: 0;\n    bottom: -1px;\n    width: 30px;\n    content: \"\";\n    pointer-events: none;\n    box-sizing: border-box;\n    transition: box-shadow .3s;\n  `;\n\n  const startShadowVisible =\n    scrollPosition === ScrollPosition.middle || scrollPosition === ScrollPosition.end;\n  const endShadowVisible =\n    scrollPosition === ScrollPosition.start || scrollPosition === ScrollPosition.middle;\n\n  const startShadow = startShadowVisible\n    ? 'box-shadow: inset 10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n  const endShadow = endShadowVisible\n    ? 'box-shadow: inset -10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n\n  const startBlock = lastStartFixedColumnsIndex ? `\n    td:nth-child(${lastStartFixedColumnsIndex}):after,\n    th:nth-child(${lastStartFixedColumnsIndex}):after {\n      right: 0;\n      transform: translate(100%);\n      ${fixedColumnShadow}\n      ${startShadow}\n    }\n  ` : '';\n\n  const endBlock = firstEndFixedColumnsIndex ? `\n    td:nth-last-child(${firstEndFixedColumnsIndex}):after,\n    th:nth-last-child(${firstEndFixedColumnsIndex}):after {\n      left: 0;\n      transform: translate(-100%);\n      ${fixedColumnShadow}\n      ${endShadow}\n    }\n  ` : '';\n\n  return `${startBlock}${endBlock}`;\n}\n\nexport const Wrapper = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (\n    {\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n      showScrollbar,\n      className,\n      children,\n      ...rest\n    },\n    ref,\n  ) => {\n    const tableId = useLegacyTableId();\n    const scopedCss = useScopedShadowCss({\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n    });\n\n    return (\n      <div\n        ref={ref}\n        data-legacy-table-id={tableId}\n        className={buildClassnames([\n          styles.wrapper,\n          scrollDisabled ? styles.wrapperScrollDisabled : styles.wrapperScrollEnabled,\n          showScrollbar && styles.wrapperShowScrollbar,\n          className,\n        ])}\n        {...rest}\n      >\n        {scopedCss && <style>{`[data-legacy-table-id=\"${tableId}\"] { ${scopedCss} }`}</style>}\n        <TableIdContext.Provider value={tableId}>\n          {children}\n        </TableIdContext.Provider>\n      </div>\n    );\n  },\n);\n\nWrapper.displayName = 'Wrapper';\n\nexport const WrapperBordered = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (props, ref) => (\n    <Wrapper ref={ref} {...props} className={buildClassnames([styles.wrapperBordered, props.className])} />\n  ),\n);\n\nWrapperBordered.displayName = 'WrapperBordered';\n\n/* --- TooltipContent --- */\n\nexport const TooltipContent = ({ children, ...rest }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={styles.tooltipContent} {...rest}>\n    {children}\n  </div>\n);\n\n/* --- Head --- */\n\nexport const Head = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <thead className={styles.head} {...rest}>\n    {children}\n  </thead>\n);\n\n/* --- Body --- */\n\ninterface BodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Body = ({ fixedColumnsStyle, className, children, ...rest }: BodyProps) => {\n  const tableId = useContext(TableIdContext);\n  const scopeSelector = tableId ? `[data-legacy-table-id=\"${tableId}\"]` : '';\n  return (\n    <tbody className={buildClassnames([styles.body, styles.bodyBorderTop, className])} {...rest}>\n      {/* SAFETY: fixedColumnsStyle is internally generated by convertFixedColumnInlineStyleToStyled. Do not pass user-controlled strings. */}\n      {fixedColumnsStyle && <style>{`${scopeSelector} .${styles.body} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tbody>\n  );\n};\n\n/* --- Foot --- */\n\nexport const Foot = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <tfoot className={styles.foot} {...rest}>\n    {children}\n  </tfoot>\n);\n\n/* --- Row --- */\n\nexport interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {\n  accentColor?: string;\n}\n\nexport const Row = ({ accentColor, className, children, style, ...rest }: RowProps) => (\n  <tr\n    className={buildClassnames([styles.row, accentColor && styles.rowAccentColor, className])}\n    style={{\n      ...assignCssVars({ rowAccentColor: accentColor }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </tr>\n);\n\n/* --- Cell --- */\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const Cell = ({ align, grow, className, children, style, ...rest }: CellProps) => (\n  <td\n    className={buildClassnames([styles.cell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </td>\n);\n\n/* --- HeaderCell --- */\n\nexport interface HeaderCellProps extends React.ThHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const HeaderCell = ({ align, grow, className, children, style, ...rest }: HeaderCellProps) => (\n  <th\n    className={buildClassnames([styles.headerCell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </th>\n);\n\n/* --- HeaderCellLayout --- */\n\nconst alignmentMap: Record<string, string> = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n};\n\nexport interface HeaderCellLayoutProps extends React.HTMLAttributes<HTMLDivElement> {\n  align?: 'left' | 'center' | 'right';\n}\n\nexport const HeaderCellLayout = ({ align, className, children, style, ...rest }: HeaderCellLayoutProps) => (\n  <div\n    className={buildClassnames([styles.headerCellLayout, className])}\n    style={{\n      ...assignCssVars({ layoutAlign: align ? alignmentMap[align] : undefined }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </div>\n);\n\n/* --- Table --- */\n\ninterface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {\n  striped?: boolean;\n  noWrap?: boolean;\n  tableLoading?: boolean;\n  isFixedLayout?: boolean;\n}\n\nexport const Table = React.forwardRef<HTMLTableElement, TableProps>(\n  ({ striped, noWrap, tableLoading, isFixedLayout, className, children, ...rest }, ref) => (\n    <table\n      ref={ref}\n      className={buildClassnames([\n        styles.table,\n        isFixedLayout && styles.tableFixedLayout,\n        tableLoading && styles.tableLoading,\n        striped && styles.tableStriped,\n        noWrap && styles.tableNoWrap,\n        className,\n      ])}\n      {...rest}\n    >\n      {children}\n    </table>\n  ),\n);\n\nTable.displayName = 'Table';\n\n/* --- Footer --- */\n\ninterface FooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Footer = ({ fixedColumnsStyle, className, children, ...rest }: FooterProps) => {\n  const tableId = useContext(TableIdContext);\n  const scopeSelector = tableId ? `[data-legacy-table-id=\"${tableId}\"]` : '';\n  return (\n    <tfoot className={buildClassnames([styles.footer, className])} {...rest}>\n      {fixedColumnsStyle && <style>{`${scopeSelector} .${styles.footer} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tfoot>\n  );\n};\n\n/* --- StickyHeaderWrapper --- */\n\nexport const StickyHeaderWrapper = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, children, ...rest }, ref) => (\n    <div ref={ref} className={buildClassnames([styles.stickyHeaderWrapper, className])} {...rest}>\n      {children}\n    </div>\n  ),\n);\n\nStickyHeaderWrapper.displayName = 'StickyHeaderWrapper';\n\n/* --- FakeHeaderTable (same as Table) --- */\n\nexport const FakeHeaderTable = Table;\n"],"names":["React"],"mappings":";;;;;;;AAKA;AAEA,IAAI,oBAAoB,GAAG,CAAC;AAE5B,SAAS,gBAAgB,GAAA;AACvB,IAAA,MAAM,KAAK,GAAG,MAAM,CAAgB,IAAI,CAAC;AAEzC,IAAA,IAAI,KAAK,CAAC,OAAO,KAAK,IAAI,EAAE;QAC1B,oBAAoB,IAAI,CAAC;AACzB,QAAA,KAAK,CAAC,OAAO,GAAG,CAAA,IAAA,EAAO,oBAAoB,EAAE;AAC9C,IAAA;IAED,OAAO,KAAK,CAAC,OAAO;AACtB;AAUA,MAAM,cAAc,GAAG,aAAa,CAAS,EAAE,CAAC;AAehD,SAAS,kBAAkB,CAAC,EAC1B,cAAc,EACd,cAAc,EACd,0BAA0B,EAC1B,yBAAyB,GACgG,EAAA;AACzH,IAAA,IAAI,cAAc;AAAE,QAAA,OAAO,EAAE;AAC7B,IAAA,IAAI,CAAC,0BAA0B,IAAI,CAAC,yBAAyB;AAAE,QAAA,OAAO,EAAE;AAExE,IAAA,MAAM,iBAAiB,GAAG;;;;;;;;;GASzB;AAED,IAAA,MAAM,kBAAkB,GACtB,cAAc,KAAK,cAAc,CAAC,MAAM,IAAI,cAAc,KAAK,cAAc,CAAC,GAAG;AACnF,IAAA,MAAM,gBAAgB,GACpB,cAAc,KAAK,cAAc,CAAC,KAAK,IAAI,cAAc,KAAK,cAAc,CAAC,MAAM;IAErF,MAAM,WAAW,GAAG;AAClB,UAAE;UACA,EAAE;IACN,MAAM,SAAS,GAAG;AAChB,UAAE;UACA,EAAE;AAEN,IAAA,MAAM,UAAU,GAAG,0BAA0B,GAAG;mBAC/B,0BAA0B,CAAA;mBAC1B,0BAA0B,CAAA;;;QAGrC,iBAAiB;QACjB,WAAW;;GAEhB,GAAG,EAAE;AAEN,IAAA,MAAM,QAAQ,GAAG,yBAAyB,GAAG;wBACvB,yBAAyB,CAAA;wBACzB,yBAAyB,CAAA;;;QAGzC,iBAAiB;QACjB,SAAS;;GAEd,GAAG,EAAE;AAEN,IAAA,OAAO,CAAA,EAAG,UAAU,CAAA,EAAG,QAAQ,EAAE;AACnC;AAEO,MAAM,OAAO,GAAGA,cAAK,CAAC,UAAU,CACrC,CACE,EACE,cAAc,EACd,cAAc,EACd,0BAA0B,EAC1B,yBAAyB,EACzB,aAAa,EACb,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EACD,GAAG,KACD;AACF,IAAA,MAAM,OAAO,GAAG,gBAAgB,EAAE;IAClC,MAAM,SAAS,GAAG,kBAAkB,CAAC;QACnC,cAAc;QACd,cAAc;QACd,0BAA0B;QAC1B,yBAAyB;AAC1B,KAAA,CAAC;IAEF,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,GAAG,EAAA,sBAAA,EACc,OAAO,EAC7B,SAAS,EAAE,eAAe,CAAC;AACzB,YAAA,MAAM,CAAC,OAAO;YACd,cAAc,GAAG,MAAM,CAAC,qBAAqB,GAAG,MAAM,CAAC,oBAAoB;YAC3E,aAAa,IAAI,MAAM,CAAC,oBAAoB;YAC5C,SAAS;AACV,SAAA,CAAC,KACE,IAAI,EAAA;AAEP,QAAA,SAAS,IAAIA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EAAQ,CAAA,uBAAA,EAA0B,OAAO,CAAA,KAAA,EAAQ,SAAS,IAAI,CAAS;AACrF,QAAAA,cAAA,CAAA,aAAA,CAAC,cAAc,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,OAAO,EAAA,EACpC,QAAQ,CACe,CACtB;AAEV,CAAC;AAGH,OAAO,CAAC,WAAW,GAAG,SAAS;AAExB,MAAM,eAAe,GAAGA,cAAK,CAAC,UAAU,CAC7C,CAAC,KAAK,EAAE,GAAG,MACTA,cAAA,CAAA,aAAA,CAAC,OAAO,IAAC,GAAG,EAAE,GAAG,EAAA,GAAM,KAAK,EAAE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,eAAe,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,EAAA,CAAI,CACxG;AAGH,eAAe,CAAC,WAAW,GAAG,iBAAiB;AAE/C;AAEO,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAwC,MACxFA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,cAAc,EAAA,GAAM,IAAI,EAAA,EAC5C,QAAQ,CACL;AAGR;AAEO,MAAM,IAAI,GAAG,CAAC,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAiD,MACvFA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,MAAM,CAAC,IAAI,EAAA,GAAM,IAAI,EAAA,EACpC,QAAQ,CACH;AASH,MAAM,IAAI,GAAG,CAAC,EAAE,iBAAiB,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAa,KAAI;AACrF,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,cAAc,CAAC;AAC1C,IAAA,MAAM,aAAa,GAAG,OAAO,GAAG,CAAA,uBAAA,EAA0B,OAAO,CAAA,EAAA,CAAI,GAAG,EAAE;AAC1E,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC,KAAM,IAAI,EAAA;QAExF,iBAAiB,IAAIA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EAAQ,CAAA,EAAG,aAAa,CAAA,EAAA,EAAK,MAAM,CAAC,IAAI,CAAA,MAAA,EAAS,iBAAiB,CAAA,EAAA,CAAI,CAAS;QACpG,QAAQ,CACH;AAEZ;AAgBO,MAAM,GAAG,GAAG,CAAC,EAAE,WAAW,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAY,MAChFA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,GAAG,EAAE,WAAW,IAAI,MAAM,CAAC,cAAc,EAAE,SAAS,CAAC,CAAC,EACzF,KAAK,EAAE;AACL,QAAA,GAAG,aAAa,CAAC,EAAE,cAAc,EAAE,WAAW,EAAE,CAAC;AACjD,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACN;MAUM,IAAI,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAa,MAClFA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,IAAI,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,EAC7E,KAAK,EAAE;AACL,QAAA,GAAG,aAAa,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;AACtC,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACN;MAUM,UAAU,GAAG,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAmB,MAC9FA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EACE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,UAAU,EAAE,IAAI,IAAI,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,EACnF,KAAK,EAAE;AACL,QAAA,GAAG,aAAa,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;AACtC,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACN;AAGP;AAEA,MAAM,YAAY,GAA2B;AAC3C,IAAA,IAAI,EAAE,YAAY;AAClB,IAAA,MAAM,EAAE,QAAQ;AAChB,IAAA,KAAK,EAAE,UAAU;CAClB;AAMM,MAAM,gBAAgB,GAAG,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,IAAI,EAAyB,MACpGA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,gBAAgB,EAAE,SAAS,CAAC,CAAC,EAChE,KAAK,EAAE;AACL,QAAA,GAAG,aAAa,CAAC,EAAE,WAAW,EAAE,KAAK,GAAG,YAAY,CAAC,KAAK,CAAC,GAAG,SAAS,EAAE,CAAC;AAC1E,QAAA,GAAG,KAAK;AACT,KAAA,EAAA,GACG,IAAI,EAAA,EAEP,QAAQ,CACL;AAYD,MAAM,KAAK,GAAGA,cAAK,CAAC,UAAU,CACnC,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MAClFA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,eAAe,CAAC;AACzB,QAAA,MAAM,CAAC,KAAK;QACZ,aAAa,IAAI,MAAM,CAAC,gBAAgB;QACxC,YAAY,IAAI,MAAM,CAAC,YAAY;QACnC,OAAO,IAAI,MAAM,CAAC,YAAY;QAC9B,MAAM,IAAI,MAAM,CAAC,WAAW;QAC5B,SAAS;AACV,KAAA,CAAC,KACE,IAAI,EAAA,EAEP,QAAQ,CACH,CACT;AAGH,KAAK,CAAC,WAAW,GAAG,OAAO;AAQpB,MAAM,MAAM,GAAG,CAAC,EAAE,iBAAiB,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAe,KAAI;AACzF,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,cAAc,CAAC;AAC1C,IAAA,MAAM,aAAa,GAAG,OAAO,GAAG,CAAA,uBAAA,EAA0B,OAAO,CAAA,EAAA,CAAI,GAAG,EAAE;AAC1E,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAO,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,KAAM,IAAI,EAAA;QACpE,iBAAiB,IAAIA,cAAA,CAAA,aAAA,CAAA,OAAA,EAAA,IAAA,EAAQ,CAAA,EAAG,aAAa,CAAA,EAAA,EAAK,MAAM,CAAC,MAAM,CAAA,MAAA,EAAS,iBAAiB,CAAA,EAAA,CAAI,CAAS;QACtG,QAAQ,CACH;AAEZ;AAEA;MAEa,mBAAmB,GAAGA,cAAK,CAAC,UAAU,CACjD,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,GAAG,MACpCA,sCAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,eAAe,CAAC,CAAC,MAAM,CAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC,EAAA,GAAM,IAAI,IACzF,QAAQ,CACL,CACP;AAGH,mBAAmB,CAAC,WAAW,GAAG,qBAAqB;AAEvD;AAEO,MAAM,eAAe,GAAG;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../src/components/LegacyDataTable/styled.tsx"],"sourcesContent":["import React, { createContext, useContext, useRef } from 'react';\nimport { buildClassnames, assignCssVars } from '../../utils';\nimport styles from './LegacyDataTable.module.scss';\nimport { ScrollPosition } from './utils/constants';\n\n/* --- Instance ID for scoped styles --- */\n\nlet legacyTableIdCounter = 0;\n\nfunction useLegacyTableId(): string {\n  const idRef = useRef<string | null>(null);\n\n  if (idRef.current === null) {\n    legacyTableIdCounter += 1;\n    idRef.current = `ldt-${legacyTableIdCounter}`;\n  }\n\n  return idRef.current;\n}\n\n/**\n * Reset the counter between test runs for deterministic snapshots.\n * @internal Test utility only.\n */\nexport function resetLegacyTableIdCounter(): void {\n  legacyTableIdCounter = 0;\n}\n\nconst TableIdContext = createContext<string>('');\n\n/* --- Wrapper --- */\n\ntype WrapperPropTypes = {\n  scrollDisabled: boolean;\n  scrollPosition?: ScrollPosition;\n  lastStartFixedColumnsIndex?: number;\n  firstEndFixedColumnsIndex?: number;\n  showScrollbar?: boolean;\n  children?: React.ReactNode;\n  className?: string;\n  style?: React.CSSProperties;\n};\n\nfunction getScopedShadowRules({\n  scrollDisabled,\n  scrollPosition,\n  lastStartFixedColumnsIndex,\n  firstEndFixedColumnsIndex,\n}: Pick<WrapperPropTypes, 'scrollDisabled' | 'scrollPosition' | 'lastStartFixedColumnsIndex' | 'firstEndFixedColumnsIndex'>): string[] {\n  if (scrollDisabled) return [];\n  if (!lastStartFixedColumnsIndex && !firstEndFixedColumnsIndex) return [];\n\n  const fixedColumnShadow = 'position: absolute; top: 0; bottom: -1px; width: 30px; content: \"\"; pointer-events: none; box-sizing: border-box; transition: box-shadow .3s;';\n\n  const startShadowVisible =\n    scrollPosition === ScrollPosition.middle || scrollPosition === ScrollPosition.end;\n  const endShadowVisible =\n    scrollPosition === ScrollPosition.start || scrollPosition === ScrollPosition.middle;\n\n  const startShadow = startShadowVisible\n    ? 'box-shadow: inset 10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n  const endShadow = endShadowVisible\n    ? 'box-shadow: inset -10px 0 10px -8px rgb(0 0 0 / 25%);'\n    : '';\n\n  const rules: string[] = [];\n\n  if (lastStartFixedColumnsIndex) {\n    rules.push(\n      `td:nth-child(${lastStartFixedColumnsIndex}):after, th:nth-child(${lastStartFixedColumnsIndex}):after { right: 0; transform: translate(100%); ${fixedColumnShadow} ${startShadow} }`,\n    );\n  }\n\n  if (firstEndFixedColumnsIndex) {\n    rules.push(\n      `td:nth-last-child(${firstEndFixedColumnsIndex}):after, th:nth-last-child(${firstEndFixedColumnsIndex}):after { left: 0; transform: translate(-100%); ${fixedColumnShadow} ${endShadow} }`,\n    );\n  }\n\n  return rules;\n}\n\nexport const Wrapper = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (\n    {\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n      showScrollbar,\n      className,\n      children,\n      ...rest\n    },\n    ref,\n  ) => {\n    const tableId = useLegacyTableId();\n    const shadowRules = getScopedShadowRules({\n      scrollDisabled,\n      scrollPosition,\n      lastStartFixedColumnsIndex,\n      firstEndFixedColumnsIndex,\n    });\n    const scopeSelector = `[data-legacy-table-id=\"${tableId}\"]`;\n    const scopedStyle = shadowRules.length > 0\n      ? shadowRules.map((rule) => {\n        const braceIndex = rule.indexOf('{');\n        if (braceIndex === -1) return `${scopeSelector} ${rule}`;\n        const selectorPart = rule.slice(0, braceIndex).trim();\n        const bodyPart = rule.slice(braceIndex);\n        const scopedSelectors = selectorPart\n          .split(',')\n          .map((sel) => `${scopeSelector} ${sel.trim()}`)\n          .join(', ');\n        return `${scopedSelectors} ${bodyPart}`;\n      }).join('\\n')\n      : '';\n\n    return (\n      <div\n        ref={ref}\n        data-legacy-table-id={tableId}\n        className={buildClassnames([\n          styles.wrapper,\n          scrollDisabled ? styles.wrapperScrollDisabled : styles.wrapperScrollEnabled,\n          showScrollbar && styles.wrapperShowScrollbar,\n          className,\n        ])}\n        {...rest}\n      >\n        {scopedStyle && <style>{scopedStyle}</style>}\n        <TableIdContext.Provider value={tableId}>\n          {children}\n        </TableIdContext.Provider>\n      </div>\n    );\n  },\n);\n\nWrapper.displayName = 'Wrapper';\n\nexport const WrapperBordered = React.forwardRef<HTMLDivElement, WrapperPropTypes>(\n  (props, ref) => (\n    <Wrapper ref={ref} {...props} className={buildClassnames([styles.wrapperBordered, props.className])} />\n  ),\n);\n\nWrapperBordered.displayName = 'WrapperBordered';\n\n/* --- TooltipContent --- */\n\nexport const TooltipContent = ({ children, ...rest }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={styles.tooltipContent} {...rest}>\n    {children}\n  </div>\n);\n\n/* --- Head --- */\n\nexport const Head = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <thead className={styles.head} {...rest}>\n    {children}\n  </thead>\n);\n\n/* --- Body --- */\n\ninterface BodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Body = ({ fixedColumnsStyle, className, children, ...rest }: BodyProps) => {\n  const tableId = useContext(TableIdContext);\n  const shouldRenderStyle = fixedColumnsStyle && tableId;\n  return (\n    <tbody className={buildClassnames([styles.body, styles.bodyBorderTop, className])} {...rest}>\n      {/* Style rendered inside tbody: technically invalid HTML but browsers handle it correctly.\n          This feature (fixedColumnsStyle) has zero production usage. Moving to a portal or\n          hoisting to Wrapper would require API changes for a dead feature. */}\n      {shouldRenderStyle && <style>{`[data-legacy-table-id=\"${tableId}\"] .${styles.body} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tbody>\n  );\n};\n\n/* --- Foot --- */\n\nexport const Foot = ({ children, ...rest }: React.HTMLAttributes<HTMLTableSectionElement>) => (\n  <tfoot className={styles.foot} {...rest}>\n    {children}\n  </tfoot>\n);\n\n/* --- Row --- */\n\nexport interface RowProps extends React.HTMLAttributes<HTMLTableRowElement> {\n  accentColor?: string;\n}\n\nexport const Row = ({ accentColor, className, children, style, ...rest }: RowProps) => (\n  <tr\n    className={buildClassnames([styles.row, accentColor && styles.rowAccentColor, className])}\n    style={{\n      ...assignCssVars({ rowAccentColor: accentColor }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </tr>\n);\n\n/* --- Cell --- */\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const Cell = ({ align, grow, className, children, style, ...rest }: CellProps) => (\n  <td\n    className={buildClassnames([styles.cell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </td>\n);\n\n/* --- HeaderCell --- */\n\nexport interface HeaderCellProps extends React.ThHTMLAttributes<HTMLTableCellElement> {\n  align?: 'left' | 'center' | 'right';\n  grow?: boolean;\n}\n\nexport const HeaderCell = ({ align, grow, className, children, style, ...rest }: HeaderCellProps) => (\n  <th\n    className={buildClassnames([styles.headerCell, grow && styles.cellGrow, className])}\n    style={{\n      ...assignCssVars({ cellAlign: align }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </th>\n);\n\n/* --- HeaderCellLayout --- */\n\nconst alignmentMap: Record<string, string> = {\n  left: 'flex-start',\n  center: 'center',\n  right: 'flex-end',\n};\n\nexport interface HeaderCellLayoutProps extends React.HTMLAttributes<HTMLDivElement> {\n  align?: 'left' | 'center' | 'right';\n}\n\nexport const HeaderCellLayout = ({ align, className, children, style, ...rest }: HeaderCellLayoutProps) => (\n  <div\n    className={buildClassnames([styles.headerCellLayout, className])}\n    style={{\n      ...assignCssVars({ layoutAlign: align ? alignmentMap[align] : undefined }),\n      ...style,\n    }}\n    {...rest}\n  >\n    {children}\n  </div>\n);\n\n/* --- Table --- */\n\ninterface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {\n  striped?: boolean;\n  noWrap?: boolean;\n  tableLoading?: boolean;\n  isFixedLayout?: boolean;\n}\n\nexport const Table = React.forwardRef<HTMLTableElement, TableProps>(\n  ({ striped, noWrap, tableLoading, isFixedLayout, className, children, ...rest }, ref) => (\n    <table\n      ref={ref}\n      className={buildClassnames([\n        styles.table,\n        isFixedLayout && styles.tableFixedLayout,\n        tableLoading && styles.tableLoading,\n        striped && styles.tableStriped,\n        noWrap && styles.tableNoWrap,\n        className,\n      ])}\n      {...rest}\n    >\n      {children}\n    </table>\n  ),\n);\n\nTable.displayName = 'Table';\n\n/* --- Footer --- */\n\ninterface FooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {\n  fixedColumnsStyle?: string;\n}\n\nexport const Footer = ({ fixedColumnsStyle, className, children, ...rest }: FooterProps) => {\n  const tableId = useContext(TableIdContext);\n  const shouldRenderStyle = fixedColumnsStyle && tableId;\n  return (\n    <tfoot className={buildClassnames([styles.footer, className])} {...rest}>\n      {shouldRenderStyle && <style>{`[data-legacy-table-id=\"${tableId}\"] .${styles.footer} tr { ${fixedColumnsStyle} }`}</style>}\n      {children}\n    </tfoot>\n  );\n};\n\n/* --- StickyHeaderWrapper --- */\n\nexport const StickyHeaderWrapper = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(\n  ({ className, children, ...rest }, ref) => (\n    <div ref={ref} className={buildClassnames([styles.stickyHeaderWrapper, className])} {...rest}>\n      {children}\n    </div>\n  ),\n);\n\nStickyHeaderWrapper.displayName = 'StickyHeaderWrapper';\n\n/* --- FakeHeaderTable (same as Table) --- */\n\nexport const FakeHeaderTable = Table;\n"],"names":["React"],"mappings":"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"}

package/dist/components/Search/Search.cjs

@@ -1,14 +1,15 @@
 'use strict';
 
 var React = require('react');
-var index = require('../../theme/index.cjs');
 var withLabels = require('../../hoc/withLabels/withLabels.cjs');
-var sizes = require('../../theme/modules/sizes.cjs');
+var buildClassnames = require('../../utils/buildClassnames.cjs');
+require('uid/secure');
 var Button = require('../Button/Button.cjs');
+var Loader = require('../Loader/Loader.cjs');
+var index = require('../TextField/index.cjs');
 var CrossIcon = require('../../icons/design-system/components/CrossIcon.cjs');
 var SearchIcon = require('../../icons/design-system/components/SearchIcon.cjs');
-var styled = require('./styled.cjs');
-var Loader = require('../Loader/Loader.cjs');
+var Search_module = require('./Search.module.scss.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -16,23 +17,28 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const Search = withLabels.withLabels(({ type = 'text', disabled = false, onClearClick, onChange, value = '', className = '', isLoading = false, fill, reversed = false, autoComplete = 'on', ...otherProps }) => {
     const shouldShowClear = value && value.length > 0;
+    const iconPosition = reversed ? 'left' : 'right';
     const onClickSearch = () => {
         onChange === null || onChange === void 0 ? void 0 : onChange(value);
     };
     const renderIcon = () => {
         if (isLoading) {
-            return React__default.default.createElement(Loader.Loader, { height: 24, color: fill || index.theme.colors.secondary.blue.base });
+            return React__default.default.createElement(Loader.Loader, { height: 24, color: fill || 'var(--colors-secondary-blue-base)' });
         }
         if (shouldShowClear && onClearClick) {
             return (React__default.default.createElement(Button.Button, { variant: "unstyled", onClick: onClearClick, style: { display: 'flex' }, "aria-label": "Clear text", type: "button" },
-                React__default.default.createElement(CrossIcon.ReactComponent, { color: fill || index.theme.colors.neutral.ink.dark })));
+                React__default.default.createElement(CrossIcon.ReactComponent, { color: fill || 'var(--colors-neutral-ink-dark)' })));
         }
         return (React__default.default.createElement(Button.Button, { variant: "unstyled", onClick: onClickSearch, style: { display: 'flex' }, "aria-label": "Search", disabled: disabled, type: "button" },
-            React__default.default.createElement(SearchIcon.ReactComponent, { color: fill || index.theme.colors.neutral.ink.dark, height: sizes.sizes.md, width: sizes.sizes.md })));
+            React__default.default.createElement(SearchIcon.ReactComponent, { color: fill || 'var(--colors-neutral-ink-dark)' })));
     };
-    return (React__default.default.createElement(styled.Container, { className: className, iconPosition: reversed ? 'left' : 'right' },
-        React__default.default.createElement(styled.Input, { type: type, value: value, onChange: onChange, disabled: disabled, autoComplete: autoComplete, ...otherProps }),
-        React__default.default.createElement(styled.IconContainer, null, renderIcon())));
+    return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames([
+            Search_module.searchContainer,
+            iconPosition === 'left' ? Search_module.iconLeft : Search_module.iconRight,
+            className,
+        ]) },
+        React__default.default.createElement(index.TextField, { className: Search_module.searchInput, type: type, value: value, onChange: onChange, disabled: disabled, autoComplete: autoComplete, ...otherProps }),
+        React__default.default.createElement("div", { className: Search_module.iconContainer }, renderIcon())));
 });
 
 exports.Search = Search;

package/dist/components/Search/Search.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Search.cjs","sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import React from 'react';\n\nimport { theme } from '../../theme';\nimport { withLabels } from '../../hoc';\nimport { SearchProps } from './types';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { Button } from '../Button';\nimport { CrossIcon, SearchIcon } from '../../icons';\n\nimport { Container, Input, IconContainer, Loader } from './styled';\n\nexport const Search = withLabels(\n  ({\n    type = 'text',\n    disabled = false,\n    onClearClick,\n    onChange,\n    value = '',\n    className = '',\n    isLoading = false,\n    fill,\n    reversed = false,\n    autoComplete = 'on',\n    ...otherProps\n  }: SearchProps) => {\n    const shouldShowClear = value && value.length > 0;\n\n    const onClickSearch = () => {\n      onChange?.(value);\n    };\n\n    const renderIcon = () => {\n      if (isLoading) {\n        return <Loader height={24} color={fill || theme.colors.secondary.blue.base} />;\n      }\n      if (shouldShowClear && onClearClick) {\n        return (\n          <Button\n            variant=\"unstyled\"\n            onClick={onClearClick}\n            style={{ display: 'flex' }}\n            aria-label=\"Clear text\"\n            type=\"button\"\n          >\n            <CrossIcon color={fill || theme.colors.neutral.ink.dark} />\n          </Button>\n        );\n      }\n      return (\n        <Button\n          variant=\"unstyled\"\n          onClick={onClickSearch}\n          style={{ display: 'flex' }}\n          aria-label=\"Search\"\n          disabled={disabled}\n          type=\"button\"\n        >\n          <SearchIcon\n            color={fill || theme.colors.neutral.ink.dark}\n            height={sizes.md}\n            width={sizes.md}\n          />\n        </Button>\n      );\n    };\n\n    return (\n      <Container className={className} iconPosition={reversed ? 'left' : 'right'}>\n        <Input\n          type={type}\n          value={value}\n          onChange={onChange}\n          disabled={disabled}\n          autoComplete={autoComplete}\n          {...otherProps}\n        />\n        <IconContainer>{renderIcon()}</IconContainer>\n      </Container>\n    );\n  },\n);\n"],"names":["withLabels","React","Loader","theme","Button","CrossIcon","SearchIcon","sizes","Container","Input","IconContainer"],"mappings":";;;;;;;;;;;;;;;;MAYa,MAAM,GAAGA,qBAAU,CAC9B,CAAC,EACC,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,QAAQ,EACR,KAAK,GAAG,EAAE,EACV,SAAS,GAAG,EAAE,EACd,SAAS,GAAG,KAAK,EACjB,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,YAAY,GAAG,IAAI,EACnB,GAAG,UAAU,EACD,KAAI;IAChB,MAAM,eAAe,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;IAEjD,MAAM,aAAa,GAAG,MAAK;AACzB,QAAA,QAAQ,aAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAG,KAAK,CAAC;AACnB,IAAA,CAAC;IAED,MAAM,UAAU,GAAG,MAAK;AACtB,QAAA,IAAI,SAAS,EAAE;YACb,OAAOC,sBAAA,CAAA,aAAA,CAACC,aAAM,EAAA,EAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,IAAIC,WAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAA,CAAI;AAC/E,QAAA;QACD,IAAI,eAAe,IAAI,YAAY,EAAE;YACnC,QACEF,sBAAA,CAAA,aAAA,CAACG,aAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,gBACf,YAAY,EACvB,IAAI,EAAC,QAAQ,EAAA;AAEb,gBAAAH,sBAAA,CAAA,aAAA,CAACI,wBAAS,EAAA,EAAC,KAAK,EAAE,IAAI,IAAIF,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAA,CAAI,CACpD;AAEZ,QAAA;AACD,QAAA,QACEF,sBAAA,CAAA,aAAA,CAACG,aAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,YAAA,EACf,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EAAA;AAEb,YAAAH,sBAAA,CAAA,aAAA,CAACK,yBAAU,EAAA,EACT,KAAK,EAAE,IAAI,IAAIH,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAC5C,MAAM,EAAEI,WAAK,CAAC,EAAE,EAChB,KAAK,EAAEA,WAAK,CAAC,EAAE,EAAA,CACf,CACK;AAEb,IAAA,CAAC;AAED,IAAA,QACEN,sBAAA,CAAA,aAAA,CAACO,gBAAS,IAAC,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAA;QACxEP,sBAAA,CAAA,aAAA,CAACQ,YAAK,IACJ,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAAA,GACtB,UAAU,EAAA,CACd;AACF,QAAAR,sBAAA,CAAA,aAAA,CAACS,oBAAa,EAAA,IAAA,EAAE,UAAU,EAAE,CAAiB,CACnC;AAEhB,CAAC;;;;"}
+{"version":3,"file":"Search.cjs","sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { buildClassnames } from '../../utils';\nimport { SearchProps } from './types';\n\nimport { Button } from '../Button';\nimport { Loader } from '../Loader';\nimport { TextField } from '../TextField';\nimport { CrossIcon, SearchIcon } from '../../icons';\n\nimport styles from './Search.module.scss';\n\nexport const Search = withLabels(\n  ({\n    type = 'text',\n    disabled = false,\n    onClearClick,\n    onChange,\n    value = '',\n    className = '',\n    isLoading = false,\n    fill,\n    reversed = false,\n    autoComplete = 'on',\n    ...otherProps\n  }: SearchProps) => {\n    const shouldShowClear = value && value.length > 0;\n    const iconPosition = reversed ? 'left' : 'right';\n\n    const onClickSearch = () => {\n      onChange?.(value);\n    };\n\n    const renderIcon = () => {\n      if (isLoading) {\n        return <Loader height={24} color={fill || 'var(--colors-secondary-blue-base)'} />;\n      }\n      if (shouldShowClear && onClearClick) {\n        return (\n          <Button\n            variant=\"unstyled\"\n            onClick={onClearClick}\n            style={{ display: 'flex' }}\n            aria-label=\"Clear text\"\n            type=\"button\"\n          >\n            <CrossIcon color={fill || 'var(--colors-neutral-ink-dark)'} />\n          </Button>\n        );\n      }\n      return (\n        <Button\n          variant=\"unstyled\"\n          onClick={onClickSearch}\n          style={{ display: 'flex' }}\n          aria-label=\"Search\"\n          disabled={disabled}\n          type=\"button\"\n        >\n          <SearchIcon color={fill || 'var(--colors-neutral-ink-dark)'} />\n        </Button>\n      );\n    };\n\n    return (\n      <div\n        className={buildClassnames([\n          styles.searchContainer,\n          iconPosition === 'left' ? styles.iconLeft : styles.iconRight,\n          className,\n        ])}\n      >\n        <TextField\n          className={styles.searchInput}\n          type={type}\n          value={value}\n          onChange={onChange}\n          disabled={disabled}\n          autoComplete={autoComplete}\n          {...otherProps}\n        />\n        <div className={styles.iconContainer}>{renderIcon()}</div>\n      </div>\n    );\n  },\n);\n"],"names":["withLabels","React","Loader","Button","CrossIcon","SearchIcon","buildClassnames","styles","TextField"],"mappings":";;;;;;;;;;;;;;;;;MAaa,MAAM,GAAGA,qBAAU,CAC9B,CAAC,EACC,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,QAAQ,EACR,KAAK,GAAG,EAAE,EACV,SAAS,GAAG,EAAE,EACd,SAAS,GAAG,KAAK,EACjB,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,YAAY,GAAG,IAAI,EACnB,GAAG,UAAU,EACD,KAAI;IAChB,MAAM,eAAe,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;IACjD,MAAM,YAAY,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO;IAEhD,MAAM,aAAa,GAAG,MAAK;AACzB,QAAA,QAAQ,aAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAG,KAAK,CAAC;AACnB,IAAA,CAAC;IAED,MAAM,UAAU,GAAG,MAAK;AACtB,QAAA,IAAI,SAAS,EAAE;AACb,YAAA,OAAOC,sBAAA,CAAA,aAAA,CAACC,aAAM,EAAA,EAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,IAAI,mCAAmC,GAAI;AAClF,QAAA;QACD,IAAI,eAAe,IAAI,YAAY,EAAE;YACnC,QACED,sBAAA,CAAA,aAAA,CAACE,aAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,gBACf,YAAY,EACvB,IAAI,EAAC,QAAQ,EAAA;gBAEbF,sBAAA,CAAA,aAAA,CAACG,wBAAS,EAAA,EAAC,KAAK,EAAE,IAAI,IAAI,gCAAgC,EAAA,CAAI,CACvD;AAEZ,QAAA;AACD,QAAA,QACEH,sBAAA,CAAA,aAAA,CAACE,aAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,YAAA,EACf,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EAAA;YAEbF,sBAAA,CAAA,aAAA,CAACI,yBAAU,EAAA,EAAC,KAAK,EAAE,IAAI,IAAI,gCAAgC,EAAA,CAAI,CACxD;AAEb,IAAA,CAAC;AAED,IAAA,QACEJ,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAEK,+BAAe,CAAC;AACzB,YAAAC,aAAM,CAAC,eAAe;AACtB,YAAA,YAAY,KAAK,MAAM,GAAGA,aAAM,CAAC,QAAQ,GAAGA,aAAM,CAAC,SAAS;YAC5D,SAAS;SACV,CAAC,EAAA;AAEF,QAAAN,sBAAA,CAAA,aAAA,CAACO,eAAS,EAAA,EACR,SAAS,EAAED,aAAM,CAAC,WAAW,EAC7B,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAAA,GACtB,UAAU,EAAA,CACd;QACFN,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEM,aAAM,CAAC,aAAa,EAAA,EAAG,UAAU,EAAE,CAAO,CACtD;AAEV,CAAC;;;;"}

package/dist/components/Search/Search.d.ts

@@ -293,7 +293,7 @@ export declare const Search: React.ForwardRefExoticComponent<{
     wrap?: string | undefined;
 } & {
     value?: string | undefined;
-    type?: import("..").TextFieldType | undefined;
+    type?: import("../TextField").TextFieldType | undefined;
     onChange?: ((value: string) => void) | undefined;
     hasError?: boolean | undefined;
     disabledMessage?: React.ReactNode;

package/dist/components/Search/Search.js

@@ -1,32 +1,38 @@
 import React__default from 'react';
-import { theme } from '../../theme/index.js';
 import { withLabels } from '../../hoc/withLabels/withLabels.js';
-import { sizes } from '../../theme/modules/sizes.js';
+import { buildClassnames } from '../../utils/buildClassnames.js';
+import 'uid/secure';
 import { Button } from '../Button/Button.js';
+import { Loader } from '../Loader/Loader.js';
+import { TextField } from '../TextField/index.js';
 import { ReactComponent as CrossIcon } from '../../icons/design-system/components/CrossIcon.js';
 import { ReactComponent as SearchIcon } from '../../icons/design-system/components/SearchIcon.js';
-import { Container, Input, IconContainer } from './styled.js';
-import { Loader } from '../Loader/Loader.js';
+import styles from './Search.module.scss.js';
 
 const Search = withLabels(({ type = 'text', disabled = false, onClearClick, onChange, value = '', className = '', isLoading = false, fill, reversed = false, autoComplete = 'on', ...otherProps }) => {
     const shouldShowClear = value && value.length > 0;
+    const iconPosition = reversed ? 'left' : 'right';
     const onClickSearch = () => {
         onChange === null || onChange === void 0 ? void 0 : onChange(value);
     };
     const renderIcon = () => {
         if (isLoading) {
-            return React__default.createElement(Loader, { height: 24, color: fill || theme.colors.secondary.blue.base });
+            return React__default.createElement(Loader, { height: 24, color: fill || 'var(--colors-secondary-blue-base)' });
         }
         if (shouldShowClear && onClearClick) {
             return (React__default.createElement(Button, { variant: "unstyled", onClick: onClearClick, style: { display: 'flex' }, "aria-label": "Clear text", type: "button" },
-                React__default.createElement(CrossIcon, { color: fill || theme.colors.neutral.ink.dark })));
+                React__default.createElement(CrossIcon, { color: fill || 'var(--colors-neutral-ink-dark)' })));
         }
         return (React__default.createElement(Button, { variant: "unstyled", onClick: onClickSearch, style: { display: 'flex' }, "aria-label": "Search", disabled: disabled, type: "button" },
-            React__default.createElement(SearchIcon, { color: fill || theme.colors.neutral.ink.dark, height: sizes.md, width: sizes.md })));
+            React__default.createElement(SearchIcon, { color: fill || 'var(--colors-neutral-ink-dark)' })));
     };
-    return (React__default.createElement(Container, { className: className, iconPosition: reversed ? 'left' : 'right' },
-        React__default.createElement(Input, { type: type, value: value, onChange: onChange, disabled: disabled, autoComplete: autoComplete, ...otherProps }),
-        React__default.createElement(IconContainer, null, renderIcon())));
+    return (React__default.createElement("div", { className: buildClassnames([
+            styles.searchContainer,
+            iconPosition === 'left' ? styles.iconLeft : styles.iconRight,
+            className,
+        ]) },
+        React__default.createElement(TextField, { className: styles.searchInput, type: type, value: value, onChange: onChange, disabled: disabled, autoComplete: autoComplete, ...otherProps }),
+        React__default.createElement("div", { className: styles.iconContainer }, renderIcon())));
 });
 
 export { Search };

package/dist/components/Search/Search.js.map

@@ -1 +1 @@
-{"version":3,"file":"Search.js","sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import React from 'react';\n\nimport { theme } from '../../theme';\nimport { withLabels } from '../../hoc';\nimport { SearchProps } from './types';\nimport { sizes } from '../../theme/modules/sizes';\n\nimport { Button } from '../Button';\nimport { CrossIcon, SearchIcon } from '../../icons';\n\nimport { Container, Input, IconContainer, Loader } from './styled';\n\nexport const Search = withLabels(\n  ({\n    type = 'text',\n    disabled = false,\n    onClearClick,\n    onChange,\n    value = '',\n    className = '',\n    isLoading = false,\n    fill,\n    reversed = false,\n    autoComplete = 'on',\n    ...otherProps\n  }: SearchProps) => {\n    const shouldShowClear = value && value.length > 0;\n\n    const onClickSearch = () => {\n      onChange?.(value);\n    };\n\n    const renderIcon = () => {\n      if (isLoading) {\n        return <Loader height={24} color={fill || theme.colors.secondary.blue.base} />;\n      }\n      if (shouldShowClear && onClearClick) {\n        return (\n          <Button\n            variant=\"unstyled\"\n            onClick={onClearClick}\n            style={{ display: 'flex' }}\n            aria-label=\"Clear text\"\n            type=\"button\"\n          >\n            <CrossIcon color={fill || theme.colors.neutral.ink.dark} />\n          </Button>\n        );\n      }\n      return (\n        <Button\n          variant=\"unstyled\"\n          onClick={onClickSearch}\n          style={{ display: 'flex' }}\n          aria-label=\"Search\"\n          disabled={disabled}\n          type=\"button\"\n        >\n          <SearchIcon\n            color={fill || theme.colors.neutral.ink.dark}\n            height={sizes.md}\n            width={sizes.md}\n          />\n        </Button>\n      );\n    };\n\n    return (\n      <Container className={className} iconPosition={reversed ? 'left' : 'right'}>\n        <Input\n          type={type}\n          value={value}\n          onChange={onChange}\n          disabled={disabled}\n          autoComplete={autoComplete}\n          {...otherProps}\n        />\n        <IconContainer>{renderIcon()}</IconContainer>\n      </Container>\n    );\n  },\n);\n"],"names":["React"],"mappings":";;;;;;;;;;MAYa,MAAM,GAAG,UAAU,CAC9B,CAAC,EACC,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,QAAQ,EACR,KAAK,GAAG,EAAE,EACV,SAAS,GAAG,EAAE,EACd,SAAS,GAAG,KAAK,EACjB,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,YAAY,GAAG,IAAI,EACnB,GAAG,UAAU,EACD,KAAI;IAChB,MAAM,eAAe,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;IAEjD,MAAM,aAAa,GAAG,MAAK;AACzB,QAAA,QAAQ,aAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAG,KAAK,CAAC;AACnB,IAAA,CAAC;IAED,MAAM,UAAU,GAAG,MAAK;AACtB,QAAA,IAAI,SAAS,EAAE;YACb,OAAOA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,IAAI,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,EAAA,CAAI;AAC/E,QAAA;QACD,IAAI,eAAe,IAAI,YAAY,EAAE;YACnC,QACEA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,gBACf,YAAY,EACvB,IAAI,EAAC,QAAQ,EAAA;AAEb,gBAAAA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,KAAK,EAAE,IAAI,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAA,CAAI,CACpD;AAEZ,QAAA;AACD,QAAA,QACEA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,YAAA,EACf,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EAAA;AAEb,YAAAA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EACT,KAAK,EAAE,IAAI,IAAI,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAC5C,MAAM,EAAE,KAAK,CAAC,EAAE,EAChB,KAAK,EAAE,KAAK,CAAC,EAAE,EAAA,CACf,CACK;AAEb,IAAA,CAAC;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAC,SAAS,IAAC,SAAS,EAAE,SAAS,EAAE,YAAY,EAAE,QAAQ,GAAG,MAAM,GAAG,OAAO,EAAA;QACxEA,cAAA,CAAA,aAAA,CAAC,KAAK,IACJ,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAAA,GACtB,UAAU,EAAA,CACd;AACF,QAAAA,cAAA,CAAA,aAAA,CAAC,aAAa,EAAA,IAAA,EAAE,UAAU,EAAE,CAAiB,CACnC;AAEhB,CAAC;;;;"}
+{"version":3,"file":"Search.js","sources":["../../../src/components/Search/Search.tsx"],"sourcesContent":["import React from 'react';\n\nimport { withLabels } from '../../hoc';\nimport { buildClassnames } from '../../utils';\nimport { SearchProps } from './types';\n\nimport { Button } from '../Button';\nimport { Loader } from '../Loader';\nimport { TextField } from '../TextField';\nimport { CrossIcon, SearchIcon } from '../../icons';\n\nimport styles from './Search.module.scss';\n\nexport const Search = withLabels(\n  ({\n    type = 'text',\n    disabled = false,\n    onClearClick,\n    onChange,\n    value = '',\n    className = '',\n    isLoading = false,\n    fill,\n    reversed = false,\n    autoComplete = 'on',\n    ...otherProps\n  }: SearchProps) => {\n    const shouldShowClear = value && value.length > 0;\n    const iconPosition = reversed ? 'left' : 'right';\n\n    const onClickSearch = () => {\n      onChange?.(value);\n    };\n\n    const renderIcon = () => {\n      if (isLoading) {\n        return <Loader height={24} color={fill || 'var(--colors-secondary-blue-base)'} />;\n      }\n      if (shouldShowClear && onClearClick) {\n        return (\n          <Button\n            variant=\"unstyled\"\n            onClick={onClearClick}\n            style={{ display: 'flex' }}\n            aria-label=\"Clear text\"\n            type=\"button\"\n          >\n            <CrossIcon color={fill || 'var(--colors-neutral-ink-dark)'} />\n          </Button>\n        );\n      }\n      return (\n        <Button\n          variant=\"unstyled\"\n          onClick={onClickSearch}\n          style={{ display: 'flex' }}\n          aria-label=\"Search\"\n          disabled={disabled}\n          type=\"button\"\n        >\n          <SearchIcon color={fill || 'var(--colors-neutral-ink-dark)'} />\n        </Button>\n      );\n    };\n\n    return (\n      <div\n        className={buildClassnames([\n          styles.searchContainer,\n          iconPosition === 'left' ? styles.iconLeft : styles.iconRight,\n          className,\n        ])}\n      >\n        <TextField\n          className={styles.searchInput}\n          type={type}\n          value={value}\n          onChange={onChange}\n          disabled={disabled}\n          autoComplete={autoComplete}\n          {...otherProps}\n        />\n        <div className={styles.iconContainer}>{renderIcon()}</div>\n      </div>\n    );\n  },\n);\n"],"names":["React"],"mappings":";;;;;;;;;;;MAaa,MAAM,GAAG,UAAU,CAC9B,CAAC,EACC,IAAI,GAAG,MAAM,EACb,QAAQ,GAAG,KAAK,EAChB,YAAY,EACZ,QAAQ,EACR,KAAK,GAAG,EAAE,EACV,SAAS,GAAG,EAAE,EACd,SAAS,GAAG,KAAK,EACjB,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,YAAY,GAAG,IAAI,EACnB,GAAG,UAAU,EACD,KAAI;IAChB,MAAM,eAAe,GAAG,KAAK,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;IACjD,MAAM,YAAY,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO;IAEhD,MAAM,aAAa,GAAG,MAAK;AACzB,QAAA,QAAQ,aAAR,QAAQ,KAAA,MAAA,GAAA,MAAA,GAAR,QAAQ,CAAG,KAAK,CAAC;AACnB,IAAA,CAAC;IAED,MAAM,UAAU,GAAG,MAAK;AACtB,QAAA,IAAI,SAAS,EAAE;AACb,YAAA,OAAOA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,IAAI,mCAAmC,GAAI;AAClF,QAAA;QACD,IAAI,eAAe,IAAI,YAAY,EAAE;YACnC,QACEA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,YAAY,EACrB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,gBACf,YAAY,EACvB,IAAI,EAAC,QAAQ,EAAA;gBAEbA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EAAC,KAAK,EAAE,IAAI,IAAI,gCAAgC,EAAA,CAAI,CACvD;AAEZ,QAAA;AACD,QAAA,QACEA,cAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAA,YAAA,EACf,QAAQ,EACnB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EAAA;YAEbA,cAAA,CAAA,aAAA,CAAC,UAAU,EAAA,EAAC,KAAK,EAAE,IAAI,IAAI,gCAAgC,EAAA,CAAI,CACxD;AAEb,IAAA,CAAC;AAED,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAE,eAAe,CAAC;AACzB,YAAA,MAAM,CAAC,eAAe;AACtB,YAAA,YAAY,KAAK,MAAM,GAAG,MAAM,CAAC,QAAQ,GAAG,MAAM,CAAC,SAAS;YAC5D,SAAS;SACV,CAAC,EAAA;AAEF,QAAAA,cAAA,CAAA,aAAA,CAAC,SAAS,EAAA,EACR,SAAS,EAAE,MAAM,CAAC,WAAW,EAC7B,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAAA,GACtB,UAAU,EAAA,CACd;QACFA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,MAAM,CAAC,aAAa,EAAA,EAAG,UAAU,EAAE,CAAO,CACtD;AAEV,CAAC;;;;"}

package/dist/components/Search/Search.module.scss.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
+
+___$insertStyle("._searchContainer_12ul5_1 {\n  position: relative;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: var(--radius-base);\n}\n\n._searchInput_12ul5_9 {\n  flex-grow: 2;\n  margin-top: 0;\n  margin-bottom: 0;\n}\n\n._iconContainer_12ul5_15 {\n  position: absolute;\n}\n\n._iconLeft_12ul5_19 ._searchInput_12ul5_9 {\n  padding-left: var(--sizes-10);\n}\n._iconLeft_12ul5_19 ._iconContainer_12ul5_15 {\n  left: var(--sizes-sm);\n}\n\n._iconRight_12ul5_26 ._searchInput_12ul5_9 {\n  padding-right: var(--sizes-10);\n}\n._iconRight_12ul5_26 ._iconContainer_12ul5_15 {\n  right: var(--sizes-sm);\n}");
+var styles = {"searchContainer":"_searchContainer_12ul5_1","searchInput":"_searchInput_12ul5_9","iconContainer":"_iconContainer_12ul5_15","iconLeft":"_iconLeft_12ul5_19","iconRight":"_iconRight_12ul5_26"};
+
+module.exports = styles;
+//# sourceMappingURL=Search.module.scss.cjs.map

package/dist/components/Search/Search.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Search.module.scss.cjs","sources":["../../../src/components/Search/Search.module.scss"],"sourcesContent":[".searchContainer {\n  position: relative;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: var(--radius-base);\n}\n\n.searchInput {\n  flex-grow: 2;\n  margin-top: 0;\n  margin-bottom: 0;\n}\n\n.iconContainer {\n  position: absolute;\n}\n\n.iconLeft {\n  .searchInput {\n    padding-left: var(--sizes-10);\n  }\n\n  .iconContainer {\n    left: var(--sizes-sm);\n  }\n}\n\n.iconRight {\n  .searchInput {\n    padding-right: var(--sizes-10);\n  }\n\n  .iconContainer {\n    right: var(--sizes-sm);\n  }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,2nBAAA;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,aAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,WAAA,CAAA,qBAAA;;;;"}

package/dist/components/Search/Search.module.scss.js

@@ -0,0 +1,7 @@
+import insertStyle from '../../_virtual/____insertStyle.js';
+
+insertStyle("._searchContainer_12ul5_1 {\n  position: relative;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: var(--radius-base);\n}\n\n._searchInput_12ul5_9 {\n  flex-grow: 2;\n  margin-top: 0;\n  margin-bottom: 0;\n}\n\n._iconContainer_12ul5_15 {\n  position: absolute;\n}\n\n._iconLeft_12ul5_19 ._searchInput_12ul5_9 {\n  padding-left: var(--sizes-10);\n}\n._iconLeft_12ul5_19 ._iconContainer_12ul5_15 {\n  left: var(--sizes-sm);\n}\n\n._iconRight_12ul5_26 ._searchInput_12ul5_9 {\n  padding-right: var(--sizes-10);\n}\n._iconRight_12ul5_26 ._iconContainer_12ul5_15 {\n  right: var(--sizes-sm);\n}");
+var styles = {"searchContainer":"_searchContainer_12ul5_1","searchInput":"_searchInput_12ul5_9","iconContainer":"_iconContainer_12ul5_15","iconLeft":"_iconLeft_12ul5_19","iconRight":"_iconRight_12ul5_26"};
+
+export { styles as default };
+//# sourceMappingURL=Search.module.scss.js.map

package/dist/components/Search/Search.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Search.module.scss.js","sources":["../../../src/components/Search/Search.module.scss"],"sourcesContent":[".searchContainer {\n  position: relative;\n  display: flex;\n  justify-content: flex-start;\n  align-items: center;\n  border-radius: var(--radius-base);\n}\n\n.searchInput {\n  flex-grow: 2;\n  margin-top: 0;\n  margin-bottom: 0;\n}\n\n.iconContainer {\n  position: absolute;\n}\n\n.iconLeft {\n  .searchInput {\n    padding-left: var(--sizes-10);\n  }\n\n  .iconContainer {\n    left: var(--sizes-sm);\n  }\n}\n\n.iconRight {\n  .searchInput {\n    padding-right: var(--sizes-10);\n  }\n\n  .iconContainer {\n    right: var(--sizes-sm);\n  }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,2nBAAA;AACA,aAAA,CAAA,iBAAA,CAAA,0BAAA,CAAA,aAAA,CAAA,sBAAA,CAAA,eAAA,CAAA,yBAAA,CAAA,UAAA,CAAA,oBAAA,CAAA,WAAA,CAAA,qBAAA;;;;"}

package/dist/components/Stepper/Stepper.cjs

@@ -1,10 +1,12 @@
 'use strict';
 
 var React = require('react');
-var index = require('../../theme/index.cjs');
-var styled = require('./styled.cjs');
+var buildClassnames = require('../../utils/buildClassnames.cjs');
+require('uid/secure');
 var MinusIcon = require('../../icons/design-system/components/MinusIcon.cjs');
 var PlusIcon = require('../../icons/custom/components/PlusIcon.cjs');
+var Stepper_module = require('./Stepper.module.scss.cjs');
+var index = require('../../theme/index.cjs');
 
 function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
 
@@ -12,12 +14,17 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
 
 const Stepper = ({ onIncrement, onDecrement, disabled, hasError, size }) => {
     const compact = size === 'sm';
-    return (React__default.default.createElement(styled.ContainerStack, { hasError: hasError, disabled: disabled, direction: "horizontal", alignY: "center", spacing: "none" },
-        React__default.default.createElement(styled.StepButton, { type: "button", "aria-label": "Decrement", onClick: onDecrement, disabled: disabled, compact: compact },
-            React__default.default.createElement(MinusIcon.ReactComponent, { height: index.theme.sizes.base, width: index.theme.sizes.base, color: index.theme.colors.neutral.ink.base })),
-        React__default.default.createElement(styled.StepperDivider, { compact: compact }),
-        React__default.default.createElement(styled.StepButton, { type: "button", "aria-label": "Increment", onClick: onIncrement, disabled: disabled, compact: compact },
-            React__default.default.createElement(PlusIcon.PlusIcon, { height: index.theme.sizes.base, width: index.theme.sizes.base, color: index.theme.colors.neutral.ink.base }))));
+    return (React__default.default.createElement("div", { className: buildClassnames.buildClassnames([
+            Stepper_module.container,
+            compact ? Stepper_module.compact : undefined,
+            hasError ? Stepper_module.error : undefined,
+            disabled ? Stepper_module.disabled : undefined,
+        ]) },
+        React__default.default.createElement("button", { type: "button", "aria-label": "Decrement", onClick: onDecrement, disabled: disabled, className: Stepper_module.stepperButton },
+            React__default.default.createElement(MinusIcon.ReactComponent, { height: index.theme.sizes.base, width: index.theme.sizes.base })),
+        React__default.default.createElement("div", { className: Stepper_module.divider }),
+        React__default.default.createElement("button", { type: "button", "aria-label": "Increment", onClick: onIncrement, disabled: disabled, className: Stepper_module.stepperButton },
+            React__default.default.createElement(PlusIcon.PlusIcon, { height: index.theme.sizes.base, width: index.theme.sizes.base }))));
 };
 
 exports.Stepper = Stepper;

package/dist/components/Stepper/Stepper.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stepper.cjs","sources":["../../../src/components/Stepper/Stepper.tsx"],"sourcesContent":["import React from 'react';\nimport { theme } from '../../theme';\nimport { ComponentSizeType } from '../types';\n\nimport { ContainerStack, StepButton, StepperDivider } from './styled';\nimport { MinusIcon, PlusIcon } from '../../icons';\n\nexport interface StepperProps {\n  onIncrement: () => void;\n  onDecrement: () => void;\n  disabled?: boolean;\n  hasError?: boolean;\n  size?: ComponentSizeType;\n}\n\nexport const Stepper = ({ onIncrement, onDecrement, disabled, hasError, size }: StepperProps) => {\n  const compact = size === 'sm';\n\n  return (\n    <ContainerStack\n      hasError={hasError}\n      disabled={disabled}\n      direction=\"horizontal\"\n      alignY=\"center\"\n      spacing=\"none\"\n    >\n      <StepButton\n        type=\"button\"\n        aria-label=\"Decrement\"\n        onClick={onDecrement}\n        disabled={disabled}\n        compact={compact}\n      >\n        <MinusIcon\n          height={theme.sizes.base}\n          width={theme.sizes.base}\n          color={theme.colors.neutral.ink.base}\n        />\n      </StepButton>\n      <StepperDivider compact={compact} />\n      <StepButton\n        type=\"button\"\n        aria-label=\"Increment\"\n        onClick={onIncrement}\n        disabled={disabled}\n        compact={compact}\n      >\n        <PlusIcon\n          height={theme.sizes.base}\n          width={theme.sizes.base}\n          color={theme.colors.neutral.ink.base}\n        />\n      </StepButton>\n    </ContainerStack>\n  );\n};\n"],"names":["React","ContainerStack","StepButton","MinusIcon","theme","StepperDivider","PlusIcon"],"mappings":";;;;;;;;;;;;AAeO,MAAM,OAAO,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAgB,KAAI;AAC9F,IAAA,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI;IAE7B,QACEA,qCAACC,qBAAc,EAAA,EACb,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAC,YAAY,EACtB,MAAM,EAAC,QAAQ,EACf,OAAO,EAAC,MAAM,EAAA;AAEd,QAAAD,sBAAA,CAAA,aAAA,CAACE,iBAAU,EAAA,EACT,IAAI,EAAC,QAAQ,EAAA,YAAA,EACF,WAAW,EACtB,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAAA;AAEhB,YAAAF,sBAAA,CAAA,aAAA,CAACG,wBAAS,EAAA,EACR,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EACvB,KAAK,EAAEA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,GACpC,CACS;AACb,QAAAJ,sBAAA,CAAA,aAAA,CAACK,qBAAc,EAAA,EAAC,OAAO,EAAE,OAAO,EAAA,CAAI;AACpC,QAAAL,sBAAA,CAAA,aAAA,CAACE,iBAAU,EAAA,EACT,IAAI,EAAC,QAAQ,EAAA,YAAA,EACF,WAAW,EACtB,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,OAAO,EAAA;AAEhB,YAAAF,sBAAA,CAAA,aAAA,CAACM,iBAAQ,EAAA,EACP,MAAM,EAAEF,WAAK,CAAC,KAAK,CAAC,IAAI,EACxB,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EACvB,KAAK,EAAEA,WAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,EAAA,CACpC,CACS,CACE;AAErB;;;;"}
+{"version":3,"file":"Stepper.cjs","sources":["../../../src/components/Stepper/Stepper.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../utils';\nimport { MinusIcon, PlusIcon } from '../../icons';\nimport styles from './Stepper.module.scss';\nimport { StepperProps } from './types';\n\nimport { theme } from '../../theme';\n\nexport const Stepper = ({ onIncrement, onDecrement, disabled, hasError, size }: StepperProps) => {\n  const compact = size === 'sm';\n\n  return (\n    <div\n      className={buildClassnames([\n        styles.container,\n        compact ? styles.compact : undefined,\n        hasError ? styles.error : undefined,\n        disabled ? styles.disabled : undefined,\n      ])}\n    >\n      <button\n        type=\"button\"\n        aria-label=\"Decrement\"\n        onClick={onDecrement}\n        disabled={disabled}\n        className={styles.stepperButton}\n      >\n        <MinusIcon height={theme.sizes.base} width={theme.sizes.base} />\n      </button>\n      <div className={styles.divider} />\n      <button\n        type=\"button\"\n        aria-label=\"Increment\"\n        onClick={onIncrement}\n        disabled={disabled}\n        className={styles.stepperButton}\n      >\n        <PlusIcon height={theme.sizes.base} width={theme.sizes.base} />\n      </button>\n    </div>\n  );\n};\n"],"names":["React","buildClassnames","styles","MinusIcon","theme","PlusIcon"],"mappings":";;;;;;;;;;;;;;AAQO,MAAM,OAAO,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAgB,KAAI;AAC9F,IAAA,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI;AAE7B,IAAA,QACEA,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAEC,+BAAe,CAAC;AACzB,YAAAC,cAAM,CAAC,SAAS;YAChB,OAAO,GAAGA,cAAM,CAAC,OAAO,GAAG,SAAS;YACpC,QAAQ,GAAGA,cAAM,CAAC,KAAK,GAAG,SAAS;YACnC,QAAQ,GAAGA,cAAM,CAAC,QAAQ,GAAG,SAAS;SACvC,CAAC,EAAA;AAEF,QAAAF,sBAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,gBACF,WAAW,EACtB,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAEE,cAAM,CAAC,aAAa,EAAA;AAE/B,YAAAF,sBAAA,CAAA,aAAA,CAACG,wBAAS,EAAA,EAAC,MAAM,EAAEC,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,GAAI,CACzD;AACT,QAAAJ,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEE,cAAM,CAAC,OAAO,EAAA,CAAI;AAClC,QAAAF,sBAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EACE,IAAI,EAAC,QAAQ,gBACF,WAAW,EACtB,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAEE,cAAM,CAAC,aAAa,EAAA;YAE/BF,sBAAA,CAAA,aAAA,CAACK,iBAAQ,IAAC,MAAM,EAAED,WAAK,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,EAAEA,WAAK,CAAC,KAAK,CAAC,IAAI,EAAA,CAAI,CACxD,CACL;AAEV;;;;"}

package/dist/components/Stepper/Stepper.d.ts

@@ -1,10 +1,3 @@
 import React from 'react';
-import { ComponentSizeType } from '../types';
-export interface StepperProps {
-    onIncrement: () => void;
-    onDecrement: () => void;
-    disabled?: boolean;
-    hasError?: boolean;
-    size?: ComponentSizeType;
-}
+import { StepperProps } from './types';
 export declare const Stepper: ({ onIncrement, onDecrement, disabled, hasError, size }: StepperProps) => React.JSX.Element;