npm - @raystack/apsara - Versions diffs - 0.48.3 → 0.48.5 - Mend

@raystack/apsara 0.48.3 → 0.48.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (67) hide show

package/dist/components/data-table/utils/filter-operations.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-operations.js","sources":["../../../../components/data-table/utils/filter-operations.tsx"],"sourcesContent":["import type { FilterFn } from \"@tanstack/table-core\";\nimport dayjs from \"dayjs\";\nimport isSameOrAfter from \"dayjs/plugin/isSameOrAfter\";\nimport isSameOrBefore from \"dayjs/plugin/isSameOrBefore\";\n\nimport {\n DateFilterOperatorType,\n FilterOperatorTypes,\n FilterValue,\n NumberFilterOperatorType,\n StringFilterOperatorType,\n SelectFilterOperatorType,\n FilterTypes,\n FilterValueType,\n FilterType,\n} from \"~/types/filters\";\nimport { EmptyFilterValue, RQLFilterValues } from \"../data-table.types\";\n\ndayjs.extend(isSameOrAfter);\ndayjs.extend(isSameOrBefore);\n\nexport type FilterFunctionsMap = {\n number: Record<NumberFilterOperatorType, FilterFn<any>>;\n string: Record<StringFilterOperatorType, FilterFn<any>>;\n date: Record<DateFilterOperatorType, FilterFn<any>>;\n select: Record<SelectFilterOperatorType, FilterFn<any>>;\n};\n\nexport const filterOperationsMap: FilterFunctionsMap = {\n number: {\n eq: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) === Number(filterValue.value);\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) !== Number(filterValue.value);\n },\n lt: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) < Number(filterValue.value);\n },\n lte: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) <= Number(filterValue.value);\n },\n gt: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) > Number(filterValue.value);\n },\n gte: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) >= Number(filterValue.value);\n },\n },\n string: {\n eq: (row, columnId, filterValue: FilterValue) => {\n return (\n String(row.getValue(columnId)).toLowerCase() ===\n String(filterValue.value).toLowerCase()\n );\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n return (\n String(row.getValue(columnId)).toLowerCase() !==\n String(filterValue.value).toLowerCase()\n );\n },\n like: (row, columnId, filterValue: FilterValue) => {\n const columnValue = (row.getValue(columnId) as string).toLowerCase();\n const filterStr = (filterValue.value as string).toLowerCase();\n return columnValue.includes(filterStr);\n },\n },\n date: {\n eq: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isSame(\n dayjs(filterValue.date),\n \"day\"\n );\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n return !dayjs(row.getValue(columnId)).isSame(\n dayjs(filterValue.date),\n \"day\"\n );\n },\n lt: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isBefore(\n dayjs(filterValue.date),\n \"day\"\n );\n },\n lte: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isSameOrBefore(\n dayjs(filterValue.date),\n \"day\"\n );\n },\n gt: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isAfter(\n dayjs(filterValue.date),\n \"day\"\n );\n },\n gte: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isSameOrAfter(\n dayjs(filterValue.date),\n \"day\"\n );\n },\n },\n select: {\n eq: (row, columnId, filterValue: FilterValue) => {\n if (String(filterValue.value) === EmptyFilterValue) {\n return row.getValue(columnId) === \"\";\n }\n // Select only supports string values\n return String(row.getValue(columnId)) === String(filterValue.value);\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n if (String(filterValue.value) === EmptyFilterValue) {\n return row.getValue(columnId) !== \"\";\n }\n // Select only supports string values\n return String(row.getValue(columnId)) !== String(filterValue.value);\n },\n },\n} as const;\n\nexport function getFilterFn<T extends keyof FilterFunctionsMap>(\n type: T,\n operator: FilterOperatorTypes\n) {\n // @ts-expect-error FilterOperatorTypes is union of all possible operators\n return filterOperationsMap[type][operator];\n}\n\nconst handleStringBasedTypes = (\n filterType: FilterTypes,\n value: any\n): RQLFilterValues => {\n switch (filterType) {\n case FilterType.date:\n return {\n value,\n stringValue: (value as Date).toISOString(),\n };\n case FilterType.select:\n return {\n stringValue: value === EmptyFilterValue ? \"\" : value,\n value,\n };\n default:\n return {\n stringValue: value,\n value,\n };\n }\n};\n\nexport const getFilterOperator = ({\n value,\n filterType,\n operator,\n}: {\n value: any;\n filterType?: FilterTypes;\n operator: FilterOperatorTypes;\n}): FilterOperatorTypes => {\n return value === EmptyFilterValue && filterType === FilterType.select\n ? \"empty\"\n : operator;\n};\n\nexport const getFilterValue = ({\n value,\n dataType = \"string\",\n filterType = FilterType.string,\n}: {\n value: any;\n dataType?: FilterValueType;\n filterType?: FilterTypes;\n}): RQLFilterValues => {\n if (dataType === \"boolean\") {\n return { boolValue: value, value };\n }\n if (dataType === \"number\") {\n return { numberValue: value, value };\n }\n\n // Handle string-based types\n return handleStringBasedTypes(filterType, value);\n};\n\nexport const getDataType = ({\n filterType = FilterType.string,\n dataType = \"string\",\n}: {\n dataType?: FilterValueType;\n filterType?: FilterTypes;\n}): FilterValueType => {\n switch (filterType) {\n case FilterType.select:\n return dataType;\n case FilterType.date:\n return \"string\";\n default:\n return filterType;\n }\n};\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"filter-operations.js","sources":["../../../../components/data-table/utils/filter-operations.tsx"],"sourcesContent":["import type { FilterFn } from '@tanstack/table-core';\nimport dayjs from 'dayjs';\nimport isSameOrAfter from 'dayjs/plugin/isSameOrAfter';\nimport isSameOrBefore from 'dayjs/plugin/isSameOrBefore';\n\nimport {\n DateFilterOperatorType,\n FilterOperatorTypes,\n FilterType,\n FilterTypes,\n FilterValue,\n FilterValueType,\n MultiSelectFilterOperatorType,\n NumberFilterOperatorType,\n SelectFilterOperatorType,\n StringFilterOperatorType\n} from '~/types/filters';\nimport { EmptyFilterValue, RQLFilterValues } from '../data-table.types';\n\ndayjs.extend(isSameOrAfter);\ndayjs.extend(isSameOrBefore);\n\nexport type FilterFunctionsMap = {\n number: Record<NumberFilterOperatorType, FilterFn<any>>;\n string: Record<StringFilterOperatorType, FilterFn<any>>;\n date: Record<DateFilterOperatorType, FilterFn<any>>;\n select: Record<SelectFilterOperatorType, FilterFn<any>>;\n multiselect: Record<MultiSelectFilterOperatorType, FilterFn<any>>;\n};\n\nexport const filterOperationsMap: FilterFunctionsMap = {\n number: {\n eq: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) === Number(filterValue.value);\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) !== Number(filterValue.value);\n },\n lt: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) < Number(filterValue.value);\n },\n lte: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) <= Number(filterValue.value);\n },\n gt: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) > Number(filterValue.value);\n },\n gte: (row, columnId, filterValue: FilterValue) => {\n return Number(row.getValue(columnId)) >= Number(filterValue.value);\n }\n },\n string: {\n eq: (row, columnId, filterValue: FilterValue) => {\n return (\n String(row.getValue(columnId)).toLowerCase() ===\n String(filterValue.value).toLowerCase()\n );\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n return (\n String(row.getValue(columnId)).toLowerCase() !==\n String(filterValue.value).toLowerCase()\n );\n },\n like: (row, columnId, filterValue: FilterValue) => {\n const columnValue = (row.getValue(columnId) as string).toLowerCase();\n const filterStr = (filterValue.value as string).toLowerCase();\n return columnValue.includes(filterStr);\n }\n },\n date: {\n eq: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isSame(\n dayjs(filterValue.date),\n 'day'\n );\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n return !dayjs(row.getValue(columnId)).isSame(\n dayjs(filterValue.date),\n 'day'\n );\n },\n lt: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isBefore(\n dayjs(filterValue.date),\n 'day'\n );\n },\n lte: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isSameOrBefore(\n dayjs(filterValue.date),\n 'day'\n );\n },\n gt: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isAfter(\n dayjs(filterValue.date),\n 'day'\n );\n },\n gte: (row, columnId, filterValue: FilterValue) => {\n return dayjs(row.getValue(columnId)).isSameOrAfter(\n dayjs(filterValue.date),\n 'day'\n );\n }\n },\n select: {\n eq: (row, columnId, filterValue: FilterValue) => {\n if (String(filterValue.value) === EmptyFilterValue) {\n return row.getValue(columnId) === '';\n }\n // Select only supports string values\n return String(row.getValue(columnId)) === String(filterValue.value);\n },\n neq: (row, columnId, filterValue: FilterValue) => {\n if (String(filterValue.value) === EmptyFilterValue) {\n return row.getValue(columnId) !== '';\n }\n // Select only supports string values\n return String(row.getValue(columnId)) !== String(filterValue.value);\n }\n },\n multiselect: {\n in: (row, columnId, filterValue: FilterValue) => {\n if (!Array.isArray(filterValue.value)) return false;\n\n return filterValue.value\n .map(value => (value === EmptyFilterValue ? '' : String(value)))\n .includes(String(row.getValue(columnId)));\n },\n notin: (row, columnId, filterValue: FilterValue) => {\n if (!Array.isArray(filterValue.value)) return false;\n\n return !filterValue.value\n .map(value => (value === EmptyFilterValue ? '' : String(value)))\n .includes(String(row.getValue(columnId)));\n }\n }\n} as const;\n\nexport function getFilterFn<T extends keyof FilterFunctionsMap>(\n type: T,\n operator: FilterOperatorTypes\n) {\n // @ts-expect-error FilterOperatorTypes is union of all possible operators\n return filterOperationsMap[type][operator];\n}\n\nconst handleStringBasedTypes = (\n filterType: FilterTypes,\n value: any\n): RQLFilterValues => {\n switch (filterType) {\n case FilterType.date:\n return {\n value,\n stringValue: (value as Date).toISOString()\n };\n case FilterType.select:\n return {\n stringValue: value === EmptyFilterValue ? '' : value,\n value\n };\n case FilterType.multiselect:\n return {\n value,\n stringValue: value\n .map((value: any) =>\n value === EmptyFilterValue ? '' : String(value)\n )\n .join()\n };\n default:\n return {\n stringValue: value,\n value\n };\n }\n};\n\nexport const getFilterOperator = ({\n value,\n filterType,\n operator\n}: {\n value: any;\n filterType?: FilterTypes;\n operator: FilterOperatorTypes;\n}): FilterOperatorTypes => {\n return value === EmptyFilterValue && filterType === FilterType.select\n ? 'empty'\n : operator;\n};\n\nexport const getFilterValue = ({\n value,\n dataType = 'string',\n filterType = FilterType.string\n}: {\n value: any;\n dataType?: FilterValueType;\n filterType?: FilterTypes;\n}): RQLFilterValues => {\n if (dataType === 'boolean') {\n return { boolValue: value, value };\n }\n if (dataType === 'number') {\n return { numberValue: value, value };\n }\n\n // Handle string-based types\n return handleStringBasedTypes(filterType, value);\n};\n\nexport const getDataType = ({\n filterType = FilterType.string,\n dataType = 'string'\n}: {\n dataType?: FilterValueType;\n filterType?: FilterTypes;\n}): FilterValueType => {\n switch (filterType) {\n case FilterType.multiselect:\n case FilterType.select:\n return dataType;\n case FilterType.date:\n return 'string';\n default:\n return filterType;\n }\n};\n"],"names":[],"mappings":"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"}

package/dist/components/filter-chip/filter-chip-operation.cjs CHANGED Viewed

@@ -1,12 +1,13 @@
 'use strict';
 var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
+var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
 var React = require('react');
 var select = require('../select/select.cjs');
 var text = require('../text/text.cjs');
 var filterChip_module = require('./filter-chip.module.css.cjs');
-const Operation = ({ label, value, onChange, operations }) => {
+const Operation = ({ label, value, onChange, operations, showAlternateLabel = false }) => {
     const operationValue = value?.value ?? '';
     const handleValueChange = React.useCallback((newValue) => {
         const operation = operations.find(o => o.value === newValue);
@@ -14,9 +15,15 @@ const Operation = ({ label, value, onChange, operations }) => {
             onChange(operation);
     }, [operations, onChange]);
     if (operations.length === 1)
-        return (jsxRuntime.jsxRuntimeExports.jsx(text.Text, { variant: 'secondary', className: filterChip_module.default.selectValue, children: operations[0].label }));
-    return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: 'text', className: filterChip_module.default.selectValue, "aria-label": `${label} filter operation`, children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: 'Select operation', className: filterChip_module.default.operationText }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": 'filter', children: operations.map(operation => {
-                    return (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: operation.value, "aria-label": `Filter ${label} ${operation.label}`, children: operation.label }, operation.value));
+        return (jsxRuntime.jsxRuntimeExports.jsx(text.Text, { variant: 'secondary', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), children: operations[0].label }));
+    return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: 'text', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.operationValue), "aria-label": `${label} filter operation`, iconProps: {
+                    style: {
+                        display: 'none'
+                    }
+                }, children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: 'Select operation', className: filterChip_module.default.operationText }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": 'filter', children: operations.map(operation => {
+                    return (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: operation.value, "aria-label": `Filter ${label} ${operation.label}`, children: showAlternateLabel && operation?.alternateLabel
+                            ? operation.alternateLabel
+                            : operation.label }, operation.value));
                 }) })] }));
 };

