npm - @sth87/shadcn-design-system - Versions diffs - 0.1.7 → 0.1.8 - Mend

@sth87/shadcn-design-system 0.1.7 → 0.1.8

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 (52) hide show

package/dist/esm/components/Table/TableFilter/data-table-date-filter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-table-date-filter.js","sources":["../../../../../src/components/Table/TableFilter/data-table-date-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport { formatDate } from \"@/utils/datetime\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { CalendarIcon, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport type { DateRange } from \"react-day-picker\";\nimport { Separator } from \"../../Separator\";\nimport { Popover } from \"../../Popover\";\nimport { Button } from \"../../Button\";\nimport { Calendar } from \"../../Calendar\";\n\ntype DateSelection = Date[] \| DateRange;\n\nfunction getIsDateRange(value: DateSelection): value is DateRange {\n return value && typeof value === \"object\" && !Array.isArray(value);\n}\n\nfunction parseAsDate(timestamp: number \| string \| undefined): Date \| undefined {\n if (!timestamp) return undefined;\n const numericTimestamp =\n typeof timestamp === \"string\" ? Number(timestamp) : timestamp;\n const date = new Date(numericTimestamp);\n return !Number.isNaN(date.getTime()) ? date : undefined;\n}\n\nfunction parseColumnFilterValue(value: unknown) {\n if (value === null \|\| value === undefined) {\n return [];\n }\n\n if (Array.isArray(value)) {\n return value.map((item) => {\n if (typeof item === \"number\" \|\| typeof item === \"string\") {\n return item;\n }\n return undefined;\n });\n }\n\n if (typeof value === \"string\" \|\| typeof value === \"number\") {\n return [value];\n }\n\n return [];\n}\n\ninterface DataTableDateFilterProps<TData> {\n column: Column<TData, unknown>;\n title?: string;\n multiple?: boolean;\n}\n\nexport function DataTableDateFilter<TData>({\n column,\n title,\n multiple,\n}: DataTableDateFilterProps<TData>) {\n const columnFilterValue = column.getFilterValue();\n\n const selectedDates = React.useMemo<DateSelection>(() => {\n if (!columnFilterValue) {\n return multiple ? { from: undefined, to: undefined } : [];\n }\n\n if (multiple) {\n const timestamps = parseColumnFilterValue(columnFilterValue);\n return {\n from: parseAsDate(timestamps[0]),\n to: parseAsDate(timestamps[1]),\n };\n }\n\n const timestamps = parseColumnFilterValue(columnFilterValue);\n const date = parseAsDate(timestamps[0]);\n return date ? [date] : [];\n }, [columnFilterValue, multiple]);\n\n const onSelect = React.useCallback(\n (date: Date \| DateRange \| undefined) => {\n if (!date) {\n column.setFilterValue(undefined);\n return;\n }\n\n if (multiple && !(\"getTime\" in date)) {\n const from = date.from?.getTime();\n const to = date.to?.getTime();\n column.setFilterValue(from \|\| to ? [from, to] : undefined);\n } else if (!multiple && \"getTime\" in date) {\n column.setFilterValue(date.getTime());\n }\n },\n [column, multiple]\n );\n\n const onReset = React.useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n column.setFilterValue(undefined);\n },\n [column]\n );\n\n const hasValue = React.useMemo(() => {\n if (multiple) {\n if (!getIsDateRange(selectedDates)) return false;\n return selectedDates.from \|\| selectedDates.to;\n }\n if (!Array.isArray(selectedDates)) return false;\n return selectedDates.length > 0;\n }, [multiple, selectedDates]);\n\n const formatDateRange = React.useCallback((range: DateRange) => {\n if (!range.from && !range.to) return \"\";\n if (range.from && range.to) {\n return `${formatDate(range.from)} - ${formatDate(range.to)}`;\n }\n return formatDate(range.from ?? range.to);\n }, []);\n\n const label = React.useMemo(() => {\n if (multiple) {\n if (!getIsDateRange(selectedDates)) return null;\n\n const hasSelectedDates = selectedDates.from \|\| selectedDates.to;\n const dateText = hasSelectedDates\n ? formatDateRange(selectedDates)\n : \"Select date range\";\n\n return (\n <span className=\"ds:flex ds:items-center ds:gap-2\">\n <span>{title}</span>\n {hasSelectedDates && (\n <>\n <Separator\n orientation=\"vertical\"\n className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n />\n <span>{dateText}</span>\n </>\n )}\n </span>\n );\n }\n\n if (getIsDateRange(selectedDates)) return null;\n\n const hasSelectedDate = selectedDates.length > 0;\n const dateText = hasSelectedDate\n ? formatDate(selectedDates[0])\n : \"Select date\";\n\n return (\n <span className=\"ds:flex ds:items-center ds:gap-2\">\n <span>{title}</span>\n {hasSelectedDate && (\n <>\n <Separator\n orientation=\"vertical\"\n className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n />\n <span>{dateText}</span>\n </>\n )}\n </span>\n );\n }, [selectedDates, multiple, formatDateRange, title]);\n\n const PopContent = (\n <div className=\"ds:w-auto ds:p-0\">\n {multiple ? (\n <Calendar\n autoFocus\n captionLayout=\"dropdown\"\n mode=\"range\"\n selected={\n getIsDateRange(selectedDates)\n ? selectedDates\n : { from: undefined, to: undefined }\n }\n onSelect={onSelect}\n />\n ) : (\n <Calendar\n captionLayout=\"dropdown\"\n mode=\"single\"\n selected={\n !getIsDateRange(selectedDates) ? selectedDates[0] : undefined\n }\n onSelect={onSelect}\n />\n )}\n </div>\n );\n\n return (\n <Popover content={PopContent}>\n <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n {hasValue ? (\n <div\n role=\"button\"\n aria-label={`Clear ${title} filter`}\n tabIndex={0}\n onClick={onReset}\n className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n >\n <XCircle />\n </div>\n ) : (\n <CalendarIcon />\n )}\n {label}\n </Button>\n </Popover>\n );\n}\n"],"names":["getIsDateRange","value","parseAsDate","timestamp","numericTimestamp","date","parseColumnFilterValue","item","DataTableDateFilter","column","title","multiple","columnFilterValue","selectedDates","React","timestamps","onSelect","from","to","onReset","event","hasValue","formatDateRange","range","formatDate","label","hasSelectedDates","dateText","jsxs","jsx","Fragment","Separator","hasSelectedDate","PopContent","Calendar","Popover","Button","XCircle","CalendarIcon"],"mappings":"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"}
1	+ {"version":3,"file":"data-table-date-filter.js","sources":["../../../../../src/components/Table/TableFilter/data-table-date-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport { formatDate } from \"@/utils/datetime\";\nimport type { Column } from \"@tanstack/react-table\";\nimport { CalendarIcon, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport type { DateRange } from \"react-day-picker\";\nimport { Separator } from \"../../Separator\";\nimport { Popover } from \"../../Popover\";\nimport { Button } from \"../../Button\";\nimport { Calendar } from \"../../Calendar\";\n\ntype DateSelection = Date[] \| DateRange;\n\nfunction getIsDateRange(value: DateSelection): value is DateRange {\n return value && typeof value === \"object\" && !Array.isArray(value);\n}\n\nfunction parseAsDate(timestamp: number \| string \| undefined): Date \| undefined {\n if (!timestamp) return undefined;\n const numericTimestamp =\n typeof timestamp === \"string\" ? Number(timestamp) : timestamp;\n const date = new Date(numericTimestamp);\n return !Number.isNaN(date.getTime()) ? date : undefined;\n}\n\nfunction parseColumnFilterValue(value: unknown) {\n if (value === null \|\| value === undefined) {\n return [];\n }\n\n if (Array.isArray(value)) {\n return value.map((item) => {\n if (typeof item === \"number\" \|\| typeof item === \"string\") {\n return item;\n }\n return undefined;\n });\n }\n\n if (typeof value === \"string\" \|\| typeof value === \"number\") {\n return [value];\n }\n\n return [];\n}\n\nexport interface DataTableDateFilterProps<TData> {\n column: Column<TData, unknown>;\n title?: string;\n multiple?: boolean;\n}\n\nexport function DataTableDateFilter<TData>({\n column,\n title,\n multiple,\n}: DataTableDateFilterProps<TData>) {\n const columnFilterValue = column.getFilterValue();\n\n const selectedDates = React.useMemo<DateSelection>(() => {\n if (!columnFilterValue) {\n return multiple ? { from: undefined, to: undefined } : [];\n }\n\n if (multiple) {\n const timestamps = parseColumnFilterValue(columnFilterValue);\n return {\n from: parseAsDate(timestamps[0]),\n to: parseAsDate(timestamps[1]),\n };\n }\n\n const timestamps = parseColumnFilterValue(columnFilterValue);\n const date = parseAsDate(timestamps[0]);\n return date ? [date] : [];\n }, [columnFilterValue, multiple]);\n\n const onSelect = React.useCallback(\n (date: Date \| DateRange \| undefined) => {\n if (!date) {\n column.setFilterValue(undefined);\n return;\n }\n\n if (multiple && !(\"getTime\" in date)) {\n const from = date.from?.getTime();\n const to = date.to?.getTime();\n column.setFilterValue(from \|\| to ? [from, to] : undefined);\n } else if (!multiple && \"getTime\" in date) {\n column.setFilterValue(date.getTime());\n }\n },\n [column, multiple]\n );\n\n const onReset = React.useCallback(\n (event: React.MouseEvent) => {\n event.stopPropagation();\n column.setFilterValue(undefined);\n },\n [column]\n );\n\n const hasValue = React.useMemo(() => {\n if (multiple) {\n if (!getIsDateRange(selectedDates)) return false;\n return selectedDates.from \|\| selectedDates.to;\n }\n if (!Array.isArray(selectedDates)) return false;\n return selectedDates.length > 0;\n }, [multiple, selectedDates]);\n\n const formatDateRange = React.useCallback((range: DateRange) => {\n if (!range.from && !range.to) return \"\";\n if (range.from && range.to) {\n return `${formatDate(range.from)} - ${formatDate(range.to)}`;\n }\n return formatDate(range.from ?? range.to);\n }, []);\n\n const label = React.useMemo(() => {\n if (multiple) {\n if (!getIsDateRange(selectedDates)) return null;\n\n const hasSelectedDates = selectedDates.from \|\| selectedDates.to;\n const dateText = hasSelectedDates\n ? formatDateRange(selectedDates)\n : \"Select date range\";\n\n return (\n <span className=\"ds:flex ds:items-center ds:gap-2\">\n <span>{title}</span>\n {hasSelectedDates && (\n <>\n <Separator\n orientation=\"vertical\"\n className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n />\n <span>{dateText}</span>\n </>\n )}\n </span>\n );\n }\n\n if (getIsDateRange(selectedDates)) return null;\n\n const hasSelectedDate = selectedDates.length > 0;\n const dateText = hasSelectedDate\n ? formatDate(selectedDates[0])\n : \"Select date\";\n\n return (\n <span className=\"ds:flex ds:items-center ds:gap-2\">\n <span>{title}</span>\n {hasSelectedDate && (\n <>\n <Separator\n orientation=\"vertical\"\n className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n />\n <span>{dateText}</span>\n </>\n )}\n </span>\n );\n }, [selectedDates, multiple, formatDateRange, title]);\n\n const PopContent = (\n <div className=\"ds:w-auto ds:p-0\">\n {multiple ? (\n <Calendar\n autoFocus\n captionLayout=\"dropdown\"\n mode=\"range\"\n selected={\n getIsDateRange(selectedDates)\n ? selectedDates\n : { from: undefined, to: undefined }\n }\n onSelect={onSelect}\n />\n ) : (\n <Calendar\n captionLayout=\"dropdown\"\n mode=\"single\"\n selected={\n !getIsDateRange(selectedDates) ? selectedDates[0] : undefined\n }\n onSelect={onSelect}\n />\n )}\n </div>\n );\n\n return (\n <Popover content={PopContent}>\n <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n {hasValue ? (\n <div\n role=\"button\"\n aria-label={`Clear ${title} filter`}\n tabIndex={0}\n onClick={onReset}\n className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n >\n <XCircle />\n </div>\n ) : (\n <CalendarIcon />\n )}\n {label}\n </Button>\n </Popover>\n );\n}\n"],"names":["getIsDateRange","value","parseAsDate","timestamp","numericTimestamp","date","parseColumnFilterValue","item","DataTableDateFilter","column","title","multiple","columnFilterValue","selectedDates","React","timestamps","onSelect","from","to","onReset","event","hasValue","formatDateRange","range","formatDate","label","hasSelectedDates","dateText","jsxs","jsx","Fragment","Separator","hasSelectedDate","PopContent","Calendar","Popover","Button","XCircle","CalendarIcon"],"mappings":"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"}

