@lumx/react 3.20.1-alpha.32 → 3.20.1-alpha.33

package/_internal/packages/lumx-react/src/components/table/Table-ad4f6991.js

@@ -0,0 +1,57 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { jsx } from 'react/jsx-runtime';
+import { Theme } from '@lumx/core/js/constants';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'Table';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {};
+
+/**
+ * Table component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const Table = forwardRef((props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    children,
+    className,
+    hasBefore,
+    hasDividers,
+    theme = defaultTheme,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx("table", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      hasBefore,
+      hasDividers,
+      theme
+    })),
+    children: children
+  });
+});
+Table.displayName = COMPONENT_NAME;
+Table.className = CLASSNAME;
+Table.defaultProps = DEFAULT_PROPS;
+
+export { Table };
+//# sourceMappingURL=Table-ad4f6991.js.map

package/_internal/packages/lumx-react/src/components/table/Table-ad4f6991.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table-ad4f6991.js","sources":["../../../../../../../src/components/table/Table.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { Theme } from '@lumx/react';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableProps extends GenericProps, HasTheme {\n    /** Whether the table has checkbox or thumbnail on first cell or not. */\n    hasBefore?: boolean;\n    /** Whether the table has dividers or not. */\n    hasDividers?: boolean;\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Table';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableProps> = {};\n\n/**\n * Table component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Table = forwardRef<TableProps, HTMLTableElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const { children, className, hasBefore, hasDividers, theme = defaultTheme, ...forwardedProps } = props;\n\n    return (\n        <table\n            ref={ref}\n            {...forwardedProps}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, hasBefore, hasDividers, theme }))}\n        >\n            {children}\n        </table>\n    );\n});\nTable.displayName = COMPONENT_NAME;\nTable.className = CLASSNAME;\nTable.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","Table","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","children","className","hasBefore","hasDividers","theme","forwardedProps","_jsx","classNames","handleBasicClasses","prefix","displayName","defaultProps"],"mappings":";;;;;;;AAoBA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,OAAO,CAAA;;AAE9B;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,CAAC,CAAA;;AAElD;AACA;AACA;AACA,MAAMG,aAAkC,GAAG,EAAE,CAAA;;AAE7C;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,KAAK,GAAGC,UAAU,CAA+B,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC1E,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAEC,SAAS;IAAEC,WAAW;AAAEC,IAAAA,KAAK,GAAGR,YAAY;IAAE,GAAGS,cAAAA;AAAe,GAAC,GAAGX,KAAK,CAAA;AAEtG,EAAA,oBACIY,GAAA,CAAA,OAAA,EAAA;AACIX,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GACLU,cAAc;AAClBJ,IAAAA,SAAS,EAAEM,UAAU,CAACN,SAAS,EAAEO,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEpB,SAAS;MAAEa,SAAS;MAAEC,WAAW;AAAEC,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAE;AAAAJ,IAAAA,QAAA,EAE1GA,QAAAA;AAAQ,GACN,CAAC,CAAA;AAEhB,CAAC,EAAC;AACFR,KAAK,CAACkB,WAAW,GAAGtB,cAAc,CAAA;AAClCI,KAAK,CAACS,SAAS,GAAGZ,SAAS,CAAA;AAC3BG,KAAK,CAACmB,YAAY,GAAGpB,aAAa;;;;"}

package/_internal/packages/lumx-react/src/components/table/TableBody-c6d71a78.js