package/dist/components/filter-chip/filter-chip-operation.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-chip-operation.cjs","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { FilterOperation, FilterOperator } from '~/types/filters';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport styles from './filter-chip.module.css';\n\ninterface OperationProps {\n label: string;\n value?: FilterOperation;\n onChange: (operation: FilterOperation) => void;\n operations: FilterOperator<string>[];\n}\n\nexport const Operation = ({\n label,\n value,\n onChange,\n operations\n}: OperationProps) => {\n const operationValue = value?.value ?? '';\n\n const handleValueChange = useCallback(\n (newValue: string) => {\n const operation = operations.find(o => o.value === newValue);\n if (operation) onChange(operation);\n },\n [operations, onChange]\n );\n\n if (operations.length === 1)\n return (\n <Text variant='secondary' className={styles.selectValue}>\n {operations[0].label}\n </Text>\n );\n\n return (\n <Select\n value={operationValue}\n onValueChange={handleValueChange}\n aria-labelledby={`${label}-label`}\n >\n <Select.Trigger\n variant='text'\n className={styles.selectValue}\n aria-label={`${label} filter operation`}\n >\n <Select.Value\n placeholder='Select operation'\n className={styles.operationText}\n />\n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {operations.map(operation => {\n return (\n <Select.Item\n key={operation.value}\n value={operation.value}\n aria-label={`Filter ${label} ${operation.label}`}\n >\n {operation.label}\n </Select.Item>\n );\n })}\n </Select.Content>\n </Select>\n );\n};\n"],"names":["useCallback","_jsx","Text","styles","_jsxs","Select"],"mappings":"~~;;;;;;;;AAaO~~,~~MAAM~~,SAAS,GAAG,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,~~EACK~~,KAAI;AACnB,IAAA,MAAM,cAAc,GAAG,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC;AAE1C,IAAA,MAAM,iBAAiB,GAAGA,iBAAW,CACnC,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;AAC7D,QAAA,IAAI,SAAS;YAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;AACrC,KAAC,EACD,CAAC,UAAU,EAAE,QAAQ,CAAC,CACvB,CAAC;AAEF,IAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC;~~QACzB~~,QACEC,~~iCAACC~~,SAAI,EAAA,~~EAAC~~,OAAO,EAAC,WAAW,~~EAAC~~,SAAS,EAAEC,yBAAM,CAAC,WAAW,~~EAAA~~,QAAA,~~EACpD~~,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,~~EACf~~,~~CAAA~~,EACP;AAEJ,IAAA,QACEC,~~iCAAA~~,~~CAACC~~,aAAM,~~EAAA~~,~~EACL,~~KAAK,EAAE,cAAc,EACrB,aAAa,EAAE,iBAAiB,EAAA,iBAAA,EACf,GAAG,KAAK,CAAA,MAAA,CAAQ,~~EAEjC~~,~~QAAA~~,~~EAAA~~,~~CAAAJ,gCAAA,CAACI,~~aAAM,CAAC,OAAO,EAAA,EACb,OAAO,EAAC,MAAM,EACd,SAAS,~~EAAEF~~,yBAAM,CAAC,WAAW,~~EACjB~~,YAAA,EAAA,CAAA,EAAG,KAAK,CAAA,iBAAA,~~CAAmB~~,~~EAEvC,~~QAAA,~~EAAAF~~,~~gCAAA~~,~~CAACI~~,aAAM,CAAC,KAAK,EAAA,~~EACX,~~WAAW,EAAC,kBAAkB,EAC9B,SAAS,EAAEF,yBAAM,CAAC,aAAa,~~EAC~~/B,CAAA,~~EAAA~~,~~CACa~~,~~EACjBF~~,~~gCAAA,CAACI,~~aAAM,CAAC,OAAO,EAAc,EAAA,cAAA,EAAA,QAAQ,EAClC,QAAA,EAAA,UAAU,CAAC,GAAG,CAAC,SAAS,IAAG;~~AAC1B~~,~~oBAAA~~,~~QACEJ~~,~~gCAAA~~,~~CAACI,~~aAAM,CAAC,IAAI,~~EAAA~~,~~EAEV,~~KAAK,EAAE,SAAS,CAAC,KAAK,EAAA,YAAA,EACV,~~CAAU~~,~~OAAA,EAAA,~~KAAK,~~CAAI~~,CAAA,~~EAAA~~,SAAS,CAAC,KAAK,~~CAAE,~~CAAA,~~EAAA~~,~~QAAA,EAE~~/C,SAAS,CAAC,KAAK,EAAA,~~EAJX~~,SAAS,CAAC,KAAK,~~CAKR~~,EACd;AACJ,iBAAC,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;AACJ;;;;"}
1	+ {"version":3,"file":"filter-chip-operation.cjs","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { useCallback } from 'react';\nimport { FilterOperation, FilterOperator } from '~/types/filters';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport styles from './filter-chip.module.css';\n\ninterface OperationProps {\n label: string;\n value?: FilterOperation;\n onChange: (operation: FilterOperation) => void;\n operations: FilterOperator<string>[];\n showAlternateLabel?: boolean;\n}\n\nexport const Operation = ({\n label,\n value,\n onChange,\n operations,\n showAlternateLabel = false\n}: OperationProps) => {\n const operationValue = value?.value ?? '';\n\n const handleValueChange = useCallback(\n (newValue: string) => {\n const operation = operations.find(o => o.value === newValue);\n if (operation) onChange(operation);\n },\n [operations, onChange]\n );\n\n if (operations.length === 1)\n return (\n <Text\n variant='secondary'\n className={cx(styles.selectValue, styles.operationValue)}\n >\n {operations[0].label}\n </Text>\n );\n\n return (\n <Select\n value={operationValue}\n onValueChange={handleValueChange}\n aria-labelledby={`${label}-label`}\n >\n <Select.Trigger\n variant='text'\n className={cx(styles.selectValue, styles.operationValue)}\n aria-label={`${label} filter operation`}\n iconProps={{\n style: {\n display: 'none'\n }\n }}\n >\n <Select.Value\n placeholder='Select operation'\n className={styles.operationText}\n />\n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {operations.map(operation => {\n return (\n <Select.Item\n key={operation.value}\n value={operation.value}\n aria-label={`Filter ${label} ${operation.label}`}\n >\n {showAlternateLabel && operation?.alternateLabel\n ? operation.alternateLabel\n : operation.label}\n </Select.Item>\n );\n })}\n </Select.Content>\n </Select>\n );\n};\n"],"names":["useCallback","_jsx","Text","cx","styles","_jsxs","Select"],"mappings":";;;;;;;;;AAea,MAAA,SAAS,GAAG,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,EACV,kBAAkB,GAAG,KAAK,EACX,KAAI;AACnB,IAAA,MAAM,cAAc,GAAG,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC;AAE1C,IAAA,MAAM,iBAAiB,GAAGA,iBAAW,CACnC,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;AAC7D,QAAA,IAAI,SAAS;YAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;AACrC,KAAC,EACD,CAAC,UAAU,EAAE,QAAQ,CAAC,CACvB,CAAC;AAEF,IAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC;AACzB,QAAA,QACEC,gCAAA,CAACC,SAAI,EAAA,EACH,OAAO,EAAC,WAAW,EACnB,SAAS,EAAEC,QAAE,CAACC,yBAAM,CAAC,WAAW,EAAEA,yBAAM,CAAC,cAAc,CAAC,EAEvD,QAAA,EAAA,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,EAAA,CACf,EACP;AAEJ,IAAA,QACEC,iCAAC,CAAAC,aAAM,IACL,KAAK,EAAE,cAAc,EACrB,aAAa,EAAE,iBAAiB,EAAA,iBAAA,EACf,GAAG,KAAK,CAAA,MAAA,CAAQ,aAEjCL,gCAAC,CAAAK,aAAM,CAAC,OAAO,EAAA,EACb,OAAO,EAAC,MAAM,EACd,SAAS,EAAEH,QAAE,CAACC,yBAAM,CAAC,WAAW,EAAEA,yBAAM,CAAC,cAAc,CAAC,EAC5C,YAAA,EAAA,CAAA,EAAG,KAAK,CAAmB,iBAAA,CAAA,EACvC,SAAS,EAAE;AACT,oBAAA,KAAK,EAAE;AACL,wBAAA,OAAO,EAAE,MAAM;AAChB,qBAAA;AACF,iBAAA,EAAA,QAAA,EAEDH,gCAAC,CAAAK,aAAM,CAAC,KAAK,EACX,EAAA,WAAW,EAAC,kBAAkB,EAC9B,SAAS,EAAEF,yBAAM,CAAC,aAAa,EAAA,CAC/B,EACa,CAAA,EACjBH,gCAAC,CAAAK,aAAM,CAAC,OAAO,EAAc,EAAA,cAAA,EAAA,QAAQ,EAClC,QAAA,EAAA,UAAU,CAAC,GAAG,CAAC,SAAS,IAAG;oBAC1B,QACEL,gCAAC,CAAAK,aAAM,CAAC,IAAI,IAEV,KAAK,EAAE,SAAS,CAAC,KAAK,EAAA,YAAA,EACV,UAAU,KAAK,CAAA,CAAA,EAAI,SAAS,CAAC,KAAK,CAAA,CAAE,YAE/C,kBAAkB,IAAI,SAAS,EAAE,cAAc;8BAC5C,SAAS,CAAC,cAAc;8BACxB,SAAS,CAAC,KAAK,EAAA,EANd,SAAS,CAAC,KAAK,CAOR,EACd;AACJ,iBAAC,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;AACJ;;;;"}

package/dist/components/filter-chip/filter-chip-operation.d.ts CHANGED Viewed

@@ -4,7 +4,8 @@ interface OperationProps {
     value?: FilterOperation;
     onChange: (operation: FilterOperation) => void;
     operations: FilterOperator<string>[];
+    showAlternateLabel?: boolean;
 }