package/dist/esm/components/Table/TableFilter/data-table-filter-popover.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-table-filter-popover.js","sources":["../../../../../src/components/Table/TableFilter/data-table-filter-popover.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { Popover } from \"../../Popover\";\nimport { Input } from \"../../Input\";\nimport { Checkbox } from \"../../Checkbox\";\nimport { Radio } from \"../../Radio\";\nimport { DataTableSliderFilter } from \"./data-table-slider-filter\";\nimport { DataTableDateFilter } from \"./data-table-date-filter\";\nimport { Separator } from \"@/components/Separator\";\nimport { Button } from \"@/components/Button\";\n\~~ninterface~~ DataTableFilterPopoverProps<TData> {\n column: Column<TData>;\n trigger: React.ReactNode;\n open?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function DataTableFilterPopover<TData>({\n column,\n trigger,\n open,\n onOpenChange,\n}: DataTableFilterPopoverProps<TData>) {\n const [internalOpen, setInternalOpen] = React.useState(false);\n\n const isOpen = open !== undefined ? open : internalOpen;\n const setIsOpen = onOpenChange \|\| setInternalOpen;\n\n const columnMeta = column.columnDef.meta;\n\n const renderFilterContent = () => {\n if (!columnMeta?.variant) return <div>No filter available</div>;\n\n switch (columnMeta.variant) {\n case \"text\":\n return (\n <Input\n placeholder={columnMeta.placeholder ?? columnMeta.label}\n value={(column.getFilterValue() as string) ?? \"\"}\n onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n column.setFilterValue(event.target.value)\n }\n className=\"ds:h-8 ds:w-full\"\n />\n );\n\n case \"number\":\n return (\n <Input\n type=\"number\"\n placeholder={columnMeta.placeholder ?? columnMeta.label}\n value={(column.getFilterValue() as string) ?? \"\"}\n onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n column.setFilterValue(event.target.value)\n }\n className=\"ds:h-8 ds:w-full\"\n />\n );\n\n case \"date\":\n case \"dateRange\":\n return (\n <DataTableDateFilter\n column={column}\n title={columnMeta.label ?? column.id}\n multiple={columnMeta.variant === \"dateRange\"}\n />\n );\n\n case \"range\":\n return (\n <DataTableSliderFilter\n column={column}\n title={columnMeta.label ?? column.id}\n />\n );\n\n case \"select\":\n case \"multiSelect\": {\n const options = columnMeta.options \|\| [];\n const multiple = columnMeta.variant === \"multiSelect\";\n\n if (multiple) {\n const currentValues = (column.getFilterValue() as string[]) \|\| [];\n return (\n <>\n <div className=\"ds:space-y-2 ds:max-h-48 ds:overflow-y-auto ds:text-sm\">\n {options.map((option) => (\n <div\n key={option.value}\n className=\"ds:flex ds:items-center ds:space-x-2\"\n >\n <Checkbox\n checked={currentValues.includes(option.value)}\n onCheckedChange={(checked) => {\n if (checked) {\n column.setFilterValue([\n ...currentValues,\n option.value,\n ]);\n } else {\n column.setFilterValue(\n currentValues.filter((v) => v !== option.value)\n );\n }\n }}\n label={option.label}\n />\n </div>\n ))}\n </div>\n {/* <Separator className=\"my-2\" /> /}\n {/ <div className=\"flex justify-center gap-0 mt-2\">\n <Button\n variant=\"ghost\"\n onClick={() =>\n column.setFilterValue(options.map((o) => o.value))\n }\n >\n Check All\n </Button>\n <Button\n variant=\"ghost\"\n onClick={() => column.setFilterValue(undefined)}\n >\n <X className=\"size-3\" />\n Clear Filter\n </Button>\n </div> */}\n </>\n );\n } else {\n const currentValue = column.getFilterValue() as string;\n return (\n <Radio\n value={currentValue}\n onValueChange={(value) => column.setFilterValue(value)}\n options={options.map((option) => ({\n label: option.label,\n value: option.value,\n }))}\n className=\"ds:p-1\"\n />\n );\n }\n }\n\n default:\n return <div>No filter available</div>;\n }\n };\n\n const hasFilterValue = column.getFilterValue() != null;\n\n return (\n <Popover\n open={isOpen}\n onOpenChange={setIsOpen}\n trigger={trigger}\n content={\n <div className=\"ds:p-2 ds:min-w-32\">\n {renderFilterContent()}\n {hasFilterValue && (\n <>\n <Separator className=\"ds:mt-3 ds:mb-1\" />\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={() => column.setFilterValue(undefined)}\n >\n <X className=\"ds:size-3\" />\n Clear Filter\n </Button>\n </>\n )}\n </div>\n }\n contentClassName=\"ds:p-0\"\n />\n );\n}\n"],"names":["DataTableFilterPopover","column","trigger","open","onOpenChange","internalOpen","setInternalOpen","React","isOpen","setIsOpen","columnMeta","renderFilterContent","jsx","Input","event","DataTableDateFilter","DataTableSliderFilter","options","currentValues","Fragment","option","Checkbox","checked","v","currentValue","Radio","value","hasFilterValue","Popover","jsxs","Separator","Button","X"],"mappings":"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"}
1	+ {"version":3,"file":"data-table-filter-popover.js","sources":["../../../../../src/components/Table/TableFilter/data-table-filter-popover.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { Popover } from \"../../Popover\";\nimport { Input } from \"../../Input\";\nimport { Checkbox } from \"../../Checkbox\";\nimport { Radio } from \"../../Radio\";\nimport { DataTableSliderFilter } from \"./data-table-slider-filter\";\nimport { DataTableDateFilter } from \"./data-table-date-filter\";\nimport { Separator } from \"@/components/Separator\";\nimport { Button } from \"@/components/Button\";\n\nexport interface DataTableFilterPopoverProps<TData> {\n column: Column<TData>;\n trigger: React.ReactNode;\n open?: boolean;\n onOpenChange?: (isOpen: boolean) => void;\n}\n\nexport function DataTableFilterPopover<TData>({\n column,\n trigger,\n open,\n onOpenChange,\n}: DataTableFilterPopoverProps<TData>) {\n const [internalOpen, setInternalOpen] = React.useState(false);\n\n const isOpen = open !== undefined ? open : internalOpen;\n const setIsOpen = onOpenChange \|\| setInternalOpen;\n\n const columnMeta = column.columnDef.meta;\n\n const renderFilterContent = () => {\n if (!columnMeta?.variant) return <div>No filter available</div>;\n\n switch (columnMeta.variant) {\n case \"text\":\n return (\n <Input\n placeholder={columnMeta.placeholder ?? columnMeta.label}\n value={(column.getFilterValue() as string) ?? \"\"}\n onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n column.setFilterValue(event.target.value)\n }\n className=\"ds:h-8 ds:w-full\"\n />\n );\n\n case \"number\":\n return (\n <Input\n type=\"number\"\n placeholder={columnMeta.placeholder ?? columnMeta.label}\n value={(column.getFilterValue() as string) ?? \"\"}\n onChange={(event: React.ChangeEvent<HTMLInputElement>) =>\n column.setFilterValue(event.target.value)\n }\n className=\"ds:h-8 ds:w-full\"\n />\n );\n\n case \"date\":\n case \"dateRange\":\n return (\n <DataTableDateFilter\n column={column}\n title={columnMeta.label ?? column.id}\n multiple={columnMeta.variant === \"dateRange\"}\n />\n );\n\n case \"range\":\n return (\n <DataTableSliderFilter\n column={column}\n title={columnMeta.label ?? column.id}\n />\n );\n\n case \"select\":\n case \"multiSelect\": {\n const options = columnMeta.options \|\| [];\n const multiple = columnMeta.variant === \"multiSelect\";\n\n if (multiple) {\n const currentValues = (column.getFilterValue() as string[]) \|\| [];\n return (\n <>\n <div className=\"ds:space-y-2 ds:max-h-48 ds:overflow-y-auto ds:text-sm\">\n {options.map((option) => (\n <div\n key={option.value}\n className=\"ds:flex ds:items-center ds:space-x-2\"\n >\n <Checkbox\n checked={currentValues.includes(option.value)}\n onCheckedChange={(checked) => {\n if (checked) {\n column.setFilterValue([\n ...currentValues,\n option.value,\n ]);\n } else {\n column.setFilterValue(\n currentValues.filter((v) => v !== option.value)\n );\n }\n }}\n label={option.label}\n />\n </div>\n ))}\n </div>\n {/* <Separator className=\"my-2\" /> /}\n {/ <div className=\"flex justify-center gap-0 mt-2\">\n <Button\n variant=\"ghost\"\n onClick={() =>\n column.setFilterValue(options.map((o) => o.value))\n }\n >\n Check All\n </Button>\n <Button\n variant=\"ghost\"\n onClick={() => column.setFilterValue(undefined)}\n >\n <X className=\"size-3\" />\n Clear Filter\n </Button>\n </div> */}\n </>\n );\n } else {\n const currentValue = column.getFilterValue() as string;\n return (\n <Radio\n value={currentValue}\n onValueChange={(value) => column.setFilterValue(value)}\n options={options.map((option) => ({\n label: option.label,\n value: option.value,\n }))}\n className=\"ds:p-1\"\n />\n );\n }\n }\n\n default:\n return <div>No filter available</div>;\n }\n };\n\n const hasFilterValue = column.getFilterValue() != null;\n\n return (\n <Popover\n open={isOpen}\n onOpenChange={setIsOpen}\n trigger={trigger}\n content={\n <div className=\"ds:p-2 ds:min-w-32\">\n {renderFilterContent()}\n {hasFilterValue && (\n <>\n <Separator className=\"ds:mt-3 ds:mb-1\" />\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={() => column.setFilterValue(undefined)}\n >\n <X className=\"ds:size-3\" />\n Clear Filter\n </Button>\n </>\n )}\n </div>\n }\n contentClassName=\"ds:p-0\"\n />\n );\n}\n"],"names":["DataTableFilterPopover","column","trigger","open","onOpenChange","internalOpen","setInternalOpen","React","isOpen","setIsOpen","columnMeta","renderFilterContent","jsx","Input","event","DataTableDateFilter","DataTableSliderFilter","options","currentValues","Fragment","option","Checkbox","checked","v","currentValue","Radio","value","hasFilterValue","Popover","jsxs","Separator","Button","X"],"mappings":"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"}