@@ -0,0 +1,40 @@
+import classNames from 'classnames';
+import { getRootClassName } from '@lumx/core/js/utils/className';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'TableBody';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME, true);
+
+/**
+ * TableBody component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const TableBody = forwardRef((props, ref) => {
+  const {
+    children,
+    className,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx("tbody", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, CLASSNAME),
+    children: children
+  });
+});
+TableBody.displayName = COMPONENT_NAME;
+TableBody.className = CLASSNAME;
+
+export { TableBody };
+//# sourceMappingURL=TableBody-c6d71a78.js.map

package/_internal/packages/lumx-react/src/components/table/TableBody-c6d71a78.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableBody-c6d71a78.js","sources":["../../../../../../../src/components/table/TableBody.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableBodyProps extends GenericProps {\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableBody';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * TableBody component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const TableBody = forwardRef<TableBodyProps, HTMLTableSectionElement>((props, ref) => {\n    const { children, className, ...forwardedProps } = props;\n\n    return (\n        <tbody ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>\n            {children}\n        </tbody>\n    );\n});\nTableBody.displayName = COMPONENT_NAME;\nTableBody.className = CLASSNAME;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","TableBody","forwardRef","props","ref","children","className","forwardedProps","_jsx","classNames","displayName"],"mappings":";;;;;AAcA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,WAAW,CAAA;;AAElC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,EAAE,IAAI,CAAC,CAAA;;AAExD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMG,SAAS,GAAGC,UAAU,CAA0C,CAACC,KAAK,EAAEC,GAAG,KAAK;EACzF,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGJ,KAAK,CAAA;AAExD,EAAA,oBACIK,GAAA,CAAA,OAAA,EAAA;AAAOJ,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GAAKG,cAAc;AAAED,IAAAA,SAAS,EAAEG,UAAU,CAACH,SAAS,EAAEP,SAAS,CAAE;AAAAM,IAAAA,QAAA,EAC5EA,QAAAA;AAAQ,GACN,CAAC,CAAA;AAEhB,CAAC,EAAC;AACFJ,SAAS,CAACS,WAAW,GAAGZ,cAAc,CAAA;AACtCG,SAAS,CAACK,SAAS,GAAGP,SAAS;;;;"}

package/_internal/packages/lumx-react/src/components/table/TableCell-8b038969.js

@@ -0,0 +1,121 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { mdiArrowUp } from '../../../../lumx-icons/dist/esm/arrow-up-78a9c3cd.js';
+import { mdiArrowDown } from '../../../../lumx-icons/dist/esm/arrow-down-a32628a1.js';
+import { Icon } from '../icon/Icon-21a83e8c.js';
+import { Size } from '@lumx/core/js/constants';
+
+const ThOrder = {
+  asc: 'asc',
+  desc: 'desc'
+};
+/**
+ * Table cell variants.
+ */
+const TableCellVariant = {
+  body: 'body',
+  head: 'head'
+};
+
+/**
+ * Defines the props of the component.
+ */
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'TableCell';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME, true);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {
+  variant: TableCellVariant.body
+};
+
+/**
+ * TableCell component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const TableCell = forwardRef((props, ref) => {
+  const {
+    children,
+    className,
+    icon,
+    isSortable,
+    onHeaderClick,
+    sortOrder,
+    variant = DEFAULT_PROPS.variant,
+    ...forwardedProps
+  } = props;
+
+  // Use button if clickable
+  const Wrapper = onHeaderClick ? 'button' : 'div';
+  const wrapperProps = Wrapper === 'button' ? {
+    type: 'button',
+    onClick: onHeaderClick
+  } : undefined;
+
+  // ARIA sort
+  let ariaSort;
+  if (isSortable) {
+    ariaSort = 'none';
+    if (sortOrder === ThOrder.asc) ariaSort = 'ascending';
+    if (sortOrder === ThOrder.desc) ariaSort = 'descending';
+  }
+  return /*#__PURE__*/jsxs(Fragment, {
+    children: [variant === TableCellVariant.head && /*#__PURE__*/jsx("th", {
+      ref: ref,
+      ...forwardedProps,
+      className: classNames(handleBasicClasses({
+        prefix: CLASSNAME,
+        isSortable,
+        isSorted: isSortable && !!sortOrder
+      }), className, `${CLASSNAME}--head`),
+      "aria-sort": ariaSort,
+      children: /*#__PURE__*/jsxs(Wrapper, {
+        className: `${CLASSNAME}-wrapper`,
+        ...wrapperProps,
+        children: [icon && !isSortable && /*#__PURE__*/jsx(Icon, {
+          className: `${CLASSNAME}-icon`,
+          icon: icon,
+          size: Size.xxs
+        }), isSortable && sortOrder === ThOrder.asc && /*#__PURE__*/jsx(Icon, {
+          className: `${CLASSNAME}-icon`,
+          icon: mdiArrowUp,
+          size: Size.xxs
+        }), isSortable && sortOrder === ThOrder.desc && /*#__PURE__*/jsx(Icon, {
+          className: `${CLASSNAME}-icon`,
+          icon: mdiArrowDown,
+          size: Size.xxs
+        }), /*#__PURE__*/jsx("div", {
+          className: `${CLASSNAME}-content`,
+          children: children
+        })]
+      })
+    }), variant === TableCellVariant.body && /*#__PURE__*/jsx("td", {
+      ...forwardedProps,
+      className: classNames(className, CLASSNAME, `${CLASSNAME}--body`),
+      children: /*#__PURE__*/jsx("div", {
+        className: `${CLASSNAME}-content`,
+        children: children
+      })
+    })]
+  });
+});
+TableCell.displayName = COMPONENT_NAME;
+TableCell.className = CLASSNAME;
+TableCell.defaultProps = DEFAULT_PROPS;
+
+export { TableCell, TableCellVariant, ThOrder };
+//# sourceMappingURL=TableCell-8b038969.js.map