-export declare const Operation: ({ label, value, onChange, operations }: OperationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Operation: ({ label, value, onChange, operations, showAlternateLabel }: OperationProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=filter-chip-operation.d.ts.map

package/dist/components/filter-chip/filter-chip-operation.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-chip-operation.d.ts","sourceRoot":"","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"names":[],"mappings":"~~AACA~~,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAKlE,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC;~~CACtC~~;AAED,eAAO,MAAM,SAAS,~~2CAKnB,~~cAAc,~~4CAiDhB~~,CAAC"}
1	+ {"version":3,"file":"filter-chip-operation.d.ts","sourceRoot":"","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAKlE,UAAU,cAAc;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,QAAQ,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IAC/C,UAAU,EAAE,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC;IACrC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,SAAS,+DAMnB,cAAc,4CA2DhB,CAAC"}

package/dist/components/filter-chip/filter-chip-operation.js CHANGED Viewed

@@ -1,10 +1,11 @@
 import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.js';
+import { cx } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
 import { useCallback } from 'react';
 import { Select } from '../select/select.js';
 import { Text } from '../text/text.js';
 import styles from './filter-chip.module.css.js';
-const Operation = ({ label, value, onChange, operations }) => {
+const Operation = ({ label, value, onChange, operations, showAlternateLabel = false }) => {
     const operationValue = value?.value ?? '';
     const handleValueChange = useCallback((newValue) => {
         const operation = operations.find(o => o.value === newValue);
@@ -12,9 +13,15 @@ const Operation = ({ label, value, onChange, operations }) => {
             onChange(operation);
     }, [operations, onChange]);
     if (operations.length === 1)
-        return (jsxRuntimeExports.jsx(Text, { variant: 'secondary', className: styles.selectValue, children: operations[0].label }));
-    return (jsxRuntimeExports.jsxs(Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntimeExports.jsx(Select.Trigger, { variant: 'text', className: styles.selectValue, "aria-label": `${label} filter operation`, children: jsxRuntimeExports.jsx(Select.Value, { placeholder: 'Select operation', className: styles.operationText }) }), jsxRuntimeExports.jsx(Select.Content, { "data-variant": 'filter', children: operations.map(operation => {
-                    return (jsxRuntimeExports.jsx(Select.Item, { value: operation.value, "aria-label": `Filter ${label} ${operation.label}`, children: operation.label }, operation.value));
+        return (jsxRuntimeExports.jsx(Text, { variant: 'secondary', className: cx(styles.selectValue, styles.operationValue), children: operations[0].label }));
+    return (jsxRuntimeExports.jsxs(Select, { value: operationValue, onValueChange: handleValueChange, "aria-labelledby": `${label}-label`, children: [jsxRuntimeExports.jsx(Select.Trigger, { variant: 'text', className: cx(styles.selectValue, styles.operationValue), "aria-label": `${label} filter operation`, iconProps: {
+                    style: {
+                        display: 'none'
+                    }
+                }, children: jsxRuntimeExports.jsx(Select.Value, { placeholder: 'Select operation', className: styles.operationText }) }), jsxRuntimeExports.jsx(Select.Content, { "data-variant": 'filter', children: operations.map(operation => {
+                    return (jsxRuntimeExports.jsx(Select.Item, { value: operation.value, "aria-label": `Filter ${label} ${operation.label}`, children: showAlternateLabel && operation?.alternateLabel
+                            ? operation.alternateLabel
+                            : operation.label }, operation.value));
                 }) })] }));
 };

package/dist/components/filter-chip/filter-chip-operation.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-chip-operation.js","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"sourcesContent":["import { useCallback } from 'react';\nimport { FilterOperation, FilterOperator } from '~/types/filters';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport styles from './filter-chip.module.css';\n\ninterface OperationProps {\n label: string;\n value?: FilterOperation;\n onChange: (operation: FilterOperation) => void;\n operations: FilterOperator<string>[];\n}\n\nexport const Operation = ({\n label,\n value,\n onChange,\n operations\n}: OperationProps) => {\n const operationValue = value?.value ?? '';\n\n const handleValueChange = useCallback(\n (newValue: string) => {\n const operation = operations.find(o => o.value === newValue);\n if (operation) onChange(operation);\n },\n [operations, onChange]\n );\n\n if (operations.length === 1)\n return (\n <Text variant='secondary' className={styles.selectValue}>\n {operations[0].label}\n </Text>\n );\n\n return (\n <Select\n value={operationValue}\n onValueChange={handleValueChange}\n aria-labelledby={`${label}-label`}\n >\n <Select.Trigger\n variant='text'\n className={styles.selectValue}\n aria-label={`${label} filter operation`}\n >\n <Select.Value\n placeholder='Select operation'\n className={styles.operationText}\n />\n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {operations.map(operation => {\n return (\n <Select.Item\n key={operation.value}\n value={operation.value}\n aria-label={`Filter ${label} ${operation.label}`}\n >\n {operation.label}\n </Select.Item>\n );\n })}\n </Select.Content>\n </Select>\n );\n};\n"],"names":["_jsx","_jsxs"],"mappings":"~~;;;;;;AAaO~~,~~MAAM~~,SAAS,GAAG,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,~~EACK~~,KAAI;AACnB,IAAA,MAAM,cAAc,GAAG,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC;AAE1C,IAAA,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;AAC7D,QAAA,IAAI,SAAS;YAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;AACrC,KAAC,EACD,CAAC,UAAU,EAAE,QAAQ,CAAC,CACvB,CAAC;AAEF,IAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC;~~QACzB~~,QACEA,~~sBAAC~~,IAAI,EAAA,~~EAAC~~,OAAO,EAAC,WAAW,~~EAAC~~,SAAS,EAAE,MAAM,CAAC,WAAW,~~EAAA~~,QAAA,~~EACpD~~,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,~~EACf~~,~~CAAA~~,EACP;AAEJ,IAAA,QACEC,~~sBAAA~~,~~CAAC~~,MAAM,~~EAAA~~,~~EACL,~~KAAK,EAAE,cAAc,EACrB,aAAa,EAAE,iBAAiB,EAAA,iBAAA,EACf,GAAG,KAAK,CAAA,MAAA,CAAQ,~~EAEjC~~,~~QAAA~~,~~EAAA~~,~~CAAAD,qBAAA,CAAC,~~MAAM,CAAC,OAAO,EAAA,EACb,OAAO,EAAC,MAAM,EACd,SAAS,EAAE,MAAM,CAAC,WAAW,~~EACjB~~,YAAA,EAAA,CAAA,EAAG,KAAK,~~CAAA~~,iBAAA,~~CAAmB~~,~~EAEvC~~,~~QAAA~~,~~EAAAA~~,qBAAA,~~CAAC~~,MAAM,CAAC,KAAK,EAAA,~~EACX,~~WAAW,EAAC,kBAAkB,EAC9B,SAAS,EAAE,MAAM,CAAC,aAAa,~~EAC~~/B,CAAA,~~EAAA,CACa,~~EACjBA,~~qBAAA~~,~~CAAC~~,MAAM,CAAC,OAAO,EAAc,EAAA,cAAA,EAAA,QAAQ,EAClC,QAAA,EAAA,UAAU,CAAC,GAAG,CAAC,SAAS,IAAG;~~AAC1B~~,~~oBAAA,~~QACEA,~~qBAAA~~,~~CAAC~~,MAAM,CAAC,IAAI,~~EAAA~~,~~EAEV,~~KAAK,EAAE,SAAS,CAAC,KAAK,EAAA,YAAA,EACV,~~CAAU~~,~~OAAA,EAAA,~~KAAK,~~CAAI~~,CAAA,~~EAAA~~,SAAS,CAAC,KAAK,~~CAAE,~~CAAA,~~EAAA~~,~~QAAA,EAE~~/C,SAAS,CAAC,KAAK,EAAA,~~EAJX~~,SAAS,CAAC,KAAK,~~CAKR~~,EACd;AACJ,iBAAC,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;AACJ;;;;"}
1	+ {"version":3,"file":"filter-chip-operation.js","sources":["../../../components/filter-chip/filter-chip-operation.tsx"],"sourcesContent":["import { cx } from 'class-variance-authority';\nimport { useCallback } from 'react';\nimport { FilterOperation, FilterOperator } from '~/types/filters';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport styles from './filter-chip.module.css';\n\ninterface OperationProps {\n label: string;\n value?: FilterOperation;\n onChange: (operation: FilterOperation) => void;\n operations: FilterOperator<string>[];\n showAlternateLabel?: boolean;\n}\n\nexport const Operation = ({\n label,\n value,\n onChange,\n operations,\n showAlternateLabel = false\n}: OperationProps) => {\n const operationValue = value?.value ?? '';\n\n const handleValueChange = useCallback(\n (newValue: string) => {\n const operation = operations.find(o => o.value === newValue);\n if (operation) onChange(operation);\n },\n [operations, onChange]\n );\n\n if (operations.length === 1)\n return (\n <Text\n variant='secondary'\n className={cx(styles.selectValue, styles.operationValue)}\n >\n {operations[0].label}\n </Text>\n );\n\n return (\n <Select\n value={operationValue}\n onValueChange={handleValueChange}\n aria-labelledby={`${label}-label`}\n >\n <Select.Trigger\n variant='text'\n className={cx(styles.selectValue, styles.operationValue)}\n aria-label={`${label} filter operation`}\n iconProps={{\n style: {\n display: 'none'\n }\n }}\n >\n <Select.Value\n placeholder='Select operation'\n className={styles.operationText}\n />\n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {operations.map(operation => {\n return (\n <Select.Item\n key={operation.value}\n value={operation.value}\n aria-label={`Filter ${label} ${operation.label}`}\n >\n {showAlternateLabel && operation?.alternateLabel\n ? operation.alternateLabel\n : operation.label}\n </Select.Item>\n );\n })}\n </Select.Content>\n </Select>\n );\n};\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;AAea,MAAA,SAAS,GAAG,CAAC,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,UAAU,EACV,kBAAkB,GAAG,KAAK,EACX,KAAI;AACnB,IAAA,MAAM,cAAc,GAAG,KAAK,EAAE,KAAK,IAAI,EAAE,CAAC;AAE1C,IAAA,MAAM,iBAAiB,GAAG,WAAW,CACnC,CAAC,QAAgB,KAAI;AACnB,QAAA,MAAM,SAAS,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC;AAC7D,QAAA,IAAI,SAAS;YAAE,QAAQ,CAAC,SAAS,CAAC,CAAC;AACrC,KAAC,EACD,CAAC,UAAU,EAAE,QAAQ,CAAC,CACvB,CAAC;AAEF,IAAA,IAAI,UAAU,CAAC,MAAM,KAAK,CAAC;AACzB,QAAA,QACEA,qBAAA,CAAC,IAAI,EAAA,EACH,OAAO,EAAC,WAAW,EACnB,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,cAAc,CAAC,EAEvD,QAAA,EAAA,UAAU,CAAC,CAAC,CAAC,CAAC,KAAK,EAAA,CACf,EACP;AAEJ,IAAA,QACEC,sBAAC,CAAA,MAAM,IACL,KAAK,EAAE,cAAc,EACrB,aAAa,EAAE,iBAAiB,EAAA,iBAAA,EACf,GAAG,KAAK,CAAA,MAAA,CAAQ,aAEjCD,qBAAC,CAAA,MAAM,CAAC,OAAO,EAAA,EACb,OAAO,EAAC,MAAM,EACd,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,cAAc,CAAC,EAC5C,YAAA,EAAA,CAAA,EAAG,KAAK,CAAmB,iBAAA,CAAA,EACvC,SAAS,EAAE;AACT,oBAAA,KAAK,EAAE;AACL,wBAAA,OAAO,EAAE,MAAM;AAChB,qBAAA;AACF,iBAAA,EAAA,QAAA,EAEDA,qBAAC,CAAA,MAAM,CAAC,KAAK,EACX,EAAA,WAAW,EAAC,kBAAkB,EAC9B,SAAS,EAAE,MAAM,CAAC,aAAa,EAAA,CAC/B,EACa,CAAA,EACjBA,qBAAC,CAAA,MAAM,CAAC,OAAO,EAAc,EAAA,cAAA,EAAA,QAAQ,EAClC,QAAA,EAAA,UAAU,CAAC,GAAG,CAAC,SAAS,IAAG;oBAC1B,QACEA,qBAAC,CAAA,MAAM,CAAC,IAAI,IAEV,KAAK,EAAE,SAAS,CAAC,KAAK,EAAA,YAAA,EACV,UAAU,KAAK,CAAA,CAAA,EAAI,SAAS,CAAC,KAAK,CAAA,CAAE,YAE/C,kBAAkB,IAAI,SAAS,EAAE,cAAc;8BAC5C,SAAS,CAAC,cAAc;8BACxB,SAAS,CAAC,KAAK,EAAA,EANd,SAAS,CAAC,KAAK,CAOR,EACd;AACJ,iBAAC,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;AACJ;;;;"}

package/dist/components/filter-chip/filter-chip.cjs CHANGED Viewed

@@ -37,6 +37,7 @@ const FilterChip = ({ label, value, onRemove, className, ref, columnType = filte
     const [operation, setOperation] = React.useState(computedOperations?.[0]);
     const [filterValue, setFilterValue] = React.useState(value || '');
     const showOnRemove = typeof onRemove === 'function';
+    const isMultiSelectColumn = columnType === filters.FilterType.multiselect;
     const handleOperationChange = React.useCallback((operation) => {
         setOperation(operation);
         if (operation?.value)
@@ -48,15 +49,22 @@ const FilterChip = ({ label, value, onRemove, className, ref, columnType = filte
     }, [operation, onValueChange]);
     const renderValueInput = () => {
         switch (columnType) {
+            case filters.FilterType.multiselect:
             case filters.FilterType.select:
-                return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: filterValue.toString(), onValueChange: handleFilterValueChange, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { variant: 'text', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.selectColumn), children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: 'Select value' }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": 'filter', children: options.map(opt => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
+                return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: isMultiSelectColumn ? filterValue : filterValue.toString(), onValueChange: handleFilterValueChange, multiple: isMultiSelectColumn, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { iconProps: {
+                                style: {
+                                    display: 'none'
+                                }
+                            }, variant: 'text', className: index.cx(filterChip_module.default.selectValue, filterChip_module.default.selectColumn), children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, { placeholder: 'Select value', children: isMultiSelectColumn && filterValue.length > 1
+                                    ? `${filterValue.length} selected`
+                                    : undefined }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Content, { "data-variant": 'filter', children: options.map(opt => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
             case filters.FilterType.date:
                 return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.dateFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(datePicker.DatePicker, { value: filterValue, onSelect: date => handleFilterValueChange(date), showCalendarIcon: false, inputFieldProps: { className: filterChip_module.default.dateField } }) }));
             default:
                 return (jsxRuntime.jsxRuntimeExports.jsx("div", { className: filterChip_module.default.textFieldWrapper, children: jsxRuntime.jsxRuntimeExports.jsx(textfield.TextField, { className: filterChip_module.default.textField, value: filterValue, onChange: e => handleFilterValueChange(e.target.value) }) }));
         }
     };
-    return (jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: 'center', ref: ref, className: chip({ variant, className }), role: 'group', "aria-label": `Filter by ${label}`, ...props, children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: 'center', gap: 2, className: filterChip_module.default['chip-label'], children: [leadingIcon && (jsxRuntime.jsxRuntimeExports.jsx("span", { className: filterChip_module.default.leadingIcon, "aria-hidden": 'true', children: leadingIcon })), jsxRuntime.jsxRuntimeExports.jsx(text.Text, { size: 2, weight: 'normal', children: label })] }), jsxRuntime.jsxRuntimeExports.jsx(filterChipOperation.Operation, { operations: computedOperations, label: label, value: operation, onChange: handleOperationChange }), renderValueInput(), showOnRemove && (jsxRuntime.jsxRuntimeExports.jsx("button", { className: filterChip_module.default.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.Cross1Icon, { className: filterChip_module.default.removeIcon }) }))] }));
+    return (jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: 'center', ref: ref, className: chip({ variant, className }), role: 'group', "aria-label": `Filter by ${label}`, ...props, children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: 'center', gap: 2, className: filterChip_module.default['chip-label'], children: [leadingIcon && (jsxRuntime.jsxRuntimeExports.jsx("span", { className: filterChip_module.default.leadingIcon, "aria-hidden": 'true', children: leadingIcon })), jsxRuntime.jsxRuntimeExports.jsx(text.Text, { size: 2, weight: 'normal', children: label })] }), jsxRuntime.jsxRuntimeExports.jsx(filterChipOperation.Operation, { operations: computedOperations, label: label, value: operation, onChange: handleOperationChange, showAlternateLabel: isMultiSelectColumn && filterValue.length <= 1 }), renderValueInput(), showOnRemove && (jsxRuntime.jsxRuntimeExports.jsx("button", { className: filterChip_module.default.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.Cross1Icon, { className: filterChip_module.default.removeIcon }) }))] }));
 };
 FilterChip.displayName = 'FilterChip';