package/dist/esm/components/Table/TableFilter/data-table-slider-filter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-table-slider-filter.js","sources":["../../../../../src/components/Table/TableFilter/data-table-slider-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { PlusCircle, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"../../Button\";\nimport { Input } from \"../../Input\";\nimport { Popover } from \"../../Popover\";\nimport { Separator } from \"../../Separator\";\nimport { Slider } from \"../../Slider\";\nimport { cn } from \"@dsui/ui/index\";\n\ninterface Range {\n min: number;\n max: number;\n}\n\ntype RangeValue = [number, number];\n\nfunction getIsValidRange(value: unknown): value is RangeValue {\n return (\n Array.isArray(value) &&\n value.length === 2 &&\n typeof value[0] === \"number\" &&\n typeof value[1] === \"number\"\n );\n}\n\nfunction parseValuesAsNumbers(value: unknown): RangeValue \| undefined {\n if (\n Array.isArray(value) &&\n value.length === 2 &&\n value.every(\n (v) =>\n (typeof v === \"string\" \|\| typeof v === \"number\") && !Number.isNaN(v)\n )\n ) {\n return [Number(value[0]), Number(value[1])];\n }\n\n return undefined;\n}\n\ninterface DataTableSliderFilterProps<TData> {\n column: Column<TData, unknown>;\n title?: string;\n}\n\nexport function DataTableSliderFilter<TData>({\n column,\n title,\n}: DataTableSliderFilterProps<TData>) {\n const id = React.useId();\n\n const columnFilterValue = parseValuesAsNumbers(column.getFilterValue());\n\n const defaultRange = column.columnDef.meta?.range;\n const unit = column.columnDef.meta?.unit;\n\n const { min, max, step } = React.useMemo<Range & { step: number }>(() => {\n let minValue = 0;\n let maxValue = 100;\n\n if (defaultRange && getIsValidRange(defaultRange)) {\n [minValue, maxValue] = defaultRange;\n } else {\n const values = column.getFacetedMinMaxValues();\n if (values && Array.isArray(values) && values.length === 2) {\n const [facetMinValue, facetMaxValue] = values;\n if (\n typeof facetMinValue === \"number\" &&\n typeof facetMaxValue === \"number\"\n ) {\n minValue = facetMinValue;\n maxValue = facetMaxValue;\n }\n }\n }\n\n const rangeSize = maxValue - minValue;\n const step =\n rangeSize <= 20\n ? 1\n : rangeSize <= 100\n ? Math.ceil(rangeSize / 20)\n : Math.ceil(rangeSize / 50);\n\n return { min: minValue, max: maxValue, step };\n }, [column, defaultRange]);\n\n const range = React.useMemo((): RangeValue => {\n return columnFilterValue ?? [min, max];\n }, [columnFilterValue, min, max]);\n\n const formatValue = React.useCallback((value: number) => {\n return value.toLocaleString(undefined, { maximumFractionDigits: 0 });\n }, []);\n\n const onFromInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const numValue = Number(event.target.value);\n if (!Number.isNaN(numValue) && numValue >= min && numValue <= range[1]) {\n column.setFilterValue([numValue, range[1]]);\n }\n },\n [column, min, range]\n );\n\n const onToInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const numValue = Number(event.target.value);\n if (!Number.isNaN(numValue) && numValue <= max && numValue >= range[0]) {\n column.setFilterValue([range[0], numValue]);\n }\n },\n [column, max, range]\n );\n\n const onSliderValueChange = React.useCallback(\n (value: RangeValue) => {\n if (Array.isArray(value) && value.length === 2) {\n column.setFilterValue(value);\n }\n },\n [column]\n );\n\n const onReset = React.useCallback(\n (event: React.MouseEvent) => {\n if (event.target instanceof HTMLDivElement) {\n event.stopPropagation();\n }\n column.setFilterValue(undefined);\n },\n [column]\n );\n\n const PopContent = (\n <div className=\"ds:flex ds:w-auto ds:flex-col ds:gap-4\">\n <div className=\"ds:flex ds:flex-col ds:gap-3\">\n <p className=\"ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70\">\n {title}\n </p>\n <div className=\"ds:flex ds:items-center ds:gap-4\">\n <label htmlFor={`${id}-from`} className=\"ds:sr-only\">\n From\n </label>\n <div className=\"ds:relative\">\n <Input\n id={`${id}-from`}\n type=\"number\"\n aria-valuemin={min}\n aria-valuemax={max}\n inputMode=\"numeric\"\n pattern=\"[0-9]\"\n placeholder={min.toString()}\n min={min}\n max={max}\n value={range[0]?.toString()}\n onChange={onFromInputChange}\n className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n />\n {unit && (\n <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n {unit}\n </span>\n )}\n </div>\n <label htmlFor={`${id}-to`} className=\"ds:sr-only\">\n to\n </label>\n <div className=\"ds:relative\">\n <Input\n id={`${id}-to`}\n type=\"number\"\n aria-valuemin={min}\n aria-valuemax={max}\n inputMode=\"numeric\"\n pattern=\"[0-9]\"\n placeholder={max.toString()}\n min={min}\n max={max}\n value={range[1]?.toString()}\n onChange={onToInputChange}\n className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n />\n {unit && (\n <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n {unit}\n </span>\n )}\n </div>\n </div>\n <label htmlFor={`${id}-slider`} className=\"ds:sr-only\">\n {title} slider\n </label>\n <Slider\n id={`${id}-slider`}\n min={min}\n max={max}\n step={step}\n value={range}\n onValueChange={onSliderValueChange}\n />\n </div>\n <Button\n aria-label={`Clear ${title} filter`}\n variant=\"outline\"\n size=\"sm\"\n onClick={onReset}\n >\n Clear\n </Button>\n </div>\n );\n\n return (\n <Popover content={PopContent}>\n <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n {columnFilterValue ? (\n <div\n role=\"button\"\n aria-label={`Clear ${title} filter`}\n tabIndex={0}\n className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n onClick={onReset}\n >\n <XCircle />\n </div>\n ) : (\n <PlusCircle />\n )}\n <span>{title}</span>\n {columnFilterValue ? (\n <>\n <Separator\n orientation=\"vertical\"\n className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n />\n {formatValue(columnFilterValue[0])} -{\" \"}\n {formatValue(columnFilterValue[1])}\n {unit ? ` ${unit}` : \"\"}\n </>\n ) : null}\n </Button>\n </Popover>\n );\n}\n"],"names":["getIsValidRange","value","parseValuesAsNumbers","v","DataTableSliderFilter","column","title","id","React","columnFilterValue","defaultRange","unit","min","max","step","minValue","maxValue","values","facetMinValue","facetMaxValue","rangeSize","range","formatValue","onFromInputChange","event","numValue","onToInputChange","onSliderValueChange","onReset","PopContent","jsxs","jsx","Input","cn","Slider","Button","Popover","XCircle","PlusCircle","Fragment","Separator"],"mappings":"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"}
1	+ {"version":3,"file":"data-table-slider-filter.js","sources":["../../../../../src/components/Table/TableFilter/data-table-slider-filter.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport { PlusCircle, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\nimport { Button } from \"../../Button\";\nimport { Input } from \"../../Input\";\nimport { Popover } from \"../../Popover\";\nimport { Separator } from \"../../Separator\";\nimport { Slider } from \"../../Slider\";\nimport { cn } from \"@dsui/ui/index\";\n\ninterface Range {\n min: number;\n max: number;\n}\n\ntype RangeValue = [number, number];\n\nfunction getIsValidRange(value: unknown): value is RangeValue {\n return (\n Array.isArray(value) &&\n value.length === 2 &&\n typeof value[0] === \"number\" &&\n typeof value[1] === \"number\"\n );\n}\n\nfunction parseValuesAsNumbers(value: unknown): RangeValue \| undefined {\n if (\n Array.isArray(value) &&\n value.length === 2 &&\n value.every(\n (v) =>\n (typeof v === \"string\" \|\| typeof v === \"number\") && !Number.isNaN(v)\n )\n ) {\n return [Number(value[0]), Number(value[1])];\n }\n\n return undefined;\n}\n\nexport interface DataTableSliderFilterProps<TData> {\n column: Column<TData, unknown>;\n title?: string;\n}\n\nexport function DataTableSliderFilter<TData>({\n column,\n title,\n}: DataTableSliderFilterProps<TData>) {\n const id = React.useId();\n\n const columnFilterValue = parseValuesAsNumbers(column.getFilterValue());\n\n const defaultRange = column.columnDef.meta?.range;\n const unit = column.columnDef.meta?.unit;\n\n const { min, max, step } = React.useMemo<Range & { step: number }>(() => {\n let minValue = 0;\n let maxValue = 100;\n\n if (defaultRange && getIsValidRange(defaultRange)) {\n [minValue, maxValue] = defaultRange;\n } else {\n const values = column.getFacetedMinMaxValues();\n if (values && Array.isArray(values) && values.length === 2) {\n const [facetMinValue, facetMaxValue] = values;\n if (\n typeof facetMinValue === \"number\" &&\n typeof facetMaxValue === \"number\"\n ) {\n minValue = facetMinValue;\n maxValue = facetMaxValue;\n }\n }\n }\n\n const rangeSize = maxValue - minValue;\n const step =\n rangeSize <= 20\n ? 1\n : rangeSize <= 100\n ? Math.ceil(rangeSize / 20)\n : Math.ceil(rangeSize / 50);\n\n return { min: minValue, max: maxValue, step };\n }, [column, defaultRange]);\n\n const range = React.useMemo((): RangeValue => {\n return columnFilterValue ?? [min, max];\n }, [columnFilterValue, min, max]);\n\n const formatValue = React.useCallback((value: number) => {\n return value.toLocaleString(undefined, { maximumFractionDigits: 0 });\n }, []);\n\n const onFromInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const numValue = Number(event.target.value);\n if (!Number.isNaN(numValue) && numValue >= min && numValue <= range[1]) {\n column.setFilterValue([numValue, range[1]]);\n }\n },\n [column, min, range]\n );\n\n const onToInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const numValue = Number(event.target.value);\n if (!Number.isNaN(numValue) && numValue <= max && numValue >= range[0]) {\n column.setFilterValue([range[0], numValue]);\n }\n },\n [column, max, range]\n );\n\n const onSliderValueChange = React.useCallback(\n (value: RangeValue) => {\n if (Array.isArray(value) && value.length === 2) {\n column.setFilterValue(value);\n }\n },\n [column]\n );\n\n const onReset = React.useCallback(\n (event: React.MouseEvent) => {\n if (event.target instanceof HTMLDivElement) {\n event.stopPropagation();\n }\n column.setFilterValue(undefined);\n },\n [column]\n );\n\n const PopContent = (\n <div className=\"ds:flex ds:w-auto ds:flex-col ds:gap-4\">\n <div className=\"ds:flex ds:flex-col ds:gap-3\">\n <p className=\"ds:font-medium ds:leading-none ds:peer-disabled:cursor-not-allowed ds:peer-disabled:opacity-70\">\n {title}\n </p>\n <div className=\"ds:flex ds:items-center ds:gap-4\">\n <label htmlFor={`${id}-from`} className=\"ds:sr-only\">\n From\n </label>\n <div className=\"ds:relative\">\n <Input\n id={`${id}-from`}\n type=\"number\"\n aria-valuemin={min}\n aria-valuemax={max}\n inputMode=\"numeric\"\n pattern=\"[0-9]\"\n placeholder={min.toString()}\n min={min}\n max={max}\n value={range[0]?.toString()}\n onChange={onFromInputChange}\n className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n />\n {unit && (\n <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n {unit}\n </span>\n )}\n </div>\n <label htmlFor={`${id}-to`} className=\"ds:sr-only\">\n to\n </label>\n <div className=\"ds:relative\">\n <Input\n id={`${id}-to`}\n type=\"number\"\n aria-valuemin={min}\n aria-valuemax={max}\n inputMode=\"numeric\"\n pattern=\"[0-9]\"\n placeholder={max.toString()}\n min={min}\n max={max}\n value={range[1]?.toString()}\n onChange={onToInputChange}\n className={cn(\"ds:h-8 ds:w-24\", unit && \"ds:pr-8\")}\n />\n {unit && (\n <span className=\"ds:absolute ds:top-0 ds:right-0 ds:bottom-0 ds:flex ds:items-center ds:rounded-r-md ds:bg-accent ds:px-2 ds:text-muted-foreground ds:text-sm\">\n {unit}\n </span>\n )}\n </div>\n </div>\n <label htmlFor={`${id}-slider`} className=\"ds:sr-only\">\n {title} slider\n </label>\n <Slider\n id={`${id}-slider`}\n min={min}\n max={max}\n step={step}\n value={range}\n onValueChange={onSliderValueChange}\n />\n </div>\n <Button\n aria-label={`Clear ${title} filter`}\n variant=\"outline\"\n size=\"sm\"\n onClick={onReset}\n >\n Clear\n </Button>\n </div>\n );\n\n return (\n <Popover content={PopContent}>\n <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed ds:font-normal\">\n {columnFilterValue ? (\n <div\n role=\"button\"\n aria-label={`Clear ${title} filter`}\n tabIndex={0}\n className=\"ds:rounded-sm ds:opacity-70 ds:transition-opacity ds:hover:opacity-100 ds:focus-visible:outline-none ds:focus-visible:ring-1 ds:focus-visible:ring-ring\"\n onClick={onReset}\n >\n <XCircle />\n </div>\n ) : (\n <PlusCircle />\n )}\n <span>{title}</span>\n {columnFilterValue ? (\n <>\n <Separator\n orientation=\"vertical\"\n className=\"ds:mx-0.5 ds:data-[orientation=vertical]:h-4\"\n />\n {formatValue(columnFilterValue[0])} -{\" \"}\n {formatValue(columnFilterValue[1])}\n {unit ? ` ${unit}` : \"\"}\n </>\n ) : null}\n </Button>\n </Popover>\n );\n}\n"],"names":["getIsValidRange","value","parseValuesAsNumbers","v","DataTableSliderFilter","column","title","id","React","columnFilterValue","defaultRange","unit","min","max","step","minValue","maxValue","values","facetMinValue","facetMaxValue","rangeSize","range","formatValue","onFromInputChange","event","numValue","onToInputChange","onSliderValueChange","onReset","PopContent","jsxs","jsx","Input","cn","Slider","Button","Popover","XCircle","PlusCircle","Fragment","Separator"],"mappings":"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"}