package/_internal/packages/lumx-react/src/components/table/TableCell-8b038969.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableCell-8b038969.js","sources":["../../../../../../../src/components/table/TableCell.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { mdiArrowDown, mdiArrowUp } from '@lumx/icons';\nimport { Icon, Size } from '@lumx/react';\nimport { GenericProps, ValueOf } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Table head cell sort order.\n */\nexport const ThOrder = { asc: 'asc', desc: 'desc' } as const;\nexport type ThOrder = ValueOf<typeof ThOrder>;\n\n/**\n * Table cell variants.\n */\nexport const TableCellVariant = { body: 'body', head: 'head' } as const;\nexport type TableCellVariant = ValueOf<typeof TableCellVariant>;\n\n/**\n * Defines the props of the component.\n */\nexport interface TableCellProps extends GenericProps {\n    /** Icon (SVG path).(thead only). */\n    icon?: string;\n    /** Whether the column is sortable or not (thead only). */\n    isSortable?: boolean;\n    /** Sort order displayed as icon (sortable thead only). */\n    sortOrder?: ThOrder;\n    /** Variant. */\n    variant?: TableCellVariant;\n    /** On header cell click callback. */\n    onHeaderClick?(): void;\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableCell';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableCellProps> = {\n    variant: TableCellVariant.body,\n};\n\n/**\n * TableCell component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const TableCell = forwardRef<TableCellProps, HTMLTableCellElement>((props, ref) => {\n    const {\n        children,\n        className,\n        icon,\n        isSortable,\n        onHeaderClick,\n        sortOrder,\n        variant = DEFAULT_PROPS.variant,\n        ...forwardedProps\n    } = props;\n\n    // Use button if clickable\n    const Wrapper = onHeaderClick ? 'button' : 'div';\n    const wrapperProps = Wrapper === 'button' ? ({ type: 'button', onClick: onHeaderClick } as const) : undefined;\n\n    // ARIA sort\n    let ariaSort: 'ascending' | 'descending' | 'none' | undefined;\n    if (isSortable) {\n        ariaSort = 'none';\n        if (sortOrder === ThOrder.asc) ariaSort = 'ascending';\n        if (sortOrder === ThOrder.desc) ariaSort = 'descending';\n    }\n\n    return (\n        <>\n            {variant === TableCellVariant.head && (\n                <th\n                    ref={ref}\n                    {...forwardedProps}\n                    className={classNames(\n                        handleBasicClasses({\n                            prefix: CLASSNAME,\n                            isSortable,\n                            isSorted: isSortable && !!sortOrder,\n                        }),\n                        className,\n                        `${CLASSNAME}--head`,\n                    )}\n                    aria-sort={ariaSort}\n                >\n                    <Wrapper className={`${CLASSNAME}-wrapper`} {...wrapperProps}>\n                        {icon && !isSortable && <Icon className={`${CLASSNAME}-icon`} icon={icon} size={Size.xxs} />}\n\n                        {isSortable && sortOrder === ThOrder.asc && (\n                            <Icon className={`${CLASSNAME}-icon`} icon={mdiArrowUp} size={Size.xxs} />\n                        )}\n\n                        {isSortable && sortOrder === ThOrder.desc && (\n                            <Icon className={`${CLASSNAME}-icon`} icon={mdiArrowDown} size={Size.xxs} />\n                        )}\n\n                        <div className={`${CLASSNAME}-content`}>{children}</div>\n                    </Wrapper>\n                </th>\n            )}\n\n            {variant === TableCellVariant.body && (\n                <td {...forwardedProps} className={classNames(className, CLASSNAME, `${CLASSNAME}--body`)}>\n                    <div className={`${CLASSNAME}-content`}>{children}</div>\n                </td>\n            )}\n        </>\n    );\n});\nTableCell.displayName = COMPONENT_NAME;\nTableCell.className = CLASSNAME;\nTableCell.defaultProps = DEFAULT_PROPS;\n"],"names":["ThOrder","asc","desc","TableCellVariant","body","head","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","variant","TableCell","forwardRef","props","ref","children","className","icon","isSortable","onHeaderClick","sortOrder","forwardedProps","Wrapper","wrapperProps","type","onClick","undefined","ariaSort","_jsxs","_Fragment","_jsx","classNames","handleBasicClasses","prefix","isSorted","Icon","size","Size","xxs","mdiArrowUp","mdiArrowDown","displayName","defaultProps"],"mappings":"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"}

package/_internal/packages/lumx-react/src/components/table/TableHeader-50745c5b.js

@@ -0,0 +1,46 @@
+import classNames from 'classnames';
+import { getRootClassName } from '@lumx/core/js/utils/className';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'TableHeader';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME, true);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {};
+
+/**
+ * TableHeader component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const TableHeader = forwardRef((props, ref) => {
+  const {
+    children,
+    className,
+    ...forwardedProps
+  } = props;
+  return /*#__PURE__*/jsx("thead", {
+    ref: ref,
+    ...forwardedProps,
+    className: classNames(className, CLASSNAME),
+    children: children
+  });
+});
+TableHeader.displayName = COMPONENT_NAME;
+TableHeader.className = CLASSNAME;
+TableHeader.defaultProps = DEFAULT_PROPS;
+
+export { TableHeader };
+//# sourceMappingURL=TableHeader-50745c5b.js.map

