@scbt-ecom/ui 0.97.3 → 0.99.0
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.
- package/dist/lib/shared/style.css +1 -1
- package/dist/lib/shared/ui/dropdownList/DropdownList.js +1 -1
- package/dist/lib/shared/ui/dropdownList/DropdownList.js.map +1 -1
- package/dist/lib/shared/ui/dropdownList/hooks/useKeyboardNavigation.js +1 -1
- package/dist/lib/shared/ui/dropdownList/hooks/useKeyboardNavigation.js.map +1 -1
- package/dist/lib/shared/ui/formElements/controlled/combobox/ComboboxControl.js +1 -1
- package/dist/lib/shared/ui/formElements/controlled/combobox/ComboboxControl.js.map +1 -1
- package/dist/lib/shared/ui/formElements/controlled/combobox/hooks/index.js +2 -0
- package/dist/lib/shared/ui/formElements/controlled/combobox/hooks/index.js.map +1 -0
- package/dist/lib/shared/ui/formElements/controlled/combobox/hooks/useComboboxControl.js +2 -0
- package/dist/lib/shared/ui/formElements/controlled/combobox/hooks/useComboboxControl.js.map +1 -0
- package/dist/lib/shared/ui/formElements/uncontrolled/combobox/combobox.js +1 -1
- package/dist/lib/shared/ui/formElements/uncontrolled/combobox/combobox.js.map +1 -1
- package/dist/lib/shared/ui/formElements/uncontrolled/combobox/hooks/useCombobox.js +1 -1
- package/dist/lib/shared/ui/formElements/uncontrolled/combobox/hooks/useCombobox.js.map +1 -1
- package/dist/lib/shared/ui/table/Desktop.js +1 -1
- package/dist/lib/shared/ui/table/Desktop.js.map +1 -1
- package/dist/lib/shared/ui/table/Horizontal.js +2 -0
- package/dist/lib/shared/ui/table/Horizontal.js.map +1 -0
- package/dist/lib/shared/ui/table/Table.js +1 -1
- package/dist/lib/shared/ui/table/Table.js.map +1 -1
- package/dist/lib/shared/ui/table/ui/dataTableColumnHeader/DataTableColumnHeader.js +1 -1
- package/dist/lib/shared/ui/table/ui/dataTableColumnHeader/DataTableColumnHeader.js.map +1 -1
- package/dist/lib/widgets/model/helpers.js +2 -2
- package/dist/lib/widgets/model/helpers.js.map +1 -1
- package/dist/stats.html +1 -1
- package/dist/types/lib/shared/ui/dropdownList/DropdownList.d.ts +2 -1
- package/dist/types/lib/shared/ui/dropdownList/hooks/useKeyboardNavigation.d.ts +4 -3
- package/dist/types/lib/shared/ui/formElements/controlled/combobox/ComboboxControl.d.ts +2 -2
- package/dist/types/lib/shared/ui/formElements/controlled/combobox/hooks/index.d.ts +1 -0
- package/dist/types/lib/shared/ui/formElements/controlled/combobox/hooks/useComboboxControl.d.ts +14 -0
- package/dist/types/lib/shared/ui/formElements/controlled/index.d.ts +1 -1
- package/dist/types/lib/shared/ui/formElements/uncontrolled/combobox/hooks/useCombobox.d.ts +2 -2
- package/dist/types/lib/shared/ui/table/Horizontal.d.ts +7 -0
- package/dist/types/lib/shared/ui/table/Table.d.ts +1 -1
- package/dist/types/lib/shared/ui/table/model/types.d.ts +4 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCombobox.js","sources":["../../../../../../../../lib/shared/ui/formElements/uncontrolled/combobox/hooks/useCombobox.ts"],"sourcesContent":["import { useMemo, useState } from 'react'\nimport type { ExternalHandlers } from '../combobox'\nimport { type ChangeHandler, type ComboboxValue } from '../model'\nimport type { ComboboxItemOption } from '../ui'\nimport { TypeGuards } from '$/shared/utils'\n\ntype UseComboboxOptions<Multi extends boolean> = {\n initialOptions: ComboboxItemOption[]\n searchable?: boolean\n multiple?: Multi\n value?: ComboboxValue<Multi>\n onChange?: ChangeHandler<Multi>\n displayValue?: (option: ComboboxItemOption) => string\n defaultOpen?: boolean\n externalHandlers?: ExternalHandlers<Multi>\n externalInputValue?: string\n externalOnInputChange?: (value: string) => void\n filterDisabled?: boolean\n}\n\nexport const useCombobox = <Multi extends boolean>(props: UseComboboxOptions<Multi>) => {\n const {\n multiple,\n defaultOpen,\n value,\n onChange,\n initialOptions,\n searchable,\n filterDisabled,\n displayValue,\n externalHandlers,\n externalInputValue,\n externalOnInputChange\n } = props\n const { changeHandler: externalChangeHandler, inputChangeHandler: externalInputChangeHandler } = externalHandlers ?? {}\n\n const [search, setSearch] = useState<string>('')\n const [open, setOpen] = useState<boolean>(defaultOpen ?? false)\n const
|
|
1
|
+
{"version":3,"file":"useCombobox.js","sources":["../../../../../../../../lib/shared/ui/formElements/uncontrolled/combobox/hooks/useCombobox.ts"],"sourcesContent":["import { useMemo, useRef, useState } from 'react'\nimport type { ExternalHandlers } from '../combobox'\nimport { type ChangeHandler, type ComboboxValue } from '../model'\nimport type { ComboboxItemOption } from '../ui'\nimport { TypeGuards } from '$/shared/utils'\n\ntype UseComboboxOptions<Multi extends boolean> = {\n initialOptions: ComboboxItemOption[]\n searchable?: boolean\n multiple?: Multi\n value?: ComboboxValue<Multi>\n onChange?: ChangeHandler<Multi>\n displayValue?: (option: ComboboxItemOption) => string\n defaultOpen?: boolean\n externalHandlers?: ExternalHandlers<Multi>\n externalInputValue?: string\n externalOnInputChange?: (value: string) => void\n filterDisabled?: boolean\n}\n\nexport const useCombobox = <Multi extends boolean>(props: UseComboboxOptions<Multi>) => {\n const {\n multiple,\n defaultOpen,\n value,\n onChange,\n initialOptions,\n searchable,\n filterDisabled,\n displayValue,\n externalHandlers,\n externalInputValue,\n externalOnInputChange\n } = props\n const { changeHandler: externalChangeHandler, inputChangeHandler: externalInputChangeHandler } = externalHandlers ?? {}\n\n const [search, setSearch] = useState<string>('')\n const [open, setOpen] = useState<boolean>(defaultOpen ?? false)\n\n const isUpdatingRef = useRef<boolean>(false)\n\n const options = useMemo<ComboboxItemOption[]>(() => {\n if (filterDisabled) {\n return initialOptions\n }\n\n if (!search.length || !searchable) {\n return initialOptions\n }\n\n return initialOptions.filter((option) =>\n option.label.toLowerCase().includes(externalInputValue ? externalInputValue.toLowerCase() : search.toLowerCase())\n )\n }, [externalInputValue, filterDisabled, initialOptions, search, searchable])\n\n const onInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n setOpen(true)\n\n setSearch(e.target.value)\n externalInputChangeHandler?.(e.target.value)\n externalOnInputChange?.(e.target.value)\n }\n\n const changeHandler = (newValue: ComboboxItemOption) => {\n if (isUpdatingRef.current) return\n\n isUpdatingRef.current = true\n\n if (multiple) {\n const prev = (value as ComboboxItemOption[]) || []\n const exists = prev.some((option) => option.value === newValue.value)\n\n let updatedValue: ComboboxItemOption[]\n\n if (exists) {\n updatedValue = prev.filter((option) => option.value !== newValue.value)\n } else {\n updatedValue = [...prev, newValue]\n }\n\n onChange?.(updatedValue as ComboboxValue<Multi>)\n externalChangeHandler?.(updatedValue as ComboboxValue<Multi>)\n\n const searchValue = prev.map((option) => (displayValue ? displayValue(option) : option.label)).join(', ')\n setSearch(searchValue)\n externalOnInputChange?.(searchValue)\n } else {\n let updated: ComboboxValue<Multi>\n\n if ((value as ComboboxItemOption)?.value === newValue.value) {\n updated = null as ComboboxValue<Multi>\n } else {\n updated = newValue as ComboboxValue<Multi>\n }\n\n onChange?.(updated)\n externalChangeHandler?.(updated)\n\n const label = displayValue && updated ? displayValue(updated as ComboboxItemOption) : (updated as ComboboxItemOption)?.label\n setSearch(label ?? '')\n externalOnInputChange?.(label ?? '')\n setOpen(false)\n }\n\n setTimeout(() => {\n isUpdatingRef.current = false\n }, 0)\n }\n\n const comboboxDisplayValue = (value: ComboboxValue<Multi>) => {\n if (!value) return\n\n if (TypeGuards.isArray(value)) {\n return value.map((item) => (displayValue ? displayValue(item) : item.label)).join(', ')\n }\n\n return displayValue ? displayValue(value) : value.label\n }\n\n return {\n open,\n setOpen,\n changeHandler,\n options,\n search,\n onInputChange,\n state: value,\n comboboxDisplayValue\n }\n}\n"],"names":["useCombobox","props","multiple","defaultOpen","value","onChange","initialOptions","searchable","filterDisabled","displayValue","externalHandlers","externalInputValue","externalOnInputChange","externalChangeHandler","externalInputChangeHandler","search","setSearch","useState","open","setOpen","isUpdatingRef","useRef","options","useMemo","option","newValue","prev","exists","updatedValue","searchValue","updated","label","TypeGuards","item"],"mappings":"0HAoBO,MAAMA,EAAsCC,GAAqC,CACtF,KAAM,CACJ,SAAAC,EACA,YAAAC,EACA,MAAAC,EACA,SAAAC,EACA,eAAAC,EACA,WAAAC,EACA,eAAAC,EACA,aAAAC,EACA,iBAAAC,EACA,mBAAAC,EACA,sBAAAC,CAAA,EACEX,EACE,CAAE,cAAeY,EAAuB,mBAAoBC,CAAA,EAA+BJ,GAAoB,CAAA,EAE/G,CAACK,EAAQC,CAAS,EAAIC,EAAiB,EAAE,EACzC,CAACC,EAAMC,CAAO,EAAIF,EAAkBd,GAAe,EAAK,EAExDiB,EAAgBC,EAAgB,EAAK,EAErCC,EAAUC,EAA8B,IACxCf,GAIA,CAACO,EAAO,QAAU,CAACR,EACdD,EAGFA,EAAe,OAAQkB,GAC5BA,EAAO,MAAM,YAAA,EAAc,SAASb,EAAqBA,EAAmB,cAAgBI,EAAO,aAAa,CAAA,EAEjH,CAACJ,EAAoBH,EAAgBF,EAAgBS,EAAQR,CAAU,CAAC,EAkE3E,MAAO,CACL,KAAAW,EACA,QAAAC,EACA,cA3DqBM,GAAiC,CACtD,GAAI,CAAAL,EAAc,QAIlB,IAFAA,EAAc,QAAU,GAEpBlB,EAAU,CACZ,MAAMwB,EAAQtB,GAAkC,CAAA,EAC1CuB,EAASD,EAAK,KAAMF,GAAWA,EAAO,QAAUC,EAAS,KAAK,EAEpE,IAAIG,EAEAD,EACFC,EAAeF,EAAK,OAAQF,GAAWA,EAAO,QAAUC,EAAS,KAAK,EAEtEG,EAAe,CAAC,GAAGF,EAAMD,CAAQ,EAGnCpB,GAAA,MAAAA,EAAWuB,GACXf,GAAA,MAAAA,EAAwBe,GAExB,MAAMC,EAAcH,EAAK,IAAKF,GAAYf,EAAeA,EAAae,CAAM,EAAIA,EAAO,KAAM,EAAE,KAAK,IAAI,EACxGR,EAAUa,CAAW,EACrBjB,GAAA,MAAAA,EAAwBiB,EAC1B,KAAO,CACL,IAAIC,GAEC1B,GAAA,YAAAA,EAA8B,SAAUqB,EAAS,MACpDK,EAAU,KAEVA,EAAUL,EAGZpB,GAAA,MAAAA,EAAWyB,GACXjB,GAAA,MAAAA,EAAwBiB,GAExB,MAAMC,EAAQtB,GAAgBqB,EAAUrB,EAAaqB,CAA6B,EAAKA,GAAA,YAAAA,EAAgC,MACvHd,EAAUe,GAAS,EAAE,EACrBnB,GAAA,MAAAA,EAAwBmB,GAAS,IACjCZ,EAAQ,EAAK,CACf,CAEA,WAAW,IAAM,CACfC,EAAc,QAAU,EAC1B,EAAG,CAAC,EACN,EAgBE,QAAAE,EACA,OAAAP,EACA,cAtEqB,GAA2C,CAChEI,EAAQ,EAAI,EAEZH,EAAU,EAAE,OAAO,KAAK,EACxBF,GAAA,MAAAA,EAA6B,EAAE,OAAO,OACtCF,GAAA,MAAAA,EAAwB,EAAE,OAAO,MACnC,EAiEE,MAAOR,EACP,qBAlB4BA,GAAgC,CAC5D,GAAKA,EAEL,OAAI4B,EAAW,QAAQ5B,CAAK,EACnBA,EAAM,IAAK6B,GAAUxB,EAAeA,EAAawB,CAAI,EAAIA,EAAK,KAAM,EAAE,KAAK,IAAI,EAGjFxB,EAAeA,EAAaL,CAAK,EAAIA,EAAM,KACpD,CAUE,CAEJ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as a,jsx as
|
|
1
|
+
import{jsxs as a,jsx as n}from"react/jsx-runtime";import{flexRender as f}from"../../../../node_modules/@tanstack/react-table/build/lib/index.js";import{TablePagination as C}from"./TablePagination.js";import{Table as N,TableHeader as y,TableRow as p,TableHead as P,TableBody as T,TableCell as u}from"./ui/primitives/Primitives.js";import"react";import{cn as r}from"../../utils/cn.js";const j=({mode:d,enableHeaders:h,table:e,classes:o,pagination:l,empty:b="Ничего не найдено"})=>{const x=l!==!1&&e.getPageCount()>1,m={pageCount:e.getPageCount(),rowsCount:e.getCoreRowModel().rows.length,pageSize:e.getState().pagination.pageSize,page:e.getState().pagination.pageIndex+1,onPageIndexChange:e.setPageIndex,classes:o==null?void 0:o.pagination};return a("div",{className:r("flex w-full flex-col gap-y-4",o==null?void 0:o.root),children:[a(N,{className:r("w-full",o==null?void 0:o.table),children:[h&&n(y,{className:"px-2",children:e.getHeaderGroups().map(i=>n(p,{className:r("w-full",{"border-b border-b-[rgba(234,237,241,1)]":d==="solid"},o==null?void 0:o.tableHeader),children:i.headers.map(t=>n(P,{className:r("py-3",{"px-2":d==="odd"},o==null?void 0:o.tableHead),children:t.isPlaceholder?null:f(t.column.columnDef.header,t.getContext())},t.id))},i.id))}),n(T,{children:e.getRowModel().rows.length?e.getRowModel().rows.map((i,t)=>n(p,{className:r("w-full",{"[&:not(:last-child)]:border-b [&:not(:last-child)]:border-b-[rgba(234,237,241,1)]":d==="solid","[&:nth-child(odd)]:bg-color-primary-light-default":d==="odd"},o==null?void 0:o.tableRow),children:i.getVisibleCells().map((g,w)=>n(u,{className:r("py-3",{"px-2":d==="odd","font-medium":w!==0},o==null?void 0:o.tableCell),children:f(g.column.columnDef.cell,{...g.getContext(),rowIndex:t})},g.id))},i.id)):n(p,{children:n(u,{className:"py-4 text-center",colSpan:e.getAllColumns().length,children:b})})})]}),x?typeof l=="function"?l(m):n(C,{...m}):null]})};export{j as Desktop};
|
|
2
2
|
//# sourceMappingURL=Desktop.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Desktop.js","sources":["../../../../../lib/shared/ui/table/Desktop.tsx"],"sourcesContent":["import { flexRender, type Table as TTable } from '@tanstack/react-table'\nimport type { DataTableProps } from './model'\nimport { TablePagination } from './TablePagination'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from './ui'\nimport { cn } from '$/shared/utils'\n\ntype DesktopTableProps<TData extends {}> = Pick<\n DataTableProps<TData>,\n 'enableHeaders' | 'classes' | 'mode' | 'pagination' | 'empty'\n> & {\n table: TTable<TData>\n}\n\nexport const Desktop = <TData extends {}>({\n mode,\n enableHeaders,\n table,\n classes,\n pagination,\n empty = '
|
|
1
|
+
{"version":3,"file":"Desktop.js","sources":["../../../../../lib/shared/ui/table/Desktop.tsx"],"sourcesContent":["import { flexRender, type Table as TTable } from '@tanstack/react-table'\nimport type { DataTableProps } from './model'\nimport { TablePagination } from './TablePagination'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from './ui'\nimport { cn } from '$/shared/utils'\n\ntype DesktopTableProps<TData extends {}> = Pick<\n DataTableProps<TData>,\n 'enableHeaders' | 'classes' | 'mode' | 'pagination' | 'empty'\n> & {\n table: TTable<TData>\n}\n\nexport const Desktop = <TData extends {}>({\n mode,\n enableHeaders,\n table,\n classes,\n pagination,\n empty = 'Ничего не найдено'\n}: DesktopTableProps<TData>) => {\n const paginationEnabled = pagination !== false && table.getPageCount() > 1\n\n const paginationProps = {\n pageCount: table.getPageCount(),\n rowsCount: table.getCoreRowModel().rows.length,\n pageSize: table.getState().pagination.pageSize,\n page: table.getState().pagination.pageIndex + 1,\n onPageIndexChange: table.setPageIndex,\n classes: classes?.pagination\n }\n\n return (\n <div className={cn('flex w-full flex-col gap-y-4', classes?.root)}>\n <Table className={cn('w-full', classes?.table)}>\n {enableHeaders && (\n <TableHeader className='px-2'>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow\n key={headerGroup.id}\n className={cn(\n 'w-full',\n {\n 'border-b border-b-[rgba(234,237,241,1)]': mode === 'solid'\n },\n classes?.tableHeader\n )}\n >\n {headerGroup.headers.map((header) => (\n <TableHead\n key={header.id}\n className={cn(\n 'py-3',\n {\n 'px-2': mode === 'odd'\n },\n classes?.tableHead\n )}\n >\n {header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}\n </TableHead>\n ))}\n </TableRow>\n ))}\n </TableHeader>\n )}\n <TableBody>\n {table.getRowModel().rows.length ? (\n table.getRowModel().rows.map((row, rowIndex) => (\n <TableRow\n key={row.id}\n className={cn(\n 'w-full',\n {\n '[&:not(:last-child)]:border-b [&:not(:last-child)]:border-b-[rgba(234,237,241,1)]': mode === 'solid',\n '[&:nth-child(odd)]:bg-color-primary-light-default': mode === 'odd'\n },\n classes?.tableRow\n )}\n >\n {row.getVisibleCells().map((cell, cellIndex) => (\n <TableCell\n key={cell.id}\n className={cn(\n 'py-3',\n {\n 'px-2': mode === 'odd',\n 'font-medium': cellIndex !== 0\n },\n classes?.tableCell\n )}\n >\n {flexRender(cell.column.columnDef.cell, { ...cell.getContext(), rowIndex })}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell className='py-4 text-center' colSpan={table.getAllColumns().length}>\n {empty}\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n {paginationEnabled ? (\n typeof pagination === 'function' ? (\n pagination(paginationProps)\n ) : (\n <TablePagination {...paginationProps} />\n )\n ) : null}\n </div>\n )\n}\n"],"names":["Desktop","mode","enableHeaders","table","classes","pagination","empty","paginationEnabled","paginationProps","cn","jsxs","Table","jsx","TableHeader","headerGroup","TableRow","header","TableHead","flexRender","TableBody","row","rowIndex","cell","cellIndex","TableCell","TablePagination"],"mappings":"+XAaO,MAAMA,EAAU,CAAmB,CACxC,KAAAC,EACA,cAAAC,EACA,MAAAC,EACA,QAAAC,EACA,WAAAC,EACA,MAAAC,EAAQ,mBACV,IAAgC,CAC9B,MAAMC,EAAoBF,IAAe,IAASF,EAAM,eAAiB,EAEnEK,EAAkB,CACtB,UAAWL,EAAM,aAAA,EACjB,UAAWA,EAAM,gBAAA,EAAkB,KAAK,OACxC,SAAUA,EAAM,SAAA,EAAW,WAAW,SACtC,KAAMA,EAAM,SAAA,EAAW,WAAW,UAAY,EAC9C,kBAAmBA,EAAM,aACzB,QAASC,GAAA,YAAAA,EAAS,UAAA,EAGpB,SACG,MAAA,CAAI,UAAWK,EAAG,+BAAgCL,GAAA,YAAAA,EAAS,IAAI,EAC9D,SAAA,CAAAM,EAACC,GAAM,UAAWF,EAAG,SAAUL,GAAA,YAAAA,EAAS,KAAK,EAC1C,SAAA,CAAAF,GACCU,EAACC,GAAY,UAAU,OACpB,WAAM,gBAAA,EAAkB,IAAKC,GAC5BF,EAACG,EAAA,CAEC,UAAWN,EACT,SACA,CACE,0CAA2CR,IAAS,OAAA,EAEtDG,GAAA,YAAAA,EAAS,WAAA,EAGV,SAAAU,EAAY,QAAQ,IAAKE,GACxBJ,EAACK,EAAA,CAEC,UAAWR,EACT,OACA,CACE,OAAQR,IAAS,KAAA,EAEnBG,GAAA,YAAAA,EAAS,SAAA,EAGV,SAAAY,EAAO,cAAgB,KAAOE,EAAWF,EAAO,OAAO,UAAU,OAAQA,EAAO,WAAA,CAAY,CAAA,EATxFA,EAAO,EAAA,CAWf,CAAA,EAtBIF,EAAY,EAAA,CAwBpB,EACH,EAEFF,EAACO,EAAA,CACE,SAAAhB,EAAM,YAAA,EAAc,KAAK,OACxBA,EAAM,YAAA,EAAc,KAAK,IAAI,CAACiB,EAAKC,IACjCT,EAACG,EAAA,CAEC,UAAWN,EACT,SACA,CACE,oFAAqFR,IAAS,QAC9F,oDAAqDA,IAAS,KAAA,EAEhEG,GAAA,YAAAA,EAAS,QAAA,EAGV,WAAI,gBAAA,EAAkB,IAAI,CAACkB,EAAMC,IAChCX,EAACY,EAAA,CAEC,UAAWf,EACT,OACA,CACE,OAAQR,IAAS,MACjB,cAAesB,IAAc,CAAA,EAE/BnB,GAAA,YAAAA,EAAS,SAAA,EAGV,SAAAc,EAAWI,EAAK,OAAO,UAAU,KAAM,CAAE,GAAGA,EAAK,WAAA,EAAc,SAAAD,CAAA,CAAU,CAAA,EAVrEC,EAAK,EAAA,CAYb,CAAA,EAxBIF,EAAI,EAAA,CA0BZ,EAEDR,EAACG,EAAA,CACC,WAACS,EAAA,CAAU,UAAU,mBAAmB,QAASrB,EAAM,gBAAgB,OACpE,SAAAG,CAAA,CACH,EACF,CAAA,CAEJ,CAAA,EACF,EACCC,EACC,OAAOF,GAAe,WACpBA,EAAWG,CAAe,EAE1BI,EAACa,EAAA,CAAiB,GAAGjB,CAAA,CAAiB,EAEtC,IAAA,EACN,CAEJ"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{jsxs as m,jsx as r}from"react/jsx-runtime";import{useRef as v,useState as E,useLayoutEffect as H}from"react";import{flexRender as w}from"../../../../node_modules/@tanstack/react-table/build/lib/index.js";import{TablePagination as M}from"./TablePagination.js";import{Table as z,TableBody as I,TableRow as x,TableHead as j,TableCell as b}from"./ui/primitives/Primitives.js";import{cn as a}from"../../utils/cn.js";const V=({mode:l,enableHeaders:C,table:e,classes:t,pagination:g,empty:y="Ничего не найдено"})=>{const d=v(null),[N,R]=E(!1);H(()=>{if(!d.current)return;const n=d.current,o=new AbortController;return d.current.addEventListener("scroll",()=>{const i=n.scrollLeft;R(i!==0)},{signal:o.signal}),()=>{o.abort()}},[]);const L=g!==!1&&e.getPageCount()>1,u={pageCount:e.getPageCount(),rowsCount:e.getCoreRowModel().rows.length,pageSize:e.getState().pagination.pageSize,page:e.getState().pagination.pageIndex+1,onPageIndexChange:e.setPageIndex,classes:t==null?void 0:t.pagination},c=e.getRowModel().rows,p=e.getAllLeafColumns(),h=new Map;return e.getHeaderGroups().forEach(n=>{n.headers.forEach(o=>{h.set(o.column.id,o)})}),m("div",{className:a("flex w-full flex-col gap-y-4",t==null?void 0:t.root),children:[r("div",{ref:d,className:"relative overflow-x-auto",children:r(z,{className:a("min-w-full",t==null?void 0:t.table),children:r(I,{children:p.length&&c.length?p.map((n,o)=>{const i=h.get(n.id);return m(x,{className:a("w-full",{"[&:not(:last-child)]:border-b":l==="solid"},t==null?void 0:t.tableRow),children:[C&&r(j,{className:a("sticky left-0 bg-color-white py-3 text-left text-color-tetriary desktop:whitespace-nowrap",{"px-3":l==="odd","bg-color-primary-light-default":l==="odd"&&o%2===0,"[&:not(:last-child)]:border-b-[rgba(234,237,241,1)]":l==="solid","drop-shadow-xl":N},t==null?void 0:t.tableHead),children:i&&w(i.column.columnDef.header,i.getContext())}),c.map((P,S)=>{const f=P.getVisibleCells().find(T=>T.column.id===n.id);return f?r(b,{className:a("whitespace-nowrap py-3",{"bg-color-primary-light-default":l==="odd"&&o%2===0,"px-3":l==="odd"},t==null?void 0:t.tableCell),children:w(f.column.columnDef.cell,{...f.getContext(),rowIndex:S})},f.id):null})]},n.id)}):r(x,{children:r(b,{className:"py-4 text-center",colSpan:p.length+1,children:y})})})})}),L?typeof g=="function"?g(u):r(M,{...u}):null]})};export{V as Horizontal};
|
|
2
|
+
//# sourceMappingURL=Horizontal.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Horizontal.js","sources":["../../../../../lib/shared/ui/table/Horizontal.tsx"],"sourcesContent":["import { useLayoutEffect, useRef, useState } from 'react'\nimport { flexRender, type Header, type Table as TTable } from '@tanstack/react-table'\nimport type { DataTableProps } from './model'\nimport { TablePagination } from './TablePagination'\nimport { Table, TableBody, TableCell, TableHead, TableRow } from './ui'\nimport { cn } from '$/shared/utils'\n\ntype DesktopTableProps<TData extends {}> = Pick<\n DataTableProps<TData>,\n 'enableHeaders' | 'classes' | 'mode' | 'pagination' | 'empty'\n> & {\n table: TTable<TData>\n}\n\nexport const Horizontal = <TData extends {}>({\n mode,\n enableHeaders,\n table,\n classes,\n pagination,\n empty = 'Ничего не найдено'\n}: DesktopTableProps<TData>) => {\n const containerRef = useRef<HTMLDivElement>(null)\n const [hasLeftOffset, setLeftOffset] = useState<boolean>(false)\n\n useLayoutEffect(() => {\n if (!containerRef.current) return\n const container = containerRef.current\n\n const abortController = new AbortController()\n\n containerRef.current.addEventListener(\n 'scroll',\n () => {\n const offset = container.scrollLeft\n setLeftOffset(offset !== 0)\n },\n { signal: abortController.signal }\n )\n\n return () => {\n abortController.abort()\n }\n }, [])\n\n const paginationEnabled = pagination !== false && table.getPageCount() > 1\n\n const paginationProps = {\n pageCount: table.getPageCount(),\n rowsCount: table.getCoreRowModel().rows.length,\n pageSize: table.getState().pagination.pageSize,\n page: table.getState().pagination.pageIndex + 1,\n onPageIndexChange: table.setPageIndex,\n classes: classes?.pagination\n }\n\n const rows = table.getRowModel().rows\n const columns = table.getAllLeafColumns()\n\n // карта column.id -> header\n const headersMap = new Map<string, Header<TData, unknown>>()\n table.getHeaderGroups().forEach((group) => {\n group.headers.forEach((header) => {\n headersMap.set(header.column.id, header)\n })\n })\n\n return (\n <div className={cn('flex w-full flex-col gap-y-4', classes?.root)}>\n <div ref={containerRef} className='relative overflow-x-auto'>\n <Table className={cn('min-w-full', classes?.table)}>\n <TableBody>\n {columns.length && rows.length ? (\n columns.map((column, index) => {\n const header = headersMap.get(column.id)\n\n return (\n <TableRow\n key={column.id}\n className={cn(\n 'w-full',\n {\n '[&:not(:last-child)]:border-b': mode === 'solid'\n },\n classes?.tableRow\n )}\n >\n {enableHeaders && (\n <TableHead\n className={cn(\n 'sticky left-0 bg-color-white py-3 text-left text-color-tetriary desktop:whitespace-nowrap',\n {\n 'px-3': mode === 'odd',\n 'bg-color-primary-light-default': mode === 'odd' && index % 2 === 0,\n '[&:not(:last-child)]:border-b-[rgba(234,237,241,1)]': mode === 'solid',\n 'drop-shadow-xl': hasLeftOffset\n },\n classes?.tableHead\n )}\n >\n {header && flexRender(header.column.columnDef.header, header.getContext())}\n </TableHead>\n )}\n\n {rows.map((row, rowIndex) => {\n const cell = row.getVisibleCells().find((c) => c.column.id === column.id)\n if (!cell) return null\n\n return (\n <TableCell\n key={cell.id}\n className={cn(\n 'whitespace-nowrap py-3',\n {\n 'bg-color-primary-light-default': mode === 'odd' && index % 2 === 0,\n 'px-3': mode === 'odd'\n },\n classes?.tableCell\n )}\n >\n {flexRender(cell.column.columnDef.cell, {\n ...cell.getContext(),\n rowIndex\n })}\n </TableCell>\n )\n })}\n </TableRow>\n )\n })\n ) : (\n <TableRow>\n <TableCell className='py-4 text-center' colSpan={columns.length + 1}>\n {empty}\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n </div>\n\n {paginationEnabled ? (\n typeof pagination === 'function' ? (\n pagination(paginationProps)\n ) : (\n <TablePagination {...paginationProps} />\n )\n ) : null}\n </div>\n )\n}\n"],"names":["Horizontal","mode","enableHeaders","table","classes","pagination","empty","containerRef","useRef","hasLeftOffset","setLeftOffset","useState","useLayoutEffect","container","abortController","offset","paginationEnabled","paginationProps","rows","columns","headersMap","group","header","cn","jsx","Table","TableBody","column","index","jsxs","TableRow","TableHead","flexRender","row","rowIndex","cell","c","TableCell","TablePagination"],"mappings":"kaAcO,MAAMA,EAAa,CAAmB,CAC3C,KAAAC,EACA,cAAAC,EACA,MAAAC,EACA,QAAAC,EACA,WAAAC,EACA,MAAAC,EAAQ,mBACV,IAAgC,CAC9B,MAAMC,EAAeC,EAAuB,IAAI,EAC1C,CAACC,EAAeC,CAAa,EAAIC,EAAkB,EAAK,EAE9DC,EAAgB,IAAM,CACpB,GAAI,CAACL,EAAa,QAAS,OAC3B,MAAMM,EAAYN,EAAa,QAEzBO,EAAkB,IAAI,gBAE5B,OAAAP,EAAa,QAAQ,iBACnB,SACA,IAAM,CACJ,MAAMQ,EAASF,EAAU,WACzBH,EAAcK,IAAW,CAAC,CAC5B,EACA,CAAE,OAAQD,EAAgB,MAAA,CAAO,EAG5B,IAAM,CACXA,EAAgB,MAAA,CAClB,CACF,EAAG,CAAA,CAAE,EAEL,MAAME,EAAoBX,IAAe,IAASF,EAAM,eAAiB,EAEnEc,EAAkB,CACtB,UAAWd,EAAM,aAAA,EACjB,UAAWA,EAAM,gBAAA,EAAkB,KAAK,OACxC,SAAUA,EAAM,SAAA,EAAW,WAAW,SACtC,KAAMA,EAAM,SAAA,EAAW,WAAW,UAAY,EAC9C,kBAAmBA,EAAM,aACzB,QAASC,GAAA,YAAAA,EAAS,UAAA,EAGdc,EAAOf,EAAM,YAAA,EAAc,KAC3BgB,EAAUhB,EAAM,kBAAA,EAGhBiB,MAAiB,IACvB,OAAAjB,EAAM,gBAAA,EAAkB,QAASkB,GAAU,CACzCA,EAAM,QAAQ,QAASC,GAAW,CAChCF,EAAW,IAAIE,EAAO,OAAO,GAAIA,CAAM,CACzC,CAAC,CACH,CAAC,IAGE,MAAA,CAAI,UAAWC,EAAG,+BAAgCnB,GAAA,YAAAA,EAAS,IAAI,EAC9D,SAAA,CAAAoB,EAAC,MAAA,CAAI,IAAKjB,EAAc,UAAU,2BAChC,SAAAiB,EAACC,EAAA,CAAM,UAAWF,EAAG,aAAcnB,GAAA,YAAAA,EAAS,KAAK,EAC/C,SAAAoB,EAACE,EAAA,CACE,SAAAP,EAAQ,QAAUD,EAAK,OACtBC,EAAQ,IAAI,CAACQ,EAAQC,IAAU,CAC7B,MAAMN,EAASF,EAAW,IAAIO,EAAO,EAAE,EAEvC,OACEE,EAACC,EAAA,CAEC,UAAWP,EACT,SACA,CACE,gCAAiCtB,IAAS,OAAA,EAE5CG,GAAA,YAAAA,EAAS,QAAA,EAGV,SAAA,CAAAF,GACCsB,EAACO,EAAA,CACC,UAAWR,EACT,4FACA,CACE,OAAQtB,IAAS,MACjB,iCAAkCA,IAAS,OAAS2B,EAAQ,IAAM,EAClE,sDAAuD3B,IAAS,QAChE,iBAAkBQ,CAAA,EAEpBL,GAAA,YAAAA,EAAS,SAAA,EAGV,SAAAkB,GAAUU,EAAWV,EAAO,OAAO,UAAU,OAAQA,EAAO,YAAY,CAAA,CAAA,EAI5EJ,EAAK,IAAI,CAACe,EAAKC,IAAa,CAC3B,MAAMC,EAAOF,EAAI,gBAAA,EAAkB,KAAMG,GAAMA,EAAE,OAAO,KAAOT,EAAO,EAAE,EACxE,OAAKQ,EAGHX,EAACa,EAAA,CAEC,UAAWd,EACT,yBACA,CACE,iCAAkCtB,IAAS,OAAS2B,EAAQ,IAAM,EAClE,OAAQ3B,IAAS,KAAA,EAEnBG,GAAA,YAAAA,EAAS,SAAA,EAGV,SAAA4B,EAAWG,EAAK,OAAO,UAAU,KAAM,CACtC,GAAGA,EAAK,WAAA,EACR,SAAAD,CAAA,CACD,CAAA,EAbIC,EAAK,EAAA,EAJI,IAoBpB,CAAC,CAAA,CAAA,EAhDIR,EAAO,EAAA,CAmDlB,CAAC,EAEDH,EAACM,EAAA,CACC,SAAAN,EAACa,GAAU,UAAU,mBAAmB,QAASlB,EAAQ,OAAS,EAC/D,SAAAb,CAAA,CACH,EACF,CAAA,CAEJ,EACF,EACF,EAECU,EACC,OAAOX,GAAe,WACpBA,EAAWY,CAAe,EAE1BO,EAACc,EAAA,CAAiB,GAAGrB,CAAA,CAAiB,EAEtC,IAAA,EACN,CAEJ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as n}from"react/jsx-runtime";import{useState as a}from"react";import{useReactTable as F}from"../../../../node_modules/@tanstack/react-table/build/lib/index.js";import{Desktop as C}from"./Desktop.js";import{Horizontal as S}from"./Horizontal.js";import{Mobile as b}from"./Mobile.js";import{useDevice as P}from"../../hooks/useDevice.js";import{getPaginationRowModel as h,getFacetedUniqueValues as x,getFacetedRowModel as D,getSortedRowModel as q,getFilteredRowModel as T,getCoreRowModel as U}from"../../../../node_modules/@tanstack/table-core/build/lib/index.js";const E=({columns:g,data:d,enableHeaders:o=!0,mode:e="solid",classes:t,pagination:l=!0,empty:i,pageSize:m=10,horizontal:s})=>{const[u,c]=a([]),[M,R]=a([]),[w,p]=a({pageIndex:0,pageSize:m}),r=F({data:d,columns:g,state:{columnFilters:u,sorting:M,pagination:w},enableRowSelection:!0,onSortingChange:R,onColumnFiltersChange:c,onPaginationChange:p,getCoreRowModel:U(),getFilteredRowModel:T(),getSortedRowModel:q(),getFacetedRowModel:D(),getFacetedUniqueValues:x(),getPaginationRowModel:h()}),{isMobile:f}=P();return s?n(S,{table:r,enableHeaders:o,empty:i,mode:e,pagination:l,classes:t}):f?n(b,{table:r,enableHeaders:o,empty:i,mode:e,classes:t}):n(C,{table:r,enableHeaders:o,empty:i,mode:e,pagination:l,classes:t})};export{E as DataTable};
|
|
2
2
|
//# sourceMappingURL=Table.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.js","sources":["../../../../../lib/shared/ui/table/Table.tsx"],"sourcesContent":["import { useState } from 'react'\nimport {\n type ColumnFiltersState,\n getCoreRowModel,\n getFacetedRowModel,\n getFacetedUniqueValues,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n type PaginationState,\n type SortingState,\n useReactTable\n} from '@tanstack/react-table'\nimport { Desktop } from './Desktop'\nimport { Mobile } from './Mobile'\nimport { type DataTableProps } from './model'\nimport { useDevice } from '$/shared/hooks'\n\nexport const DataTable = <TData extends {}>({\n columns,\n data,\n enableHeaders = true,\n mode = 'solid',\n classes,\n pagination = true,\n empty,\n pageSize = 10\n}: DataTableProps<TData>) => {\n const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([])\n const [sorting, setSorting] = useState<SortingState>([])\n const [paginationState, setPagination] = useState<PaginationState>({\n pageIndex: 0,\n pageSize\n })\n\n const table = useReactTable({\n data,\n columns,\n state: { columnFilters, sorting, pagination: paginationState },\n enableRowSelection: true,\n onSortingChange: setSorting,\n onColumnFiltersChange: setColumnFilters,\n onPaginationChange: setPagination,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getFacetedRowModel: getFacetedRowModel(),\n getFacetedUniqueValues: getFacetedUniqueValues(),\n getPaginationRowModel: getPaginationRowModel()\n })\n\n const { isMobile } = useDevice()\n\n return isMobile ? (\n <Mobile table={table} enableHeaders={enableHeaders} empty={empty} mode={mode} classes={classes} />\n ) : (\n <Desktop table={table} enableHeaders={enableHeaders} empty={empty} mode={mode} pagination={pagination} classes={classes} />\n )\n}\n"],"names":["DataTable","columns","data","enableHeaders","mode","classes","pagination","empty","pageSize","columnFilters","setColumnFilters","useState","sorting","setSorting","paginationState","setPagination","table","useReactTable","getCoreRowModel","getFilteredRowModel","getSortedRowModel","getFacetedRowModel","getFacetedUniqueValues","getPaginationRowModel","isMobile","useDevice","jsx","Mobile","Desktop"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Table.js","sources":["../../../../../lib/shared/ui/table/Table.tsx"],"sourcesContent":["import { useState } from 'react'\nimport {\n type ColumnFiltersState,\n getCoreRowModel,\n getFacetedRowModel,\n getFacetedUniqueValues,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n type PaginationState,\n type SortingState,\n useReactTable\n} from '@tanstack/react-table'\nimport { Desktop } from './Desktop'\nimport { Horizontal } from './Horizontal'\nimport { Mobile } from './Mobile'\nimport { type DataTableProps } from './model'\nimport { useDevice } from '$/shared/hooks'\n\nexport const DataTable = <TData extends {}>({\n columns,\n data,\n enableHeaders = true,\n mode = 'solid',\n classes,\n pagination = true,\n empty,\n pageSize = 10,\n horizontal\n}: DataTableProps<TData>) => {\n const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([])\n const [sorting, setSorting] = useState<SortingState>([])\n const [paginationState, setPagination] = useState<PaginationState>({\n pageIndex: 0,\n pageSize\n })\n\n const table = useReactTable({\n data,\n columns,\n state: { columnFilters, sorting, pagination: paginationState },\n enableRowSelection: true,\n onSortingChange: setSorting,\n onColumnFiltersChange: setColumnFilters,\n onPaginationChange: setPagination,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getFacetedRowModel: getFacetedRowModel(),\n getFacetedUniqueValues: getFacetedUniqueValues(),\n getPaginationRowModel: getPaginationRowModel()\n })\n\n const { isMobile } = useDevice()\n\n if (horizontal) {\n return (\n <Horizontal\n table={table}\n enableHeaders={enableHeaders}\n empty={empty}\n mode={mode}\n pagination={pagination}\n classes={classes}\n />\n )\n }\n\n return isMobile ? (\n <Mobile table={table} enableHeaders={enableHeaders} empty={empty} mode={mode} classes={classes} />\n ) : (\n <Desktop table={table} enableHeaders={enableHeaders} empty={empty} mode={mode} pagination={pagination} classes={classes} />\n )\n}\n"],"names":["DataTable","columns","data","enableHeaders","mode","classes","pagination","empty","pageSize","horizontal","columnFilters","setColumnFilters","useState","sorting","setSorting","paginationState","setPagination","table","useReactTable","getCoreRowModel","getFilteredRowModel","getSortedRowModel","getFacetedRowModel","getFacetedUniqueValues","getPaginationRowModel","isMobile","useDevice","jsx","Horizontal","Mobile","Desktop"],"mappings":"2jBAmBO,MAAMA,EAAY,CAAmB,CAC1C,QAAAC,EACA,KAAAC,EACA,cAAAC,EAAgB,GAChB,KAAAC,EAAO,QACP,QAAAC,EACA,WAAAC,EAAa,GACb,MAAAC,EACA,SAAAC,EAAW,GACX,WAAAC,CACF,IAA6B,CAC3B,KAAM,CAACC,EAAeC,CAAgB,EAAIC,EAA6B,CAAA,CAAE,EACnE,CAACC,EAASC,CAAU,EAAIF,EAAuB,CAAA,CAAE,EACjD,CAACG,EAAiBC,CAAa,EAAIJ,EAA0B,CACjE,UAAW,EACX,SAAAJ,CAAA,CACD,EAEKS,EAAQC,EAAc,CAC1B,KAAAhB,EACA,QAAAD,EACA,MAAO,CAAE,cAAAS,EAAe,QAAAG,EAAS,WAAYE,CAAA,EAC7C,mBAAoB,GACpB,gBAAiBD,EACjB,sBAAuBH,EACvB,mBAAoBK,EACpB,gBAAiBG,EAAA,EACjB,oBAAqBC,EAAA,EACrB,kBAAmBC,EAAA,EACnB,mBAAoBC,EAAA,EACpB,uBAAwBC,EAAA,EACxB,sBAAuBC,EAAA,CAAsB,CAC9C,EAEK,CAAE,SAAAC,CAAA,EAAaC,EAAA,EAErB,OAAIjB,EAEAkB,EAACC,EAAA,CACC,MAAAX,EACA,cAAAd,EACA,MAAAI,EACA,KAAAH,EACA,WAAAE,EACA,QAAAD,CAAA,CAAA,EAKCoB,EACLE,EAACE,EAAA,CAAO,MAAAZ,EAAc,cAAAd,EAA8B,MAAAI,EAAc,KAAAH,EAAY,QAAAC,CAAA,CAAkB,EAEhGsB,EAACG,GAAQ,MAAAb,EAAc,cAAAd,EAA8B,MAAAI,EAAc,KAAAH,EAAY,WAAAE,EAAwB,QAAAD,EAAkB,CAE7H"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as d,jsx as e}from"react/jsx-runtime";import{useDevice as x}from"../../../../hooks/useDevice.js";import"react";import{cn as t}from"../../../../utils/cn.js";import{Icon as b}from"../../../icon/Icon.js";const D=({children:r,canSort:s,toggleSorting:a,nextSortingOrder:n,isSorted:c,classes:i})=>{const{root:m,content:l,icon:p}=i||{},{isDesktop:u}=x(),o=s&&u;return d("button",{type:"button",className:t("desk-body-regular-l flex items-center justify-center gap-x-2 text-
|
|
1
|
+
import{jsxs as d,jsx as e}from"react/jsx-runtime";import{useDevice as x}from"../../../../hooks/useDevice.js";import"react";import{cn as t}from"../../../../utils/cn.js";import{Icon as b}from"../../../icon/Icon.js";const D=({children:r,canSort:s,toggleSorting:a,nextSortingOrder:n,isSorted:c,classes:i})=>{const{root:m,content:l,icon:p}=i||{},{isDesktop:u}=x(),o=s&&u;return d("button",{type:"button",className:t("desk-body-regular-l flex items-center justify-center gap-x-2 text-start",m),onClick:()=>a(!c),disabled:!o,children:[e("span",{className:t("",l),children:r}),o&&e(b,{name:"arrows/arrowRight",className:t("size-4 rotate-90 text-color-current duration-100",{"-rotate-90":!n},p)})]})};export{D as DataTableColumnHeader};
|
|
2
2
|
//# sourceMappingURL=DataTableColumnHeader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTableColumnHeader.js","sources":["../../../../../../../lib/shared/ui/table/ui/dataTableColumnHeader/DataTableColumnHeader.tsx"],"sourcesContent":["import { type SortDirection } from '@tanstack/react-table'\nimport { useDevice } from '$/shared/hooks'\nimport { Icon } from '$/shared/ui/icon'\nimport { cn } from '$/shared/utils'\n\ntype DataTableColumnHeaderClasses = {\n root?: string\n content?: string\n icon?: string\n}\n\ntype DataTableColumnHeaderProps = {\n children: React.ReactNode\n isSorted: boolean | SortDirection\n toggleSorting: (desc: boolean) => void\n nextSortingOrder: boolean | SortDirection\n canSort: boolean\n classes?: DataTableColumnHeaderClasses\n}\n\nexport const DataTableColumnHeader = ({\n children,\n canSort,\n toggleSorting,\n nextSortingOrder,\n isSorted,\n classes\n}: DataTableColumnHeaderProps) => {\n const { root, content, icon } = classes || {}\n\n const { isDesktop } = useDevice()\n\n const isSortable = canSort && isDesktop\n\n return (\n <button\n type='button'\n className={cn('desk-body-regular-l flex items-center justify-center gap-x-2 text-
|
|
1
|
+
{"version":3,"file":"DataTableColumnHeader.js","sources":["../../../../../../../lib/shared/ui/table/ui/dataTableColumnHeader/DataTableColumnHeader.tsx"],"sourcesContent":["import { type SortDirection } from '@tanstack/react-table'\nimport { useDevice } from '$/shared/hooks'\nimport { Icon } from '$/shared/ui/icon'\nimport { cn } from '$/shared/utils'\n\ntype DataTableColumnHeaderClasses = {\n root?: string\n content?: string\n icon?: string\n}\n\ntype DataTableColumnHeaderProps = {\n children: React.ReactNode\n isSorted: boolean | SortDirection\n toggleSorting: (desc: boolean) => void\n nextSortingOrder: boolean | SortDirection\n canSort: boolean\n classes?: DataTableColumnHeaderClasses\n}\n\nexport const DataTableColumnHeader = ({\n children,\n canSort,\n toggleSorting,\n nextSortingOrder,\n isSorted,\n classes\n}: DataTableColumnHeaderProps) => {\n const { root, content, icon } = classes || {}\n\n const { isDesktop } = useDevice()\n\n const isSortable = canSort && isDesktop\n\n return (\n <button\n type='button'\n className={cn('desk-body-regular-l flex items-center justify-center gap-x-2 text-start', root)}\n onClick={() => toggleSorting(!isSorted)}\n disabled={!isSortable}\n >\n <span className={cn('', content)}>{children}</span>\n {isSortable && (\n <Icon\n name='arrows/arrowRight'\n className={cn(\n 'size-4 rotate-90 text-color-current duration-100',\n {\n '-rotate-90': !nextSortingOrder\n },\n icon\n )}\n />\n )}\n </button>\n )\n}\n"],"names":["DataTableColumnHeader","children","canSort","toggleSorting","nextSortingOrder","isSorted","classes","root","content","icon","isDesktop","useDevice","isSortable","jsxs","cn","jsx","Icon"],"mappings":"qNAoBO,MAAMA,EAAwB,CAAC,CACpC,SAAAC,EACA,QAAAC,EACA,cAAAC,EACA,iBAAAC,EACA,SAAAC,EACA,QAAAC,CACF,IAAkC,CAChC,KAAM,CAAE,KAAAC,EAAM,QAAAC,EAAS,KAAAC,CAAA,EAASH,GAAW,CAAA,EAErC,CAAE,UAAAI,CAAA,EAAcC,EAAA,EAEhBC,EAAaV,GAAWQ,EAE9B,OACEG,EAAC,SAAA,CACC,KAAK,SACL,UAAWC,EAAG,0EAA2EP,CAAI,EAC7F,QAAS,IAAMJ,EAAc,CAACE,CAAQ,EACtC,SAAU,CAACO,EAEX,SAAA,CAAAG,EAAC,QAAK,UAAWD,EAAG,GAAIN,CAAO,EAAI,SAAAP,EAAS,EAC3CW,GACCG,EAACC,EAAA,CACC,KAAK,oBACL,UAAWF,EACT,mDACA,CACE,aAAc,CAACV,CAAA,EAEjBK,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAIR"}
|