package/dist/esm/components/Table/data-table-column-header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"data-table-column-header.js","sources":["../../../../src/components/Table/data-table-column-header.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport {\n ChevronDown,\n ChevronsUpDown,\n ChevronUp,\n EyeOff,\n Filter,\n X,\n} from \"lucide-react\";\n\nimport { cn } from \"@dsui/ui\";\nimport DropdownMenu, {\n type DropdownMenuItem,\n} from \"../DropdownMenu/DropdownMenu\";\nimport { DataTableFilterPopover } from \"./TableFilter/data-table-filter-popover\";\nimport { Button } from \"../Button\";\n\~~ninterface~~ DataTableColumnHeaderProps<TData, TValue> {\n column: Column<TData, TValue>;\n label?: string;\n className?: string;\n}\n\nexport function DataTableColumnHeader<TData, TValue>({\n column,\n label,\n className,\n}: DataTableColumnHeaderProps<TData, TValue>) {\n const displayLabel =\n label \|\|\n (typeof column.columnDef.header === \"string\"\n ? column.columnDef.header\n : null);\n\n const hasActions =\n column.getCanSort() \|\| column.getCanHide() \|\| column.getCanFilter();\n\n if (!hasActions) {\n return <div className={cn(className)}>{displayLabel}</div>;\n }\n\n const sortTrigger = (\n <button className=\"ds:-ml-1.5 ds:flex ds:h-8 ds:items-center ds:gap-1.5 ds:rounded-md ds:px-2 ds:py-1.5 ds:hover:bg-accent ds:focus:outline-none ds:focus:ring-1 ds:focus:ring-ring ds:data-[state=open]:bg-accent ds:[&_svg]:size-4 ds:[&_svg]:shrink-0 ds:[&_svg]:text-muted-foreground\">\n {displayLabel}\n {column.getCanSort() &&\n (column.getIsSorted() === \"desc\" ? (\n <ChevronDown />\n ) : column.getIsSorted() === \"asc\" ? (\n <ChevronUp />\n ) : (\n <ChevronsUpDown />\n ))}\n </button>\n );\n\n const filterButton =\n column.getCanFilter() && column.columnDef.meta?.variant ? (\n <DataTableFilterPopover\n column={column}\n trigger={\n <Button\n variant=\"ghost\"\n className={cn(\n \"ds:hover:bg-accent ds:rounded ds:p-1\",\n column.getFilterValue() ? \"ds:text-primary\" : \"\"\n )}\n >\n <Filter className=\"ds:size-4\" />\n </Button>\n }\n />\n ) : null;\n\n const items: DropdownMenuItem[] = [];\n\n if (column.getCanSort()) {\n items.push({\n key: \"asc\",\n type: \"checkbox\",\n label: \"Asc\",\n icon: <ChevronUp />,\n checked: column.getIsSorted() === \"asc\",\n onClick: () => column.toggleSorting(false),\n className:\n \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n });\n items.push({\n key: \"desc\",\n type: \"checkbox\",\n label: \"Desc\",\n icon: <ChevronDown />,\n checked: column.getIsSorted() === \"desc\",\n onClick: () => column.toggleSorting(true),\n className:\n \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n });\n if (column.getIsSorted()) {\n items.push({\n key: \"reset\",\n type: \"item\",\n label: \"Reset\",\n icon: <X />,\n onClick: () => column.clearSorting(),\n className: \"ds:pl-2 ds:[&_svg]:text-muted-foreground\",\n });\n }\n }\n\n if (column.getCanHide()) {\n items.push({\n key: \"hide\",\n type: \"checkbox\",\n label: \"Hide\",\n icon: <EyeOff />,\n checked: !column.getIsVisible(),\n onClick: () => column.toggleVisibility(false),\n className:\n \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n });\n }\n\n return (\n <div className={cn(\"ds:flex ds:items-center ds:gap-1.5\", className)}>\n <DropdownMenu\n trigger={sortTrigger}\n items={items}\n align=\"start\"\n contentClassName=\"ds:w-28\"\n />\n {filterButton}\n </div>\n );\n}\n"],"names":["DataTableColumnHeader","column","label","className","displayLabel","cn","sortTrigger","jsxs","jsx","ChevronDown","ChevronUp","ChevronsUpDown","filterButton","DataTableFilterPopover","Button","Filter","items","X","EyeOff","DropdownMenu"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,SAASA,GAAqC;AAAA,EACnD,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AACF,GAA8C;AAC5C,QAAMC,IACJF,MACC,OAAOD,EAAO,UAAU,UAAW,WAChCA,EAAO,UAAU,SACjB;AAKN,MAAI,EAFFA,EAAO,WAAA,KAAgBA,EAAO,WAAA,KAAgBA,EAAO,aAAA;AAGrD,6BAAQ,OAAA,EAAI,WAAWI,EAAGF,CAAS,GAAI,UAAAC,GAAa;AAGtD,QAAME,IACJ,gBAAAC,EAAC,UAAA,EAAO,WAAU,0QACf,UAAA;AAAA,IAAAH;AAAA,IACAH,EAAO,WAAA,MACLA,EAAO,YAAA,MAAkB,SACxB,gBAAAO,EAACC,GAAA,EAAY,IACXR,EAAO,kBAAkB,0BAC1BS,GAAA,CAAA,CAAU,sBAEVC,GAAA,EAAe;AAAA,EAAA,GAEtB,GAGIC,IACJX,EAAO,aAAA,KAAkBA,EAAO,UAAU,MAAM,UAC9C,gBAAAO;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,QAAAZ;AAAA,MACA,SACE,gBAAAO;AAAA,QAACM;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,WAAWT;AAAA,YACT;AAAA,YACAJ,EAAO,eAAA,IAAmB,oBAAoB;AAAA,UAAA;AAAA,UAGhD,UAAA,gBAAAO,EAACO,GAAA,EAAO,WAAU,YAAA,CAAY;AAAA,QAAA;AAAA,MAAA;AAAA,IAChC;AAAA,EAAA,IAGF,MAEAC,IAA4B,CAAA;AAElC,SAAIf,EAAO,iBACTe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAON,GAAA,EAAU;AAAA,IACjB,SAAST,EAAO,YAAA,MAAkB;AAAA,IAClC,SAAS,MAAMA,EAAO,cAAc,EAAK;AAAA,IACzC,WACE;AAAA,EAAA,CACH,GACDe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAOP,GAAA,EAAY;AAAA,IACnB,SAASR,EAAO,YAAA,MAAkB;AAAA,IAClC,SAAS,MAAMA,EAAO,cAAc,EAAI;AAAA,IACxC,WACE;AAAA,EAAA,CACH,GACGA,EAAO,iBACTe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAOC,GAAA,EAAE;AAAA,IACT,SAAS,MAAMhB,EAAO,aAAA;AAAA,IACtB,WAAW;AAAA,EAAA,CACZ,IAIDA,EAAO,gBACTe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAOE,GAAA,EAAO;AAAA,IACd,SAAS,CAACjB,EAAO,aAAA;AAAA,IACjB,SAAS,MAAMA,EAAO,iBAAiB,EAAK;AAAA,IAC5C,WACE;AAAA,EAAA,CACH,qBAIA,OAAA,EAAI,WAAWI,EAAG,sCAAsCF,CAAS,GAChE,UAAA;AAAA,IAAA,gBAAAK;AAAA,MAACW;AAAA,MAAA;AAAA,QACC,SAASb;AAAA,QACT,OAAAU;AAAA,QACA,OAAM;AAAA,QACN,kBAAiB;AAAA,MAAA;AAAA,IAAA;AAAA,IAElBJ;AAAA,EAAA,GACH;AAEJ;"}
1	+ {"version":3,"file":"data-table-column-header.js","sources":["../../../../src/components/Table/data-table-column-header.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column } from \"@tanstack/react-table\";\nimport {\n ChevronDown,\n ChevronsUpDown,\n ChevronUp,\n EyeOff,\n Filter,\n X,\n} from \"lucide-react\";\n\nimport { cn } from \"@dsui/ui\";\nimport DropdownMenu, {\n type DropdownMenuItem,\n} from \"../DropdownMenu/DropdownMenu\";\nimport { DataTableFilterPopover } from \"./TableFilter/data-table-filter-popover\";\nimport { Button } from \"../Button\";\n\nexport interface DataTableColumnHeaderProps<TData, TValue> {\n column: Column<TData, TValue>;\n label?: string;\n className?: string;\n}\n\nexport function DataTableColumnHeader<TData, TValue>({\n column,\n label,\n className,\n}: DataTableColumnHeaderProps<TData, TValue>) {\n const displayLabel =\n label \|\|\n (typeof column.columnDef.header === \"string\"\n ? column.columnDef.header\n : null);\n\n const hasActions =\n column.getCanSort() \|\| column.getCanHide() \|\| column.getCanFilter();\n\n if (!hasActions) {\n return <div className={cn(className)}>{displayLabel}</div>;\n }\n\n const sortTrigger = (\n <button className=\"ds:-ml-1.5 ds:flex ds:h-8 ds:items-center ds:gap-1.5 ds:rounded-md ds:px-2 ds:py-1.5 ds:hover:bg-accent ds:focus:outline-none ds:focus:ring-1 ds:focus:ring-ring ds:data-[state=open]:bg-accent ds:[&_svg]:size-4 ds:[&_svg]:shrink-0 ds:[&_svg]:text-muted-foreground\">\n {displayLabel}\n {column.getCanSort() &&\n (column.getIsSorted() === \"desc\" ? (\n <ChevronDown />\n ) : column.getIsSorted() === \"asc\" ? (\n <ChevronUp />\n ) : (\n <ChevronsUpDown />\n ))}\n </button>\n );\n\n const filterButton =\n column.getCanFilter() && column.columnDef.meta?.variant ? (\n <DataTableFilterPopover\n column={column}\n trigger={\n <Button\n variant=\"ghost\"\n className={cn(\n \"ds:hover:bg-accent ds:rounded ds:p-1\",\n column.getFilterValue() ? \"ds:text-primary\" : \"\"\n )}\n >\n <Filter className=\"ds:size-4\" />\n </Button>\n }\n />\n ) : null;\n\n const items: DropdownMenuItem[] = [];\n\n if (column.getCanSort()) {\n items.push({\n key: \"asc\",\n type: \"checkbox\",\n label: \"Asc\",\n icon: <ChevronUp />,\n checked: column.getIsSorted() === \"asc\",\n onClick: () => column.toggleSorting(false),\n className:\n \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n });\n items.push({\n key: \"desc\",\n type: \"checkbox\",\n label: \"Desc\",\n icon: <ChevronDown />,\n checked: column.getIsSorted() === \"desc\",\n onClick: () => column.toggleSorting(true),\n className:\n \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n });\n if (column.getIsSorted()) {\n items.push({\n key: \"reset\",\n type: \"item\",\n label: \"Reset\",\n icon: <X />,\n onClick: () => column.clearSorting(),\n className: \"ds:pl-2 ds:[&_svg]:text-muted-foreground\",\n });\n }\n }\n\n if (column.getCanHide()) {\n items.push({\n key: \"hide\",\n type: \"checkbox\",\n label: \"Hide\",\n icon: <EyeOff />,\n checked: !column.getIsVisible(),\n onClick: () => column.toggleVisibility(false),\n className:\n \"ds:relative ds:pr-8 ds:pl-2 ds:[&>span:first-child]:right-2 ds:[&>span:first-child]:left-auto ds:[&_svg]:text-muted-foreground\",\n });\n }\n\n return (\n <div className={cn(\"ds:flex ds:items-center ds:gap-1.5\", className)}>\n <DropdownMenu\n trigger={sortTrigger}\n items={items}\n align=\"start\"\n contentClassName=\"ds:w-28\"\n />\n {filterButton}\n </div>\n );\n}\n"],"names":["DataTableColumnHeader","column","label","className","displayLabel","cn","sortTrigger","jsxs","jsx","ChevronDown","ChevronUp","ChevronsUpDown","filterButton","DataTableFilterPopover","Button","Filter","items","X","EyeOff","DropdownMenu"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,SAASA,GAAqC;AAAA,EACnD,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AACF,GAA8C;AAC5C,QAAMC,IACJF,MACC,OAAOD,EAAO,UAAU,UAAW,WAChCA,EAAO,UAAU,SACjB;AAKN,MAAI,EAFFA,EAAO,WAAA,KAAgBA,EAAO,WAAA,KAAgBA,EAAO,aAAA;AAGrD,6BAAQ,OAAA,EAAI,WAAWI,EAAGF,CAAS,GAAI,UAAAC,GAAa;AAGtD,QAAME,IACJ,gBAAAC,EAAC,UAAA,EAAO,WAAU,0QACf,UAAA;AAAA,IAAAH;AAAA,IACAH,EAAO,WAAA,MACLA,EAAO,YAAA,MAAkB,SACxB,gBAAAO,EAACC,GAAA,EAAY,IACXR,EAAO,kBAAkB,0BAC1BS,GAAA,CAAA,CAAU,sBAEVC,GAAA,EAAe;AAAA,EAAA,GAEtB,GAGIC,IACJX,EAAO,aAAA,KAAkBA,EAAO,UAAU,MAAM,UAC9C,gBAAAO;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,QAAAZ;AAAA,MACA,SACE,gBAAAO;AAAA,QAACM;AAAA,QAAA;AAAA,UACC,SAAQ;AAAA,UACR,WAAWT;AAAA,YACT;AAAA,YACAJ,EAAO,eAAA,IAAmB,oBAAoB;AAAA,UAAA;AAAA,UAGhD,UAAA,gBAAAO,EAACO,GAAA,EAAO,WAAU,YAAA,CAAY;AAAA,QAAA;AAAA,MAAA;AAAA,IAChC;AAAA,EAAA,IAGF,MAEAC,IAA4B,CAAA;AAElC,SAAIf,EAAO,iBACTe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAON,GAAA,EAAU;AAAA,IACjB,SAAST,EAAO,YAAA,MAAkB;AAAA,IAClC,SAAS,MAAMA,EAAO,cAAc,EAAK;AAAA,IACzC,WACE;AAAA,EAAA,CACH,GACDe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAOP,GAAA,EAAY;AAAA,IACnB,SAASR,EAAO,YAAA,MAAkB;AAAA,IAClC,SAAS,MAAMA,EAAO,cAAc,EAAI;AAAA,IACxC,WACE;AAAA,EAAA,CACH,GACGA,EAAO,iBACTe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAOC,GAAA,EAAE;AAAA,IACT,SAAS,MAAMhB,EAAO,aAAA;AAAA,IACtB,WAAW;AAAA,EAAA,CACZ,IAIDA,EAAO,gBACTe,EAAM,KAAK;AAAA,IACT,KAAK;AAAA,IACL,MAAM;AAAA,IACN,OAAO;AAAA,IACP,wBAAOE,GAAA,EAAO;AAAA,IACd,SAAS,CAACjB,EAAO,aAAA;AAAA,IACjB,SAAS,MAAMA,EAAO,iBAAiB,EAAK;AAAA,IAC5C,WACE;AAAA,EAAA,CACH,qBAIA,OAAA,EAAI,WAAWI,EAAG,sCAAsCF,CAAS,GAChE,UAAA;AAAA,IAAA,gBAAAK;AAAA,MAACW;AAAA,MAAA;AAAA,QACC,SAASb;AAAA,QACT,OAAAU;AAAA,QACA,OAAM;AAAA,QACN,kBAAiB;AAAA,MAAA;AAAA,IAAA;AAAA,IAElBJ;AAAA,EAAA,GACH;AAEJ;"}

package/dist/esm/components/Table/data-table-toolbar.js ADDED Viewed

@@ -0,0 +1,116 @@
+import { jsxs as e, jsx as r } from "react/jsx-runtime";
+import { X as g, XCircle as h, PlusCircle as b } from "lucide-react";
+import * as m from "react";
+import { DataTableFilterPopover as F } from "./TableFilter/data-table-filter-popover.js";
+import { DataTableViewOptions as v } from "./data-table-view-options.js";
+import "@radix-ui/react-slot";
+import "../../packages/ui/src/components/button.js";
+import "../../packages/ui/src/components/button-group.js";
+import "../../packages/ui/src/components/input.js";
+import "../../packages/ui/src/components/textarea.js";
+import "@radix-ui/react-label";
+import { cn as x } from "../../packages/ui/src/lib/utils.js";
+import "../../packages/ui/src/components/select.js";
+import "../../packages/ui/src/components/combobox.js";
+import "@radix-ui/react-tooltip";
+import "react-day-picker";
+import "../../packages/ui/src/components/popover.js";
+import "@radix-ui/react-separator";
+import "../../packages/ui/src/components/switch.js";
+import "vaul";
+import "@radix-ui/react-scroll-area";
+import "../../packages/ui/src/components/tree-view.js";
+import "@radix-ui/react-alert-dialog";
+import "@radix-ui/react-avatar";
+import "../../packages/ui/src/components/badge.js";
+import "../../packages/ui/src/components/checkbox.js";
+import "@radix-ui/react-collapsible";
+import "cmdk";
+import "@radix-ui/react-dialog";
+import "@radix-ui/react-dropdown-menu";
+import "../../packages/ui/src/components/input-otp.js";
+import "../../packages/ui/src/components/radio-group.js";
+import "../../packages/ui/src/components/sidebar.js";
+import "@radix-ui/react-slider";
+import "../../packages/ui/src/components/tabs.js";
+import "../../packages/ui/src/components/toggle.js";
+import p from "../Button/Button.js";
+function ot({
+  table: t,
+  children: i,
+  className: a,
+  showColumnFilters: s = !1,
+  showColumnVisibilityToggle: l = !1,
+  columnVisibilityOptions: n,
+  ...d
+}) {
+  const c = t.getState().columnFilters.length > 0, f = m.useMemo(
+    () => t.getAllColumns().filter((o) => o.getCanFilter()),
+    [t]
+  ), u = m.useCallback(() => {
+    t.resetColumnFilters();
+  }, [t]);
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      role: "toolbar",
+      "aria-orientation": "horizontal",
+      className: x(
+        "ds:flex ds:w-full ds:items-start ds:justify-between ds:gap-2 ds:p-1",
+        a
+      ),
+      ...d,
+      children: [
+        s ? /* @__PURE__ */ e("div", { className: "ds:flex ds:flex-1 ds:flex-wrap ds:items-center ds:justify-start ds:gap-2", children: [
+          f.map((o) => /* @__PURE__ */ r(T, { column: o }, o.id)),
+          c && /* @__PURE__ */ e(
+            p,
+            {
+              "aria-label": "Reset filters",
+              variant: "outline",
+              size: "sm",
+              className: "ds:border-dashed",
+              onClick: u,
+              children: [
+                /* @__PURE__ */ r(g, {}),
+                "Reset"
+              ]
+            }
+          )
+        ] }) : /* @__PURE__ */ r("div", {}),
+        /* @__PURE__ */ e("div", { className: "ds:flex ds:items-center ds:gap-2", children: [
+          i,
+          l && /* @__PURE__ */ r(
+            v,
+            {
+              table: t,
+              align: "end",
+              ...n
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+function T({
+  column: t
+}) {
+  const i = t.columnDef.meta;
+  if (!i?.variant) return null;
+  const s = t.getFilterValue() != null ? /* @__PURE__ */ r(h, {}) : /* @__PURE__ */ r(b, {});
+  return /* @__PURE__ */ r(
+    F,
+    {
+      column: t,
+      trigger: /* @__PURE__ */ e(p, { variant: "outline", size: "sm", className: "ds:border-dashed", children: [
+        s,
+        i.label ?? t.id
+      ] })
+    }
+  );
+}
+export {
+  ot as DataTableToolbar
+};
+//# sourceMappingURL=data-table-toolbar.js.map

package/dist/esm/components/Table/data-table-toolbar.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"data-table-toolbar.js","sources":["../../../../src/components/Table/data-table-toolbar.tsx"],"sourcesContent":["\"use client\";\n\nimport type { Column, Table } from \"@tanstack/react-table\";\nimport { PlusCircle, X, XCircle } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { DataTableFilterPopover } from \"./TableFilter/data-table-filter-popover\";\nimport {\n DataTableViewOptions,\n type DataTableViewOptionsProps,\n} from \"./data-table-view-options\";\nimport { Button } from \"../Button\";\nimport { cn } from \"@dsui/ui\";\n\nexport interface DataTableToolbarProps<TData>\n extends React.ComponentProps<\"div\"> {\n table: Table<TData>;\n showColumnFilters?: boolean;\n showColumnVisibilityToggle?: boolean;\n columnVisibilityOptions?: Omit<\n DataTableViewOptionsProps<TData>,\n \"table\" | \"align\"\n >;\n}\n\nexport function DataTableToolbar<TData>({\n table,\n children,\n className,\n showColumnFilters = false,\n showColumnVisibilityToggle = false,\n columnVisibilityOptions,\n ...props\n}: DataTableToolbarProps<TData>) {\n const isFiltered = table.getState().columnFilters.length > 0;\n\n const columns = React.useMemo(\n () => table.getAllColumns().filter((column) => column.getCanFilter()),\n [table]\n );\n\n const onReset = React.useCallback(() => {\n table.resetColumnFilters();\n }, [table]);\n\n return (\n <div\n role=\"toolbar\"\n aria-orientation=\"horizontal\"\n className={cn(\n \"ds:flex ds:w-full ds:items-start ds:justify-between ds:gap-2 ds:p-1\",\n className\n )}\n {...props}\n >\n {showColumnFilters ? (\n <div className=\"ds:flex ds:flex-1 ds:flex-wrap ds:items-center ds:justify-start ds:gap-2\">\n {columns.map((column) => (\n <DataTableToolbarFilter key={column.id} column={column} />\n ))}\n {isFiltered && (\n <Button\n aria-label=\"Reset filters\"\n variant=\"outline\"\n size=\"sm\"\n className=\"ds:border-dashed\"\n onClick={onReset}\n >\n <X />\n Reset\n </Button>\n )}\n </div>\n ) : (\n <div />\n )}\n <div className=\"ds:flex ds:items-center ds:gap-2\">\n {children}\n {showColumnVisibilityToggle && (\n <DataTableViewOptions\n table={table}\n align=\"end\"\n {...columnVisibilityOptions}\n />\n )}\n </div>\n </div>\n );\n}\ninterface DataTableToolbarFilterProps<TData> {\n column: Column<TData>;\n}\n\nfunction DataTableToolbarFilter<TData>({\n column,\n}: DataTableToolbarFilterProps<TData>) {\n const columnMeta = column.columnDef.meta;\n\n if (!columnMeta?.variant) return null;\n\n const hasFilterValue = column.getFilterValue() != null;\n const icon = hasFilterValue ? <XCircle /> : <PlusCircle />;\n\n const getTriggerLabel = () => {\n return columnMeta.label ?? column.id;\n };\n\n return (\n <DataTableFilterPopover\n column={column}\n trigger={\n <Button variant=\"outline\" size=\"sm\" className=\"ds:border-dashed\">\n {icon}\n {getTriggerLabel()}\n </Button>\n }\n />\n );\n}\n"],"names":["DataTableToolbar","table","children","className","showColumnFilters","showColumnVisibilityToggle","columnVisibilityOptions","props","isFiltered","columns","React","column","onReset","jsxs","cn","jsx","DataTableToolbarFilter","Button","X","DataTableViewOptions","columnMeta","icon","XCircle","PlusCircle","DataTableFilterPopover"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBO,SAASA,GAAwB;AAAA,EACtC,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,mBAAAC,IAAoB;AAAA,EACpB,4BAAAC,IAA6B;AAAA,EAC7B,yBAAAC;AAAA,EACA,GAAGC;AACL,GAAiC;AAC/B,QAAMC,IAAaP,EAAM,SAAA,EAAW,cAAc,SAAS,GAErDQ,IAAUC,EAAM;AAAA,IACpB,MAAMT,EAAM,gBAAgB,OAAO,CAACU,MAAWA,EAAO,cAAc;AAAA,IACpE,CAACV,CAAK;AAAA,EAAA,GAGFW,IAAUF,EAAM,YAAY,MAAM;AACtC,IAAAT,EAAM,mBAAA;AAAA,EACR,GAAG,CAACA,CAAK,CAAC;AAEV,SACE,gBAAAY;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,oBAAiB;AAAA,MACjB,WAAWC;AAAA,QACT;AAAA,QACAX;AAAA,MAAA;AAAA,MAED,GAAGI;AAAA,MAEH,UAAA;AAAA,QAAAH,IACC,gBAAAS,EAAC,OAAA,EAAI,WAAU,4EACZ,UAAA;AAAA,UAAAJ,EAAQ,IAAI,CAACE,MACZ,gBAAAI,EAACC,KAAuC,QAAAL,EAAA,GAAXA,EAAO,EAAoB,CACzD;AAAA,UACAH,KACC,gBAAAK;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,cAAW;AAAA,cACX,SAAQ;AAAA,cACR,MAAK;AAAA,cACL,WAAU;AAAA,cACV,SAASL;AAAA,cAET,UAAA;AAAA,gBAAA,gBAAAG,EAACG,GAAA,EAAE;AAAA,gBAAE;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAEP,EAAA,CAEJ,sBAEC,OAAA,EAAI;AAAA,QAEP,gBAAAL,EAAC,OAAA,EAAI,WAAU,oCACZ,UAAA;AAAA,UAAAX;AAAA,UACAG,KACC,gBAAAU;AAAA,YAACI;AAAA,YAAA;AAAA,cACC,OAAAlB;AAAA,cACA,OAAM;AAAA,cACL,GAAGK;AAAA,YAAA;AAAA,UAAA;AAAA,QACN,EAAA,CAEJ;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;AAKA,SAASU,EAA8B;AAAA,EACrC,QAAAL;AACF,GAAuC;AACrC,QAAMS,IAAaT,EAAO,UAAU;AAEpC,MAAI,CAACS,GAAY,QAAS,QAAO;AAGjC,QAAMC,IADiBV,EAAO,eAAA,KAAoB,OACpB,gBAAAI,EAACO,GAAA,CAAA,CAAQ,sBAAMC,GAAA,EAAW;AAMxD,SACE,gBAAAR;AAAA,IAACS;AAAA,IAAA;AAAA,MACC,QAAAb;AAAA,MACA,2BACGM,GAAA,EAAO,SAAQ,WAAU,MAAK,MAAK,WAAU,oBAC3C,UAAA;AAAA,QAAAI;AAAA,QARAD,EAAW,SAAST,EAAO;AAAA,MASX,EAAA,CACnB;AAAA,IAAA;AAAA,EAAA;AAIR;"}

package/dist/esm/components/Table/data-table-view-options.js ADDED Viewed

@@ -0,0 +1,258 @@
+import { jsxs as x, Fragment as G, jsx as r } from "react/jsx-runtime";
+import { useSensors as K, useSensor as O, DndContext as $, closestCenter as H, KeyboardSensor as q, PointerSensor as J } from "../../node_modules/.pnpm/@dnd-kit_core@6.3.1_react-dom@19.1.1_react@19.1.1__react@19.1.1/node_modules/@dnd-kit/core/dist/core.esm.js";
+import { arrayMove as Q, SortableContext as U, verticalListSortingStrategy as W, sortableKeyboardCoordinates as X, useSortable as Y } from "../../node_modules/.pnpm/@dnd-kit_sortable@10.0.0_@dnd-kit_core@6.3.1_react-dom@19.1.1_react@19.1.1__react@19.1.1__react@19.1.1/node_modules/@dnd-kit/sortable/dist/sortable.esm.js";
+import { CSS as Z } from "../../node_modules/.pnpm/@dnd-kit_utilities@3.2.2_react@19.1.1/node_modules/@dnd-kit/utilities/dist/utilities.esm.js";
+import { Check as _, Settings2 as ee, GripVertical as te } from "lucide-react";
+import * as h from "react";
+import se from "../Command/Command.js";
+import { Popover as re } from "../Popover/index.js";
+import "@radix-ui/react-slot";
+import "../../packages/ui/src/components/button.js";
+import "../../packages/ui/src/components/button-group.js";
+import "../../packages/ui/src/components/input.js";
+import "../../packages/ui/src/components/textarea.js";
+import "@radix-ui/react-label";
+import { cn as N } from "../../packages/ui/src/lib/utils.js";
+import "../../packages/ui/src/components/select.js";
+import "../../packages/ui/src/components/combobox.js";
+import "@radix-ui/react-tooltip";
+import "react-day-picker";
+import "../../packages/ui/src/components/popover.js";
+import "@radix-ui/react-separator";
+import "../../packages/ui/src/components/switch.js";
+import "vaul";
+import "@radix-ui/react-scroll-area";
+import "../../packages/ui/src/components/tree-view.js";
+import "@radix-ui/react-alert-dialog";
+import "@radix-ui/react-avatar";
+import "../../packages/ui/src/components/badge.js";
+import "../../packages/ui/src/components/checkbox.js";
+import "@radix-ui/react-collapsible";
+import "cmdk";
+import "@radix-ui/react-dialog";
+import "@radix-ui/react-dropdown-menu";
+import "../../packages/ui/src/components/input-otp.js";
+import "../../packages/ui/src/components/radio-group.js";
+import "../../packages/ui/src/components/sidebar.js";
+import "@radix-ui/react-slider";
+import "../../packages/ui/src/components/tabs.js";
+import "../../packages/ui/src/components/toggle.js";
+import D from "../Checkbox/Checkbox.js";
+import P from "../Button/Button.js";
+function qe({
+  table: s,
+  variant: o = "command",
+  labels: n,
+  triggerIcon: c = /* @__PURE__ */ r(ee, { className: "ds:text-muted-foreground" }),
+  trigger: d,
+  content: f,
+  contentClassName: g,
+  ...u
+}) {
+  const l = s.getState().columnOrder, a = s.getState().columnPinning, i = h.useMemo(
+    () => w(s, l, a).filter(
+      (e) => typeof e.accessorFn < "u" && e.getCanHide()
+    ),
+    [s, l, a]
+  ), C = h.useCallback(
+    (e) => e.columnDef.meta?.label ?? (typeof e.columnDef.header == "string" ? e.columnDef.header : e.id),
+    []
+  ), y = K(
+    O(J),
+    O(q, {
+      coordinateGetter: X
+    })
+  ), t = h.useMemo(
+    () => i.map((e) => e.id),
+    [i]
+  ), T = i.every((e) => e.getIsVisible()), z = i.some((e) => e.getIsVisible()), A = h.useCallback(
+    (e) => {
+      i.forEach((p) => p.toggleVisibility(e));
+    },
+    [i]
+  ), L = h.useCallback(
+    (e) => {
+      const { active: p, over: S } = e;
+      if (!S || p.id === S.id) return;
+      const V = t.indexOf(String(p.id)), k = t.indexOf(String(S.id));
+      if (V === -1 || k === -1) return;
+      const B = Q(t, V, k), I = new Set(t), R = [...B], E = w(s).map(
+        (m) => I.has(m.id) ? R.shift() ?? m.id : m.id
+      ), v = s.getState().columnPinning, F = {
+        ...v,
+        left: v?.left?.filter((m) => !I.has(m)),
+        right: v?.right?.filter(
+          (m) => !I.has(m)
+        )
+      };
+      s.setColumnOrder(E), s.setColumnPinning(F);
+    },
+    [t, s]
+  ), M = [
+    {
+      type: "group",
+      heading: "",
+      items: i.map((e) => ({
+        type: "item",
+        onClick: () => e.toggleVisibility(!e.getIsVisible()),
+        children: /* @__PURE__ */ x(G, { children: [
+          /* @__PURE__ */ r("span", { className: "ds:truncate", children: C(e) }),
+          /* @__PURE__ */ r(
+            _,
+            {
+              className: N(
+                "ds:ml-auto ds:size-4 ds:shrink-0",
+                e.getIsVisible() ? "ds:opacity-100" : "ds:opacity-0"
+              )
+            }
+          )
+        ] })
+      }))
+    }
+  ], b = {
+    trigger: n?.trigger ?? "View",
+    searchPlaceholder: n?.searchPlaceholder ?? "Search columns...",
+    selectAll: n?.selectAll ?? "Chọn tất cả",
+    reset: n?.reset ?? "Đặt lại"
+  }, j = /* @__PURE__ */ x("div", { className: "ds:flex ds:w-full ds:flex-col", children: [
+    /* @__PURE__ */ x("div", { className: "ds:flex ds:items-center ds:gap-3 ds:px-3 ds:py-3", children: [
+      /* @__PURE__ */ r(
+        D,
+        {
+          "aria-label": "Toggle all columns",
+          checked: T ? !0 : z ? "indeterminate" : !1,
+          onCheckedChange: (e) => A(e === !0)
+        }
+      ),
+      /* @__PURE__ */ r("span", { className: "ds:text-sm ds:font-medium ds:text-foreground", children: b.selectAll })
+    ] }),
+    /* @__PURE__ */ r("div", { className: "ds:mx-3 ds:h-px ds:bg-border" }),
+    /* @__PURE__ */ r(
+      $,
+      {
+        sensors: y,
+        collisionDetection: H,
+        onDragEnd: L,
+        children: /* @__PURE__ */ r(
+          U,
+          {
+            items: t,
+            strategy: W,
+            children: /* @__PURE__ */ r("div", { className: "ds:flex ds:max-h-80 ds:flex-col ds:overflow-y-auto ds:py-2", children: i.map((e) => /* @__PURE__ */ r(
+              ie,
+              {
+                id: e.id,
+                label: C(e),
+                checked: e.getIsVisible(),
+                onCheckedChange: (p) => e.toggleVisibility(p === !0)
+              },
+              e.id
+            )) })
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ r("div", { className: "ds:mx-3 ds:h-px ds:bg-border" }),
+    /* @__PURE__ */ r(
+      P,
+      {
+        type: "button",
+        variant: "ghost",
+        size: "sm",
+        className: "ds:mx-3 ds:my-2 ds:text-primary hover:ds:text-primary",
+        onClick: () => {
+          s.resetColumnVisibility(), s.resetColumnOrder(), s.resetColumnPinning();
+        },
+        children: b.reset
+      }
+    )
+  ] });
+  return /* @__PURE__ */ r(
+    re,
+    {
+      trigger: d ?? /* @__PURE__ */ x(
+        P,
+        {
+          "aria-label": "Toggle columns",
+          role: "combobox",
+          variant: "outline",
+          size: "sm",
+          className: "ds:ml-auto ds:h-8 ds:font-normal ds:lg:flex",
+          children: [
+            c,
+            b.trigger
+          ]
+        }
+      ),
+      content: f ?? (o === "draggable" ? j : /* @__PURE__ */ r(se, { items: M, search: b.searchPlaceholder })),
+      contentClassName: N(
+        "ds:p-0",
+        o === "draggable" ? "ds:w-72" : "ds:w-44",
+        g
+      ),
+      ...u
+    }
+  );
+}
+function w(s, o = s.getState().columnOrder, n = s.getState().columnPinning) {
+  const c = s.getAllLeafColumns(), d = new Map(c.map((t) => [t.id, t])), f = c.map((t) => t.id), g = o ?? [], u = [
+    ...g.filter((t) => d.has(t)),
+    ...f.filter((t) => !g.includes(t))
+  ], l = n ?? {}, a = (l.left ?? []).filter((t) => d.has(t)), i = (l.right ?? []).filter((t) => d.has(t)), C = /* @__PURE__ */ new Set([...a, ...i]), y = u.filter((t) => !C.has(t));
+  return [...a, ...y, ...i].map((t) => d.get(t)).filter((t) => !!t);
+}
+function ie({
+  id: s,
+  label: o,
+  checked: n,
+  onCheckedChange: c
+}) {
+  const {
+    attributes: d,
+    listeners: f,
+    setNodeRef: g,
+    transform: u,
+    transition: l,
+    isDragging: a
+  } = Y({ id: s });
+  return /* @__PURE__ */ x(
+    "div",
+    {
+      ref: g,
+      className: N(
+        "ds:flex ds:min-h-11 ds:items-center ds:gap-3 ds:px-3 ds:text-sm ds:text-foreground",
+        a && "ds:bg-accent"
+      ),
+      style: {
+        transform: Z.Transform.toString(u),
+        transition: l
+      },
+      children: [
+        /* @__PURE__ */ r(
+          "button",
+          {
+            type: "button",
+            className: "ds:flex ds:size-5 ds:shrink-0 ds:cursor-grab ds:items-center ds:justify-center ds:text-muted-foreground active:ds:cursor-grabbing",
+            "aria-label": `Reorder ${o}`,
+            ...d,
+            ...f,
+            children: /* @__PURE__ */ r(te, { className: "ds:size-4" })
+          }
+        ),
+        /* @__PURE__ */ r(
+          D,
+          {
+            "aria-label": `Toggle ${o}`,
+            checked: n,
+            onCheckedChange: c
+          }
+        ),
+        /* @__PURE__ */ r("span", { className: "ds:min-w-0 ds:flex-1 ds:truncate ds:font-medium", children: o })
+      ]
+    }
+  );
+}
+export {
+  qe as DataTableViewOptions
+};
+//# sourceMappingURL=data-table-view-options.js.map