package/_internal/packages/lumx-react/src/components/table/TableHeader-50745c5b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeader-50745c5b.js","sources":["../../../../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableHeaderProps extends GenericProps {\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableHeader';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableHeaderProps> = {};\n\n/**\n * TableHeader component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const TableHeader = forwardRef<TableHeaderProps, HTMLTableSectionElement>((props, ref) => {\n    const { children, className, ...forwardedProps } = props;\n\n    return (\n        <thead ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>\n            {children}\n        </thead>\n    );\n});\nTableHeader.displayName = COMPONENT_NAME;\nTableHeader.className = CLASSNAME;\nTableHeader.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","TableHeader","forwardRef","props","ref","children","className","forwardedProps","_jsx","classNames","displayName","defaultProps"],"mappings":";;;;;AAcA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,aAAa,CAAA;;AAEpC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,EAAE,IAAI,CAAC,CAAA;;AAExD;AACA;AACA;AACA,MAAMG,aAAwC,GAAG,EAAE,CAAA;;AAEnD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,WAAW,GAAGC,UAAU,CAA4C,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC7F,MAAM;IAAEC,QAAQ;IAAEC,SAAS;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGJ,KAAK,CAAA;AAExD,EAAA,oBACIK,GAAA,CAAA,OAAA,EAAA;AAAOJ,IAAAA,GAAG,EAAEA,GAAI;AAAA,IAAA,GAAKG,cAAc;AAAED,IAAAA,SAAS,EAAEG,UAAU,CAACH,SAAS,EAAER,SAAS,CAAE;AAAAO,IAAAA,QAAA,EAC5EA,QAAAA;AAAQ,GACN,CAAC,CAAA;AAEhB,CAAC,EAAC;AACFJ,WAAW,CAACS,WAAW,GAAGb,cAAc,CAAA;AACxCI,WAAW,CAACK,SAAS,GAAGR,SAAS,CAAA;AACjCG,WAAW,CAACU,YAAY,GAAGX,aAAa;;;;"}

package/_internal/packages/lumx-react/src/components/table/TableRow-1194f809.js

@@ -0,0 +1,61 @@
+import classNames from 'classnames';
+import { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { useDisableStateProps } from '../../utils/disabled/useDisableStateProps-2391c02d.js';
+import { jsx } from 'react/jsx-runtime';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'TableRow';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = getRootClassName(COMPONENT_NAME, true);
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {};
+
+/**
+ * TableRow component.
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const TableRow = forwardRef((props, ref) => {
+  const {
+    isAnyDisabled,
+    disabledStateProps,
+    otherProps
+  } = useDisableStateProps(props);
+  const {
+    children,
+    className,
+    isClickable,
+    isSelected,
+    ...forwardedProps
+  } = otherProps;
+  return /*#__PURE__*/jsx("tr", {
+    ref: ref,
+    tabIndex: isClickable && !disabledStateProps.disabled ? 0 : -1,
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      isClickable: isClickable && !isAnyDisabled,
+      isDisabled: isAnyDisabled,
+      isSelected: isSelected && !isAnyDisabled,
+      prefix: CLASSNAME
+    })),
+    "aria-disabled": isAnyDisabled,
+    children: children
+  });
+});
+TableRow.displayName = COMPONENT_NAME;
+TableRow.className = CLASSNAME;
+TableRow.defaultProps = DEFAULT_PROPS;
+
+export { TableRow };
+//# sourceMappingURL=TableRow-1194f809.js.map