package/dist/components/filter-chip/filter-chip.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-chip.cjs","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["import { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n FilterOperation,\n FilterOperator,\n FilterSelectOption,\n FilterType,\n FilterTypes,\n filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { TextField } from '../textfield';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n variants: {\n variant: {\n default: styles['chip-default'],\n text: null\n }\n },\n defaultVariants: {\n variant: 'default'\n }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n label: string;\n value?: string;\n onRemove?: () => void;\n className?: string;\n ref?: React.RefObject<HTMLDivElement>;\n children?: ReactNode;\n columnType?: FilterTypes;\n options?: FilterSelectOption[];\n onValueChange?: (value: any, operation: string) => void;\n onOperationChange?: (operation: string) => void;\n leadingIcon?: ReactElement;\n operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n label,\n value,\n onRemove,\n className,\n ref,\n columnType = FilterType.string,\n options = [],\n onValueChange,\n onOperationChange,\n leadingIcon,\n variant,\n operations,\n ...props\n}: FilterChipProps) => {\n const computedOperations = operations?.length\n ? operations\n : filterOperators[columnType];\n\n const [operation, setOperation] = useState<FilterOperation \| undefined>(\n computedOperations?.[0]\n );\n const [filterValue, setFilterValue] = useState<any>(value \|\| '');\n\n const showOnRemove = typeof onRemove === 'function';\n\n const handleOperationChange = useCallback(\n (operation: FilterOperation) => {\n setOperation(operation);\n if (operation?.value) onOperationChange?.(operation.value);\n },\n [onOperationChange]\n );\n\n const handleFilterValueChange = useCallback(\n (value: any) => {\n setFilterValue(value);\n onValueChange?.(value, operation?.value ?? '');\n },\n [operation, onValueChange]\n );\n\n const renderValueInput = () => {\n switch (columnType) {\n case FilterType.select:\n return (\n <Select\n value={filterValue.toString()}\n onValueChange={handleFilterValueChange}\n >\n <Select.Trigger\n variant='text'\n className={cx(styles.selectValue, styles.selectColumn)}\n >\n <Select.Value placeholder='Select value' ~~/>\~~n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {options.map(opt => (\n <Select.Item\n key={opt.value.toString()}\n value={opt.value.toString()}\n >\n {opt.label}\n </Select.Item>\n ))}\n </Select.Content>\n </Select>\n );\n case FilterType.date:\n return (\n <div className={styles.dateFieldWrapper}>\n <DatePicker\n value={filterValue}\n onSelect={date => handleFilterValueChange(date)}\n showCalendarIcon={false}\n inputFieldProps={{ className: styles.dateField }}\n />\n </div>\n );\n default:\n return (\n <div className={styles.textFieldWrapper}>\n <TextField\n className={styles.textField}\n value={filterValue}\n onChange={e => handleFilterValueChange(e.target.value)}\n />\n </div>\n );\n }\n };\n\n return (\n <Flex\n align='center'\n ref={ref}\n className={chip({ variant, className })}\n role='group'\n aria-label={`Filter by ${label}`}\n {...props}\n >\n <Flex align='center' gap={2} className={styles['chip-label']}>\n {leadingIcon && (\n <span className={styles.leadingIcon} aria-hidden='true'>\n {leadingIcon}\n </span>\n )}\n <Text size={2} weight='normal'>\n {label}\n </Text>\n </Flex>\n <Operation\n operations={computedOperations}\n label={label}\n value={operation}\n onChange={handleOperationChange}\n />\n {renderValueInput()}\n {showOnRemove && (\n <button\n className={styles.removeIconContainer}\n aria-label={`Remove ${label} filter`}\n onClick={onRemove}\n >\n <Cross1Icon className={styles.removeIcon} />\n </button>\n )}\n </Flex>\n );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":["cva","styles","FilterType","filterOperators","useState","useCallback","_jsxs","Select","_jsx","cx","DatePicker","TextField","Flex","Text","Operation","Cross1Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,IAAI,GAAGA,SAAG,CAACC,yBAAM,CAAC,IAAI,EAAE;AAC5B,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAEA,yBAAM,CAAC,cAAc,CAAC;AAC/B,YAAA,IAAI,EAAE,IAAI;AACX,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,OAAO,EAAE,SAAS;AACnB,KAAA;AACF,CAAA,CAAC,CAAC;AAiBU,MAAA,UAAU,GAAG,CAAC,EACzB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,EACH,UAAU,GAAGC,kBAAU,CAAC,MAAM,EAC9B,OAAO,GAAG,EAAE,EACZ,aAAa,EACb,iBAAiB,EACjB,WAAW,EACX,OAAO,EACP,UAAU,EACV,GAAG,KAAK,EACQ,KAAI;AACpB,IAAA,MAAM,kBAAkB,GAAG,UAAU,EAAE,MAAM;AAC3C,UAAE,UAAU;AACZ,UAAEC,uBAAe,CAAC,UAAU,CAAC,CAAC;AAEhC,IAAA,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAGC,cAAQ,CACxC,kBAAkB,GAAG,CAAC,CAAC,CACxB,CAAC;AACF,IAAA,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGA,cAAQ,CAAM,KAAK,IAAI,EAAE,CAAC,CAAC;AAEjE,IAAA,MAAM,YAAY,GAAG,OAAO,QAAQ,KAAK,UAAU,CAAC;~~AAEpD~~,IAAA,MAAM,qBAAqB,~~GAAGC~~,iBAAW,CACvC,CAAC,SAA0B,KAAI;QAC7B,YAAY,CAAC,SAAS,CAAC,CAAC;QACxB,IAAI,SAAS,EAAE,KAAK;AAAE,YAAA,iBAAiB,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;AAC7D,KAAC,EACD,CAAC,iBAAiB,CAAC,CACpB,CAAC;AAEF,IAAA,MAAM,uBAAuB,GAAGA,iBAAW,CACzC,CAAC,KAAU,KAAI;QACb,cAAc,CAAC,KAAK,CAAC,CAAC;QACtB,aAAa,GAAG,KAAK,EAAE,SAAS,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC;AACjD,KAAC,EACD,CAAC,SAAS,EAAE,aAAa,CAAC,CAC3B,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAK;QAC5B,QAAQ,UAAU;YAChB,KAAKH,kBAAU,CAAC,MAAM;~~gBACpB~~,QACEI,~~kCAACC~~,aAAM,EAAA,EACL,KAAK,EAAE,WAAW,CAAC,QAAQ,EAAE,~~EAC7B~~,aAAa,EAAE,uBAAuB,~~EAEtC~~,QAAA,EAAA,~~CAAAC~~,~~gCAAA~~,~~CAACD,~~aAAM,CAAC,OAAO,~~IACb~~,OAAO,EAAC,MAAM,EACd,SAAS,EAAEE,QAAE,CAACR,yBAAM,CAAC,WAAW,EAAEA,yBAAM,CAAC,YAAY,CAAC,~~EAAA~~,QAAA,~~EAEtDO~~,~~iCAACD~~,aAAM,CAAC,KAAK,EAAC,~~EAAA,~~WAAW,EAAC,cAAc,EAAG,CAAA,EAAA,~~CAC5B~~,EACjBC,gCAAC,CAAAD,aAAM,CAAC,OAAO,~~EAAA~~,EAAA,cAAA,~~EAAc~~,QAAQ,~~EAClC~~,~~QAAA,EAAA,~~OAAO,CAAC,GAAG,CAAC,GAAG,KACdC,~~gCAAA~~,~~CAACD~~,aAAM,CAAC,IAAI,IAEV,KAAK,EAAE,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,~~YAE1B~~,GAAG,CAAC,KAAK,EAHL,~~EAAA,~~GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,CAIb,CACf,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;YACJ,KAAKL,kBAAU,CAAC,IAAI;AAClB,gBAAA,QACEM,gCAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEP,yBAAM,CAAC,gBAAgB,EACrC,QAAA,EAAAO,gCAAA,CAACE,qBAAU,EACT,EAAA,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,IAAI,IAAI,uBAAuB,CAAC,IAAI,CAAC,EAC/C,gBAAgB,EAAE,KAAK,EACvB,eAAe,EAAE,EAAE,SAAS,EAAET,yBAAM,CAAC,SAAS,EAAE,EAChD,CAAA,EAAA,CACE,EACN;AACJ,YAAA;AACE,gBAAA,QACEO,gCAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEP,yBAAM,CAAC,gBAAgB,EAAA,QAAA,EACrCO,gCAAC,CAAAG,mBAAS,IACR,SAAS,EAAEV,yBAAM,CAAC,SAAS,EAC3B,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,CAAC,IAAI,uBAAuB,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,CAAA,EAAA,CACE,EACN;SACL;AACH,KAAC,CAAC;AAEF,IAAA,QACEK,iCAAA,CAACM,SAAI,EAAA,EACH,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,EACvC,IAAI,EAAC,OAAO,~~EACA~~,YAAA,~~EAAA~~,~~CAAA~~,~~UAAA,EAAa,~~KAAK,CAAA,CAAE,~~KAC5B~~,KAAK,~~EAAA~~,~~QAAA,EAAA,CAETN,~~iCAAC,CAAAM,SAAI,EAAC,EAAA,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,SAAS,EAAEX,yBAAM,CAAC,YAAY,CAAC,~~EACzD~~,QAAA,EAAA,~~CAAA~~,WAAW,KACVO,gCAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAEP,yBAAM,CAAC,WAAW,~~EAAA~~,~~aAAA,EAAc,~~MAAM,EAAA,QAAA,EACpD,WAAW,EAAA,CACP,CACR,EACDO,gCAAA,CAACK,SAAI,EAAA,EAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAC,QAAQ,~~EAAA~~,QAAA,~~EAC3B~~,KAAK,~~EAAA~~,~~CACD,~~CACF,EAAA,CAAA,EACPL,~~iCAACM~~,6BAAS,EAAA,~~EACR,~~UAAU,EAAE,kBAAkB,EAC9B,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,qBAAqB,~~GAC~~/B,EACD,gBAAgB,EAAE,EAClB,YAAY,KACXN,gCAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAEP,yBAAM,CAAC,mBAAmB,~~EAAA~~,YAAA,~~EACzB~~,~~CAAU~~,OAAA,~~EAAA~~,KAAK,~~SAAS~~,EACpC,OAAO,EAAE,QAAQ,~~EAEjB~~,QAAA,~~EAAAO~~,~~gCAAA~~,~~CAACO~~,yBAAU,~~EAAA~~,~~EAAC,~~SAAS,EAAEd,yBAAM,CAAC,UAAU,EAAI,CAAA,EAAA,CACrC,CACV,CAAA,EAAA,CACI,EACP;AACJ,EAAE;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
1	+ {"version":3,"file":"filter-chip.cjs","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["import { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n FilterOperation,\n FilterOperator,\n FilterSelectOption,\n FilterType,\n FilterTypes,\n filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { TextField } from '../textfield';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n variants: {\n variant: {\n default: styles['chip-default'],\n text: null\n }\n },\n defaultVariants: {\n variant: 'default'\n }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n label: string;\n value?: string;\n onRemove?: () => void;\n className?: string;\n ref?: React.RefObject<HTMLDivElement>;\n children?: ReactNode;\n columnType?: FilterTypes;\n options?: FilterSelectOption[];\n onValueChange?: (value: any, operation: string) => void;\n onOperationChange?: (operation: string) => void;\n leadingIcon?: ReactElement;\n operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n label,\n value,\n onRemove,\n className,\n ref,\n columnType = FilterType.string,\n options = [],\n onValueChange,\n onOperationChange,\n leadingIcon,\n variant,\n operations,\n ...props\n}: FilterChipProps) => {\n const computedOperations = operations?.length\n ? operations\n : filterOperators[columnType];\n\n const [operation, setOperation] = useState<FilterOperation \| undefined>(\n computedOperations?.[0]\n );\n const [filterValue, setFilterValue] = useState<any>(value \|\| '');\n\n const showOnRemove = typeof onRemove === 'function';\n const isMultiSelectColumn = columnType === FilterType.multiselect;\n\n const handleOperationChange = useCallback(\n (operation: FilterOperation) => {\n setOperation(operation);\n if (operation?.value) onOperationChange?.(operation.value);\n },\n [onOperationChange]\n );\n\n const handleFilterValueChange = useCallback(\n (value: any) => {\n setFilterValue(value);\n onValueChange?.(value, operation?.value ?? '');\n },\n [operation, onValueChange]\n );\n\n const renderValueInput = () => {\n switch (columnType) {\n case FilterType.multiselect:\n case FilterType.select:\n return (\n <Select\n value={isMultiSelectColumn ? filterValue : filterValue.toString()}\n onValueChange={handleFilterValueChange}\n multiple={isMultiSelectColumn}\n >\n <Select.Trigger\n iconProps={{\n style: {\n display: 'none'\n }\n }}\n variant='text'\n className={cx(styles.selectValue, styles.selectColumn)}\n >\n <Select.Value placeholder='Select value'>\n {isMultiSelectColumn && filterValue.length > 1\n ? `${filterValue.length} selected`\n : undefined}\n </Select.Value>\n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {options.map(opt => (\n <Select.Item\n key={opt.value.toString()}\n value={opt.value.toString()}\n >\n {opt.label}\n </Select.Item>\n ))}\n </Select.Content>\n </Select>\n );\n case FilterType.date:\n return (\n <div className={styles.dateFieldWrapper}>\n <DatePicker\n value={filterValue}\n onSelect={date => handleFilterValueChange(date)}\n showCalendarIcon={false}\n inputFieldProps={{ className: styles.dateField }}\n />\n </div>\n );\n default:\n return (\n <div className={styles.textFieldWrapper}>\n <TextField\n className={styles.textField}\n value={filterValue}\n onChange={e => handleFilterValueChange(e.target.value)}\n />\n </div>\n );\n }\n };\n\n return (\n <Flex\n align='center'\n ref={ref}\n className={chip({ variant, className })}\n role='group'\n aria-label={`Filter by ${label}`}\n {...props}\n >\n <Flex align='center' gap={2} className={styles['chip-label']}>\n {leadingIcon && (\n <span className={styles.leadingIcon} aria-hidden='true'>\n {leadingIcon}\n </span>\n )}\n <Text size={2} weight='normal'>\n {label}\n </Text>\n </Flex>\n <Operation\n operations={computedOperations}\n label={label}\n value={operation}\n onChange={handleOperationChange}\n showAlternateLabel={isMultiSelectColumn && filterValue.length <= 1}\n />\n {renderValueInput()}\n {showOnRemove && (\n <button\n className={styles.removeIconContainer}\n aria-label={`Remove ${label} filter`}\n onClick={onRemove}\n >\n <Cross1Icon className={styles.removeIcon} />\n </button>\n )}\n </Flex>\n );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":["cva","styles","FilterType","filterOperators","useState","useCallback","_jsxs","Select","_jsx","cx","DatePicker","TextField","Flex","Text","Operation","Cross1Icon"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,IAAI,GAAGA,SAAG,CAACC,yBAAM,CAAC,IAAI,EAAE;AAC5B,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAEA,yBAAM,CAAC,cAAc,CAAC;AAC/B,YAAA,IAAI,EAAE,IAAI;AACX,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,OAAO,EAAE,SAAS;AACnB,KAAA;AACF,CAAA,CAAC,CAAC;AAiBU,MAAA,UAAU,GAAG,CAAC,EACzB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,EACH,UAAU,GAAGC,kBAAU,CAAC,MAAM,EAC9B,OAAO,GAAG,EAAE,EACZ,aAAa,EACb,iBAAiB,EACjB,WAAW,EACX,OAAO,EACP,UAAU,EACV,GAAG,KAAK,EACQ,KAAI;AACpB,IAAA,MAAM,kBAAkB,GAAG,UAAU,EAAE,MAAM;AAC3C,UAAE,UAAU;AACZ,UAAEC,uBAAe,CAAC,UAAU,CAAC,CAAC;AAEhC,IAAA,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAGC,cAAQ,CACxC,kBAAkB,GAAG,CAAC,CAAC,CACxB,CAAC;AACF,IAAA,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAGA,cAAQ,CAAM,KAAK,IAAI,EAAE,CAAC,CAAC;AAEjE,IAAA,MAAM,YAAY,GAAG,OAAO,QAAQ,KAAK,UAAU,CAAC;AACpD,IAAA,MAAM,mBAAmB,GAAG,UAAU,KAAKF,kBAAU,CAAC,WAAW,CAAC;AAElE,IAAA,MAAM,qBAAqB,GAAGG,iBAAW,CACvC,CAAC,SAA0B,KAAI;QAC7B,YAAY,CAAC,SAAS,CAAC,CAAC;QACxB,IAAI,SAAS,EAAE,KAAK;AAAE,YAAA,iBAAiB,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;AAC7D,KAAC,EACD,CAAC,iBAAiB,CAAC,CACpB,CAAC;AAEF,IAAA,MAAM,uBAAuB,GAAGA,iBAAW,CACzC,CAAC,KAAU,KAAI;QACb,cAAc,CAAC,KAAK,CAAC,CAAC;QACtB,aAAa,GAAG,KAAK,EAAE,SAAS,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC;AACjD,KAAC,EACD,CAAC,SAAS,EAAE,aAAa,CAAC,CAC3B,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAK;QAC5B,QAAQ,UAAU;YAChB,KAAKH,kBAAU,CAAC,WAAW,CAAC;YAC5B,KAAKA,kBAAU,CAAC,MAAM;AACpB,gBAAA,QACEI,iCAAA,CAACC,aAAM,EAAA,EACL,KAAK,EAAE,mBAAmB,GAAG,WAAW,GAAG,WAAW,CAAC,QAAQ,EAAE,EACjE,aAAa,EAAE,uBAAuB,EACtC,QAAQ,EAAE,mBAAmB,EAAA,QAAA,EAAA,CAE7BC,iCAACD,aAAM,CAAC,OAAO,EAAA,EACb,SAAS,EAAE;AACT,gCAAA,KAAK,EAAE;AACL,oCAAA,OAAO,EAAE,MAAM;AAChB,iCAAA;AACF,6BAAA,EACD,OAAO,EAAC,MAAM,EACd,SAAS,EAAEE,QAAE,CAACR,yBAAM,CAAC,WAAW,EAAEA,yBAAM,CAAC,YAAY,CAAC,EAEtD,QAAA,EAAAO,gCAAA,CAACD,aAAM,CAAC,KAAK,EAAA,EAAC,WAAW,EAAC,cAAc,EACrC,QAAA,EAAA,mBAAmB,IAAI,WAAW,CAAC,MAAM,GAAG,CAAC;AAC5C,sCAAE,CAAA,EAAG,WAAW,CAAC,MAAM,CAAW,SAAA,CAAA;sCAChC,SAAS,EACA,CAAA,EAAA,CACA,EACjBC,gCAAC,CAAAD,aAAM,CAAC,OAAO,EAAc,EAAA,cAAA,EAAA,QAAQ,YAClC,OAAO,CAAC,GAAG,CAAC,GAAG,KACdC,gCAAC,CAAAD,aAAM,CAAC,IAAI,IAEV,KAAK,EAAE,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAA,QAAA,EAE1B,GAAG,CAAC,KAAK,EAAA,EAHL,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,CAIb,CACf,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;YACJ,KAAKL,kBAAU,CAAC,IAAI;AAClB,gBAAA,QACEM,gCAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEP,yBAAM,CAAC,gBAAgB,EACrC,QAAA,EAAAO,gCAAA,CAACE,qBAAU,EACT,EAAA,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,IAAI,IAAI,uBAAuB,CAAC,IAAI,CAAC,EAC/C,gBAAgB,EAAE,KAAK,EACvB,eAAe,EAAE,EAAE,SAAS,EAAET,yBAAM,CAAC,SAAS,EAAE,EAChD,CAAA,EAAA,CACE,EACN;AACJ,YAAA;AACE,gBAAA,QACEO,gCAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEP,yBAAM,CAAC,gBAAgB,EAAA,QAAA,EACrCO,gCAAC,CAAAG,mBAAS,IACR,SAAS,EAAEV,yBAAM,CAAC,SAAS,EAC3B,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,CAAC,IAAI,uBAAuB,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,CAAA,EAAA,CACE,EACN;SACL;AACH,KAAC,CAAC;AAEF,IAAA,QACEK,iCAAA,CAACM,SAAI,EAAA,EACH,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,EACvC,IAAI,EAAC,OAAO,EAAA,YAAA,EACA,aAAa,KAAK,CAAA,CAAE,EAC5B,GAAA,KAAK,aAETN,iCAAC,CAAAM,SAAI,EAAC,EAAA,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,SAAS,EAAEX,yBAAM,CAAC,YAAY,CAAC,EAAA,QAAA,EAAA,CACzD,WAAW,KACVO,gCAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAEP,yBAAM,CAAC,WAAW,iBAAc,MAAM,EAAA,QAAA,EACpD,WAAW,EAAA,CACP,CACR,EACDO,gCAAA,CAACK,SAAI,EAAA,EAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAC,QAAQ,EAC3B,QAAA,EAAA,KAAK,GACD,CACF,EAAA,CAAA,EACPL,gCAAC,CAAAM,6BAAS,EACR,EAAA,UAAU,EAAE,kBAAkB,EAC9B,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,qBAAqB,EAC/B,kBAAkB,EAAE,mBAAmB,IAAI,WAAW,CAAC,MAAM,IAAI,CAAC,EAClE,CAAA,EACD,gBAAgB,EAAE,EAClB,YAAY,KACXN,gCAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAEP,yBAAM,CAAC,mBAAmB,EACzB,YAAA,EAAA,CAAA,OAAA,EAAU,KAAK,CAAS,OAAA,CAAA,EACpC,OAAO,EAAE,QAAQ,EAAA,QAAA,EAEjBO,gCAAC,CAAAO,yBAAU,IAAC,SAAS,EAAEd,yBAAM,CAAC,UAAU,EAAI,CAAA,EAAA,CACrC,CACV,CAAA,EAAA,CACI,EACP;AACJ,EAAE;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}

package/dist/components/filter-chip/filter-chip.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-chip.d.ts","sourceRoot":"","sources":["../../../components/filter-chip/filter-chip.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAW,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAyB,MAAM,OAAO,CAAC;AACvE,OAAO,EAEL,cAAc,EACd,kBAAkB,EAElB,WAAW,EAEZ,MAAM,iBAAiB,CAAC;AASzB,QAAA,MAAM,IAAI;;8EAUR,CAAC;AAEH,MAAM,WAAW,eAAgB,SAAQ,YAAY,CAAC,OAAO,IAAI,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC/B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACxD,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,UAAU,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC;CACvC;AAED,eAAO,MAAM,UAAU;oJAcpB,eAAe;;~~CAmHjB~~,CAAC"}
1	+ {"version":3,"file":"filter-chip.d.ts","sourceRoot":"","sources":["../../../components/filter-chip/filter-chip.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAW,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,SAAS,EAAyB,MAAM,OAAO,CAAC;AACvE,OAAO,EAEL,cAAc,EACd,kBAAkB,EAElB,WAAW,EAEZ,MAAM,iBAAiB,CAAC;AASzB,QAAA,MAAM,IAAI;;8EAUR,CAAC;AAEH,MAAM,WAAW,eAAgB,SAAQ,YAAY,CAAC,OAAO,IAAI,CAAC;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,GAAG,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IACtC,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,CAAC,EAAE,WAAW,CAAC;IACzB,OAAO,CAAC,EAAE,kBAAkB,EAAE,CAAC;IAC/B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IACxD,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAChD,WAAW,CAAC,EAAE,YAAY,CAAC;IAC3B,UAAU,CAAC,EAAE,cAAc,CAAC,MAAM,CAAC,EAAE,CAAC;CACvC;AAED,eAAO,MAAM,UAAU;oJAcpB,eAAe;;CAgIjB,CAAC"}

package/dist/components/filter-chip/filter-chip.js CHANGED Viewed

@@ -35,6 +35,7 @@ const FilterChip = ({ label, value, onRemove, className, ref, columnType = Filte
     const [operation, setOperation] = useState(computedOperations?.[0]);
     const [filterValue, setFilterValue] = useState(value || '');
     const showOnRemove = typeof onRemove === 'function';
+    const isMultiSelectColumn = columnType === FilterType.multiselect;
     const handleOperationChange = useCallback((operation) => {
         setOperation(operation);
         if (operation?.value)
@@ -46,15 +47,22 @@ const FilterChip = ({ label, value, onRemove, className, ref, columnType = Filte
     }, [operation, onValueChange]);
     const renderValueInput = () => {
         switch (columnType) {
+            case FilterType.multiselect:
             case FilterType.select:
-                return (jsxRuntimeExports.jsxs(Select, { value: filterValue.toString(), onValueChange: handleFilterValueChange, children: [jsxRuntimeExports.jsx(Select.Trigger, { variant: 'text', className: cx(styles.selectValue, styles.selectColumn), children: jsxRuntimeExports.jsx(Select.Value, { placeholder: 'Select value' }) }), jsxRuntimeExports.jsx(Select.Content, { "data-variant": 'filter', children: options.map(opt => (jsxRuntimeExports.jsx(Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
+                return (jsxRuntimeExports.jsxs(Select, { value: isMultiSelectColumn ? filterValue : filterValue.toString(), onValueChange: handleFilterValueChange, multiple: isMultiSelectColumn, children: [jsxRuntimeExports.jsx(Select.Trigger, { iconProps: {
+                                style: {
+                                    display: 'none'
+                                }
+                            }, variant: 'text', className: cx(styles.selectValue, styles.selectColumn), children: jsxRuntimeExports.jsx(Select.Value, { placeholder: 'Select value', children: isMultiSelectColumn && filterValue.length > 1
+                                    ? `${filterValue.length} selected`
+                                    : undefined }) }), jsxRuntimeExports.jsx(Select.Content, { "data-variant": 'filter', children: options.map(opt => (jsxRuntimeExports.jsx(Select.Item, { value: opt.value.toString(), children: opt.label }, opt.value.toString()))) })] }));
             case FilterType.date:
                 return (jsxRuntimeExports.jsx("div", { className: styles.dateFieldWrapper, children: jsxRuntimeExports.jsx(DatePicker, { value: filterValue, onSelect: date => handleFilterValueChange(date), showCalendarIcon: false, inputFieldProps: { className: styles.dateField } }) }));
             default:
                 return (jsxRuntimeExports.jsx("div", { className: styles.textFieldWrapper, children: jsxRuntimeExports.jsx(TextField, { className: styles.textField, value: filterValue, onChange: e => handleFilterValueChange(e.target.value) }) }));
         }
     };
-    return (jsxRuntimeExports.jsxs(Flex, { align: 'center', ref: ref, className: chip({ variant, className }), role: 'group', "aria-label": `Filter by ${label}`, ...props, children: [jsxRuntimeExports.jsxs(Flex, { align: 'center', gap: 2, className: styles['chip-label'], children: [leadingIcon && (jsxRuntimeExports.jsx("span", { className: styles.leadingIcon, "aria-hidden": 'true', children: leadingIcon })), jsxRuntimeExports.jsx(Text, { size: 2, weight: 'normal', children: label })] }), jsxRuntimeExports.jsx(Operation, { operations: computedOperations, label: label, value: operation, onChange: handleOperationChange }), renderValueInput(), showOnRemove && (jsxRuntimeExports.jsx("button", { className: styles.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntimeExports.jsx(Cross1Icon, { className: styles.removeIcon }) }))] }));
+    return (jsxRuntimeExports.jsxs(Flex, { align: 'center', ref: ref, className: chip({ variant, className }), role: 'group', "aria-label": `Filter by ${label}`, ...props, children: [jsxRuntimeExports.jsxs(Flex, { align: 'center', gap: 2, className: styles['chip-label'], children: [leadingIcon && (jsxRuntimeExports.jsx("span", { className: styles.leadingIcon, "aria-hidden": 'true', children: leadingIcon })), jsxRuntimeExports.jsx(Text, { size: 2, weight: 'normal', children: label })] }), jsxRuntimeExports.jsx(Operation, { operations: computedOperations, label: label, value: operation, onChange: handleOperationChange, showAlternateLabel: isMultiSelectColumn && filterValue.length <= 1 }), renderValueInput(), showOnRemove && (jsxRuntimeExports.jsx("button", { className: styles.removeIconContainer, "aria-label": `Remove ${label} filter`, onClick: onRemove, children: jsxRuntimeExports.jsx(Cross1Icon, { className: styles.removeIcon }) }))] }));
 };
 FilterChip.displayName = 'FilterChip';

package/dist/components/filter-chip/filter-chip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"filter-chip.js","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["import { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n FilterOperation,\n FilterOperator,\n FilterSelectOption,\n FilterType,\n FilterTypes,\n filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { TextField } from '../textfield';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n variants: {\n variant: {\n default: styles['chip-default'],\n text: null\n }\n },\n defaultVariants: {\n variant: 'default'\n }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n label: string;\n value?: string;\n onRemove?: () => void;\n className?: string;\n ref?: React.RefObject<HTMLDivElement>;\n children?: ReactNode;\n columnType?: FilterTypes;\n options?: FilterSelectOption[];\n onValueChange?: (value: any, operation: string) => void;\n onOperationChange?: (operation: string) => void;\n leadingIcon?: ReactElement;\n operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n label,\n value,\n onRemove,\n className,\n ref,\n columnType = FilterType.string,\n options = [],\n onValueChange,\n onOperationChange,\n leadingIcon,\n variant,\n operations,\n ...props\n}: FilterChipProps) => {\n const computedOperations = operations?.length\n ? operations\n : filterOperators[columnType];\n\n const [operation, setOperation] = useState<FilterOperation \| undefined>(\n computedOperations?.[0]\n );\n const [filterValue, setFilterValue] = useState<any>(value \|\| '');\n\n const showOnRemove = typeof onRemove === 'function';\n\n const handleOperationChange = useCallback(\n (operation: FilterOperation) => {\n setOperation(operation);\n if (operation?.value) onOperationChange?.(operation.value);\n },\n [onOperationChange]\n );\n\n const handleFilterValueChange = useCallback(\n (value: any) => {\n setFilterValue(value);\n onValueChange?.(value, operation?.value ?? '');\n },\n [operation, onValueChange]\n );\n\n const renderValueInput = () => {\n switch (columnType) {\n case FilterType.select:\n return (\n <Select\n value={filterValue.toString()}\n onValueChange={handleFilterValueChange}\n >\n <Select.Trigger\n variant='text'\n className={cx(styles.selectValue, styles.selectColumn)}\n >\n <Select.Value placeholder='Select value' ~~/>\~~n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {options.map(opt => (\n <Select.Item\n key={opt.value.toString()}\n value={opt.value.toString()}\n >\n {opt.label}\n </Select.Item>\n ))}\n </Select.Content>\n </Select>\n );\n case FilterType.date:\n return (\n <div className={styles.dateFieldWrapper}>\n <DatePicker\n value={filterValue}\n onSelect={date => handleFilterValueChange(date)}\n showCalendarIcon={false}\n inputFieldProps={{ className: styles.dateField }}\n />\n </div>\n );\n default:\n return (\n <div className={styles.textFieldWrapper}>\n <TextField\n className={styles.textField}\n value={filterValue}\n onChange={e => handleFilterValueChange(e.target.value)}\n />\n </div>\n );\n }\n };\n\n return (\n <Flex\n align='center'\n ref={ref}\n className={chip({ variant, className })}\n role='group'\n aria-label={`Filter by ${label}`}\n {...props}\n >\n <Flex align='center' gap={2} className={styles['chip-label']}>\n {leadingIcon && (\n <span className={styles.leadingIcon} aria-hidden='true'>\n {leadingIcon}\n </span>\n )}\n <Text size={2} weight='normal'>\n {label}\n </Text>\n </Flex>\n <Operation\n operations={computedOperations}\n label={label}\n value={operation}\n onChange={handleOperationChange}\n />\n {renderValueInput()}\n {showOnRemove && (\n <button\n className={styles.removeIconContainer}\n aria-label={`Remove ${label} filter`}\n onClick={onRemove}\n >\n <Cross1Icon className={styles.removeIcon} />\n </button>\n )}\n </Flex>\n );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;AAmBA,MAAM,IAAI,GAAG,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE;AAC5B,IAAA,QAAQ,EAAE;AACR,QAAA,OAAO,EAAE;AACP,YAAA,OAAO,EAAE,MAAM,CAAC,cAAc,CAAC;AAC/B,YAAA,IAAI,EAAE,IAAI;AACX,SAAA;AACF,KAAA;AACD,IAAA,eAAe,EAAE;AACf,QAAA,OAAO,EAAE,SAAS;AACnB,KAAA;AACF,CAAA,CAAC,CAAC;AAiBU,MAAA,UAAU,GAAG,CAAC,EACzB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,SAAS,EACT,GAAG,EACH,UAAU,GAAG,UAAU,CAAC,MAAM,EAC9B,OAAO,GAAG,EAAE,EACZ,aAAa,EACb,iBAAiB,EACjB,WAAW,EACX,OAAO,EACP,UAAU,EACV,GAAG,KAAK,EACQ,KAAI;AACpB,IAAA,MAAM,kBAAkB,GAAG,UAAU,EAAE,MAAM;AAC3C,UAAE,UAAU;AACZ,UAAE,eAAe,CAAC,UAAU,CAAC,CAAC;AAEhC,IAAA,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CACxC,kBAAkB,GAAG,CAAC,CAAC,CACxB,CAAC;AACF,IAAA,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAM,KAAK,IAAI,EAAE,CAAC,CAAC;AAEjE,IAAA,MAAM,YAAY,GAAG,OAAO,QAAQ,KAAK,UAAU,CAAC;~~AAEpD~~,IAAA,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,SAA0B,KAAI;QAC7B,YAAY,CAAC,SAAS,CAAC,CAAC;QACxB,IAAI,SAAS,EAAE,KAAK;AAAE,YAAA,iBAAiB,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC;AAC7D,KAAC,EACD,CAAC,iBAAiB,CAAC,CACpB,CAAC;AAEF,IAAA,MAAM,uBAAuB,GAAG,WAAW,CACzC,CAAC,KAAU,KAAI;QACb,cAAc,CAAC,KAAK,CAAC,CAAC;QACtB,aAAa,GAAG,KAAK,EAAE,SAAS,EAAE,KAAK,IAAI,EAAE,CAAC,CAAC;AACjD,KAAC,EACD,CAAC,SAAS,EAAE,aAAa,CAAC,CAC3B,CAAC;IAEF,MAAM,gBAAgB,GAAG,MAAK;QAC5B,QAAQ,UAAU;YAChB,KAAK,UAAU,CAAC,MAAM;~~gBACpB~~,QACEA,~~uBAAC~~,MAAM,EAAA,EACL,KAAK,EAAE,WAAW,CAAC,QAAQ,EAAE,~~EAC7B~~,aAAa,EAAE,uBAAuB,~~EAEtC~~,QAAA,EAAA,~~CAAAC~~,~~qBAAA~~,~~CAAC,~~MAAM,CAAC,OAAO,~~IACb~~,OAAO,EAAC,MAAM,EACd,SAAS,EAAE,EAAE,CAAC,MAAM,CAAC,WAAW,EAAE,MAAM,CAAC,YAAY,CAAC,~~EAAA~~,QAAA,~~EAEtDA~~,~~sBAAC~~,MAAM,CAAC,KAAK,EAAC,~~EAAA,~~WAAW,EAAC,cAAc,EAAG,CAAA,EAAA,~~CAC5B~~,EACjBA,qBAAC,CAAA,MAAM,CAAC,OAAO,~~EAAA~~,EAAA,cAAA,~~EAAc~~,QAAQ,~~EAClC~~,~~QAAA,EAAA,~~OAAO,CAAC,GAAG,CAAC,GAAG,KACdA,~~qBAAA~~,~~CAAC~~,MAAM,CAAC,IAAI,IAEV,KAAK,EAAE,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,~~YAE1B~~,GAAG,CAAC,KAAK,EAHL,~~EAAA,~~GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,CAIb,CACf,CAAC,EAAA,CACa,CACV,EAAA,CAAA,EACT;YACJ,KAAK,UAAU,CAAC,IAAI;AAClB,gBAAA,QACEA,qBAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,gBAAgB,EACrC,QAAA,EAAAA,qBAAA,CAAC,UAAU,EACT,EAAA,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,IAAI,IAAI,uBAAuB,CAAC,IAAI,CAAC,EAC/C,gBAAgB,EAAE,KAAK,EACvB,eAAe,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,EAAE,EAChD,CAAA,EAAA,CACE,EACN;AACJ,YAAA;AACE,gBAAA,QACEA,qBAAK,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,gBAAgB,EAAA,QAAA,EACrCA,qBAAC,CAAA,SAAS,IACR,SAAS,EAAE,MAAM,CAAC,SAAS,EAC3B,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,CAAC,IAAI,uBAAuB,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,CAAA,EAAA,CACE,EACN;SACL;AACH,KAAC,CAAC;AAEF,IAAA,QACED,sBAAA,CAAC,IAAI,EAAA,EACH,KAAK,EAAC,QAAQ,EACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,EACvC,IAAI,EAAC,OAAO,~~EACA~~,YAAA,~~EAAA~~,~~CAAA~~,~~UAAA,EAAa,~~KAAK,CAAA,CAAE,~~KAC5B~~,KAAK,~~EAAA~~,~~QAAA,EAAA,CAETA,~~sBAAC,CAAA,IAAI,EAAC,EAAA,KAAK,EAAC,QAAQ,EAAC,GAAG,EAAE,CAAC,EAAE,SAAS,EAAE,MAAM,CAAC,YAAY,CAAC,~~EACzD~~,QAAA,EAAA,~~CAAA~~,WAAW,KACVC,qBAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAE,MAAM,CAAC,WAAW,~~EAAA~~,~~aAAA,EAAc,~~MAAM,EAAA,QAAA,EACpD,WAAW,EAAA,CACP,CACR,EACDA,qBAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,CAAC,EAAE,MAAM,EAAC,QAAQ,~~EAAA~~,QAAA,~~EAC3B~~,KAAK,~~EAAA~~,~~CACD,~~CACF,EAAA,CAAA,EACPA,~~sBAAC~~,SAAS,EAAA,~~EACR,~~UAAU,EAAE,kBAAkB,EAC9B,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,qBAAqB,~~GAC~~/B,EACD,gBAAgB,EAAE,EAClB,YAAY,KACXA,qBAAA,CAAA,QAAA,EAAA,EACE,SAAS,EAAE,MAAM,CAAC,mBAAmB,~~EAAA~~,YAAA,~~EACzB~~,~~CAAU~~,OAAA,~~EAAA~~,KAAK,~~SAAS~~,EACpC,OAAO,EAAE,QAAQ,~~EAEjB~~,QAAA,~~EAAAA~~,~~qBAAA~~,~~CAAC~~,UAAU,~~EAAA~~,~~EAAC,~~SAAS,EAAE,MAAM,CAAC,UAAU,EAAI,CAAA,EAAA,CACrC,CACV,CAAA,EAAA,CACI,EACP;AACJ,EAAE;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}
1	+ {"version":3,"file":"filter-chip.js","sources":["../../../components/filter-chip/filter-chip.tsx"],"sourcesContent":["import { Cross1Icon } from '@radix-ui/react-icons';\nimport { VariantProps, cva, cx } from 'class-variance-authority';\nimport { ReactElement, ReactNode, useCallback, useState } from 'react';\nimport {\n FilterOperation,\n FilterOperator,\n FilterSelectOption,\n FilterType,\n FilterTypes,\n filterOperators\n} from '~/types/filters';\nimport { DatePicker } from '../calendar';\nimport { Flex } from '../flex';\nimport { Select } from '../select';\nimport { Text } from '../text';\nimport { TextField } from '../textfield';\nimport { Operation } from './filter-chip-operation';\nimport styles from './filter-chip.module.css';\n\nconst chip = cva(styles.chip, {\n variants: {\n variant: {\n default: styles['chip-default'],\n text: null\n }\n },\n defaultVariants: {\n variant: 'default'\n }\n});\n\nexport interface FilterChipProps extends VariantProps<typeof chip> {\n label: string;\n value?: string;\n onRemove?: () => void;\n className?: string;\n ref?: React.RefObject<HTMLDivElement>;\n children?: ReactNode;\n columnType?: FilterTypes;\n options?: FilterSelectOption[];\n onValueChange?: (value: any, operation: string) => void;\n onOperationChange?: (operation: string) => void;\n leadingIcon?: ReactElement;\n operations?: FilterOperator<string>[];\n}\n\nexport const FilterChip = ({\n label,\n value,\n onRemove,\n className,\n ref,\n columnType = FilterType.string,\n options = [],\n onValueChange,\n onOperationChange,\n leadingIcon,\n variant,\n operations,\n ...props\n}: FilterChipProps) => {\n const computedOperations = operations?.length\n ? operations\n : filterOperators[columnType];\n\n const [operation, setOperation] = useState<FilterOperation \| undefined>(\n computedOperations?.[0]\n );\n const [filterValue, setFilterValue] = useState<any>(value \|\| '');\n\n const showOnRemove = typeof onRemove === 'function';\n const isMultiSelectColumn = columnType === FilterType.multiselect;\n\n const handleOperationChange = useCallback(\n (operation: FilterOperation) => {\n setOperation(operation);\n if (operation?.value) onOperationChange?.(operation.value);\n },\n [onOperationChange]\n );\n\n const handleFilterValueChange = useCallback(\n (value: any) => {\n setFilterValue(value);\n onValueChange?.(value, operation?.value ?? '');\n },\n [operation, onValueChange]\n );\n\n const renderValueInput = () => {\n switch (columnType) {\n case FilterType.multiselect:\n case FilterType.select:\n return (\n <Select\n value={isMultiSelectColumn ? filterValue : filterValue.toString()}\n onValueChange={handleFilterValueChange}\n multiple={isMultiSelectColumn}\n >\n <Select.Trigger\n iconProps={{\n style: {\n display: 'none'\n }\n }}\n variant='text'\n className={cx(styles.selectValue, styles.selectColumn)}\n >\n <Select.Value placeholder='Select value'>\n {isMultiSelectColumn && filterValue.length > 1\n ? `${filterValue.length} selected`\n : undefined}\n </Select.Value>\n </Select.Trigger>\n <Select.Content data-variant='filter'>\n {options.map(opt => (\n <Select.Item\n key={opt.value.toString()}\n value={opt.value.toString()}\n >\n {opt.label}\n </Select.Item>\n ))}\n </Select.Content>\n </Select>\n );\n case FilterType.date:\n return (\n <div className={styles.dateFieldWrapper}>\n <DatePicker\n value={filterValue}\n onSelect={date => handleFilterValueChange(date)}\n showCalendarIcon={false}\n inputFieldProps={{ className: styles.dateField }}\n />\n </div>\n );\n default:\n return (\n <div className={styles.textFieldWrapper}>\n <TextField\n className={styles.textField}\n value={filterValue}\n onChange={e => handleFilterValueChange(e.target.value)}\n />\n </div>\n );\n }\n };\n\n return (\n <Flex\n align='center'\n ref={ref}\n className={chip({ variant, className })}\n role='group'\n aria-label={`Filter by ${label}`}\n {...props}\n >\n <Flex align='center' gap={2} className={styles['chip-label']}>\n {leadingIcon && (\n <span className={styles.leadingIcon} aria-hidden='true'>\n {leadingIcon}\n </span>\n )}\n <Text size={2} weight='normal'>\n {label}\n </Text>\n </Flex>\n <Operation\n operations={computedOperations}\n label={label}\n value={operation}\n onChange={handleOperationChange}\n showAlternateLabel={isMultiSelectColumn && filterValue.length <= 1}\n />\n {renderValueInput()}\n {showOnRemove && (\n <button\n className={styles.removeIconContainer}\n aria-label={`Remove ${label} filter`}\n onClick={onRemove}\n >\n <Cross1Icon className={styles.removeIcon} />\n </button>\n )}\n </Flex>\n );\n};\n\nFilterChip.displayName = 'FilterChip';\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/components/filter-chip/filter-chip.module.css.cjs CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-var styles = {"chip":"filter-chip-module_chip__BphAr","chip-default":"filter-chip-module_chip-default__q9QfE","chip-label":"filter-chip-module_chip-label__-ugGs","operationText":"filter-chip-module_operationText__spj1Y","value":"filter-chip-module_value__5JK-z","removeIconContainer":"filter-chip-module_removeIconContainer__W5cow","removeIcon":"filter-chip-module_removeIcon__6xmN1","selectValue":"filter-chip-module_selectValue__qtzzQ","selectColumn":"filter-chip-module_selectColumn__uaqj2","leadingIcon":"filter-chip-module_leadingIcon__ANvl2","textFieldWrapper":"filter-chip-module_textFieldWrapper__29UIA","textField":"filter-chip-module_textField__tADFO","dateFieldWrapper":"filter-chip-module_dateFieldWrapper__fPmxI","dateField":"filter-chip-module_dateField__nxEVq","chip___default":"filter-chip-module_chip-default__q9QfE","chip___label":"filter-chip-module_chip-label__-ugGs"};
+var styles = {"chip":"filter-chip-module_chip__BphAr","chip-default":"filter-chip-module_chip-default__q9QfE","chip-label":"filter-chip-module_chip-label__-ugGs","operationText":"filter-chip-module_operationText__spj1Y","value":"filter-chip-module_value__5JK-z","removeIconContainer":"filter-chip-module_removeIconContainer__W5cow","removeIcon":"filter-chip-module_removeIcon__6xmN1","selectValue":"filter-chip-module_selectValue__qtzzQ","operationValue":"filter-chip-module_operationValue__n-7CS","selectColumn":"filter-chip-module_selectColumn__uaqj2","leadingIcon":"filter-chip-module_leadingIcon__ANvl2","textFieldWrapper":"filter-chip-module_textFieldWrapper__29UIA","textField":"filter-chip-module_textField__tADFO","dateFieldWrapper":"filter-chip-module_dateFieldWrapper__fPmxI","dateField":"filter-chip-module_dateField__nxEVq","chip___default":"filter-chip-module_chip-default__q9QfE","chip___label":"filter-chip-module_chip-label__-ugGs"};
 exports.default = styles;
 //# sourceMappingURL=filter-chip.module.css.cjs.map

package/dist/components/filter-chip/filter-chip.module.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
-var styles = {"chip":"filter-chip-module_chip__BphAr","chip-default":"filter-chip-module_chip-default__q9QfE","chip-label":"filter-chip-module_chip-label__-ugGs","operationText":"filter-chip-module_operationText__spj1Y","value":"filter-chip-module_value__5JK-z","removeIconContainer":"filter-chip-module_removeIconContainer__W5cow","removeIcon":"filter-chip-module_removeIcon__6xmN1","selectValue":"filter-chip-module_selectValue__qtzzQ","selectColumn":"filter-chip-module_selectColumn__uaqj2","leadingIcon":"filter-chip-module_leadingIcon__ANvl2","textFieldWrapper":"filter-chip-module_textFieldWrapper__29UIA","textField":"filter-chip-module_textField__tADFO","dateFieldWrapper":"filter-chip-module_dateFieldWrapper__fPmxI","dateField":"filter-chip-module_dateField__nxEVq","chip___default":"filter-chip-module_chip-default__q9QfE","chip___label":"filter-chip-module_chip-label__-ugGs"};
+var styles = {"chip":"filter-chip-module_chip__BphAr","chip-default":"filter-chip-module_chip-default__q9QfE","chip-label":"filter-chip-module_chip-label__-ugGs","operationText":"filter-chip-module_operationText__spj1Y","value":"filter-chip-module_value__5JK-z","removeIconContainer":"filter-chip-module_removeIconContainer__W5cow","removeIcon":"filter-chip-module_removeIcon__6xmN1","selectValue":"filter-chip-module_selectValue__qtzzQ","operationValue":"filter-chip-module_operationValue__n-7CS","selectColumn":"filter-chip-module_selectColumn__uaqj2","leadingIcon":"filter-chip-module_leadingIcon__ANvl2","textFieldWrapper":"filter-chip-module_textFieldWrapper__29UIA","textField":"filter-chip-module_textField__tADFO","dateFieldWrapper":"filter-chip-module_dateFieldWrapper__fPmxI","dateField":"filter-chip-module_dateField__nxEVq","chip___default":"filter-chip-module_chip-default__q9QfE","chip___label":"filter-chip-module_chip-label__-ugGs"};
 export { styles as default };
 //# sourceMappingURL=filter-chip.module.css.js.map

package/dist/components/sidebar/index.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
-export { Sidebar } from "./sidebar";
+export { Sidebar } from './sidebar';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/sidebar/sidebar.cjs CHANGED Viewed

@@ -3,6 +3,8 @@
 var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
 var index$1 = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
 var React = require('react');
+var avatar = require('../avatar/avatar.cjs');
+var flex = require('../flex/flex.cjs');
 var tooltip = require('../tooltip/tooltip.cjs');
 var sidebar_module = require('./sidebar.module.css.cjs');
 var index = require('../../node_modules/.pnpm/@radix-ui_react-collapsible@1.1.11_@types_react-dom@18.0.11_@types_react@18.2.12_react-dom@18_qdnr5tshbuses2czt45n43so7q/node_modules/@radix-ui/react-collapsible/dist/index.cjs');
@@ -11,22 +13,21 @@ const SidebarContext = React.createContext({
     isCollapsed: false
 });
 const root = index$1.cva(sidebar_module.default.root);
-const SidebarRoot = React.forwardRef(({ className, position = 'left', open, onOpenChange, hideCollapsedItemTooltip, collapsible = true, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsx(SidebarContext.Provider, { value: { isCollapsed: !open, hideCollapsedItemTooltip }, children: jsxRuntime.jsxRuntimeExports.jsx(tooltip.TooltipProvider, { children: jsxRuntime.jsxRuntimeExports.jsx(index.Root, { ref: ref, className: root({ className }), "data-position": position, "data-state": open ? 'expanded' : 'collapsed', "data-collapse-disabled": !collapsible, open: open, onOpenChange: collapsible ? onOpenChange : undefined, "aria-label": 'Navigation Sidebar', "aria-expanded": open, role: 'navigation', ...props, asChild: true, children: jsxRuntime.jsxRuntimeExports.jsxs("aside", { children: [collapsible && (jsxRuntime.jsxRuntimeExports.jsx(tooltip.Tooltip, { message: open ? 'Click to collapse' : 'Click to expand', side: position === 'left' ? 'right' : 'left', asChild: true, followCursor: true, sideOffset: 10, children: jsxRuntime.jsxRuntimeExports.jsx("div", { className: sidebar_module.default.resizeHandle, onClick: () => onOpenChange?.(!open), role: 'button', tabIndex: 0, "aria-label": open ? 'Collapse sidebar' : 'Expand sidebar', onKeyDown: e => {
+const SidebarRoot = React.forwardRef(({ className, position = 'left', open, onOpenChange, hideCollapsedItemTooltip, collapsible = true, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsx(SidebarContext.Provider, { value: { isCollapsed: !open, hideCollapsedItemTooltip }, children: jsxRuntime.jsxRuntimeExports.jsx(tooltip.Tooltip.Provider, { children: jsxRuntime.jsxRuntimeExports.jsx(index.Root, { ref: ref, className: root({ className }), "data-position": position, "data-state": open ? 'expanded' : 'collapsed', "data-collapse-disabled": !collapsible, open: open, onOpenChange: collapsible ? onOpenChange : undefined, "aria-label": 'Navigation Sidebar', "aria-expanded": open, role: 'navigation', ...props, asChild: true, children: jsxRuntime.jsxRuntimeExports.jsxs("aside", { children: [collapsible && (jsxRuntime.jsxRuntimeExports.jsx(tooltip.Tooltip, { message: open ? 'Click to collapse' : 'Click to expand', side: position === 'left' ? 'right' : 'left', asChild: true, followCursor: true, sideOffset: 10, children: jsxRuntime.jsxRuntimeExports.jsx("div", { className: sidebar_module.default.resizeHandle, onClick: () => onOpenChange?.(!open), role: 'button', tabIndex: 0, "aria-label": open ? 'Collapse sidebar' : 'Expand sidebar', onKeyDown: e => {
                                 if (e.key === 'Enter' || e.key === ' ') {
                                     e.preventDefault();
                                     onOpenChange?.(!open);
                                 }
                             } }) })), children] }) }) }) })));
-const SidebarHeader = React.forwardRef(({ className, logo, title, onLogoClick, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsxs("div", { ref: ref, className: sidebar_module.default.header, role: 'banner', ...props, children: [jsxRuntime.jsxRuntimeExports.jsx("div", { className: sidebar_module.default.logo, onClick: onLogoClick, role: onLogoClick ? 'button' : undefined, tabIndex: onLogoClick ? 0 : undefined, onKeyDown: e => {
-                if (onLogoClick && (e.key === 'Enter' || e.key === ' ')) {
-                    e.preventDefault();
-                    onLogoClick();
-                }
-            }, style: { cursor: onLogoClick ? 'pointer' : undefined }, children: logo }), jsxRuntime.jsxRuntimeExports.jsx("div", { className: sidebar_module.default.title, role: 'heading', "aria-level": 1, children: title })] })));
-const SidebarMain = React.forwardRef(({ className, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsx("div", { ref: ref, className: sidebar_module.default.main, role: 'group', "aria-label": 'Main navigation', ...props, children: children })));
-const SidebarFooter = React.forwardRef(({ className, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsx("div", { ref: ref, className: sidebar_module.default.footer, role: 'group', "aria-label": 'Footer navigation', ...props, children: children })));
-const SidebarItem = React.forwardRef(({ classNames, icon, children, active, disabled, as = jsxRuntime.jsxRuntimeExports.jsx("a", {}), ...props }, ref) => {
-    const { isCollapsed, hideCollapsedItemTooltip } = React.useContext(SidebarContext); // To prevent prop drillng
+const SidebarHeader = React.forwardRef(({ className, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { align: 'center', ref: ref, className: sidebar_module.default.header, role: 'banner', ...props, children: children })));
+const SidebarMain = React.forwardRef(({ className, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { ref: ref, className: sidebar_module.default.main, direction: 'column', role: 'group', "aria-label": 'Main navigation', ...props, children: children })));
+const SidebarFooter = React.forwardRef(({ className, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { ref: ref, className: sidebar_module.default.footer, direction: 'column', role: 'group', "aria-label": 'Footer navigation', ...props, children: children })));
+const SidebarItem = React.forwardRef(({ classNames, leadingIcon, children, active, disabled, as = jsxRuntime.jsxRuntimeExports.jsx("a", {}), ...props }, ref) => {
+    const { isCollapsed, hideCollapsedItemTooltip } = React.useContext(SidebarContext);
+    const shouldShowFallback = leadingIcon == undefined &&
+        isCollapsed &&
+        typeof children === 'string' &&
+        children.length > 0;
     const content = React.cloneElement(as, {
         ref,
         className: index$1.cx(sidebar_module.default['nav-item'], classNames?.root),
@@ -36,13 +37,13 @@ const SidebarItem = React.forwardRef(({ classNames, icon, children, active, disa
         'aria-current': active ? 'page' : undefined,
         'aria-disabled': disabled,
         ...props
-    }, jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment, { children: [jsxRuntime.jsxRuntimeExports.jsx("span", { className: index$1.cx(sidebar_module.default['nav-icon'], classNames?.icon), "aria-hidden": 'true', children: icon }), !isCollapsed && jsxRuntime.jsxRuntimeExports.jsx("span", { className: sidebar_module.default['nav-text'], children: children })] }));
+    }, jsxRuntime.jsxRuntimeExports.jsxs(jsxRuntime.jsxRuntimeExports.Fragment, { children: [jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { align: 'center', gap: 3, className: index$1.cx(sidebar_module.default['nav-leading-icon'], classNames?.leadingIcon), "aria-hidden": 'true', children: shouldShowFallback ? (jsxRuntime.jsxRuntimeExports.jsx(avatar.Avatar, { size: 1, variant: 'soft', color: 'neutral', fallback: children[0].toUpperCase(), style: { cursor: 'pointer' } })) : (leadingIcon) }), !isCollapsed && jsxRuntime.jsxRuntimeExports.jsx("span", { className: sidebar_module.default['nav-text'], children: children })] }));
     if (isCollapsed && !hideCollapsedItemTooltip) {
         return (jsxRuntime.jsxRuntimeExports.jsx(tooltip.Tooltip, { message: children, side: 'right', children: content }));
     }
     return content;
 });
-const SidebarNavigationGroup = React.forwardRef(({ className, name, icon, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsxs("section", { ref: ref, className: className, "aria-label": name, ...props, children: [jsxRuntime.jsxRuntimeExports.jsxs("div", { className: sidebar_module.default['nav-group-header'], children: [icon && jsxRuntime.jsxRuntimeExports.jsx("span", { className: sidebar_module.default['nav-icon'], children: icon }), jsxRuntime.jsxRuntimeExports.jsx("span", { className: sidebar_module.default['nav-group-name'], children: name })] }), jsxRuntime.jsxRuntimeExports.jsx("div", { className: sidebar_module.default['nav-group-items'], role: 'list', children: children })] })));
+const SidebarNavigationGroup = React.forwardRef(({ className, label, leadingIcon, children, ...props }, ref) => (jsxRuntime.jsxRuntimeExports.jsxs("section", { ref: ref, className: index$1.cx(sidebar_module.default['nav-group'], className), "aria-label": label, ...props, children: [jsxRuntime.jsxRuntimeExports.jsxs(flex.Flex, { align: 'center', gap: 3, className: sidebar_module.default['nav-group-header'], children: [leadingIcon && (jsxRuntime.jsxRuntimeExports.jsx("span", { className: sidebar_module.default['nav-leading-icon'], children: leadingIcon })), jsxRuntime.jsxRuntimeExports.jsx("span", { className: sidebar_module.default['nav-group-label'], children: label })] }), jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { direction: 'column', className: sidebar_module.default['nav-group-items'], role: 'list', children: children })] })));
 SidebarRoot.displayName = 'Sidebar.Root';
 SidebarHeader.displayName = 'Sidebar.Header';
 SidebarMain.displayName = 'Sidebar.Main';

package/dist/components/sidebar/sidebar.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sidebar.cjs","sources":["../../../components/sidebar/sidebar.tsx"],"sourcesContent":["import { cva, cx } from 'class-variance-authority';\nimport { Collapsible } from 'radix-ui';\nimport {\n ComponentPropsWithoutRef,\n ComponentRef,\n ReactElement,\n ReactNode,\n cloneElement,\n createContext,\n forwardRef,\n useContext\n} from 'react';\nimport { Tooltip, TooltipProvider } from '../tooltip';\nimport styles from './sidebar.module.css';\n\ninterface SidebarContextValue {\n isCollapsed: boolean;\n hideCollapsedItemTooltip?: boolean;\n}\n\nconst SidebarContext = createContext<SidebarContextValue>({\n isCollapsed: false\n});\n\nconst root = cva(styles.root);\n\ninterface SidebarProps\n extends ComponentPropsWithoutRef<typeof Collapsible.Root> {\n position?: 'left' \| 'right';\n hideCollapsedItemTooltip?: boolean;\n collapsible?: boolean;\n}\n\ninterface SidebarHeaderProps extends ComponentPropsWithoutRef<'div'> {\n logo: ReactNode;\n title: string;\n onLogoClick?: () => void;\n}\n\ninterface SidebarItemProps extends ComponentPropsWithoutRef<'a'> {\n icon?: ReactNode;\n active?: boolean;\n disabled?: boolean;\n as?: ReactElement;\n classNames?: {\n root?: string;\n icon?: string;\n text?: string;\n };\n}\n\ninterface SidebarFooterProps extends ComponentPropsWithoutRef<'div'> {}\n\ninterface SidebarNavigationGroupProps extends ComponentPropsWithoutRef<'div'> {\n name: string;\n icon?: ReactNode;\n}\n\nconst SidebarRoot = forwardRef<\n ComponentRef<typeof Collapsible.Root>,\n SidebarProps\n>(\n (\n {\n className,\n position = 'left',\n open,\n onOpenChange,\n hideCollapsedItemTooltip,\n collapsible = true,\n children,\n ...props\n },\n ref\n ) => (\n <SidebarContext.Provider\n value={{ isCollapsed: !open, hideCollapsedItemTooltip }}\n >\n <TooltipProvider>\n <Collapsible.Root\n ref={ref}\n className={root({ className })}\n data-position={position}\n data-state={open ? 'expanded' : 'collapsed'}\n data-collapse-disabled={!collapsible}\n open={open}\n onOpenChange={collapsible ? onOpenChange : undefined}\n aria-label='Navigation Sidebar'\n aria-expanded={open}\n role='navigation'\n {...props}\n asChild\n >\n <aside>\n {collapsible && (\n <Tooltip\n message={open ? 'Click to collapse' : 'Click to expand'}\n side={position === 'left' ? 'right' : 'left'}\n asChild\n followCursor\n sideOffset={10}\n >\n <div\n className={styles.resizeHandle}\n onClick={() => onOpenChange?.(!open)}\n role='button'\n tabIndex={0}\n aria-label={open ? 'Collapse sidebar' : 'Expand sidebar'}\n onKeyDown={e => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n onOpenChange?.(!open);\n }\n }}\n />\n </Tooltip>\n )}\n {children}\n </aside>\n </Collapsible.Root>\n </TooltipProvider>\n </SidebarContext.Provider>\n )\n);\n\nconst SidebarHeader = forwardRef<HTMLDivElement, SidebarHeaderProps>(\n ({ className, logo, title, onLogoClick, ...props }, ref) => (\n <div ref={ref} className={styles.header} role='banner' {...props}>\n <div\n className={styles.logo}\n onClick={onLogoClick}\n role={onLogoClick ? 'button' : undefined}\n tabIndex={onLogoClick ? 0 : undefined}\n onKeyDown={e => {\n if (onLogoClick && (e.key === 'Enter' \|\| e.key === ' ')) {\n e.preventDefault();\n onLogoClick();\n }\n }}\n style={{ cursor: onLogoClick ? 'pointer' : undefined }}\n >\n {logo}\n </div>\n <div className={styles.title} role='heading' aria-level={1}>\n {title}\n </div>\n </div>\n )\n);\n\nconst SidebarMain = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n ({ className, children, ...props }, ref) => (\n <div\n ref={ref}\n className={styles.main}\n role='group'\n aria-label='Main navigation'\n {...props}\n >\n {children}\n </div>\n )\n);\n\nconst SidebarFooter = forwardRef<HTMLDivElement, SidebarFooterProps>(\n ({ className, children, ...props }, ref) => (\n <div\n ref={ref}\n className={styles.footer}\n role='group'\n aria-label='Footer navigation'\n {...props}\n >\n {children}\n </div>\n )\n);\n\nconst SidebarItem = forwardRef<HTMLAnchorElement, SidebarItemProps>(\n (\n { classNames, icon, children, active, disabled, as = <a />, ...props },\n ref\n ) => {\n const { isCollapsed, hideCollapsedItemTooltip } =\n useContext(SidebarContext); // To prevent prop drillng\n\n const content = cloneElement(\n as,\n {\n ref,\n className: cx(styles['nav-item'], classNames?.root),\n 'data-active': active,\n 'data-disabled': disabled,\n role: 'menuitem',\n 'aria-current': active ? 'page' : undefined,\n 'aria-disabled': disabled,\n ...props\n },\n <>\n <span\n className={cx(styles['nav-icon'], classNames?.icon)}\n aria-hidden='true'\n >\n {icon}\n </span>\n {!isCollapsed && <span className={styles['nav-text']}>{children}</span>}\n </>\n );\n\n if (isCollapsed && !hideCollapsedItemTooltip) {\n return (\n <Tooltip message={children} side='right'>\n {content}\n </Tooltip>\n );\n }\n\n return content;\n }\n);\n\nconst SidebarNavigationGroup = forwardRef<\n HTMLElement,\n SidebarNavigationGroupProps\n>(({ className, name, icon, children, ...props }, ref) => (\n <section ref={ref} className={className} aria-label={name} {...props}>\n <div className={styles['nav-group-header']}>\n {icon && <span className={styles['nav-icon']}>{icon}</span>}\n <span className={styles['nav-group-name']}>{name}</span>\n </div>\n <div className={styles['nav-group-items']} role='list'>\n {children}\n </div>\n </section>\n));\n\nSidebarRoot.displayName = 'Sidebar.Root';\nSidebarHeader.displayName = 'Sidebar.Header';\nSidebarMain.displayName = 'Sidebar.Main';\nSidebarFooter.displayName = 'Sidebar.Footer';\nSidebarItem.displayName = 'Sidebar.Item';\nSidebarNavigationGroup.displayName = 'Sidebar.Group';\n\nexport const Sidebar = Object.assign(SidebarRoot, {\n Header: SidebarHeader,\n Main: SidebarMain,\n Footer: SidebarFooter,\n Item: SidebarItem,\n Group: SidebarNavigationGroup\n});\n"],"names":["createContext","cva","styles","forwardRef","_jsx","TooltipProvider","Collapsible.Root","_jsxs","Tooltip","useContext","cloneElement","cx"],"mappings":";;;;;;;;;AAoBA,MAAM,cAAc,GAAGA,mBAAa,CAAsB;AACxD,IAAA,WAAW,EAAE,KAAK;AACnB,CAAA,CAAC,CAAC;AAEH,MAAM,IAAI,GAAGC,WAAG,CAACC,sBAAM,CAAC,IAAI,CAAC,CAAC;AAkC9B,MAAM,WAAW,GAAGC,gBAAU,CAI5B,CACE,EACE,SAAS,EACT,QAAQ,GAAG,MAAM,EACjB,IAAI,EACJ,YAAY,EACZ,wBAAwB,EACxB,WAAW,GAAG,IAAI,EAClB,QAAQ,EACR,GAAG,KAAK,EACT,EACD,GAAG,MAEHC,gCAAA,CAAC,cAAc,CAAC,QAAQ,IACtB,KAAK,EAAE,EAAE,WAAW,EAAE,CAAC,IAAI,EAAE,wBAAwB,EAAE,EAEvD,QAAA,EAAAA,gCAAA,CAACC,uBAAe,EACd,EAAA,QAAA,EAAAD,gCAAA,CAACE,UAAgB,IACf,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,EAAE,SAAS,EAAE,CAAC,EAAA,eAAA,EACf,QAAQ,EAAA,YAAA,EACX,IAAI,GAAG,UAAU,GAAG,WAAW,4BACnB,CAAC,WAAW,EACpC,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,WAAW,GAAG,YAAY,GAAG,SAAS,gBACzC,oBAAoB,EAAA,eAAA,EAChB,IAAI,EACnB,IAAI,EAAC,YAAY,EAAA,GACb,KAAK,EACT,OAAO,kBAEPC,iCACG,CAAA,OAAA,EAAA,EAAA,QAAA,EAAA,CAAA,WAAW,KACVH,gCAAA,CAACI,eAAO,EAAA,EACN,OAAO,EAAE,IAAI,GAAG,mBAAmB,GAAG,iBAAiB,EACvD,IAAI,EAAE,QAAQ,KAAK,MAAM,GAAG,OAAO,GAAG,MAAM,EAC5C,OAAO,QACP,YAAY,EAAA,IAAA,EACZ,UAAU,EAAE,EAAE,YAEdJ,gCACE,CAAA,KAAA,EAAA,EAAA,SAAS,EAAEF,sBAAM,CAAC,YAAY,EAC9B,OAAO,EAAE,MAAM,YAAY,GAAG,CAAC,IAAI,CAAC,EACpC,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,CAAC,EAAA,YAAA,EACC,IAAI,GAAG,kBAAkB,GAAG,gBAAgB,EACxD,SAAS,EAAE,CAAC,IAAG;AACb,gCAAA,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE;oCACtC,CAAC,CAAC,cAAc,EAAE,CAAC;AACnB,oCAAA,YAAY,GAAG,CAAC,IAAI,CAAC,CAAC;iCACvB;6BACF,EAAA,CACD,EACM,CAAA,CACX,EACA,QAAQ,CACH,EAAA,CAAA,EAAA,CACS,EACH,CAAA,EAAA,CACM,CAC3B,CACF,CAAC;AAEF,MAAM,aAAa,GAAGC,gBAAU,CAC9B,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACrDI,iCAAK,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EAAE,SAAS,EAAEL,sBAAM,CAAC,MAAM,EAAE,IAAI,EAAC,QAAQ,EAAK,GAAA,KAAK,EAC9D,QAAA,EAAA,CAAAE,gCAAA,CAAA,KAAA,EAAA,EACE,SAAS,EAAEF,sBAAM,CAAC,IAAI,EACtB,OAAO,EAAE,WAAW,EACpB,IAAI,EAAE,WAAW,GAAG,QAAQ,GAAG,SAAS,EACxC,QAAQ,EAAE,WAAW,GAAG,CAAC,GAAG,SAAS,EACrC,SAAS,EAAE,CAAC,IAAG;AACb,gBAAA,IAAI,WAAW,KAAK,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE;oBACvD,CAAC,CAAC,cAAc,EAAE,CAAC;AACnB,oBAAA,WAAW,EAAE,CAAC;iBACf;AACH,aAAC,EACD,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,GAAG,SAAS,GAAG,SAAS,EAAE,YAErD,IAAI,EAAA,CACD,EACNE,gCAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEF,sBAAM,CAAC,KAAK,EAAE,IAAI,EAAC,SAAS,EAAA,YAAA,EAAa,CAAC,EACvD,QAAA,EAAA,KAAK,GACF,CACF,EAAA,CAAA,CACP,CACF,CAAC;AAEF,MAAM,WAAW,GAAGC,gBAAU,CAC5B,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACrCC,gCACE,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAEF,sBAAM,CAAC,IAAI,EACtB,IAAI,EAAC,OAAO,EACD,YAAA,EAAA,iBAAiB,KACxB,KAAK,EAAA,QAAA,EAER,QAAQ,EACL,CAAA,CACP,CACF,CAAC;AAEF,MAAM,aAAa,GAAGC,gBAAU,CAC9B,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACrCC,gCACE,CAAA,KAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EACR,SAAS,EAAEF,sBAAM,CAAC,MAAM,EACxB,IAAI,EAAC,OAAO,EACD,YAAA,EAAA,mBAAmB,KAC1B,KAAK,EAAA,QAAA,EAER,QAAQ,EACL,CAAA,CACP,CACF,CAAC;AAEF,MAAM,WAAW,GAAGC,gBAAU,CAC5B,CACE,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,GAAGC,gCAAK,CAAA,GAAA,EAAA,EAAA,CAAA,EAAE,GAAG,KAAK,EAAE,EACtE,GAAG,KACD;AACF,IAAA,MAAM,EAAE,WAAW,EAAE,wBAAwB,EAAE,GAC7CK,gBAAU,CAAC,cAAc,CAAC,CAAC;AAE7B,IAAA,MAAM,OAAO,GAAGC,kBAAY,CAC1B,EAAE,EACF;QACE,GAAG;QACH,SAAS,EAAEC,UAAE,CAACT,sBAAM,CAAC,UAAU,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC;AACnD,QAAA,aAAa,EAAE,MAAM;AACrB,QAAA,eAAe,EAAE,QAAQ;AACzB,QAAA,IAAI,EAAE,UAAU;QAChB,cAAc,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS;AAC3C,QAAA,eAAe,EAAE,QAAQ;AACzB,QAAA,GAAG,KAAK;AACT,KAAA,EACDK,sFACEH,gCACE,CAAA,MAAA,EAAA,EAAA,SAAS,EAAEO,UAAE,CAACT,sBAAM,CAAC,UAAU,CAAC,EAAE,UAAU,EAAE,IAAI,CAAC,iBACvC,MAAM,EAAA,QAAA,EAEjB,IAAI,EAAA,CACA,EACN,CAAC,WAAW,IAAIE,gCAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAEF,sBAAM,CAAC,UAAU,CAAC,EAAG,QAAA,EAAA,QAAQ,EAAQ,CAAA,CAAA,EAAA,CACtE,CACJ,CAAC;AAEF,IAAA,IAAI,WAAW,IAAI,CAAC,wBAAwB,EAAE;AAC5C,QAAA,QACEE,gCAAA,CAACI,eAAO,EAAA,EAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAA,QAAA,EACrC,OAAO,EAAA,CACA,EACV;KACH;AAED,IAAA,OAAO,OAAO,CAAC;AACjB,CAAC,CACF,CAAC;AAEF,MAAM,sBAAsB,GAAGL,gBAAU,CAGvC,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,MACnDI,iCAAS,CAAA,SAAA,EAAA,EAAA,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,SAAS,gBAAc,IAAI,EAAA,GAAM,KAAK,EAClE,QAAA,EAAA,CAAAA,iCAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEL,sBAAM,CAAC,kBAAkB,CAAC,EACvC,QAAA,EAAA,CAAA,IAAI,IAAIE,gCAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAEF,sBAAM,CAAC,UAAU,CAAC,EAAA,QAAA,EAAG,IAAI,EAAA,CAAQ,EAC3DE,gCAAM,CAAA,MAAA,EAAA,EAAA,SAAS,EAAEF,sBAAM,CAAC,gBAAgB,CAAC,EAAA,QAAA,EAAG,IAAI,EAAA,CAAQ,IACpD,EACNE,gCAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEF,sBAAM,CAAC,iBAAiB,CAAC,EAAE,IAAI,EAAC,MAAM,EACnD,QAAA,EAAA,QAAQ,GACL,CACE,EAAA,CAAA,CACX,CAAC,CAAC;AAEH,WAAW,CAAC,WAAW,GAAG,cAAc,CAAC;AACzC,aAAa,CAAC,WAAW,GAAG,gBAAgB,CAAC;AAC7C,WAAW,CAAC,WAAW,GAAG,cAAc,CAAC;AACzC,aAAa,CAAC,WAAW,GAAG,gBAAgB,CAAC;AAC7C,WAAW,CAAC,WAAW,GAAG,cAAc,CAAC;AACzC,sBAAsB,CAAC,WAAW,GAAG,eAAe,CAAC;MAExC,OAAO,GAAG,MAAM,CAAC,MAAM,CAAC,WAAW,EAAE;AAChD,IAAA,MAAM,EAAE,aAAa;AACrB,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,MAAM,EAAE,aAAa;AACrB,IAAA,IAAI,EAAE,WAAW;AACjB,IAAA,KAAK,EAAE,sBAAsB;AAC9B,CAAA;;;;"}
1	+ {"version":3,"file":"sidebar.cjs","sources":["../../../components/sidebar/sidebar.tsx"],"sourcesContent":["import { cva, cx } from 'class-variance-authority';\nimport { Collapsible } from 'radix-ui';\nimport {\n ComponentPropsWithoutRef,\n ComponentRef,\n ReactElement,\n ReactNode,\n cloneElement,\n createContext,\n forwardRef,\n useContext\n} from 'react';\nimport { Avatar } from '../avatar';\nimport { Flex } from '../flex';\nimport { Tooltip } from '../tooltip';\nimport styles from './sidebar.module.css';\n\ninterface SidebarContextValue {\n isCollapsed: boolean;\n hideCollapsedItemTooltip?: boolean;\n}\n\nconst SidebarContext = createContext<SidebarContextValue>({\n isCollapsed: false\n});\n\nconst root = cva(styles.root);\n\ninterface SidebarProps\n extends ComponentPropsWithoutRef<typeof Collapsible.Root> {\n position?: 'left' \| 'right';\n hideCollapsedItemTooltip?: boolean;\n collapsible?: boolean;\n}\n\ninterface SidebarItemProps extends ComponentPropsWithoutRef<'a'> {\n leadingIcon?: ReactNode;\n active?: boolean;\n disabled?: boolean;\n as?: ReactElement;\n classNames?: {\n root?: string;\n leadingIcon?: string;\n text?: string;\n };\n}\n\ninterface SidebarFooterProps extends ComponentPropsWithoutRef<'div'> {}\n\ninterface SidebarNavigationGroupProps extends ComponentPropsWithoutRef<'div'> {\n label: string;\n leadingIcon?: ReactNode;\n}\n\nconst SidebarRoot = forwardRef<\n ComponentRef<typeof Collapsible.Root>,\n SidebarProps\n>(\n (\n {\n className,\n position = 'left',\n open,\n onOpenChange,\n hideCollapsedItemTooltip,\n collapsible = true,\n children,\n ...props\n },\n ref\n ) => (\n <SidebarContext.Provider\n value={{ isCollapsed: !open, hideCollapsedItemTooltip }}\n >\n <Tooltip.Provider>\n <Collapsible.Root\n ref={ref}\n className={root({ className })}\n data-position={position}\n data-state={open ? 'expanded' : 'collapsed'}\n data-collapse-disabled={!collapsible}\n open={open}\n onOpenChange={collapsible ? onOpenChange : undefined}\n aria-label='Navigation Sidebar'\n aria-expanded={open}\n role='navigation'\n {...props}\n asChild\n >\n <aside>\n {collapsible && (\n <Tooltip\n message={open ? 'Click to collapse' : 'Click to expand'}\n side={position === 'left' ? 'right' : 'left'}\n asChild\n followCursor\n sideOffset={10}\n >\n <div\n className={styles.resizeHandle}\n onClick={() => onOpenChange?.(!open)}\n role='button'\n tabIndex={0}\n aria-label={open ? 'Collapse sidebar' : 'Expand sidebar'}\n onKeyDown={e => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n onOpenChange?.(!open);\n }\n }}\n />\n </Tooltip>\n )}\n {children}\n </aside>\n </Collapsible.Root>\n </Tooltip.Provider>\n </SidebarContext.Provider>\n )\n);\n\nconst SidebarHeader = forwardRef<\n HTMLDivElement,\n ComponentPropsWithoutRef<'div'>\n>(({ className, children, ...props }, ref) => (\n <Flex\n align='center'\n ref={ref}\n className={styles.header}\n role='banner'\n {...props}\n >\n {children}\n </Flex>\n));\n\nconst SidebarMain = forwardRef<HTMLDivElement, ComponentPropsWithoutRef<'div'>>(\n ({ className, children, ...props }, ref) => (\n <Flex\n ref={ref}\n className={styles.main}\n direction='column'\n role='group'\n aria-label='Main navigation'\n {...props}\n >\n {children}\n </Flex>\n )\n);\n\nconst SidebarFooter = forwardRef<HTMLDivElement, SidebarFooterProps>(\n ({ className, children, ...props }, ref) => (\n <Flex\n ref={ref}\n className={styles.footer}\n direction='column'\n role='group'\n aria-label='Footer navigation'\n {...props}\n >\n {children}\n </Flex>\n )\n);\n\nconst SidebarItem = forwardRef<HTMLAnchorElement, SidebarItemProps>(\n (\n {\n classNames,\n leadingIcon,\n children,\n active,\n disabled,\n as = <a />,\n ...props\n },\n ref\n ) => {\n const { isCollapsed, hideCollapsedItemTooltip } =\n useContext(SidebarContext);\n\n const shouldShowFallback =\n leadingIcon == undefined &&\n isCollapsed &&\n typeof children === 'string' &&\n children.length > 0;\n\n const content = cloneElement(\n as,\n {\n ref,\n className: cx(styles['nav-item'], classNames?.root),\n 'data-active': active,\n 'data-disabled': disabled,\n role: 'menuitem',\n 'aria-current': active ? 'page' : undefined,\n 'aria-disabled': disabled,\n ...props\n },\n <>\n <Flex\n align='center'\n gap={3}\n className={cx(styles['nav-leading-icon'], classNames?.leadingIcon)}\n aria-hidden='true'\n >\n {shouldShowFallback ? (\n <Avatar\n size={1}\n variant='soft'\n color='neutral'\n fallback={children[0].toUpperCase()}\n style={{ cursor: 'pointer' }}\n />\n ) : (\n leadingIcon\n )}\n </Flex>\n {!isCollapsed && <span className={styles['nav-text']}>{children}</span>}\n </>\n );\n\n if (isCollapsed && !hideCollapsedItemTooltip) {\n return (\n <Tooltip message={children} side='right'>\n {content}\n </Tooltip>\n );\n }\n\n return content;\n }\n);\n\nconst SidebarNavigationGroup = forwardRef<\n HTMLElement,\n SidebarNavigationGroupProps\n>(({ className, label, leadingIcon, children, ...props }, ref) => (\n <section\n ref={ref}\n className={cx(styles['nav-group'], className)}\n aria-label={label}\n {...props}\n >\n <Flex align='center' gap={3} className={styles['nav-group-header']}>\n {leadingIcon && (\n <span className={styles['nav-leading-icon']}>{leadingIcon}</span>\n )}\n <span className={styles['nav-group-label']}>{label}</span>\n </Flex>\n <Flex direction='column' className={styles['nav-group-items']} role='list'>\n {children}\n </Flex>\n </section>\n));\n\nSidebarRoot.displayName = 'Sidebar.Root';\nSidebarHeader.displayName = 'Sidebar.Header';\nSidebarMain.displayName = 'Sidebar.Main';\nSidebarFooter.displayName = 'Sidebar.Footer';\nSidebarItem.displayName = 'Sidebar.Item';\nSidebarNavigationGroup.displayName = 'Sidebar.Group';\n\nexport const Sidebar = Object.assign(SidebarRoot, {\n Header: SidebarHeader,\n Main: SidebarMain,\n Footer: SidebarFooter,\n Item: SidebarItem,\n Group: SidebarNavigationGroup\n});\n"],"names":["createContext","cva","styles","forwardRef","_jsx","Tooltip","Collapsible.Root","_jsxs","Flex","useContext","cloneElement","cx","Avatar"],"mappings":"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"}