@oneplatformdev/ui 0.1.99-beta.196 → 0.1.99-beta.197
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/.storybook/Wrappers.js.map +1 -1
- package/Accordion/Accordion.js.map +1 -1
- package/Alert/Alert.js.map +1 -1
- package/Alert/alertVariants.js.map +1 -1
- package/AlertDialog/AlertDialog.js.map +1 -1
- package/AlertDialog/AlertDialog.stories.js +2 -4
- package/AlertDialog/AlertDialog.stories.js.map +1 -1
- package/AlertDialog/AlertDialogRoot.js +18 -20
- package/AlertDialog/AlertDialogRoot.js.map +1 -1
- package/AreaChart/AreaChart.js.map +1 -1
- package/Aside/Aside.js.map +1 -1
- package/Aside/AsideSidebar.js.map +1 -1
- package/AspectRatio/AspectRatio.js.map +1 -1
- package/Avatar/Avatar.js.map +1 -1
- package/Badge/Badge.js.map +1 -1
- package/Badge/badgeVariants.js.map +1 -1
- package/Breadcrumb/Breadcrumb.js.map +1 -1
- package/Button/Button.js +10 -11
- package/Button/Button.js.map +1 -1
- package/Button/Button.stories.js.map +1 -1
- package/Button/Button.utils.js.map +1 -1
- package/Button/ButtonCounterBadge.js.map +1 -1
- package/Button/buttonVariants.js.map +1 -1
- package/ButtonIcon/ButtonIcon.js +19 -22
- package/ButtonIcon/ButtonIcon.js.map +1 -1
- package/ButtonIcon/ButtonIcon.stories.js.map +1 -1
- package/ButtonIcon/buttonIconVariants.js.map +1 -1
- package/CHANGELOG.md +2649 -2641
- package/Calendar/Calendar.js +4 -6
- package/Calendar/Calendar.js.map +1 -1
- package/Card/Card.js.map +1 -1
- package/Carousel/Carousel.js +6 -7
- package/Carousel/Carousel.js.map +1 -1
- package/Chart/Chart.js.map +1 -1
- package/Checkbox/Checkbox.js +4 -5
- package/Checkbox/Checkbox.js.map +1 -1
- package/Checkbox/Checkbox.stories.js.map +1 -1
- package/Collapsible/Collapsible.js.map +1 -1
- package/Combobox/Combobox.js +33 -35
- package/Combobox/Combobox.js.map +1 -1
- package/Combobox/Combobox.stories.js.map +1 -1
- package/Combobox/ComboboxOptionItem.js +4 -4
- package/Combobox/ComboboxOptionItem.js.map +1 -1
- package/Combobox/ComboboxOptions.js +14 -15
- package/Combobox/ComboboxOptions.js.map +1 -1
- package/Command/Command.js +22 -23
- package/Command/Command.js.map +1 -1
- package/DataTable/DataTable.js +22 -24
- package/DataTable/DataTable.js.map +1 -1
- package/DataTable/DataTableColumnFilter.js +6 -7
- package/DataTable/DataTableColumnFilter.js.map +1 -1
- package/DataTable/useDataTable.js.map +1 -1
- package/DatePicker/DatePicker.js +12 -13
- package/DatePicker/DatePicker.js.map +1 -1
- package/Dialog/Dialog.js +16 -17
- package/Dialog/Dialog.js.map +1 -1
- package/Dialog/Dialog.stories.js +14 -15
- package/Dialog/Dialog.stories.js.map +1 -1
- package/Dialog/DialogOverlayScope.js.map +1 -1
- package/Drawer/Drawer.js.map +1 -1
- package/DropdownMenu/DropdownMenu.js.map +1 -1
- package/Dropzone/Dropzone.js.map +1 -1
- package/Dropzone/Dropzone.types.js.map +1 -1
- package/Dropzone/DropzoneFilePreview.js.map +1 -1
- package/Dropzone/DropzoneSinglePickPreview.js.map +1 -1
- package/Dropzone/DropzoneUtils.js.map +1 -1
- package/Form/Form.js +14 -15
- package/Form/Form.js.map +1 -1
- package/Form/FormRenderControl.js +7 -8
- package/Form/FormRenderControl.js.map +1 -1
- package/Form/Form_old.js +4 -5
- package/Form/Form_old.js.map +1 -1
- package/FormCheckbox/FormCheckbox.js +4 -4
- package/FormCheckbox/FormCheckbox.js.map +1 -1
- package/FormCombobox/FormCombobox.js +4 -4
- package/FormCombobox/FormCombobox.js.map +1 -1
- package/FormDatePicker/FormDatePicker.js +4 -4
- package/FormDatePicker/FormDatePicker.js.map +1 -1
- package/FormDropzone/FormDropzone.js +3 -3
- package/FormDropzone/FormDropzone.js.map +1 -1
- package/FormInput/FormInput.d.ts.map +1 -1
- package/FormInput/FormInput.js +26 -25
- package/FormInput/FormInput.js.map +1 -1
- package/FormInput/FormInput.stories.js +21 -17
- package/FormInput/FormInput.stories.js.map +1 -1
- package/FormInput/FormInput.types.d.ts +1 -0
- package/FormInput/FormInput.types.d.ts.map +1 -1
- package/FormRadio/FormRadio.js.map +1 -1
- package/FormSelect/FormSelect.js +6 -9
- package/FormSelect/FormSelect.js.map +1 -1
- package/FormTextarea/FormTextarea.js +4 -4
- package/FormTextarea/FormTextarea.js.map +1 -1
- package/Header/Header.js.map +1 -1
- package/HoverCard/HoverCard.js.map +1 -1
- package/InfoBlock/InfoBlock.js.map +1 -1
- package/InfoBlock/InfoBlock.stories.js.map +1 -1
- package/InfoBlock/infoBlockVariants.js.map +1 -1
- package/Input/Input.d.ts.map +1 -1
- package/Input/Input.js +65 -51
- package/Input/Input.js.map +1 -1
- package/Input/Input.types.d.ts +1 -0
- package/Input/Input.types.d.ts.map +1 -1
- package/Input/inputVariants.js.map +1 -1
- package/InputOTP/InputOTP.d.ts.map +1 -1
- package/InputOTP/InputOTP.js.map +1 -1
- package/LICENSE +21 -21
- package/Label/Label.js.map +1 -1
- package/Label/labelVariants.js.map +1 -1
- package/LazyLoader/LazyLoader.js +4 -5
- package/LazyLoader/LazyLoader.js.map +1 -1
- package/LoadedIcon/LoadedIcon.js.map +1 -1
- package/LoadingMask/LoadingMask.js.map +1 -1
- package/LoadingMask/RenderLoadingMask.js.map +1 -1
- package/LoadingProgress/LoadingProgress.js.map +1 -1
- package/LoadingProgress/loadingProgressVariants.js.map +1 -1
- package/Menubar/Menubar.js.map +1 -1
- package/NavigationMenu/NavigationMenu.js.map +1 -1
- package/NavigationMenu/navigationMenuVariants.js.map +1 -1
- package/Pagination/Pagination.js +0 -1
- package/Pagination/Pagination.js.map +1 -1
- package/Popover/Popover.js.map +1 -1
- package/Progress/Progress.js.map +1 -1
- package/README.md +7 -7
- package/Radio/Radio.js.map +1 -1
- package/RadioGroup/RadioGroup.js.map +1 -1
- package/Resizable/Resizable.js.map +1 -1
- package/Resizable/Resizable.stories.js.map +1 -1
- package/ScrollArea/ScrollArea.js.map +1 -1
- package/Search/Search.js +9 -9
- package/Search/Search.js.map +1 -1
- package/Search/Search.stories.js.map +1 -1
- package/Select/Select.js +6 -7
- package/Select/Select.js.map +1 -1
- package/Select/Select.stories.js.map +1 -1
- package/Select/SelectRoot.js.map +1 -1
- package/Separator/Separator.js.map +1 -1
- package/Sheet/Sheet.js.map +1 -1
- package/Sidebar/Sidebar.js +20 -21
- package/Sidebar/Sidebar.js.map +1 -1
- package/Skeleton/Skeleton.js.map +1 -1
- package/Slider/Slider.js.map +1 -1
- package/Sonner/Sonner.js.map +1 -1
- package/Switch/Switch.js.map +1 -1
- package/Table/Table.js.map +1 -1
- package/TablePagination/TablePagination.js +21 -26
- package/TablePagination/TablePagination.js.map +1 -1
- package/Tabs/Tabs.js.map +1 -1
- package/Tabs/TabsRoot.js.map +1 -1
- package/Textarea/Textarea.js.map +1 -1
- package/Textarea/Textarea.stories.js.map +1 -1
- package/Textarea/useAutosizeTextArea.js.map +1 -1
- package/Theme/ThemeModeToggle.js +3 -4
- package/Theme/ThemeModeToggle.js.map +1 -1
- package/Theme/ThemeProvider.js.map +1 -1
- package/Toast/Toast.js.map +1 -1
- package/Toast/toast.constants.js.map +1 -1
- package/Toast/toastVariants.js.map +1 -1
- package/Toast/useToast.js.map +1 -1
- package/Toaster/Toaster.js.map +1 -1
- package/Toggle/Toggle.js.map +1 -1
- package/ToggleGroup/ToggleGroup.js.map +1 -1
- package/Tooltip/Tooltip.js.map +1 -1
- package/Tooltip/TooltipRoot.js.map +1 -1
- package/Tooltip/tooltipVariants.js.map +1 -1
- package/index.js +280 -280
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.js","sources":["../../src/DataTable/DataTable.tsx"],"sourcesContent":["'use client';\n\nimport { Button } from '../Button';\nimport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuTrigger,\n} from '../DropdownMenu';\nimport {\n Table,\n TableBody,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from '../Table';\nimport { flexRender, type Table as ReactTable } from '@tanstack/react-table';\nimport { ChevronDown } from 'lucide-react';\nimport React, { FC } from 'react';\n\ninterface IProps {\n table: ReactTable<any>;\n ToolBar?: React.ReactNode;\n tColumns?: string;\n tNoResults?: string;\n}\n\nexport const DataTable: FC<IProps> = ({\n table,\n ToolBar,\n tColumns = 'Columns',\n tNoResults = 'No results',\n}) => {\n return (\n <div className=\"w-full\">\n <div className=\"flex items-center py-4\">\n {ToolBar}\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button variant=\"outline\" className=\"ml-auto\">\n {tColumns} <ChevronDown className=\"ml-2 h-4 w-4\" />\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\">\n {table\n .getAllColumns()\n .filter((column) => column.getCanHide())\n .map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.id}\n className=\"capitalize\"\n checked={column.getIsVisible()}\n onCheckedChange={(value) =>\n column.toggleVisibility(!!value)\n }\n >\n {column.id}\n </DropdownMenuCheckboxItem>\n );\n })}\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n <div className=\"rounded-md border\">\n <Table>\n <TableHeader>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n return (\n <TableHead key={header.id}>\n {header.isPlaceholder\n ? null\n : flexRender(\n header.column.columnDef.header,\n header.getContext()\n )}\n </TableHead>\n );\n })}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {table.getRowModel().rows?.length ? (\n table.getRowModel().rows.map((row) => (\n <TableRow\n key={row.id}\n data-state={row.getIsSelected() && 'selected'}\n >\n {row.getVisibleCells().map((cell) => (\n <TableCell key={cell.id}>\n {flexRender(\n cell.column.columnDef.cell,\n cell.getContext()\n )}\n </TableCell>\n ))}\n </TableRow>\n ))\n ) : (\n <TableRow>\n <TableCell\n colSpan={table.getAllColumns().length}\n className=\"h-24 text-center\"\n >\n {tNoResults}\n </TableCell>\n </TableRow>\n )}\n </TableBody>\n </Table>\n </div>\n </div>\n );\n};\n"],"names":["DataTable","table","ToolBar","tColumns","tNoResults","jsxs","DropdownMenu","jsx","DropdownMenuTrigger","Button","ChevronDown","DropdownMenuContent","column","DropdownMenuCheckboxItem","value","Table","TableHeader","headerGroup","TableRow","header","TableHead","flexRender","TableBody","row","cell","TableCell"],"mappings":"
|
|
1
|
+
{"version":3,"file":"DataTable.js","sources":["../../src/DataTable/DataTable.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { Button } from '../Button';\r\nimport {\r\n DropdownMenu,\r\n DropdownMenuCheckboxItem,\r\n DropdownMenuContent,\r\n DropdownMenuTrigger,\r\n} from '../DropdownMenu';\r\nimport {\r\n Table,\r\n TableBody,\r\n TableCell,\r\n TableHead,\r\n TableHeader,\r\n TableRow,\r\n} from '../Table';\r\nimport { flexRender, type Table as ReactTable } from '@tanstack/react-table';\r\nimport { ChevronDown } from 'lucide-react';\r\nimport React, { FC } from 'react';\r\n\r\ninterface IProps {\r\n table: ReactTable<any>;\r\n ToolBar?: React.ReactNode;\r\n tColumns?: string;\r\n tNoResults?: string;\r\n}\r\n\r\nexport const DataTable: FC<IProps> = ({\r\n table,\r\n ToolBar,\r\n tColumns = 'Columns',\r\n tNoResults = 'No results',\r\n}) => {\r\n return (\r\n <div className=\"w-full\">\r\n <div className=\"flex items-center py-4\">\r\n {ToolBar}\r\n <DropdownMenu>\r\n <DropdownMenuTrigger asChild>\r\n <Button variant=\"outline\" className=\"ml-auto\">\r\n {tColumns} <ChevronDown className=\"ml-2 h-4 w-4\" />\r\n </Button>\r\n </DropdownMenuTrigger>\r\n <DropdownMenuContent align=\"end\">\r\n {table\r\n .getAllColumns()\r\n .filter((column) => column.getCanHide())\r\n .map((column) => {\r\n return (\r\n <DropdownMenuCheckboxItem\r\n key={column.id}\r\n className=\"capitalize\"\r\n checked={column.getIsVisible()}\r\n onCheckedChange={(value) =>\r\n column.toggleVisibility(!!value)\r\n }\r\n >\r\n {column.id}\r\n </DropdownMenuCheckboxItem>\r\n );\r\n })}\r\n </DropdownMenuContent>\r\n </DropdownMenu>\r\n </div>\r\n <div className=\"rounded-md border\">\r\n <Table>\r\n <TableHeader>\r\n {table.getHeaderGroups().map((headerGroup) => (\r\n <TableRow key={headerGroup.id}>\r\n {headerGroup.headers.map((header) => {\r\n return (\r\n <TableHead key={header.id}>\r\n {header.isPlaceholder\r\n ? null\r\n : flexRender(\r\n header.column.columnDef.header,\r\n header.getContext()\r\n )}\r\n </TableHead>\r\n );\r\n })}\r\n </TableRow>\r\n ))}\r\n </TableHeader>\r\n <TableBody>\r\n {table.getRowModel().rows?.length ? (\r\n table.getRowModel().rows.map((row) => (\r\n <TableRow\r\n key={row.id}\r\n data-state={row.getIsSelected() && 'selected'}\r\n >\r\n {row.getVisibleCells().map((cell) => (\r\n <TableCell key={cell.id}>\r\n {flexRender(\r\n cell.column.columnDef.cell,\r\n cell.getContext()\r\n )}\r\n </TableCell>\r\n ))}\r\n </TableRow>\r\n ))\r\n ) : (\r\n <TableRow>\r\n <TableCell\r\n colSpan={table.getAllColumns().length}\r\n className=\"h-24 text-center\"\r\n >\r\n {tNoResults}\r\n </TableCell>\r\n </TableRow>\r\n )}\r\n </TableBody>\r\n </Table>\r\n </div>\r\n </div>\r\n );\r\n};\r\n"],"names":["DataTable","table","ToolBar","tColumns","tNoResults","jsxs","DropdownMenu","jsx","DropdownMenuTrigger","Button","ChevronDown","DropdownMenuContent","column","DropdownMenuCheckboxItem","value","Table","TableHeader","headerGroup","TableRow","header","TableHead","flexRender","TableBody","row","cell","TableCell"],"mappings":";;;;;;AA4BO,MAAMA,IAAwB,CAAC;AAAA,EACpC,OAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,YAAAC,IAAa;AACf,MAEI,gBAAAC,EAAC,OAAA,EAAI,WAAU,UACb,UAAA;AAAA,EAAA,gBAAAA,EAAC,OAAA,EAAI,WAAU,0BACZ,UAAA;AAAA,IAAAH;AAAA,sBACAI,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAoB,SAAO,IAC1B,UAAA,gBAAAH,EAACI,KAAO,SAAQ,WAAU,WAAU,WACjC,UAAA;AAAA,QAAAN;AAAA,QAAS;AAAA,QAAC,gBAAAI,EAACG,GAAA,EAAY,WAAU,eAAA,CAAe;AAAA,MAAA,EAAA,CACnD,EAAA,CACF;AAAA,wBACCC,GAAA,EAAoB,OAAM,OACxB,UAAAV,EACE,gBACA,OAAO,CAACW,MAAWA,EAAO,WAAA,CAAY,EACtC,IAAI,CAACA,MAEF,gBAAAL;AAAA,QAACM;AAAA,QAAA;AAAA,UAEC,WAAU;AAAA,UACV,SAASD,EAAO,aAAA;AAAA,UAChB,iBAAiB,CAACE,MAChBF,EAAO,iBAAiB,CAAC,CAACE,CAAK;AAAA,UAGhC,UAAAF,EAAO;AAAA,QAAA;AAAA,QAPHA,EAAO;AAAA,MAAA,CAUjB,EAAA,CACL;AAAA,IAAA,EAAA,CACF;AAAA,EAAA,GACF;AAAA,EACA,gBAAAL,EAAC,OAAA,EAAI,WAAU,qBACb,4BAACQ,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAR,EAACS,GAAA,EACE,UAAAf,EAAM,gBAAA,EAAkB,IAAI,CAACgB,MAC5B,gBAAAV,EAACW,GAAA,EACE,UAAAD,EAAY,QAAQ,IAAI,CAACE,MAEtB,gBAAAZ,EAACa,GAAA,EACE,UAAAD,EAAO,gBACJ,OACAE;AAAA,MACEF,EAAO,OAAO,UAAU;AAAA,MACxBA,EAAO,WAAA;AAAA,IAAW,EACpB,GANUA,EAAO,EAOvB,CAEH,EAAA,GAZYF,EAAY,EAa3B,CACD,EAAA,CACH;AAAA,IACA,gBAAAV,EAACe,GAAA,EACE,UAAArB,EAAM,YAAA,EAAc,MAAM,SACzBA,EAAM,YAAA,EAAc,KAAK,IAAI,CAACsB,MAC5B,gBAAAhB;AAAA,MAACW;AAAA,MAAA;AAAA,QAEC,cAAYK,EAAI,cAAA,KAAmB;AAAA,QAElC,YAAI,gBAAA,EAAkB,IAAI,CAACC,wBACzBC,GAAA,EACE,UAAAJ;AAAA,UACCG,EAAK,OAAO,UAAU;AAAA,UACtBA,EAAK,WAAA;AAAA,QAAW,EAClB,GAJcA,EAAK,EAKrB,CACD;AAAA,MAAA;AAAA,MAVID,EAAI;AAAA,IAAA,CAYZ,IAED,gBAAAhB,EAACW,GAAA,EACC,UAAA,gBAAAX;AAAA,MAACkB;AAAA,MAAA;AAAA,QACC,SAASxB,EAAM,cAAA,EAAgB;AAAA,QAC/B,WAAU;AAAA,QAET,UAAAG;AAAA,MAAA;AAAA,IAAA,GAEL,EAAA,CAEJ;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAAA,GACF;"}
|
|
@@ -1,14 +1,13 @@
|
|
|
1
1
|
import { jsx as n, jsxs as t } from "react/jsx-runtime";
|
|
2
|
-
import { ChevronDown as
|
|
3
|
-
import { useMemo as
|
|
2
|
+
import { ChevronDown as s } from "lucide-react";
|
|
3
|
+
import { useMemo as m } from "react";
|
|
4
4
|
import { Button as d } from "../Button/Button.js";
|
|
5
|
-
import "../Button/buttonVariants.js";
|
|
6
5
|
import { DropdownMenuCheckboxItem as c, DropdownMenu as u, DropdownMenuTrigger as h, DropdownMenuContent as p } from "../DropdownMenu/DropdownMenu.js";
|
|
7
|
-
const
|
|
6
|
+
const D = (i) => {
|
|
8
7
|
const {
|
|
9
8
|
table: r,
|
|
10
9
|
columnsLabel: l = "Columns"
|
|
11
|
-
} = i, o =
|
|
10
|
+
} = i, o = m(() => r.getAllColumns().filter((e) => e.getCanHide()).map((e) => /* @__PURE__ */ n(
|
|
12
11
|
c,
|
|
13
12
|
{
|
|
14
13
|
className: "capitalize",
|
|
@@ -21,12 +20,12 @@ const x = (i) => {
|
|
|
21
20
|
return o.length ? /* @__PURE__ */ t(u, { children: [
|
|
22
21
|
/* @__PURE__ */ n(h, { asChild: !0, children: /* @__PURE__ */ t(d, { variant: "outline", className: "ml-auto", children: [
|
|
23
22
|
l,
|
|
24
|
-
/* @__PURE__ */ n(
|
|
23
|
+
/* @__PURE__ */ n(s, { className: "ml-2 h-4 w-4" })
|
|
25
24
|
] }) }),
|
|
26
25
|
/* @__PURE__ */ n(p, { align: "end", children: o })
|
|
27
26
|
] }) : null;
|
|
28
27
|
};
|
|
29
28
|
export {
|
|
30
|
-
|
|
29
|
+
D as DataTableColumnFilter
|
|
31
30
|
};
|
|
32
31
|
//# sourceMappingURL=DataTableColumnFilter.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTableColumnFilter.js","sources":["../../src/DataTable/DataTableColumnFilter.tsx"],"sourcesContent":["'use client';\n\nimport { ChevronDown } from 'lucide-react';\nimport React, { FC, useMemo } from 'react';\n\nimport { Button } from '../Button';\nimport {\n DropdownMenu,\n DropdownMenuCheckboxItem,\n DropdownMenuContent,\n DropdownMenuTrigger,\n} from '../DropdownMenu';\nimport { DataTableProps } from './DataTable.types';\n\n// TODO: refactor this component to use the new Table component\nexport const DataTableColumnFilter: FC<DataTableProps> = (props) => {\n const {\n table,\n columnsLabel = 'Columns',\n } = props;\n\n const columnsCheckboxRender = useMemo(() => {\n return table\n .getAllColumns()\n .filter((column) => column.getCanHide())\n .map((column) => {\n return (\n <DropdownMenuCheckboxItem\n key={column.id}\n className=\"capitalize\"\n checked={column.getIsVisible()}\n onCheckedChange={(value) =>\n column.toggleVisibility(!!value)\n }\n >\n {column.id}\n </DropdownMenuCheckboxItem>\n );\n })\n }, [table])\n\n if(!columnsCheckboxRender.length) return null;\n\n return (\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button variant=\"outline\" className=\"ml-auto\">\n {columnsLabel}\n <ChevronDown className=\"ml-2 h-4 w-4\" />\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"end\">\n {columnsCheckboxRender}\n </DropdownMenuContent>\n </DropdownMenu>\n );\n};\n"],"names":["DataTableColumnFilter","props","table","columnsLabel","columnsCheckboxRender","useMemo","column","jsx","DropdownMenuCheckboxItem","value","DropdownMenu","DropdownMenuTrigger","jsxs","Button","ChevronDown","DropdownMenuContent"],"mappings":"
|
|
1
|
+
{"version":3,"file":"DataTableColumnFilter.js","sources":["../../src/DataTable/DataTableColumnFilter.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { ChevronDown } from 'lucide-react';\r\nimport React, { FC, useMemo } from 'react';\r\n\r\nimport { Button } from '../Button';\r\nimport {\r\n DropdownMenu,\r\n DropdownMenuCheckboxItem,\r\n DropdownMenuContent,\r\n DropdownMenuTrigger,\r\n} from '../DropdownMenu';\r\nimport { DataTableProps } from './DataTable.types';\r\n\r\n// TODO: refactor this component to use the new Table component\r\nexport const DataTableColumnFilter: FC<DataTableProps> = (props) => {\r\n const {\r\n table,\r\n columnsLabel = 'Columns',\r\n } = props;\r\n\r\n const columnsCheckboxRender = useMemo(() => {\r\n return table\r\n .getAllColumns()\r\n .filter((column) => column.getCanHide())\r\n .map((column) => {\r\n return (\r\n <DropdownMenuCheckboxItem\r\n key={column.id}\r\n className=\"capitalize\"\r\n checked={column.getIsVisible()}\r\n onCheckedChange={(value) =>\r\n column.toggleVisibility(!!value)\r\n }\r\n >\r\n {column.id}\r\n </DropdownMenuCheckboxItem>\r\n );\r\n })\r\n }, [table])\r\n\r\n if(!columnsCheckboxRender.length) return null;\r\n\r\n return (\r\n <DropdownMenu>\r\n <DropdownMenuTrigger asChild>\r\n <Button variant=\"outline\" className=\"ml-auto\">\r\n {columnsLabel}\r\n <ChevronDown className=\"ml-2 h-4 w-4\" />\r\n </Button>\r\n </DropdownMenuTrigger>\r\n <DropdownMenuContent align=\"end\">\r\n {columnsCheckboxRender}\r\n </DropdownMenuContent>\r\n </DropdownMenu>\r\n );\r\n};\r\n"],"names":["DataTableColumnFilter","props","table","columnsLabel","columnsCheckboxRender","useMemo","column","jsx","DropdownMenuCheckboxItem","value","DropdownMenu","DropdownMenuTrigger","jsxs","Button","ChevronDown","DropdownMenuContent"],"mappings":";;;;;AAeO,MAAMA,IAA4C,CAACC,MAAU;AAClE,QAAM;AAAA,IACJ,OAAAC;AAAA,IACA,cAAAC,IAAe;AAAA,EAAA,IACbF,GAEEG,IAAwBC,EAAQ,MAC7BH,EACJ,gBACA,OAAO,CAACI,MAAWA,EAAO,WAAA,CAAY,EACtC,IAAI,CAACA,MAEF,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MAEC,WAAU;AAAA,MACV,SAASF,EAAO,aAAA;AAAA,MAChB,iBAAiB,CAACG,MAChBH,EAAO,iBAAiB,CAAC,CAACG,CAAK;AAAA,MAGhC,UAAAH,EAAO;AAAA,IAAA;AAAA,IAPHA,EAAO;AAAA,EAAA,CAUjB,GACF,CAACJ,CAAK,CAAC;AAEV,SAAIE,EAAsB,2BAGvBM,GAAA,EACC,UAAA;AAAA,IAAA,gBAAAH,EAACI,GAAA,EAAoB,SAAO,IAC1B,UAAA,gBAAAC,EAACC,KAAO,SAAQ,WAAU,WAAU,WACjC,UAAA;AAAA,MAAAV;AAAA,MACD,gBAAAI,EAACO,GAAA,EAAY,WAAU,eAAA,CAAe;AAAA,IAAA,EAAA,CACxC,EAAA,CACF;AAAA,IACA,gBAAAP,EAACQ,GAAA,EAAoB,OAAM,OACxB,UAAAX,EAAA,CACH;AAAA,EAAA,GACF,IAbuC;AAe3C;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDataTable.js","sources":["../../src/DataTable/useDataTable.ts"],"sourcesContent":["import React from 'react';\nimport {\n ColumnFiltersState,\n SortingState,\n VisibilityState,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n} from '@tanstack/react-table';\n\n// TODO: refactor any type\nexport const useDataTable = (data: any, columns: any) => {\n const [sorting, setSorting] = React.useState<SortingState>([]);\n const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(\n []\n );\n const [columnVisibility, setColumnVisibility] =\n React.useState<VisibilityState>({});\n\n const table = useReactTable({\n data,\n columns,\n onSortingChange: setSorting,\n onColumnFiltersChange: setColumnFilters,\n getCoreRowModel: getCoreRowModel(),\n getPaginationRowModel: getPaginationRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n onColumnVisibilityChange: setColumnVisibility,\n enableRowSelection: true,\n manualPagination: true,\n manualSorting: true,\n manualFiltering: true,\n state: {\n sorting,\n columnFilters,\n columnVisibility,\n },\n });\n\n return { table };\n};\n"],"names":["useDataTable","data","columns","sorting","setSorting","React","columnFilters","setColumnFilters","columnVisibility","setColumnVisibility","useReactTable","getCoreRowModel","getPaginationRowModel","getSortedRowModel","getFilteredRowModel"],"mappings":";;AAaO,MAAMA,IAAe,CAACC,GAAWC,MAAiB;AACvD,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAM,SAAuB,CAAA,CAAE,GACvD,CAACC,GAAeC,CAAgB,IAAIF,EAAM;AAAA,IAC9C,CAAA;AAAA,EAAC,GAEG,CAACG,GAAkBC,CAAmB,IAC1CJ,EAAM,SAA0B,CAAA,CAAE;AAuBpC,SAAO,EAAE,OArBKK,EAAc;AAAA,IAC1B,MAAAT;AAAA,IACA,SAAAC;AAAA,IACA,iBAAiBE;AAAA,IACjB,uBAAuBG;AAAA,IACvB,iBAAiBI,EAAA;AAAA,IACjB,uBAAuBC,EAAA;AAAA,IACvB,mBAAmBC,EAAA;AAAA,IACnB,qBAAqBC,EAAA;AAAA,IACrB,0BAA0BL;AAAA,IAC1B,oBAAoB;AAAA,IACpB,kBAAkB;AAAA,IAClB,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,OAAO;AAAA,MACL,SAAAN;AAAA,MACA,eAAAG;AAAA,MACA,kBAAAE;AAAA,IAAA;AAAA,EACF,CACD,EAEQ;AACX;"}
|
|
1
|
+
{"version":3,"file":"useDataTable.js","sources":["../../src/DataTable/useDataTable.ts"],"sourcesContent":["import React from 'react';\r\nimport {\r\n ColumnFiltersState,\r\n SortingState,\r\n VisibilityState,\r\n getCoreRowModel,\r\n getFilteredRowModel,\r\n getPaginationRowModel,\r\n getSortedRowModel,\r\n useReactTable,\r\n} from '@tanstack/react-table';\r\n\r\n// TODO: refactor any type\r\nexport const useDataTable = (data: any, columns: any) => {\r\n const [sorting, setSorting] = React.useState<SortingState>([]);\r\n const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>(\r\n []\r\n );\r\n const [columnVisibility, setColumnVisibility] =\r\n React.useState<VisibilityState>({});\r\n\r\n const table = useReactTable({\r\n data,\r\n columns,\r\n onSortingChange: setSorting,\r\n onColumnFiltersChange: setColumnFilters,\r\n getCoreRowModel: getCoreRowModel(),\r\n getPaginationRowModel: getPaginationRowModel(),\r\n getSortedRowModel: getSortedRowModel(),\r\n getFilteredRowModel: getFilteredRowModel(),\r\n onColumnVisibilityChange: setColumnVisibility,\r\n enableRowSelection: true,\r\n manualPagination: true,\r\n manualSorting: true,\r\n manualFiltering: true,\r\n state: {\r\n sorting,\r\n columnFilters,\r\n columnVisibility,\r\n },\r\n });\r\n\r\n return { table };\r\n};\r\n"],"names":["useDataTable","data","columns","sorting","setSorting","React","columnFilters","setColumnFilters","columnVisibility","setColumnVisibility","useReactTable","getCoreRowModel","getPaginationRowModel","getSortedRowModel","getFilteredRowModel"],"mappings":";;AAaO,MAAMA,IAAe,CAACC,GAAWC,MAAiB;AACvD,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAM,SAAuB,CAAA,CAAE,GACvD,CAACC,GAAeC,CAAgB,IAAIF,EAAM;AAAA,IAC9C,CAAA;AAAA,EAAC,GAEG,CAACG,GAAkBC,CAAmB,IAC1CJ,EAAM,SAA0B,CAAA,CAAE;AAuBpC,SAAO,EAAE,OArBKK,EAAc;AAAA,IAC1B,MAAAT;AAAA,IACA,SAAAC;AAAA,IACA,iBAAiBE;AAAA,IACjB,uBAAuBG;AAAA,IACvB,iBAAiBI,EAAA;AAAA,IACjB,uBAAuBC,EAAA;AAAA,IACvB,mBAAmBC,EAAA;AAAA,IACnB,qBAAqBC,EAAA;AAAA,IACrB,0BAA0BL;AAAA,IAC1B,oBAAoB;AAAA,IACpB,kBAAkB;AAAA,IAClB,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,OAAO;AAAA,MACL,SAAAN;AAAA,MACA,eAAAG;AAAA,MACA,kBAAAE;AAAA,IAAA;AAAA,EACF,CACD,EAEQ;AACX;"}
|
package/DatePicker/DatePicker.js
CHANGED
|
@@ -1,33 +1,32 @@
|
|
|
1
|
-
import { jsxs as
|
|
1
|
+
import { jsxs as o, jsx as r } from "react/jsx-runtime";
|
|
2
2
|
import * as i from "react";
|
|
3
3
|
import { format as d } from "date-fns";
|
|
4
4
|
import { Calendar as s } from "lucide-react";
|
|
5
5
|
import { cn as c } from "@oneplatformdev/utils";
|
|
6
|
+
import { uk as t } from "date-fns/locale";
|
|
6
7
|
import { Button as f } from "../Button/Button.js";
|
|
7
|
-
import "../Button/buttonVariants.js";
|
|
8
8
|
import { Calendar as p } from "../Calendar/Calendar.js";
|
|
9
9
|
import { Popover as u, PopoverTrigger as h, PopoverContent as y } from "../Popover/Popover.js";
|
|
10
|
-
import { uk as t } from "date-fns/locale";
|
|
11
10
|
const g = i.forwardRef(
|
|
12
|
-
(a,
|
|
11
|
+
(a, l) => {
|
|
13
12
|
const {
|
|
14
|
-
selectedDate:
|
|
15
|
-
onDateChange:
|
|
13
|
+
selectedDate: e,
|
|
14
|
+
onDateChange: m,
|
|
16
15
|
disabled: n = !1
|
|
17
16
|
} = a;
|
|
18
|
-
return /* @__PURE__ */
|
|
19
|
-
/* @__PURE__ */ r(h, { asChild: !0, children: /* @__PURE__ */
|
|
17
|
+
return /* @__PURE__ */ o(u, { children: [
|
|
18
|
+
/* @__PURE__ */ r(h, { asChild: !0, children: /* @__PURE__ */ o(
|
|
20
19
|
f,
|
|
21
20
|
{
|
|
22
|
-
ref:
|
|
21
|
+
ref: l,
|
|
23
22
|
disabled: n,
|
|
24
23
|
variant: "outline-solid",
|
|
25
24
|
className: c(
|
|
26
25
|
"w-full justify-start text-left font-normal border h-10",
|
|
27
|
-
!
|
|
26
|
+
!e && "text-muted-foreground"
|
|
28
27
|
),
|
|
29
28
|
children: [
|
|
30
|
-
|
|
29
|
+
e ? d(e, "LLL dd, y", { locale: t }) : /* @__PURE__ */ r("span", { children: "dd/mm/yyyy" }),
|
|
31
30
|
/* @__PURE__ */ r(s, { className: "mr-2 h-4 w-4 ml-auto" })
|
|
32
31
|
]
|
|
33
32
|
}
|
|
@@ -37,8 +36,8 @@ const g = i.forwardRef(
|
|
|
37
36
|
{
|
|
38
37
|
mode: "single",
|
|
39
38
|
captionLayout: "dropdown-buttons",
|
|
40
|
-
selected:
|
|
41
|
-
onSelect:
|
|
39
|
+
selected: e,
|
|
40
|
+
onSelect: m,
|
|
42
41
|
fromYear: 1960,
|
|
43
42
|
toYear: 2030,
|
|
44
43
|
locale: t
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatePicker.js","sources":["../../src/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { format } from 'date-fns';\nimport { Calendar as CalendarIcon } from 'lucide-react';\nimport { cn } from '@oneplatformdev/utils';\nimport { Button } from '../Button';\nimport { Calendar } from '../Calendar';\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\nimport { uk } from 'date-fns/locale';\nimport { DatePickerProps } from './DatePicker.types';\n\nexport const DatePicker = React.forwardRef<HTMLButtonElement, DatePickerProps>(\n (props, ref) => {\n const {\n selectedDate,\n onDateChange,\n disabled = false\n } = props;\n return (\n <Popover>\n <PopoverTrigger asChild>\n <Button\n ref={ref}\n disabled={disabled}\n variant={'outline-solid'}\n className={cn(\n 'w-full justify-start text-left font-normal border h-10',\n !selectedDate && 'text-muted-foreground'\n )}\n >\n {selectedDate ? (\n format(selectedDate, 'LLL dd, y', { locale: uk })\n ) : (\n <span>dd/mm/yyyy</span>\n )}\n <CalendarIcon className=\"mr-2 h-4 w-4 ml-auto\" />\n </Button>\n </PopoverTrigger>\n <PopoverContent align=\"start\" className=\"w-auto p-0\">\n <Calendar\n mode=\"single\"\n captionLayout=\"dropdown-buttons\"\n selected={selectedDate}\n onSelect={onDateChange}\n fromYear={1960}\n toYear={2030}\n locale={uk}\n />\n </PopoverContent>\n </Popover>\n );\n }\n);\n\nDatePicker.displayName = 'DatePicker';\n"],"names":["DatePicker","React","props","ref","selectedDate","onDateChange","disabled","Popover","jsx","PopoverTrigger","jsxs","Button","cn","format","uk","CalendarIcon","PopoverContent","Calendar"],"mappings":"
|
|
1
|
+
{"version":3,"file":"DatePicker.js","sources":["../../src/DatePicker/DatePicker.tsx"],"sourcesContent":["'use client';\r\n\r\nimport * as React from 'react';\r\nimport { format } from 'date-fns';\r\nimport { Calendar as CalendarIcon } from 'lucide-react';\r\nimport { cn } from '@oneplatformdev/utils';\r\nimport { Button } from '../Button';\r\nimport { Calendar } from '../Calendar';\r\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\r\nimport { uk } from 'date-fns/locale';\r\nimport { DatePickerProps } from './DatePicker.types';\r\n\r\nexport const DatePicker = React.forwardRef<HTMLButtonElement, DatePickerProps>(\r\n (props, ref) => {\r\n const {\r\n selectedDate,\r\n onDateChange,\r\n disabled = false\r\n } = props;\r\n return (\r\n <Popover>\r\n <PopoverTrigger asChild>\r\n <Button\r\n ref={ref}\r\n disabled={disabled}\r\n variant={'outline-solid'}\r\n className={cn(\r\n 'w-full justify-start text-left font-normal border h-10',\r\n !selectedDate && 'text-muted-foreground'\r\n )}\r\n >\r\n {selectedDate ? (\r\n format(selectedDate, 'LLL dd, y', { locale: uk })\r\n ) : (\r\n <span>dd/mm/yyyy</span>\r\n )}\r\n <CalendarIcon className=\"mr-2 h-4 w-4 ml-auto\" />\r\n </Button>\r\n </PopoverTrigger>\r\n <PopoverContent align=\"start\" className=\"w-auto p-0\">\r\n <Calendar\r\n mode=\"single\"\r\n captionLayout=\"dropdown-buttons\"\r\n selected={selectedDate}\r\n onSelect={onDateChange}\r\n fromYear={1960}\r\n toYear={2030}\r\n locale={uk}\r\n />\r\n </PopoverContent>\r\n </Popover>\r\n );\r\n }\r\n);\r\n\r\nDatePicker.displayName = 'DatePicker';\r\n"],"names":["DatePicker","React","props","ref","selectedDate","onDateChange","disabled","Popover","jsx","PopoverTrigger","jsxs","Button","cn","format","uk","CalendarIcon","PopoverContent","Calendar"],"mappings":";;;;;;;;;AAYO,MAAMA,IAAaC,EAAM;AAAA,EAC9B,CAACC,GAAOC,MAAQ;AACd,UAAM;AAAA,MACJ,cAAAC;AAAA,MACA,cAAAC;AAAA,MACA,UAAAC,IAAW;AAAA,IAAA,IACTJ;AACJ,6BACGK,GAAA,EACC,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAA,EAAe,SAAO,IACrB,UAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,KAAAR;AAAA,UACA,UAAAG;AAAA,UACA,SAAS;AAAA,UACT,WAAWM;AAAA,YACT;AAAA,YACA,CAACR,KAAgB;AAAA,UAAA;AAAA,UAGlB,UAAA;AAAA,YAAAA,IACCS,EAAOT,GAAc,aAAa,EAAE,QAAQU,GAAI,IAEhD,gBAAAN,EAAC,QAAA,EAAK,UAAA,aAAA,CAAU;AAAA,YAElB,gBAAAA,EAACO,GAAA,EAAa,WAAU,uBAAA,CAAuB;AAAA,UAAA;AAAA,QAAA;AAAA,MAAA,GAEnD;AAAA,MACA,gBAAAP,EAACQ,GAAA,EAAe,OAAM,SAAQ,WAAU,cACtC,UAAA,gBAAAR;AAAA,QAACS;AAAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,eAAc;AAAA,UACd,UAAUb;AAAA,UACV,UAAUC;AAAA,UACV,UAAU;AAAA,UACV,QAAQ;AAAA,UACR,QAAQS;AAAA,QAAA;AAAA,MAAA,EACV,CACF;AAAA,IAAA,GACF;AAAA,EAEJ;AACF;AAEAd,EAAW,cAAc;"}
|
package/Dialog/Dialog.js
CHANGED
|
@@ -3,13 +3,12 @@ import * as a from "@radix-ui/react-dialog";
|
|
|
3
3
|
import { XIcon as u } from "lucide-react";
|
|
4
4
|
import { cn as n } from "@oneplatformdev/utils";
|
|
5
5
|
import { ButtonIcon as g } from "../ButtonIcon/ButtonIcon.js";
|
|
6
|
-
|
|
7
|
-
function y({
|
|
6
|
+
function b({
|
|
8
7
|
...t
|
|
9
8
|
}) {
|
|
10
9
|
return /* @__PURE__ */ e(a.Root, { "data-slot": "dialog", ...t });
|
|
11
10
|
}
|
|
12
|
-
function
|
|
11
|
+
function y({
|
|
13
12
|
...t
|
|
14
13
|
}) {
|
|
15
14
|
return /* @__PURE__ */ e(a.Trigger, { "data-slot": "dialog-trigger", ...t });
|
|
@@ -19,7 +18,7 @@ function f({
|
|
|
19
18
|
}) {
|
|
20
19
|
return /* @__PURE__ */ e(a.Portal, { "data-slot": "dialog-portal", ...t });
|
|
21
20
|
}
|
|
22
|
-
function
|
|
21
|
+
function D({
|
|
23
22
|
...t
|
|
24
23
|
}) {
|
|
25
24
|
return /* @__PURE__ */ e(a.Close, { "data-slot": "dialog-close", ...t });
|
|
@@ -40,7 +39,7 @@ function p({
|
|
|
40
39
|
}
|
|
41
40
|
);
|
|
42
41
|
}
|
|
43
|
-
function
|
|
42
|
+
function w(t) {
|
|
44
43
|
const {
|
|
45
44
|
className: o,
|
|
46
45
|
children: i,
|
|
@@ -101,7 +100,7 @@ function N(t) {
|
|
|
101
100
|
}
|
|
102
101
|
) }) });
|
|
103
102
|
}
|
|
104
|
-
function
|
|
103
|
+
function N({ className: t, ...o }) {
|
|
105
104
|
return /* @__PURE__ */ e(
|
|
106
105
|
"div",
|
|
107
106
|
{
|
|
@@ -111,7 +110,7 @@ function C({ className: t, ...o }) {
|
|
|
111
110
|
}
|
|
112
111
|
);
|
|
113
112
|
}
|
|
114
|
-
function
|
|
113
|
+
function C({ className: t, ...o }) {
|
|
115
114
|
return /* @__PURE__ */ e(
|
|
116
115
|
"div",
|
|
117
116
|
{
|
|
@@ -124,7 +123,7 @@ function z({ className: t, ...o }) {
|
|
|
124
123
|
}
|
|
125
124
|
);
|
|
126
125
|
}
|
|
127
|
-
function
|
|
126
|
+
function z(t) {
|
|
128
127
|
const {
|
|
129
128
|
className: o,
|
|
130
129
|
children: i,
|
|
@@ -154,7 +153,7 @@ function k(t) {
|
|
|
154
153
|
}
|
|
155
154
|
);
|
|
156
155
|
}
|
|
157
|
-
function
|
|
156
|
+
function k({
|
|
158
157
|
className: t,
|
|
159
158
|
...o
|
|
160
159
|
}) {
|
|
@@ -172,16 +171,16 @@ function j({
|
|
|
172
171
|
);
|
|
173
172
|
}
|
|
174
173
|
export {
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
174
|
+
b as Dialog,
|
|
175
|
+
D as DialogClose,
|
|
176
|
+
w as DialogContent,
|
|
177
|
+
k as DialogDescription,
|
|
178
|
+
C as DialogFooter,
|
|
179
|
+
N as DialogHeader,
|
|
181
180
|
p as DialogOverlay,
|
|
182
181
|
f as DialogPortal,
|
|
183
182
|
a as DialogPrimitive,
|
|
184
|
-
|
|
185
|
-
|
|
183
|
+
z as DialogTitle,
|
|
184
|
+
y as DialogTrigger
|
|
186
185
|
};
|
|
187
186
|
//# sourceMappingURL=Dialog.js.map
|
package/Dialog/Dialog.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.js","sources":["../../src/Dialog/Dialog.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\"\nimport { XIcon } from \"lucide-react\"\n\nimport { cn } from \"@oneplatformdev/utils\"\nimport { ButtonIcon } from \"../ButtonIcon\";\n\nfunction Dialog({\n ...props\n }: React.ComponentProps<typeof DialogPrimitive.Root>) {\n return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />\n}\n\nfunction DialogTrigger({\n ...props\n }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\n}\n\nfunction DialogPortal({\n ...props\n }: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\n}\n\nfunction DialogClose({\n ...props\n }: React.ComponentProps<typeof DialogPrimitive.Close>) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\n}\n\nfunction DialogOverlay({\n className,\n ...props\n }: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n return (\n <DialogPrimitive.Overlay\n data-slot=\"dialog-overlay\"\n className={cn(\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DialogContent(props: React.ComponentProps<typeof DialogPrimitive.Content> & {\n showCloseButton?: boolean;\n slotProps?: {\n overlay?: React.ComponentProps<typeof DialogPrimitive.Overlay>;\n }\n}) {\n const {\n className,\n children,\n showCloseButton = true,\n style,\n slotProps,\n ...rest\n } = props;\n return (\n <DialogPortal data-slot=\"dialog-portal\">\n <DialogOverlay {...slotProps?.overlay}>\n <DialogPrimitive.Content\n data-slot=\"dialog-content\"\n data-closable={JSON.stringify(showCloseButton)}\n className={cn(\n 'group group/content',\n 'fixed top-[50%] left-[50%] z-50 translate-x-[-50%] translate-y-[-50%]',\n 'flex flex-col w-full max-w-[calc(100%-2rem)] sm:max-w-2xl gap-3',\n 'bg-background rounded-lg border shadow-lg duration-200 p-6',\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n \"focus:outline-none focus-visible:outline-none focus:ring-0 focus-visible:ring-0 focus:ring-transparent\",\n 'outline-none focus:outline-none focus-visible:outline-none',\n className\n )}\n {...rest}\n style={{\n pointerEvents: 'auto',\n ...(style || {}),\n }}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n className={cn(\n 'absolute top-6 right-6 rounded-2xl opacity-70 transition-opacity hover:opacity-100',\n 'data-[state=open]:bg-accent data-[state=open]:text-muted-foreground',\n 'ring-offset-background focus:ring-transparent focus:ring-0 focus:ring-offset-0 focus:outline-hidden',\n 'focus:outline-none focus:ring-0',\n 'disabled:pointer-events-none [&_svg]:pointer-events-none',\n '[&_svg]:shrink-0 [&_svg:not([class*=\"size-\"])]:size-5',\n 'cursor-pointer size-10 flex items-center justify-center',\n )}\n >\n <ButtonIcon\n variant='ghost'\n color='secondary'\n icon={XIcon}\n />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </DialogPrimitive.Content>\n </DialogOverlay>\n </DialogPortal>\n )\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"dialog-header\"\n className={cn(\"flex flex-col gap-4 justify-center text-center sm:text-left min-h-10\", className)}\n {...props}\n />\n )\n}\n\nfunction DialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n return (\n <div\n data-slot=\"dialog-footer\"\n className={cn(\n \"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end pt-4\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DialogTitle(props: React.ComponentProps<typeof DialogPrimitive.Title>) {\n const {\n className,\n children,\n ...rest\n } = props;\n return (\n <DialogPrimitive.Title\n asChild\n data-slot=\"dialog-title\"\n className={cn(\n \"flex items-center min-h-10\",\n \"group-data-[closable='true']/content:pr-13\",\n className\n )}\n {...rest}\n >\n <span\n className={cn(\n \"text-lg leading-[1.2] font-bold text-[#06080D]\",\n 'whitespace-pre-wrap wrap-break-word line-clamp-10',\n )}\n >\n {children}\n </span>\n </DialogPrimitive.Title>\n )\n}\n\nfunction DialogDescription({\n className,\n ...props\n }: React.ComponentProps<typeof DialogPrimitive.Description>) {\n return (\n <DialogPrimitive.Description\n data-slot=\"dialog-description\"\n className={cn(\n \"text-[#06080D] font-medium text-base\",\n 'whitespace-pre-wrap wrap-break-word line-clamp-10',\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger,\n DialogPrimitive\n}\n"],"names":["Dialog","props","DialogPrimitive","DialogTrigger","DialogPortal","DialogClose","DialogOverlay","className","jsx","cn","DialogContent","children","showCloseButton","style","slotProps","rest","jsxs","ButtonIcon","XIcon","DialogHeader","DialogFooter","DialogTitle","DialogDescription"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Dialog.js","sources":["../../src/Dialog/Dialog.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\"\r\nimport { XIcon } from \"lucide-react\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\"\r\nimport { ButtonIcon } from \"../ButtonIcon\";\r\n\r\nfunction Dialog({\r\n ...props\r\n }: React.ComponentProps<typeof DialogPrimitive.Root>) {\r\n return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />\r\n}\r\n\r\nfunction DialogTrigger({\r\n ...props\r\n }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\r\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />\r\n}\r\n\r\nfunction DialogPortal({\r\n ...props\r\n }: React.ComponentProps<typeof DialogPrimitive.Portal>) {\r\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />\r\n}\r\n\r\nfunction DialogClose({\r\n ...props\r\n }: React.ComponentProps<typeof DialogPrimitive.Close>) {\r\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />\r\n}\r\n\r\nfunction DialogOverlay({\r\n className,\r\n ...props\r\n }: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\r\n return (\r\n <DialogPrimitive.Overlay\r\n data-slot=\"dialog-overlay\"\r\n className={cn(\r\n \"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50\",\r\n className\r\n )}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DialogContent(props: React.ComponentProps<typeof DialogPrimitive.Content> & {\r\n showCloseButton?: boolean;\r\n slotProps?: {\r\n overlay?: React.ComponentProps<typeof DialogPrimitive.Overlay>;\r\n }\r\n}) {\r\n const {\r\n className,\r\n children,\r\n showCloseButton = true,\r\n style,\r\n slotProps,\r\n ...rest\r\n } = props;\r\n return (\r\n <DialogPortal data-slot=\"dialog-portal\">\r\n <DialogOverlay {...slotProps?.overlay}>\r\n <DialogPrimitive.Content\r\n data-slot=\"dialog-content\"\r\n data-closable={JSON.stringify(showCloseButton)}\r\n className={cn(\r\n 'group group/content',\r\n 'fixed top-[50%] left-[50%] z-50 translate-x-[-50%] translate-y-[-50%]',\r\n 'flex flex-col w-full max-w-[calc(100%-2rem)] sm:max-w-2xl gap-3',\r\n 'bg-background rounded-lg border shadow-lg duration-200 p-6',\r\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\r\n \"focus:outline-none focus-visible:outline-none focus:ring-0 focus-visible:ring-0 focus:ring-transparent\",\r\n 'outline-none focus:outline-none focus-visible:outline-none',\r\n className\r\n )}\r\n {...rest}\r\n style={{\r\n pointerEvents: 'auto',\r\n ...(style || {}),\r\n }}\r\n >\r\n {children}\r\n {showCloseButton && (\r\n <DialogPrimitive.Close\r\n data-slot=\"dialog-close\"\r\n className={cn(\r\n 'absolute top-6 right-6 rounded-2xl opacity-70 transition-opacity hover:opacity-100',\r\n 'data-[state=open]:bg-accent data-[state=open]:text-muted-foreground',\r\n 'ring-offset-background focus:ring-transparent focus:ring-0 focus:ring-offset-0 focus:outline-hidden',\r\n 'focus:outline-none focus:ring-0',\r\n 'disabled:pointer-events-none [&_svg]:pointer-events-none',\r\n '[&_svg]:shrink-0 [&_svg:not([class*=\"size-\"])]:size-5',\r\n 'cursor-pointer size-10 flex items-center justify-center',\r\n )}\r\n >\r\n <ButtonIcon\r\n variant='ghost'\r\n color='secondary'\r\n icon={XIcon}\r\n />\r\n <span className=\"sr-only\">Close</span>\r\n </DialogPrimitive.Close>\r\n )}\r\n </DialogPrimitive.Content>\r\n </DialogOverlay>\r\n </DialogPortal>\r\n )\r\n}\r\n\r\nfunction DialogHeader({ className, ...props }: React.ComponentProps<\"div\">) {\r\n return (\r\n <div\r\n data-slot=\"dialog-header\"\r\n className={cn(\"flex flex-col gap-4 justify-center text-center sm:text-left min-h-10\", className)}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DialogFooter({ className, ...props }: React.ComponentProps<\"div\">) {\r\n return (\r\n <div\r\n data-slot=\"dialog-footer\"\r\n className={cn(\r\n \"flex flex-col-reverse gap-2 sm:flex-row sm:justify-end pt-4\",\r\n className\r\n )}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DialogTitle(props: React.ComponentProps<typeof DialogPrimitive.Title>) {\r\n const {\r\n className,\r\n children,\r\n ...rest\r\n } = props;\r\n return (\r\n <DialogPrimitive.Title\r\n asChild\r\n data-slot=\"dialog-title\"\r\n className={cn(\r\n \"flex items-center min-h-10\",\r\n \"group-data-[closable='true']/content:pr-13\",\r\n className\r\n )}\r\n {...rest}\r\n >\r\n <span\r\n className={cn(\r\n \"text-lg leading-[1.2] font-bold text-[#06080D]\",\r\n 'whitespace-pre-wrap wrap-break-word line-clamp-10',\r\n )}\r\n >\r\n {children}\r\n </span>\r\n </DialogPrimitive.Title>\r\n )\r\n}\r\n\r\nfunction DialogDescription({\r\n className,\r\n ...props\r\n }: React.ComponentProps<typeof DialogPrimitive.Description>) {\r\n return (\r\n <DialogPrimitive.Description\r\n data-slot=\"dialog-description\"\r\n className={cn(\r\n \"text-[#06080D] font-medium text-base\",\r\n 'whitespace-pre-wrap wrap-break-word line-clamp-10',\r\n className\r\n )}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nexport {\r\n Dialog,\r\n DialogClose,\r\n DialogContent,\r\n DialogDescription,\r\n DialogFooter,\r\n DialogHeader,\r\n DialogOverlay,\r\n DialogPortal,\r\n DialogTitle,\r\n DialogTrigger,\r\n DialogPrimitive\r\n}\r\n"],"names":["Dialog","props","DialogPrimitive","DialogTrigger","DialogPortal","DialogClose","DialogOverlay","className","jsx","cn","DialogContent","children","showCloseButton","style","slotProps","rest","jsxs","ButtonIcon","XIcon","DialogHeader","DialogFooter","DialogTitle","DialogDescription"],"mappings":"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"}
|
package/Dialog/Dialog.stories.js
CHANGED
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { jsx as o, jsxs as e } from "react/jsx-runtime";
|
|
2
2
|
import { Dialog as b, DialogTrigger as O, DialogContent as B, DialogHeader as v, DialogTitle as w, DialogDescription as T, DialogFooter as F, DialogClose as L } from "./Dialog.js";
|
|
3
|
-
import { Button as l } from "../Button/Button.js";
|
|
4
|
-
import "../Button/buttonVariants.js";
|
|
5
3
|
import { useState as N, useCallback as S } from "react";
|
|
4
|
+
import { Button as l } from "../Button/Button.js";
|
|
6
5
|
function I(p) {
|
|
7
6
|
const {
|
|
8
7
|
open: i,
|
|
@@ -42,7 +41,7 @@ function I(p) {
|
|
|
42
41
|
] })
|
|
43
42
|
] }) });
|
|
44
43
|
}
|
|
45
|
-
const
|
|
44
|
+
const U = {
|
|
46
45
|
title: "UI/Dialog",
|
|
47
46
|
component: I,
|
|
48
47
|
parameters: {
|
|
@@ -68,35 +67,35 @@ const W = {
|
|
|
68
67
|
bodyText: "Some content inside dialog…",
|
|
69
68
|
longBody: !1
|
|
70
69
|
}
|
|
71
|
-
},
|
|
70
|
+
}, W = {}, _ = {
|
|
72
71
|
args: {
|
|
73
72
|
description: ""
|
|
74
73
|
}
|
|
75
|
-
},
|
|
74
|
+
}, q = {
|
|
76
75
|
args: {
|
|
77
76
|
showCloseButton: !1
|
|
78
77
|
}
|
|
79
|
-
},
|
|
78
|
+
}, z = {
|
|
80
79
|
args: {
|
|
81
80
|
withFooter: !1
|
|
82
81
|
}
|
|
83
|
-
},
|
|
82
|
+
}, E = {
|
|
84
83
|
args: {
|
|
85
84
|
longBody: !0,
|
|
86
85
|
bodyText: "Long text line"
|
|
87
86
|
}
|
|
88
|
-
},
|
|
87
|
+
}, G = {
|
|
89
88
|
args: {
|
|
90
89
|
initialOpen: !0
|
|
91
90
|
}
|
|
92
91
|
};
|
|
93
92
|
export {
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
93
|
+
W as Default,
|
|
94
|
+
G as InitiallyOpen,
|
|
95
|
+
E as LongContentScrollable,
|
|
96
|
+
q as NoCloseButton,
|
|
97
|
+
z as NoFooter,
|
|
98
|
+
_ as WithoutDescription,
|
|
99
|
+
U as default
|
|
101
100
|
};
|
|
102
101
|
//# sourceMappingURL=Dialog.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.stories.js","sources":["../../src/Dialog/Dialog.stories.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react\";\n\nimport {\n Dialog,\n DialogTrigger,\n DialogContent,\n DialogHeader,\n DialogTitle,\n DialogDescription,\n DialogFooter,\n DialogClose,\n} from \"./Dialog\";\nimport { Button } from \"../Button\";\nimport { useCallback, useState } from \"react\";\nimport { DialogControlsProps } from \"./Dialog.types\";\n\ntype DialogDemoProps = DialogControlsProps & {\n title: string;\n description?: string;\n showCloseButton?: boolean;\n withFooter?: boolean;\n initialOpen?: boolean;\n triggerLabel?: string;\n bodyText?: string;\n longBody?: boolean;\n};\n\n// TODO: create cmp like alert\nfunction DialogDemo(props: DialogDemoProps) {\n const {\n open: controlledOpen,\n onOpenChange,\n title,\n description,\n showCloseButton = true,\n withFooter = true,\n initialOpen = false,\n triggerLabel = \"Open dialog\",\n bodyText = \"Some content inside dialog…\",\n longBody = false,\n } = props;\n\n const [ internalOpen, setInternalOpen ] = useState(initialOpen);\n const isControlled = controlledOpen !== undefined;\n const open = isControlled ? controlledOpen : internalOpen;\n const setOpen = useCallback((next: boolean) => {\n if (!isControlled) setInternalOpen(next);\n onOpenChange?.(next);\n }, [ isControlled, onOpenChange ]);\n\n return (\n <div className=\"p-10\">\n <Dialog open={open} onOpenChange={setOpen}>\n <DialogTrigger asChild>\n <Button variant='outlined'>\n {triggerLabel}\n </Button>\n </DialogTrigger>\n\n <DialogContent showCloseButton={showCloseButton}>\n <DialogHeader>\n <DialogTitle>{title} 123</DialogTitle>\n {description ? <DialogDescription>{description}</DialogDescription> : null}\n </DialogHeader>\n\n <div className={longBody ? \"max-h-[50vh] overflow-auto pr-1\" : undefined}>\n {longBody ? (\n <div className=\"space-y-3 text-sm leading-6\">\n {Array.from({ length: 30 }).map((_, i) => (\n <p key={i}>\n #{i + 1}. {bodyText} Lorem ipsum dolor sit amet, consectetur adipiscing elit.\n </p>\n ))}\n </div>\n ) : (\n <p className=\"text-sm leading-6\">{bodyText}</p>\n )}\n </div>\n\n {withFooter ? (\n <DialogFooter>\n <DialogClose asChild>\n <Button color='secondary'>\n Cancel\n </Button>\n </DialogClose>\n\n <Button onClick={() => setOpen(false)}>\n Save\n </Button>\n </DialogFooter>\n ) : null}\n </DialogContent>\n </Dialog>\n </div>\n );\n}\n\nconst meta: Meta<typeof DialogDemo> = {\n title: \"UI/Dialog\",\n component: DialogDemo,\n parameters: {\n layout: \"fullscreen\",\n },\n argTypes: {\n title: { control: \"text\" },\n description: { control: \"text\" },\n showCloseButton: { control: \"boolean\" },\n withFooter: { control: \"boolean\" },\n initialOpen: { control: \"boolean\" },\n triggerLabel: { control: \"text\" },\n bodyText: { control: \"text\" },\n longBody: { control: \"boolean\" },\n },\n args: {\n title: \"Dialog title\",\n description: \"Dialog description\",\n showCloseButton: true,\n withFooter: true,\n initialOpen: false,\n triggerLabel: \"Open dialog\",\n bodyText: \"Some content inside dialog…\",\n longBody: false,\n },\n};\nexport default meta;\n\ntype Story = StoryObj<typeof DialogDemo>;\n\nexport const Default: Story = {};\n\nexport const WithoutDescription: Story = {\n args: {\n description: \"\",\n },\n};\n\nexport const NoCloseButton: Story = {\n args: {\n showCloseButton: false,\n },\n};\n\nexport const NoFooter: Story = {\n args: {\n withFooter: false,\n },\n};\n\nexport const LongContentScrollable: Story = {\n args: {\n longBody: true,\n bodyText: \"Long text line\",\n },\n};\n\nexport const InitiallyOpen: Story = {\n args: {\n initialOpen: true,\n },\n};\n"],"names":["DialogDemo","props","controlledOpen","onOpenChange","title","description","showCloseButton","withFooter","initialOpen","triggerLabel","bodyText","longBody","internalOpen","setInternalOpen","useState","isControlled","open","setOpen","useCallback","next","jsx","Dialog","DialogTrigger","Button","jsxs","DialogContent","DialogHeader","DialogTitle","DialogDescription","_","i","DialogFooter","DialogClose","meta","Default","WithoutDescription","NoCloseButton","NoFooter","LongContentScrollable","InitiallyOpen"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Dialog.stories.js","sources":["../../src/Dialog/Dialog.stories.tsx"],"sourcesContent":["import * as React from \"react\";\r\nimport type { Meta, StoryObj } from \"@storybook/react\";\r\n\r\nimport {\r\n Dialog,\r\n DialogTrigger,\r\n DialogContent,\r\n DialogHeader,\r\n DialogTitle,\r\n DialogDescription,\r\n DialogFooter,\r\n DialogClose,\r\n} from \"./Dialog\";\r\nimport { Button } from \"../Button\";\r\nimport { useCallback, useState } from \"react\";\r\nimport { DialogControlsProps } from \"./Dialog.types\";\r\n\r\ntype DialogDemoProps = DialogControlsProps & {\r\n title: string;\r\n description?: string;\r\n showCloseButton?: boolean;\r\n withFooter?: boolean;\r\n initialOpen?: boolean;\r\n triggerLabel?: string;\r\n bodyText?: string;\r\n longBody?: boolean;\r\n};\r\n\r\n// TODO: create cmp like alert\r\nfunction DialogDemo(props: DialogDemoProps) {\r\n const {\r\n open: controlledOpen,\r\n onOpenChange,\r\n title,\r\n description,\r\n showCloseButton = true,\r\n withFooter = true,\r\n initialOpen = false,\r\n triggerLabel = \"Open dialog\",\r\n bodyText = \"Some content inside dialog…\",\r\n longBody = false,\r\n } = props;\r\n\r\n const [ internalOpen, setInternalOpen ] = useState(initialOpen);\r\n const isControlled = controlledOpen !== undefined;\r\n const open = isControlled ? controlledOpen : internalOpen;\r\n const setOpen = useCallback((next: boolean) => {\r\n if (!isControlled) setInternalOpen(next);\r\n onOpenChange?.(next);\r\n }, [ isControlled, onOpenChange ]);\r\n\r\n return (\r\n <div className=\"p-10\">\r\n <Dialog open={open} onOpenChange={setOpen}>\r\n <DialogTrigger asChild>\r\n <Button variant='outlined'>\r\n {triggerLabel}\r\n </Button>\r\n </DialogTrigger>\r\n\r\n <DialogContent showCloseButton={showCloseButton}>\r\n <DialogHeader>\r\n <DialogTitle>{title} 123</DialogTitle>\r\n {description ? <DialogDescription>{description}</DialogDescription> : null}\r\n </DialogHeader>\r\n\r\n <div className={longBody ? \"max-h-[50vh] overflow-auto pr-1\" : undefined}>\r\n {longBody ? (\r\n <div className=\"space-y-3 text-sm leading-6\">\r\n {Array.from({ length: 30 }).map((_, i) => (\r\n <p key={i}>\r\n #{i + 1}. {bodyText} Lorem ipsum dolor sit amet, consectetur adipiscing elit.\r\n </p>\r\n ))}\r\n </div>\r\n ) : (\r\n <p className=\"text-sm leading-6\">{bodyText}</p>\r\n )}\r\n </div>\r\n\r\n {withFooter ? (\r\n <DialogFooter>\r\n <DialogClose asChild>\r\n <Button color='secondary'>\r\n Cancel\r\n </Button>\r\n </DialogClose>\r\n\r\n <Button onClick={() => setOpen(false)}>\r\n Save\r\n </Button>\r\n </DialogFooter>\r\n ) : null}\r\n </DialogContent>\r\n </Dialog>\r\n </div>\r\n );\r\n}\r\n\r\nconst meta: Meta<typeof DialogDemo> = {\r\n title: \"UI/Dialog\",\r\n component: DialogDemo,\r\n parameters: {\r\n layout: \"fullscreen\",\r\n },\r\n argTypes: {\r\n title: { control: \"text\" },\r\n description: { control: \"text\" },\r\n showCloseButton: { control: \"boolean\" },\r\n withFooter: { control: \"boolean\" },\r\n initialOpen: { control: \"boolean\" },\r\n triggerLabel: { control: \"text\" },\r\n bodyText: { control: \"text\" },\r\n longBody: { control: \"boolean\" },\r\n },\r\n args: {\r\n title: \"Dialog title\",\r\n description: \"Dialog description\",\r\n showCloseButton: true,\r\n withFooter: true,\r\n initialOpen: false,\r\n triggerLabel: \"Open dialog\",\r\n bodyText: \"Some content inside dialog…\",\r\n longBody: false,\r\n },\r\n};\r\nexport default meta;\r\n\r\ntype Story = StoryObj<typeof DialogDemo>;\r\n\r\nexport const Default: Story = {};\r\n\r\nexport const WithoutDescription: Story = {\r\n args: {\r\n description: \"\",\r\n },\r\n};\r\n\r\nexport const NoCloseButton: Story = {\r\n args: {\r\n showCloseButton: false,\r\n },\r\n};\r\n\r\nexport const NoFooter: Story = {\r\n args: {\r\n withFooter: false,\r\n },\r\n};\r\n\r\nexport const LongContentScrollable: Story = {\r\n args: {\r\n longBody: true,\r\n bodyText: \"Long text line\",\r\n },\r\n};\r\n\r\nexport const InitiallyOpen: Story = {\r\n args: {\r\n initialOpen: true,\r\n },\r\n};\r\n"],"names":["DialogDemo","props","controlledOpen","onOpenChange","title","description","showCloseButton","withFooter","initialOpen","triggerLabel","bodyText","longBody","internalOpen","setInternalOpen","useState","isControlled","open","setOpen","useCallback","next","jsx","Dialog","DialogTrigger","Button","jsxs","DialogContent","DialogHeader","DialogTitle","DialogDescription","_","i","DialogFooter","DialogClose","meta","Default","WithoutDescription","NoCloseButton","NoFooter","LongContentScrollable","InitiallyOpen"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogOverlayScope.js","sources":["../../src/Dialog/DialogOverlayScope.tsx"],"sourcesContent":["import { createContext, PropsWithChildren, useContext } from 'react';\n\nexport const DialogOverlayContainerContext = createContext<HTMLElement | null>(\n null\n);\nexport const useDialogOverlayContainer = () => useContext(DialogOverlayContainerContext);\n\ninterface IDialogOverlayScopeProps\n extends PropsWithChildren {\n value: HTMLElement | null;\n}\n\nexport const DialogOverlayScope = ({ value, children }: IDialogOverlayScopeProps) => {\n return (\n <DialogOverlayContainerContext.Provider value={value}>\n {children}\n </DialogOverlayContainerContext.Provider>\n );\n}\n"],"names":["DialogOverlayContainerContext","createContext","useDialogOverlayContainer","useContext","DialogOverlayScope","value","children","jsx"],"mappings":";;AAEO,MAAMA,IAAgCC;AAAA,EAC3C;AACF,GACaC,IAA4B,MAAMC,EAAWH,CAA6B,GAO1EI,IAAqB,CAAC,EAAE,OAAAC,GAAO,UAAAC,QAExC,gBAAAC,EAACP,EAA8B,UAA9B,EAAuC,OAAAK,GACrC,UAAAC,EAAA,CACH;"}
|
|
1
|
+
{"version":3,"file":"DialogOverlayScope.js","sources":["../../src/Dialog/DialogOverlayScope.tsx"],"sourcesContent":["import { createContext, PropsWithChildren, useContext } from 'react';\r\n\r\nexport const DialogOverlayContainerContext = createContext<HTMLElement | null>(\r\n null\r\n);\r\nexport const useDialogOverlayContainer = () => useContext(DialogOverlayContainerContext);\r\n\r\ninterface IDialogOverlayScopeProps\r\n extends PropsWithChildren {\r\n value: HTMLElement | null;\r\n}\r\n\r\nexport const DialogOverlayScope = ({ value, children }: IDialogOverlayScopeProps) => {\r\n return (\r\n <DialogOverlayContainerContext.Provider value={value}>\r\n {children}\r\n </DialogOverlayContainerContext.Provider>\r\n );\r\n}\r\n"],"names":["DialogOverlayContainerContext","createContext","useDialogOverlayContainer","useContext","DialogOverlayScope","value","children","jsx"],"mappings":";;AAEO,MAAMA,IAAgCC;AAAA,EAC3C;AACF,GACaC,IAA4B,MAAMC,EAAWH,CAA6B,GAO1EI,IAAqB,CAAC,EAAE,OAAAC,GAAO,UAAAC,QAExC,gBAAAC,EAACP,EAA8B,UAA9B,EAAuC,OAAAK,GACrC,UAAAC,EAAA,CACH;"}
|
package/Drawer/Drawer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.js","sources":["../../src/Drawer/Drawer.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { Drawer as DrawerPrimitive } from \"vaul\"\n\nimport { cn } from \"@oneplatformdev/utils\";\n\nconst Drawer = ({\n shouldScaleBackground = true,\n ...props\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) => (\n <DrawerPrimitive.Root\n shouldScaleBackground={shouldScaleBackground}\n {...props}\n />\n)\nDrawer.displayName = \"Drawer\"\n\nconst DrawerTrigger = DrawerPrimitive.Trigger\n\nconst DrawerPortal = DrawerPrimitive.Portal\n\nconst DrawerClose = DrawerPrimitive.Close\n\nconst DrawerOverlay = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitive.Overlay>,\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n <DrawerPrimitive.Overlay\n ref={ref}\n className={cn(\"fixed inset-0 z-50 bg-black/80\", className)}\n {...props}\n />\n))\nDrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName\n\nconst DrawerContent = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content>\n>(({ className, children, ...props }, ref) => (\n <DrawerPortal>\n <DrawerOverlay />\n <DrawerPrimitive.Content\n ref={ref}\n className={cn(\n \"fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background\",\n className\n )}\n {...props}\n >\n <div className=\"mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted\" />\n {children}\n </DrawerPrimitive.Content>\n </DrawerPortal>\n))\nDrawerContent.displayName = \"DrawerContent\"\n\nconst DrawerHeader = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\"grid gap-1.5 p-4 text-center sm:text-left\", className)}\n {...props}\n />\n)\nDrawerHeader.displayName = \"DrawerHeader\"\n\nconst DrawerFooter = ({\n className,\n ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n <div\n className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\n {...props}\n />\n)\nDrawerFooter.displayName = \"DrawerFooter\"\n\nconst DrawerTitle = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DrawerPrimitive.Title\n ref={ref}\n className={cn(\n \"text-lg font-semibold leading-none tracking-tight\",\n className\n )}\n {...props}\n />\n))\nDrawerTitle.displayName = DrawerPrimitive.Title.displayName\n\nconst DrawerDescription = React.forwardRef<\n React.ElementRef<typeof DrawerPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DrawerPrimitive.Description\n ref={ref}\n className={cn(\"text-sm text-muted-foreground\", className)}\n {...props}\n />\n))\nDrawerDescription.displayName = DrawerPrimitive.Description.displayName\n\nexport {\n Drawer,\n DrawerPortal,\n DrawerOverlay,\n DrawerTrigger,\n DrawerClose,\n DrawerContent,\n DrawerHeader,\n DrawerFooter,\n DrawerTitle,\n DrawerDescription,\n}\n"],"names":["Drawer","shouldScaleBackground","props","jsx","DrawerPrimitive","DrawerTrigger","DrawerPortal","DrawerClose","DrawerOverlay","React","className","ref","cn","DrawerContent","children","jsxs","DrawerHeader","DrawerFooter","DrawerTitle","DrawerDescription"],"mappings":";;;;AAOA,MAAMA,IAAS,CAAC;AAAA,EACd,uBAAAC,IAAwB;AAAA,EACxB,GAAGC;AACL,MACE,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,uBAAAH;AAAA,IACC,GAAGC;AAAA,EAAA;AACN;AAEFF,EAAO,cAAc;AAErB,MAAMK,IAAgBD,EAAgB,SAEhCE,IAAeF,EAAgB,QAE/BG,IAAcH,EAAgB,OAE9BI,IAAgBC,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,GAAGR,EAAA,GAASS,MAC1B,gBAAAR;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAO;AAAA,IACA,WAAWC,EAAG,kCAAkCF,CAAS;AAAA,IACxD,GAAGR;AAAA,EAAA;AACN,CACD;AACDM,EAAc,cAAcJ,EAAgB,QAAQ;AAEpD,MAAMS,IAAgBJ,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,UAAAI,GAAU,GAAGZ,EAAA,GAASS,MACpC,gBAAAI,EAACT,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAH,EAACK,GAAA,EAAc;AAAA,EACf,gBAAAO;AAAA,IAACX,EAAgB;AAAA,IAAhB;AAAA,MACC,KAAAO;AAAA,MACA,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAED,GAAGR;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,mDAAA,CAAmD;AAAA,QACjEW;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AACH,GACF,CACD;AACDD,EAAc,cAAc;AAE5B,MAAMG,IAAe,CAAC;AAAA,EACpB,WAAAN;AAAA,EACA,GAAGR;AACL,MACE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWS,EAAG,6CAA6CF,CAAS;AAAA,IACnE,GAAGR;AAAA,EAAA;AACN;AAEFc,EAAa,cAAc;AAE3B,MAAMC,IAAe,CAAC;AAAA,EACpB,WAAAP;AAAA,EACA,GAAGR;AACL,MACE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWS,EAAG,mCAAmCF,CAAS;AAAA,IACzD,GAAGR;AAAA,EAAA;AACN;AAEFe,EAAa,cAAc;AAE3B,MAAMC,IAAcT,EAAM,WAGxB,CAAC,EAAE,WAAAC,GAAW,GAAGR,EAAA,GAASS,MAC1B,gBAAAR;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAO;AAAA,IACA,WAAWC;AAAA,MACT;AAAA,MACAF;AAAA,IAAA;AAAA,IAED,GAAGR;AAAA,EAAA;AACN,CACD;AACDgB,EAAY,cAAcd,EAAgB,MAAM;AAEhD,MAAMe,IAAoBV,EAAM,WAG9B,CAAC,EAAE,WAAAC,GAAW,GAAGR,EAAA,GAASS,MAC1B,gBAAAR;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAO;AAAA,IACA,WAAWC,EAAG,iCAAiCF,CAAS;AAAA,IACvD,GAAGR;AAAA,EAAA;AACN,CACD;AACDiB,EAAkB,cAAcf,EAAgB,YAAY;"}
|
|
1
|
+
{"version":3,"file":"Drawer.js","sources":["../../src/Drawer/Drawer.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport { Drawer as DrawerPrimitive } from \"vaul\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\";\r\n\r\nconst Drawer = ({\r\n shouldScaleBackground = true,\r\n ...props\r\n}: React.ComponentProps<typeof DrawerPrimitive.Root>) => (\r\n <DrawerPrimitive.Root\r\n shouldScaleBackground={shouldScaleBackground}\r\n {...props}\r\n />\r\n)\r\nDrawer.displayName = \"Drawer\"\r\n\r\nconst DrawerTrigger = DrawerPrimitive.Trigger\r\n\r\nconst DrawerPortal = DrawerPrimitive.Portal\r\n\r\nconst DrawerClose = DrawerPrimitive.Close\r\n\r\nconst DrawerOverlay = React.forwardRef<\r\n React.ElementRef<typeof DrawerPrimitive.Overlay>,\r\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay>\r\n>(({ className, ...props }, ref) => (\r\n <DrawerPrimitive.Overlay\r\n ref={ref}\r\n className={cn(\"fixed inset-0 z-50 bg-black/80\", className)}\r\n {...props}\r\n />\r\n))\r\nDrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName\r\n\r\nconst DrawerContent = React.forwardRef<\r\n React.ElementRef<typeof DrawerPrimitive.Content>,\r\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content>\r\n>(({ className, children, ...props }, ref) => (\r\n <DrawerPortal>\r\n <DrawerOverlay />\r\n <DrawerPrimitive.Content\r\n ref={ref}\r\n className={cn(\r\n \"fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background\",\r\n className\r\n )}\r\n {...props}\r\n >\r\n <div className=\"mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted\" />\r\n {children}\r\n </DrawerPrimitive.Content>\r\n </DrawerPortal>\r\n))\r\nDrawerContent.displayName = \"DrawerContent\"\r\n\r\nconst DrawerHeader = ({\r\n className,\r\n ...props\r\n}: React.HTMLAttributes<HTMLDivElement>) => (\r\n <div\r\n className={cn(\"grid gap-1.5 p-4 text-center sm:text-left\", className)}\r\n {...props}\r\n />\r\n)\r\nDrawerHeader.displayName = \"DrawerHeader\"\r\n\r\nconst DrawerFooter = ({\r\n className,\r\n ...props\r\n}: React.HTMLAttributes<HTMLDivElement>) => (\r\n <div\r\n className={cn(\"mt-auto flex flex-col gap-2 p-4\", className)}\r\n {...props}\r\n />\r\n)\r\nDrawerFooter.displayName = \"DrawerFooter\"\r\n\r\nconst DrawerTitle = React.forwardRef<\r\n React.ElementRef<typeof DrawerPrimitive.Title>,\r\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title>\r\n>(({ className, ...props }, ref) => (\r\n <DrawerPrimitive.Title\r\n ref={ref}\r\n className={cn(\r\n \"text-lg font-semibold leading-none tracking-tight\",\r\n className\r\n )}\r\n {...props}\r\n />\r\n))\r\nDrawerTitle.displayName = DrawerPrimitive.Title.displayName\r\n\r\nconst DrawerDescription = React.forwardRef<\r\n React.ElementRef<typeof DrawerPrimitive.Description>,\r\n React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description>\r\n>(({ className, ...props }, ref) => (\r\n <DrawerPrimitive.Description\r\n ref={ref}\r\n className={cn(\"text-sm text-muted-foreground\", className)}\r\n {...props}\r\n />\r\n))\r\nDrawerDescription.displayName = DrawerPrimitive.Description.displayName\r\n\r\nexport {\r\n Drawer,\r\n DrawerPortal,\r\n DrawerOverlay,\r\n DrawerTrigger,\r\n DrawerClose,\r\n DrawerContent,\r\n DrawerHeader,\r\n DrawerFooter,\r\n DrawerTitle,\r\n DrawerDescription,\r\n}\r\n"],"names":["Drawer","shouldScaleBackground","props","jsx","DrawerPrimitive","DrawerTrigger","DrawerPortal","DrawerClose","DrawerOverlay","React","className","ref","cn","DrawerContent","children","jsxs","DrawerHeader","DrawerFooter","DrawerTitle","DrawerDescription"],"mappings":";;;;AAOA,MAAMA,IAAS,CAAC;AAAA,EACd,uBAAAC,IAAwB;AAAA,EACxB,GAAGC;AACL,MACE,gBAAAC;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,uBAAAH;AAAA,IACC,GAAGC;AAAA,EAAA;AACN;AAEFF,EAAO,cAAc;AAErB,MAAMK,IAAgBD,EAAgB,SAEhCE,IAAeF,EAAgB,QAE/BG,IAAcH,EAAgB,OAE9BI,IAAgBC,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,GAAGR,EAAA,GAASS,MAC1B,gBAAAR;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAO;AAAA,IACA,WAAWC,EAAG,kCAAkCF,CAAS;AAAA,IACxD,GAAGR;AAAA,EAAA;AACN,CACD;AACDM,EAAc,cAAcJ,EAAgB,QAAQ;AAEpD,MAAMS,IAAgBJ,EAAM,WAG1B,CAAC,EAAE,WAAAC,GAAW,UAAAI,GAAU,GAAGZ,EAAA,GAASS,MACpC,gBAAAI,EAACT,GAAA,EACC,UAAA;AAAA,EAAA,gBAAAH,EAACK,GAAA,EAAc;AAAA,EACf,gBAAAO;AAAA,IAACX,EAAgB;AAAA,IAAhB;AAAA,MACC,KAAAO;AAAA,MACA,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAED,GAAGR;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,mDAAA,CAAmD;AAAA,QACjEW;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AACH,GACF,CACD;AACDD,EAAc,cAAc;AAE5B,MAAMG,IAAe,CAAC;AAAA,EACpB,WAAAN;AAAA,EACA,GAAGR;AACL,MACE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWS,EAAG,6CAA6CF,CAAS;AAAA,IACnE,GAAGR;AAAA,EAAA;AACN;AAEFc,EAAa,cAAc;AAE3B,MAAMC,IAAe,CAAC;AAAA,EACpB,WAAAP;AAAA,EACA,GAAGR;AACL,MACE,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWS,EAAG,mCAAmCF,CAAS;AAAA,IACzD,GAAGR;AAAA,EAAA;AACN;AAEFe,EAAa,cAAc;AAE3B,MAAMC,IAAcT,EAAM,WAGxB,CAAC,EAAE,WAAAC,GAAW,GAAGR,EAAA,GAASS,MAC1B,gBAAAR;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAO;AAAA,IACA,WAAWC;AAAA,MACT;AAAA,MACAF;AAAA,IAAA;AAAA,IAED,GAAGR;AAAA,EAAA;AACN,CACD;AACDgB,EAAY,cAAcd,EAAgB,MAAM;AAEhD,MAAMe,IAAoBV,EAAM,WAG9B,CAAC,EAAE,WAAAC,GAAW,GAAGR,EAAA,GAASS,MAC1B,gBAAAR;AAAA,EAACC,EAAgB;AAAA,EAAhB;AAAA,IACC,KAAAO;AAAA,IACA,WAAWC,EAAG,iCAAiCF,CAAS;AAAA,IACvD,GAAGR;AAAA,EAAA;AACN,CACD;AACDiB,EAAkB,cAAcf,EAAgB,YAAY;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.js","sources":["../../src/DropdownMenu/DropdownMenu.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\"\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from \"lucide-react\"\n\nimport { cn } from \"@oneplatformdev/utils\"\n\nfunction DropdownMenu({\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\n return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />\n}\n\nfunction DropdownMenuPortal({\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\n return (\n <DropdownMenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\n )\n}\n\nfunction DropdownMenuTrigger({\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\n return (\n <DropdownMenuPrimitive.Trigger\n data-slot=\"dropdown-menu-trigger\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuContent({\n className,\n sideOffset = 4,\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\n return (\n <DropdownMenuPrimitive.Portal>\n <DropdownMenuPrimitive.Content\n data-slot=\"dropdown-menu-content\"\n sideOffset={sideOffset}\n className={cn(\n 'rounded-lg border border-[#EBEBEB] p-1',\n \"bg-[#FCFCFC] shadow-[1px_1px_10px_rgba(6,8,13,0.06)]\",\n 'text-sm text-[#06080D] font-medium leading-[1.25]',\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50',\n 'max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin)',\n 'overflow-x-hidden overflow-y-auto',\n className\n )}\n {...props}\n />\n </DropdownMenuPrimitive.Portal>\n )\n}\n\nfunction DropdownMenuGroup({\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\n return (\n <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\n )\n}\n\nfunction DropdownMenuItem({\n className,\n inset,\n variant = \"default\",\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\n inset?: boolean\n variant?: \"default\" | \"destructive\"\n}) {\n return (\n <DropdownMenuPrimitive.Item\n data-slot=\"dropdown-menu-item\"\n data-inset={inset}\n data-variant={variant}\n className={cn(\n 'relative flex items-center gap-1 rounded-md p-1',\n 'text-sm text-[#06080D] font-medium leading-[1.25]',\n \"[&_svg:not([class*='text-'])]:text-[#06080D]\",\n 'outline-hidden select-none',\n 'focus:bg-accent focus:text-accent-foreground ',\n \"data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive\",\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-6\",\n 'data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8',\n 'cursor-pointer',\n className\n )}\n {...props}\n />\n )\n}\n\n\nfunction DropdownMenuCheckboxItem({\n className,\n children,\n checked,\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\n return (\n <DropdownMenuPrimitive.CheckboxItem\n data-slot=\"dropdown-menu-checkbox-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n checked={checked}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CheckIcon className=\"size-4\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.CheckboxItem>\n )\n}\n\nfunction DropdownMenuRadioGroup({\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\n return (\n <DropdownMenuPrimitive.RadioGroup\n data-slot=\"dropdown-menu-radio-group\"\n {...props}\n />\n )\n}\n\nfunction DropdownMenuRadioItem({\n className,\n children,\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\n return (\n <DropdownMenuPrimitive.RadioItem\n data-slot=\"dropdown-menu-radio-item\"\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n className\n )}\n {...props}\n >\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n <DropdownMenuPrimitive.ItemIndicator>\n <CircleIcon className=\"size-2 fill-current\" />\n </DropdownMenuPrimitive.ItemIndicator>\n </span>\n {children}\n </DropdownMenuPrimitive.RadioItem>\n )\n}\n\nfunction DropdownMenuLabel({\n className,\n inset,\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\n inset?: boolean\n}) {\n return (\n <DropdownMenuPrimitive.Label\n data-slot=\"dropdown-menu-label\"\n data-inset={inset}\n className={cn(\n \"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSeparator({\n className,\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\n return (\n <DropdownMenuPrimitive.Separator\n data-slot=\"dropdown-menu-separator\"\n className={cn(\"bg-border -mx-1 my-1 h-px\", className)}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n }: React.ComponentProps<\"span\">) {\n return (\n <span\n data-slot=\"dropdown-menu-shortcut\"\n className={cn(\n \"text-muted-foreground ml-auto text-xs tracking-widest\",\n className\n )}\n {...props}\n />\n )\n}\n\nfunction DropdownMenuSub({\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\n return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />\n}\n\nfunction DropdownMenuSubTrigger({\n className,\n inset,\n children,\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\n inset?: boolean\n}) {\n return (\n <DropdownMenuPrimitive.SubTrigger\n data-slot=\"dropdown-menu-sub-trigger\"\n data-inset={inset}\n className={cn(\n \"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8\",\n className\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ml-auto size-4\" />\n </DropdownMenuPrimitive.SubTrigger>\n )\n}\n\nfunction DropdownMenuSubContent({\n className,\n ...props\n }: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\n return (\n <DropdownMenuPrimitive.SubContent\n data-slot=\"dropdown-menu-sub-content\"\n className={cn(\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg\",\n className\n )}\n {...props}\n />\n )\n}\n\nexport {\n DropdownMenu,\n DropdownMenuPortal,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuLabel,\n DropdownMenuItem,\n DropdownMenuCheckboxItem,\n DropdownMenuRadioGroup,\n DropdownMenuRadioItem,\n DropdownMenuSeparator,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubTrigger,\n DropdownMenuSubContent,\n DropdownMenuPrimitive\n}\n"],"names":["DropdownMenu","props","DropdownMenuPrimitive","DropdownMenuPortal","DropdownMenuTrigger","jsx","DropdownMenuContent","className","sideOffset","cn","DropdownMenuGroup","DropdownMenuItem","inset","variant","DropdownMenuCheckboxItem","children","checked","jsxs","CheckIcon","DropdownMenuRadioGroup","DropdownMenuRadioItem","CircleIcon","DropdownMenuLabel","DropdownMenuSeparator","DropdownMenuShortcut","DropdownMenuSub","DropdownMenuSubTrigger","ChevronRightIcon","DropdownMenuSubContent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"DropdownMenu.js","sources":["../../src/DropdownMenu/DropdownMenu.tsx"],"sourcesContent":["\"use client\"\r\n\r\nimport * as React from \"react\"\r\nimport * as DropdownMenuPrimitive from \"@radix-ui/react-dropdown-menu\"\r\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from \"lucide-react\"\r\n\r\nimport { cn } from \"@oneplatformdev/utils\"\r\n\r\nfunction DropdownMenu({\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Root>) {\r\n return <DropdownMenuPrimitive.Root data-slot=\"dropdown-menu\" {...props} />\r\n}\r\n\r\nfunction DropdownMenuPortal({\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Portal>) {\r\n return (\r\n <DropdownMenuPrimitive.Portal data-slot=\"dropdown-menu-portal\" {...props} />\r\n )\r\n}\r\n\r\nfunction DropdownMenuTrigger({\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Trigger>) {\r\n return (\r\n <DropdownMenuPrimitive.Trigger\r\n data-slot=\"dropdown-menu-trigger\"\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DropdownMenuContent({\r\n className,\r\n sideOffset = 4,\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Content>) {\r\n return (\r\n <DropdownMenuPrimitive.Portal>\r\n <DropdownMenuPrimitive.Content\r\n data-slot=\"dropdown-menu-content\"\r\n sideOffset={sideOffset}\r\n className={cn(\r\n 'rounded-lg border border-[#EBEBEB] p-1',\r\n \"bg-[#FCFCFC] shadow-[1px_1px_10px_rgba(6,8,13,0.06)]\",\r\n 'text-sm text-[#06080D] font-medium leading-[1.25]',\r\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50',\r\n 'max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin)',\r\n 'overflow-x-hidden overflow-y-auto',\r\n className\r\n )}\r\n {...props}\r\n />\r\n </DropdownMenuPrimitive.Portal>\r\n )\r\n}\r\n\r\nfunction DropdownMenuGroup({\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Group>) {\r\n return (\r\n <DropdownMenuPrimitive.Group data-slot=\"dropdown-menu-group\" {...props} />\r\n )\r\n}\r\n\r\nfunction DropdownMenuItem({\r\n className,\r\n inset,\r\n variant = \"default\",\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Item> & {\r\n inset?: boolean\r\n variant?: \"default\" | \"destructive\"\r\n}) {\r\n return (\r\n <DropdownMenuPrimitive.Item\r\n data-slot=\"dropdown-menu-item\"\r\n data-inset={inset}\r\n data-variant={variant}\r\n className={cn(\r\n 'relative flex items-center gap-1 rounded-md p-1',\r\n 'text-sm text-[#06080D] font-medium leading-[1.25]',\r\n \"[&_svg:not([class*='text-'])]:text-[#06080D]\",\r\n 'outline-hidden select-none',\r\n 'focus:bg-accent focus:text-accent-foreground ',\r\n \"data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive\",\r\n \"[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-6\",\r\n 'data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8',\r\n 'cursor-pointer',\r\n className\r\n )}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\n\r\nfunction DropdownMenuCheckboxItem({\r\n className,\r\n children,\r\n checked,\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>) {\r\n return (\r\n <DropdownMenuPrimitive.CheckboxItem\r\n data-slot=\"dropdown-menu-checkbox-item\"\r\n className={cn(\r\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\r\n className\r\n )}\r\n checked={checked}\r\n {...props}\r\n >\r\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\r\n <DropdownMenuPrimitive.ItemIndicator>\r\n <CheckIcon className=\"size-4\" />\r\n </DropdownMenuPrimitive.ItemIndicator>\r\n </span>\r\n {children}\r\n </DropdownMenuPrimitive.CheckboxItem>\r\n )\r\n}\r\n\r\nfunction DropdownMenuRadioGroup({\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>) {\r\n return (\r\n <DropdownMenuPrimitive.RadioGroup\r\n data-slot=\"dropdown-menu-radio-group\"\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DropdownMenuRadioItem({\r\n className,\r\n children,\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>) {\r\n return (\r\n <DropdownMenuPrimitive.RadioItem\r\n data-slot=\"dropdown-menu-radio-item\"\r\n className={cn(\r\n \"focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\r\n className\r\n )}\r\n {...props}\r\n >\r\n <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\r\n <DropdownMenuPrimitive.ItemIndicator>\r\n <CircleIcon className=\"size-2 fill-current\" />\r\n </DropdownMenuPrimitive.ItemIndicator>\r\n </span>\r\n {children}\r\n </DropdownMenuPrimitive.RadioItem>\r\n )\r\n}\r\n\r\nfunction DropdownMenuLabel({\r\n className,\r\n inset,\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Label> & {\r\n inset?: boolean\r\n}) {\r\n return (\r\n <DropdownMenuPrimitive.Label\r\n data-slot=\"dropdown-menu-label\"\r\n data-inset={inset}\r\n className={cn(\r\n \"px-2 py-1.5 text-sm font-medium data-[inset]:pl-8\",\r\n className\r\n )}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DropdownMenuSeparator({\r\n className,\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Separator>) {\r\n return (\r\n <DropdownMenuPrimitive.Separator\r\n data-slot=\"dropdown-menu-separator\"\r\n className={cn(\"bg-border -mx-1 my-1 h-px\", className)}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DropdownMenuShortcut({\r\n className,\r\n ...props\r\n }: React.ComponentProps<\"span\">) {\r\n return (\r\n <span\r\n data-slot=\"dropdown-menu-shortcut\"\r\n className={cn(\r\n \"text-muted-foreground ml-auto text-xs tracking-widest\",\r\n className\r\n )}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nfunction DropdownMenuSub({\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.Sub>) {\r\n return <DropdownMenuPrimitive.Sub data-slot=\"dropdown-menu-sub\" {...props} />\r\n}\r\n\r\nfunction DropdownMenuSubTrigger({\r\n className,\r\n inset,\r\n children,\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {\r\n inset?: boolean\r\n}) {\r\n return (\r\n <DropdownMenuPrimitive.SubTrigger\r\n data-slot=\"dropdown-menu-sub-trigger\"\r\n data-inset={inset}\r\n className={cn(\r\n \"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8\",\r\n className\r\n )}\r\n {...props}\r\n >\r\n {children}\r\n <ChevronRightIcon className=\"ml-auto size-4\" />\r\n </DropdownMenuPrimitive.SubTrigger>\r\n )\r\n}\r\n\r\nfunction DropdownMenuSubContent({\r\n className,\r\n ...props\r\n }: React.ComponentProps<typeof DropdownMenuPrimitive.SubContent>) {\r\n return (\r\n <DropdownMenuPrimitive.SubContent\r\n data-slot=\"dropdown-menu-sub-content\"\r\n className={cn(\r\n \"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg\",\r\n className\r\n )}\r\n {...props}\r\n />\r\n )\r\n}\r\n\r\nexport {\r\n DropdownMenu,\r\n DropdownMenuPortal,\r\n DropdownMenuTrigger,\r\n DropdownMenuContent,\r\n DropdownMenuGroup,\r\n DropdownMenuLabel,\r\n DropdownMenuItem,\r\n DropdownMenuCheckboxItem,\r\n DropdownMenuRadioGroup,\r\n DropdownMenuRadioItem,\r\n DropdownMenuSeparator,\r\n DropdownMenuShortcut,\r\n DropdownMenuSub,\r\n DropdownMenuSubTrigger,\r\n DropdownMenuSubContent,\r\n DropdownMenuPrimitive\r\n}\r\n"],"names":["DropdownMenu","props","DropdownMenuPrimitive","DropdownMenuPortal","DropdownMenuTrigger","jsx","DropdownMenuContent","className","sideOffset","cn","DropdownMenuGroup","DropdownMenuItem","inset","variant","DropdownMenuCheckboxItem","children","checked","jsxs","CheckIcon","DropdownMenuRadioGroup","DropdownMenuRadioItem","CircleIcon","DropdownMenuLabel","DropdownMenuSeparator","DropdownMenuShortcut","DropdownMenuSub","DropdownMenuSubTrigger","ChevronRightIcon","DropdownMenuSubContent"],"mappings":"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"}
|