package/_internal/packages/lumx-react/src/components/table/TableRow-1194f809.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRow-1194f809.js","sources":["../../../../../../../src/components/table/TableRow.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { getRootClassName, handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\n\n/**\n * Defines the props of the component.\n */\nexport interface TableRowProps extends GenericProps {\n    /** Whether the component is clickable or not. */\n    isClickable?: boolean;\n    /** Whether the component is disabled or not. */\n    isDisabled?: boolean;\n    /** Whether the component is selected or not. */\n    isSelected?: boolean;\n    /** Children */\n    children?: React.ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TableRow';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME, true);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TableRowProps> = {};\n\n/**\n * TableRow component.\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const TableRow = forwardRef<TableRowProps, HTMLTableRowElement>((props, ref) => {\n    const { isAnyDisabled, disabledStateProps, otherProps } = useDisableStateProps(props);\n    const { children, className, isClickable, isSelected, ...forwardedProps } = otherProps;\n\n    return (\n        <tr\n            ref={ref}\n            tabIndex={isClickable && !disabledStateProps.disabled ? 0 : -1}\n            {...forwardedProps}\n            className={classNames(\n                className,\n                handleBasicClasses({\n                    isClickable: isClickable && !isAnyDisabled,\n                    isDisabled: isAnyDisabled,\n                    isSelected: isSelected && !isAnyDisabled,\n                    prefix: CLASSNAME,\n                }),\n            )}\n            aria-disabled={isAnyDisabled}\n        >\n            {children}\n        </tr>\n    );\n});\n\nTableRow.displayName = COMPONENT_NAME;\nTableRow.className = CLASSNAME;\nTableRow.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","TableRow","forwardRef","props","ref","isAnyDisabled","disabledStateProps","otherProps","useDisableStateProps","children","className","isClickable","isSelected","forwardedProps","_jsx","tabIndex","disabled","classNames","handleBasicClasses","isDisabled","prefix","displayName","defaultProps"],"mappings":";;;;;;AAqBA;AACA;AACA;AACA,MAAMA,cAAc,GAAG,UAAU,CAAA;;AAEjC;AACA;AACA;AACA,MAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAc,EAAE,IAAI,CAAC,CAAA;;AAExD;AACA;AACA;AACA,MAAMG,aAAqC,GAAG,EAAE,CAAA;;AAEhD;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,QAAQ,GAAGC,UAAU,CAAqC,CAACC,KAAK,EAAEC,GAAG,KAAK;EACnF,MAAM;IAAEC,aAAa;IAAEC,kBAAkB;AAAEC,IAAAA,UAAAA;AAAW,GAAC,GAAGC,oBAAoB,CAACL,KAAK,CAAC,CAAA;EACrF,MAAM;IAAEM,QAAQ;IAAEC,SAAS;IAAEC,WAAW;IAAEC,UAAU;IAAE,GAAGC,cAAAA;AAAe,GAAC,GAAGN,UAAU,CAAA;AAEtF,EAAA,oBACIO,GAAA,CAAA,IAAA,EAAA;AACIV,IAAAA,GAAG,EAAEA,GAAI;IACTW,QAAQ,EAAEJ,WAAW,IAAI,CAACL,kBAAkB,CAACU,QAAQ,GAAG,CAAC,GAAG,CAAC,CAAE;AAAA,IAAA,GAC3DH,cAAc;AAClBH,IAAAA,SAAS,EAAEO,UAAU,CACjBP,SAAS,EACTQ,kBAAkB,CAAC;AACfP,MAAAA,WAAW,EAAEA,WAAW,IAAI,CAACN,aAAa;AAC1Cc,MAAAA,UAAU,EAAEd,aAAa;AACzBO,MAAAA,UAAU,EAAEA,UAAU,IAAI,CAACP,aAAa;AACxCe,MAAAA,MAAM,EAAEtB,SAAAA;AACZ,KAAC,CACL,CAAE;AACF,IAAA,eAAA,EAAeO,aAAc;AAAAI,IAAAA,QAAA,EAE5BA,QAAAA;AAAQ,GACT,CAAC,CAAA;AAEb,CAAC,EAAC;AAEFR,QAAQ,CAACoB,WAAW,GAAGxB,cAAc,CAAA;AACrCI,QAAQ,CAACS,SAAS,GAAGZ,SAAS,CAAA;AAC9BG,QAAQ,CAACqB,YAAY,GAAGtB,aAAa;;;;"}

package/_internal/packages/lumx-react/src/components/tabs/Tab-24093fe0.js

@@ -0,0 +1,109 @@
+import { useCallback } from 'react';
+import classNames from 'classnames';
+import '../../constants-6af61e2f.js';
+import { handleBasicClasses } from '@lumx/core/js/utils/className';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { useDisableStateProps } from '../../utils/disabled/useDisableStateProps-2391c02d.js';
+import { useTabProviderContext } from './state-af53c50e.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Icon } from '../icon/Icon-21a83e8c.js';
+import { Size, CSS_PREFIX } from '@lumx/core/js/constants';
+import { Text } from '../text/Text-d8efb3ca.js';
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'Tab';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = `${CSS_PREFIX}-tabs__link`;
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {};
+
+/**
+ * Tab component.
+ *
+ * Implements WAI-ARIA `tab` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const Tab = forwardRef((props, ref) => {
+  const {
+    isAnyDisabled,
+    otherProps
+  } = useDisableStateProps(props);
+  const {
+    className,
+    icon,
+    iconProps = {},
+    id,
+    isActive: propIsActive,
+    label,
+    onFocus,
+    onKeyPress,
+    tabIndex = -1,
+    ...forwardedProps
+  } = otherProps;
+  const state = useTabProviderContext('tab', id);
+  const isActive = propIsActive || state?.isActive;
+  const changeToCurrentTab = useCallback(() => {
+    if (isAnyDisabled) {
+      return;
+    }
+    state?.changeToTab();
+  }, [isAnyDisabled, state]);
+  const handleFocus = useCallback(event => {
+    onFocus?.(event);
+    if (state?.shouldActivateOnFocus) {
+      changeToCurrentTab();
+    }
+  }, [changeToCurrentTab, onFocus, state?.shouldActivateOnFocus]);
+  const handleKeyPress = useCallback(event => {
+    onKeyPress?.(event);
+    if (event.key !== 'Enter' || isAnyDisabled) {
+      return;
+    }
+    changeToCurrentTab();
+  }, [changeToCurrentTab, isAnyDisabled, onKeyPress]);
+  return /*#__PURE__*/jsxs("button", {
+    ref: ref,
+    ...forwardedProps,
+    type: "button",
+    id: state?.tabId,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      isActive,
+      isDisabled: isAnyDisabled
+    })),
+    onClick: changeToCurrentTab,
+    onKeyPress: handleKeyPress,
+    onFocus: handleFocus,
+    role: "tab",
+    tabIndex: isActive ? 0 : tabIndex,
+    "aria-disabled": isAnyDisabled,
+    "aria-selected": isActive,
+    "aria-controls": state?.tabPanelId,
+    children: [icon && /*#__PURE__*/jsx(Icon, {
+      icon: icon,
+      size: Size.xs,
+      ...iconProps
+    }), label && /*#__PURE__*/jsx(Text, {
+      as: "span",
+      truncate: true,
+      children: label
+    })]
+  });
+});
+Tab.displayName = COMPONENT_NAME;
+Tab.className = CLASSNAME;
+Tab.defaultProps = DEFAULT_PROPS;
+
+export { Tab };
+//# sourceMappingURL=Tab-24093fe0.js.map

package/_internal/packages/lumx-react/src/components/tabs/Tab-24093fe0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tab-24093fe0.js","sources":["../../../../../../../src/components/tabs/Tab.tsx"],"sourcesContent":["import { FocusEventHandler, KeyboardEventHandler, ReactNode, useCallback } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Icon, IconProps, Size, Text } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { GenericProps } from '@lumx/react/utils/type';\nimport { handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\n\nimport { useDisableStateProps } from '@lumx/react/utils/disabled/useDisableStateProps';\nimport { useTabProviderContext } from './state';\n\n/**\n * Defines the props of the component.\n */\nexport interface TabProps extends GenericProps {\n    /** Children are not supported. */\n    children?: never;\n    /** Icon (SVG path). */\n    icon?: IconProps['icon'];\n    /** Icon component properties. */\n    iconProps?: Omit<IconProps, 'icon'>;\n    /** Native id property. */\n    id?: string;\n    /** Whether the tab is active or not. */\n    isActive?: boolean;\n    /** Whether the component is disabled or not. */\n    isDisabled?: boolean;\n    /** Label content. */\n    label: string | ReactNode;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Tab';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = `${CSS_PREFIX}-tabs__link`;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TabProps> = {};\n\n/**\n * Tab component.\n *\n * Implements WAI-ARIA `tab` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const Tab = forwardRef<TabProps, HTMLButtonElement>((props, ref) => {\n    const { isAnyDisabled, otherProps } = useDisableStateProps(props);\n    const {\n        className,\n        icon,\n        iconProps = {},\n        id,\n        isActive: propIsActive,\n        label,\n        onFocus,\n        onKeyPress,\n        tabIndex = -1,\n        ...forwardedProps\n    } = otherProps;\n    const state = useTabProviderContext('tab', id);\n    const isActive = propIsActive || state?.isActive;\n\n    const changeToCurrentTab = useCallback(() => {\n        if (isAnyDisabled) {\n            return;\n        }\n        state?.changeToTab();\n    }, [isAnyDisabled, state]);\n\n    const handleFocus: FocusEventHandler = useCallback(\n        (event) => {\n            onFocus?.(event);\n            if (state?.shouldActivateOnFocus) {\n                changeToCurrentTab();\n            }\n        },\n        [changeToCurrentTab, onFocus, state?.shouldActivateOnFocus],\n    );\n\n    const handleKeyPress: KeyboardEventHandler = useCallback(\n        (event) => {\n            onKeyPress?.(event);\n            if (event.key !== 'Enter' || isAnyDisabled) {\n                return;\n            }\n            changeToCurrentTab();\n        },\n        [changeToCurrentTab, isAnyDisabled, onKeyPress],\n    );\n\n    return (\n        <button\n            ref={ref}\n            {...forwardedProps}\n            type=\"button\"\n            id={state?.tabId}\n            className={classNames(\n                className,\n                handleBasicClasses({ prefix: CLASSNAME, isActive, isDisabled: isAnyDisabled }),\n            )}\n            onClick={changeToCurrentTab}\n            onKeyPress={handleKeyPress}\n            onFocus={handleFocus}\n            role=\"tab\"\n            tabIndex={isActive ? 0 : tabIndex}\n            aria-disabled={isAnyDisabled}\n            aria-selected={isActive}\n            aria-controls={state?.tabPanelId}\n        >\n            {icon && <Icon icon={icon} size={Size.xs} {...iconProps} />}\n            {label && (\n                <Text as=\"span\" truncate>\n                    {label}\n                </Text>\n            )}\n        </button>\n    );\n});\nTab.displayName = COMPONENT_NAME;\nTab.className = CLASSNAME;\nTab.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","CSS_PREFIX","DEFAULT_PROPS","Tab","forwardRef","props","ref","isAnyDisabled","otherProps","useDisableStateProps","className","icon","iconProps","id","isActive","propIsActive","label","onFocus","onKeyPress","tabIndex","forwardedProps","state","useTabProviderContext","changeToCurrentTab","useCallback","changeToTab","handleFocus","event","shouldActivateOnFocus","handleKeyPress","key","_jsxs","type","tabId","classNames","handleBasicClasses","prefix","isDisabled","onClick","role","tabPanelId","children","_jsx","Icon","size","Size","xs","Text","as","truncate","displayName","defaultProps"],"mappings":"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"}

package/_internal/packages/lumx-react/src/components/tabs/TabList-f0a286a1.js

@@ -0,0 +1,89 @@
+import React__default from 'react';
+import classNames from 'classnames';
+import '../../constants-6af61e2f.js';
+import { handleBasicClasses } from '@lumx/core/js/utils/className';
+import { mergeRefs } from '../../utils/react/mergeRefs-27df0cb6.js';
+import { forwardRef } from '../../utils/react/forwardRef-bd8b3ec8.js';
+import { useTheme } from '../../utils/theme/ThemeContext-d8ee966d.js';
+import { useRovingTabIndex } from '../../hooks/useRovingTabIndex-bb8088e1.js';
+import { jsx } from 'react/jsx-runtime';
+import { Alignment, Theme, CSS_PREFIX } from '@lumx/core/js/constants';
+
+let TabListLayout = /*#__PURE__*/function (TabListLayout) {
+  TabListLayout["clustered"] = "clustered";
+  TabListLayout["fixed"] = "fixed";
+  return TabListLayout;
+}({});
+
+/**
+ * Defines the props of the component.
+ */
+
+/**
+ * Component display name.
+ */
+const COMPONENT_NAME = 'TabList';
+
+/**
+ * Component default class name and class prefix.
+ */
+const CLASSNAME = `${CSS_PREFIX}-tabs`;
+
+/**
+ * Component default props.
+ */
+const DEFAULT_PROPS = {
+  layout: TabListLayout.fixed,
+  position: Alignment.left
+};
+
+/**
+ * TabList component.
+ *
+ * Implements WAI-ARIA `tablist` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}
+ *
+ * @param  props Component props.
+ * @param  ref   Component ref.
+ * @return React element.
+ */
+const TabList = forwardRef((props, ref) => {
+  const defaultTheme = useTheme() || Theme.light;
+  const {
+    'aria-label': ariaLabel,
+    children,
+    className,
+    layout = DEFAULT_PROPS.layout,
+    position = DEFAULT_PROPS.position,
+    theme = defaultTheme,
+    ...forwardedProps
+  } = props;
+  const tabListRef = React__default.useRef(null);
+  useRovingTabIndex({
+    parentRef: tabListRef,
+    elementSelector: '[role="tab"]',
+    keepTabIndex: false,
+    extraDependencies: [children]
+  });
+  return /*#__PURE__*/jsx("div", {
+    ref: mergeRefs(ref, tabListRef),
+    ...forwardedProps,
+    className: classNames(className, handleBasicClasses({
+      prefix: CLASSNAME,
+      layout,
+      position,
+      theme
+    })),
+    children: /*#__PURE__*/jsx("div", {
+      className: `${CLASSNAME}__links`,
+      role: "tablist",
+      "aria-label": ariaLabel,
+      children: children
+    })
+  });
+});
+TabList.displayName = COMPONENT_NAME;
+TabList.className = CLASSNAME;
+TabList.defaultProps = DEFAULT_PROPS;
+
+export { TabList, TabListLayout };
+//# sourceMappingURL=TabList-f0a286a1.js.map

package/_internal/packages/lumx-react/src/components/tabs/TabList-f0a286a1.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TabList-f0a286a1.js","sources":["../../../../../../../src/components/tabs/TabList.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Alignment, Theme } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { GenericProps, HasTheme } from '@lumx/react/utils/type';\nimport { handleBasicClasses } from '@lumx/core/js/utils/className';\nimport { mergeRefs } from '@lumx/react/utils/react/mergeRefs';\nimport { forwardRef } from '@lumx/react/utils/react/forwardRef';\nimport { useTheme } from '@lumx/react/utils/theme/ThemeContext';\n\nimport { useRovingTabIndex } from '../../hooks/useRovingTabIndex';\n\nexport enum TabListLayout {\n    clustered = 'clustered',\n    fixed = 'fixed',\n}\n\n/**\n * Defines the props of the component.\n */\nexport interface TabListProps extends GenericProps, HasTheme {\n    /** ARIA label (purpose of the set of tabs). */\n    ['aria-label']: string;\n    /** Tab list. */\n    children: ReactNode;\n    /** Layout of the tabs in the list. */\n    layout?: TabListLayout;\n    /** Position of the tabs in the list (requires 'clustered' layout). */\n    position?: Alignment;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TabList';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = `${CSS_PREFIX}-tabs`;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TabListProps> = {\n    layout: TabListLayout.fixed,\n    position: Alignment.left,\n};\n\n/**\n * TabList component.\n *\n * Implements WAI-ARIA `tablist` role {@see https://www.w3.org/TR/wai-aria-practices-1.1/examples/tabs/tabs-1/tabs.html#rps_label}\n *\n * @param  props Component props.\n * @param  ref   Component ref.\n * @return React element.\n */\nexport const TabList = forwardRef<TabListProps, HTMLDivElement>((props, ref) => {\n    const defaultTheme = useTheme() || Theme.light;\n    const {\n        'aria-label': ariaLabel,\n        children,\n        className,\n        layout = DEFAULT_PROPS.layout,\n        position = DEFAULT_PROPS.position,\n        theme = defaultTheme,\n        ...forwardedProps\n    } = props;\n    const tabListRef = React.useRef(null);\n    useRovingTabIndex({\n        parentRef: tabListRef,\n        elementSelector: '[role=\"tab\"]',\n        keepTabIndex: false,\n        extraDependencies: [children],\n    });\n\n    return (\n        <div\n            ref={mergeRefs(ref, tabListRef)}\n            {...forwardedProps}\n            className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, layout, position, theme }))}\n        >\n            <div className={`${CLASSNAME}__links`} role=\"tablist\" aria-label={ariaLabel}>\n                {children}\n            </div>\n        </div>\n    );\n});\nTabList.displayName = COMPONENT_NAME;\nTabList.className = CLASSNAME;\nTabList.defaultProps = DEFAULT_PROPS;\n"],"names":["TabListLayout","COMPONENT_NAME","CLASSNAME","CSS_PREFIX","DEFAULT_PROPS","layout","fixed","position","Alignment","left","TabList","forwardRef","props","ref","defaultTheme","useTheme","Theme","light","ariaLabel","children","className","theme","forwardedProps","tabListRef","React","useRef","useRovingTabIndex","parentRef","elementSelector","keepTabIndex","extraDependencies","_jsx","mergeRefs","classNames","handleBasicClasses","prefix","role","displayName","defaultProps"],"mappings":";;;;;;;;;;;AAcYA,IAAAA,aAAa,0BAAbA,aAAa,EAAA;EAAbA,aAAa,CAAA,WAAA,CAAA,GAAA,WAAA,CAAA;EAAbA,aAAa,CAAA,OAAA,CAAA,GAAA,OAAA,CAAA;AAAA,EAAA,OAAbA,aAAa,CAAA;AAAA,CAAA,CAAA,EAAA,EAAA;;AAKzB;AACA;AACA;;AAYA;AACA;AACA;AACA,MAAMC,cAAc,GAAG,SAAS,CAAA;;AAEhC;AACA;AACA;AACA,MAAMC,SAAS,GAAG,CAAGC,EAAAA,UAAU,CAAO,KAAA,CAAA,CAAA;;AAEtC;AACA;AACA;AACA,MAAMC,aAAoC,GAAG;EACzCC,MAAM,EAAEL,aAAa,CAACM,KAAK;EAC3BC,QAAQ,EAAEC,SAAS,CAACC,IAAAA;AACxB,CAAC,CAAA;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMC,OAAO,GAAGC,UAAU,CAA+B,CAACC,KAAK,EAAEC,GAAG,KAAK;EAC5E,MAAMC,YAAY,GAAGC,QAAQ,EAAE,IAAIC,KAAK,CAACC,KAAK,CAAA;EAC9C,MAAM;AACF,IAAA,YAAY,EAAEC,SAAS;IACvBC,QAAQ;IACRC,SAAS;IACTf,MAAM,GAAGD,aAAa,CAACC,MAAM;IAC7BE,QAAQ,GAAGH,aAAa,CAACG,QAAQ;AACjCc,IAAAA,KAAK,GAAGP,YAAY;IACpB,GAAGQ,cAAAA;AACP,GAAC,GAAGV,KAAK,CAAA;AACT,EAAA,MAAMW,UAAU,GAAGC,cAAK,CAACC,MAAM,CAAC,IAAI,CAAC,CAAA;AACrCC,EAAAA,iBAAiB,CAAC;AACdC,IAAAA,SAAS,EAAEJ,UAAU;AACrBK,IAAAA,eAAe,EAAE,cAAc;AAC/BC,IAAAA,YAAY,EAAE,KAAK;IACnBC,iBAAiB,EAAE,CAACX,QAAQ,CAAA;AAChC,GAAC,CAAC,CAAA;AAEF,EAAA,oBACIY,GAAA,CAAA,KAAA,EAAA;AACIlB,IAAAA,GAAG,EAAEmB,SAAS,CAACnB,GAAG,EAAEU,UAAU,CAAE;AAAA,IAAA,GAC5BD,cAAc;AAClBF,IAAAA,SAAS,EAAEa,UAAU,CAACb,SAAS,EAAEc,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEjC,SAAS;MAAEG,MAAM;MAAEE,QAAQ;AAAEc,MAAAA,KAAAA;AAAM,KAAC,CAAC,CAAE;AAAAF,IAAAA,QAAA,eAErGY,GAAA,CAAA,KAAA,EAAA;MAAKX,SAAS,EAAE,CAAGlB,EAAAA,SAAS,CAAU,OAAA,CAAA;AAACkC,MAAAA,IAAI,EAAC,SAAS;AAAC,MAAA,YAAA,EAAYlB,SAAU;AAAAC,MAAAA,QAAA,EACvEA,QAAAA;KACA,CAAA;AAAC,GACL,CAAC,CAAA;AAEd,CAAC,EAAC;AACFT,OAAO,CAAC2B,WAAW,GAAGpC,cAAc,CAAA;AACpCS,OAAO,CAACU,SAAS,GAAGlB,SAAS,CAAA;AAC7BQ,OAAO,CAAC4B,YAAY,GAAGlC,aAAa;;;;"}