@atom-learning/components 6.1.1 → 6.1.3
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/components/data-table/DataTableTable.js +1 -1
- package/dist/components/data-table/DataTableTable.js.map +1 -1
- package/dist/components/pagination/PaginationPopover.js +1 -1
- package/dist/components/pagination/PaginationPopover.js.map +1 -1
- package/dist/components/skeleton-loader/SkeletonDoughnutChart.js +1 -1
- package/dist/components/skeleton-loader/SkeletonDoughnutChart.js.map +1 -1
- package/dist/components/tile-toggle-group/TileToggleGroupItem.js +1 -1
- package/dist/components/tile-toggle-group/TileToggleGroupItem.js.map +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import C from"clsx";import*as t from"react";import{styled as A}from"../../styled.js";import{Table as B}from"../table/Table.js";import{DataTable as g}from"./DataTable.js";import{AsyncDataState as P}from"./DataTable.types.js";import{useDataTable as _}from"./DataTableContext.js";import{DataTableLoading as M}from"./DataTableLoading.js";const j=A("div",{base:["p-2","bg-white","rounded-lg"]}),q=({sortable:h,striped:S,theme:k="white",className:O,scrollOptions:e={numberOfStickyColumns:0,stickyHeaderOffset:0,hasStickyHeader:!1,showTotalInFirstColumn:!0,totalSuffix:"items"},rowAction:v,withContainer:E=!1,...I})=>{const{asyncDataState:T,getTotalRows:x,getCanSomeRowsExpand:m,rowSelection:f,enableRowSelection:d,tableId:H,setTablePosition:l}=_(),n=t.useRef(null),R=t.useRef(!1),a=t.useRef(!1),r=t.useMemo(()=>typeof window>"u"?null:window,[]);t.useEffect(()=>{if(!r||typeof IntersectionObserver>"u")return;const o=()=>{if(n.current){const s=n.current.getBoundingClientRect().top,i=n.current.getBoundingClientRect().bottom;l(u=>({...u,top:s,bottom:i}))}a.current=!1},c=()=>{a.current||(requestAnimationFrame(o),a.current=!0)};if(!n.current)return;const b=(e==null?void 0:e.stickyHeaderOffset)||0,N={rootMargin:`-${b}px 0px -${b}px 0px`,threshold:0},L=s=>{if(!s||s.length===0)return;const i=s[0];R.current=i.isIntersecting,r&&(i.isIntersecting?r==null||r.addEventListener("scroll",c):r==null||r.removeEventListener("scroll",c)),l(u=>({...u,isVisible:i.isIntersecting}))},w=new IntersectionObserver(L,N);return n.current&&(e.hasStickyHeader||Object.keys(f||{}).length>0)&&w.observe(n.current),()=>{w.disconnect(),r&&(r==null||r.removeEventListener("scroll",c))}},[f,e.hasStickyHeader,e==null?void 0:e.stickyHeaderOffset,r,l]);const p=T===P.PENDING,D=!p&&x()===0,F=()=>{let o=0;return m()&&d?o=2:(m()||d)&&(o=1),`${H}_${o}_control_columns`};if(D)return null;const y=t.createElement(B,{corners:"round",size:"lg",...I,ref:n,numberOfStickyColumns:e.numberOfStickyColumns,scrollContainerCls:e.scrollContainerCls,scrollContainerkey:F(),className:C(O,p&&["opacity-50","pointer-events-none","transition-opacity","duration-250","linear","delay-150"])},t.createElement(g.Head,{theme:k,sortable:h,isSticky:e.hasStickyHeader,stickyOffset:e.stickyHeaderOffset,className:e.headerCss,showTotalInFirstColumn:e.showTotalInFirstColumn,totalSuffix:e.totalSuffix}),t.createElement(g.Body,{striped:S,rowAction:v}));return t.createElement(t.Fragment,null,t.createElement(M,null),E?t.createElement(j,{className:C(e.numberOfStickyColumns===0&&"overflow-x-auto")},y):y)};export{q as DataTableTable};
|
|
2
2
|
//# sourceMappingURL=DataTableTable.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTableTable.js","sources":["../../../src/components/data-table/DataTableTable.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Table } from '../table'\nimport { TableBody } from '../table/TableBody'\nimport { DataTable } from './DataTable'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableHead } from './DataTableHead'\nimport { DataTableLoading } from './DataTableLoading'\n\nconst TableContainer = styled('div', {\n base: ['p-2', 'bg-white', 'rounded-lg']\n})\n\nexport type DataTableTableProps = Omit<\n React.ComponentProps<typeof Table>,\n 'children' | 'numberOfStickyColumns'\n> &\n Partial<\n Pick<React.ComponentProps<typeof DataTableHead>, 'theme' | 'sortable'>\n > &\n Partial<Pick<React.ComponentProps<typeof TableBody>, 'striped'>> & {\n scrollOptions?: {\n hasStickyHeader?: boolean\n stickyHeaderOffset?: number\n headerCss?: string\n numberOfStickyColumns?: number\n scrollContainerCls?: string | string[]\n showTotalInFirstColumn?: boolean\n totalSuffix?: string\n }\n rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void\n withContainer?: boolean\n }\n\nexport const DataTableTable = ({\n sortable,\n striped,\n theme = 'white',\n className,\n scrollOptions = {\n numberOfStickyColumns: 0,\n stickyHeaderOffset: 0,\n hasStickyHeader: false,\n showTotalInFirstColumn: true,\n totalSuffix: 'items'\n },\n rowAction,\n withContainer = false,\n ...props\n}: DataTableTableProps): JSX.Element | null => {\n const {\n asyncDataState,\n getTotalRows,\n getCanSomeRowsExpand,\n rowSelection,\n enableRowSelection,\n tableId,\n setTablePosition\n } = useDataTable()\n\n const tableRef = React.useRef<HTMLTableElement | null>(null)\n const isTableVisible = React.useRef(false)\n const isScrolling = React.useRef<boolean>(false)\n\n const scrollTarget = React.useMemo(() => {\n if (typeof window === 'undefined') return null\n return window\n }, [])\n\n React.useEffect(() => {\n if (!scrollTarget || typeof IntersectionObserver === 'undefined') {\n return\n }\n\n const updatePosition = () => {\n if (tableRef.current) {\n const tableTop = tableRef.current.getBoundingClientRect().top\n const tableBottom = tableRef.current.getBoundingClientRect().bottom\n\n setTablePosition((prevPosition) => ({\n ...prevPosition,\n top: tableTop,\n bottom: tableBottom\n }))\n }\n isScrolling.current = false\n }\n\n const handleScroll = () => {\n if (!isScrolling.current) {\n requestAnimationFrame(updatePosition)\n isScrolling.current = true\n }\n }\n\n if (!tableRef.current) return\n\n const observerOffset = scrollOptions?.stickyHeaderOffset || 0\n\n const observerOptions = {\n rootMargin: `-${observerOffset}px 0px -${observerOffset}px 0px`,\n threshold: 0\n }\n\n const handleTableIntersection = (entries: IntersectionObserverEntry[]) => {\n if (!entries || entries.length === 0) return\n const entry = entries[0]\n\n isTableVisible.current = entry.isIntersecting\n\n if (scrollTarget) {\n if (entry.isIntersecting) {\n // add scroll listener\n scrollTarget?.addEventListener('scroll', handleScroll)\n } else {\n // remove scroll listener\n scrollTarget?.removeEventListener('scroll', handleScroll)\n }\n }\n\n setTablePosition((prevPosition) => ({\n ...prevPosition,\n isVisible: entry.isIntersecting\n }))\n }\n\n const tableObserver = new IntersectionObserver(\n handleTableIntersection,\n observerOptions\n )\n\n //only track table position if we have a sticky header or bulk actions active\n if (\n tableRef.current &&\n (scrollOptions.hasStickyHeader ||\n Object.keys(rowSelection || {}).length > 0)\n ) {\n tableObserver.observe(tableRef.current)\n }\n\n return () => {\n tableObserver.disconnect()\n if (scrollTarget) {\n scrollTarget?.removeEventListener('scroll', handleScroll)\n }\n }\n }, [\n rowSelection,\n scrollOptions.hasStickyHeader,\n scrollOptions?.stickyHeaderOffset,\n scrollTarget,\n setTablePosition\n ])\n\n const isPending = asyncDataState === AsyncDataState.PENDING\n const isEmpty = !isPending && getTotalRows() === 0\n\n const buildScrollContainerKey = (): string => {\n let controlColumnCount = 0\n\n if (getCanSomeRowsExpand() && !!enableRowSelection) {\n controlColumnCount = 2\n } else if (getCanSomeRowsExpand() || !!enableRowSelection) {\n controlColumnCount = 1\n }\n\n return `${tableId}_${controlColumnCount}_control_columns`\n }\n\n if (isEmpty) return null\n\n const tableComponent = (\n <Table\n corners=\"round\"\n size=\"lg\"\n {...props}\n ref={tableRef}\n numberOfStickyColumns={scrollOptions.numberOfStickyColumns}\n scrollContainerCls={scrollOptions.scrollContainerCls}\n scrollContainerkey={buildScrollContainerKey()}\n className={clsx(\n className,\n isPending && [\n 'opacity-50',\n 'pointer-events-none',\n 'transition-opacity',\n 'duration-250',\n 'linear',\n 'delay-150'\n ]\n )}\n >\n <DataTable.Head\n theme={theme}\n sortable={sortable}\n isSticky={scrollOptions.hasStickyHeader}\n stickyOffset={scrollOptions.stickyHeaderOffset}\n className={scrollOptions.headerCss}\n showTotalInFirstColumn={scrollOptions.showTotalInFirstColumn}\n totalSuffix={scrollOptions.totalSuffix}\n />\n <DataTable.Body striped={striped} rowAction={rowAction} />\n </Table>\n )\n\n return (\n <>\n <DataTableLoading />\n {withContainer ? (\n <TableContainer>{tableComponent}</TableContainer>\n ) : (\n tableComponent\n )}\n </>\n )\n}\n"],"names":["TableContainer","styled","DataTableTable","sortable","striped","theme","className","scrollOptions","rowAction","withContainer","props","asyncDataState","getTotalRows","getCanSomeRowsExpand","rowSelection","enableRowSelection","tableId","setTablePosition","useDataTable","tableRef","React","isTableVisible","isScrolling","scrollTarget","updatePosition","tableTop","tableBottom","prevPosition","handleScroll","observerOffset","observerOptions","handleTableIntersection","entries","entry","tableObserver","isPending","AsyncDataState","isEmpty","buildScrollContainerKey","controlColumnCount","tableComponent","Table","clsx","DataTable","DataTableLoading"],"mappings":"8UAaA,MAAMA,EAAiBC,EAAO,MAAO,CACnC,KAAM,CAAC,MAAO,WAAY,YAAY,CACxC,CAAC,EAuBYC,EAAiB,CAAC,CAC7B,SAAAC,EACA,QAAAC,EACA,MAAAC,EAAQ,QACR,UAAAC,EACA,cAAAC,EAAgB,CACd,sBAAuB,EACvB,mBAAoB,EACpB,gBAAiB,GACjB,uBAAwB,GACxB,YAAa,OACf,EACA,UAAAC,EACA,cAAAC,EAAgB,GAChB,GAAGC,CACL,IAA+C,CAC7C,KAAM,CACJ,eAAAC,EACA,aAAAC,EACA,qBAAAC,EACA,aAAAC,EACA,mBAAAC,EACA,QAAAC,EACA,iBAAAC,CACF,EAAIC,IAEEC,EAAWC,EAAM,OAAgC,IAAI,EACrDC,EAAiBD,EAAM,OAAO,EAAK,EACnCE,EAAcF,EAAM,OAAgB,EAAK,EAEzCG,EAAeH,EAAM,QAAQ,IAC7B,OAAO,OAAW,IAAoB,KACnC,OACN,
|
|
1
|
+
{"version":3,"file":"DataTableTable.js","sources":["../../../src/components/data-table/DataTableTable.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Table } from '../table'\nimport { TableBody } from '../table/TableBody'\nimport { DataTable } from './DataTable'\nimport { AsyncDataState } from './DataTable.types'\nimport { useDataTable } from './DataTableContext'\nimport { DataTableHead } from './DataTableHead'\nimport { DataTableLoading } from './DataTableLoading'\n\nconst TableContainer = styled('div', {\n base: ['p-2', 'bg-white', 'rounded-lg']\n})\n\nexport type DataTableTableProps = Omit<\n React.ComponentProps<typeof Table>,\n 'children' | 'numberOfStickyColumns'\n> &\n Partial<\n Pick<React.ComponentProps<typeof DataTableHead>, 'theme' | 'sortable'>\n > &\n Partial<Pick<React.ComponentProps<typeof TableBody>, 'striped'>> & {\n scrollOptions?: {\n hasStickyHeader?: boolean\n stickyHeaderOffset?: number\n headerCss?: string\n numberOfStickyColumns?: number\n scrollContainerCls?: string | string[]\n showTotalInFirstColumn?: boolean\n totalSuffix?: string\n }\n rowAction?: (row: Record<string, unknown>, event: React.MouseEvent) => void\n withContainer?: boolean\n }\n\nexport const DataTableTable = ({\n sortable,\n striped,\n theme = 'white',\n className,\n scrollOptions = {\n numberOfStickyColumns: 0,\n stickyHeaderOffset: 0,\n hasStickyHeader: false,\n showTotalInFirstColumn: true,\n totalSuffix: 'items'\n },\n rowAction,\n withContainer = false,\n ...props\n}: DataTableTableProps): JSX.Element | null => {\n const {\n asyncDataState,\n getTotalRows,\n getCanSomeRowsExpand,\n rowSelection,\n enableRowSelection,\n tableId,\n setTablePosition\n } = useDataTable()\n\n const tableRef = React.useRef<HTMLTableElement | null>(null)\n const isTableVisible = React.useRef(false)\n const isScrolling = React.useRef<boolean>(false)\n\n const scrollTarget = React.useMemo(() => {\n if (typeof window === 'undefined') return null\n return window\n }, [])\n\n React.useEffect(() => {\n if (!scrollTarget || typeof IntersectionObserver === 'undefined') {\n return\n }\n\n const updatePosition = () => {\n if (tableRef.current) {\n const tableTop = tableRef.current.getBoundingClientRect().top\n const tableBottom = tableRef.current.getBoundingClientRect().bottom\n\n setTablePosition((prevPosition) => ({\n ...prevPosition,\n top: tableTop,\n bottom: tableBottom\n }))\n }\n isScrolling.current = false\n }\n\n const handleScroll = () => {\n if (!isScrolling.current) {\n requestAnimationFrame(updatePosition)\n isScrolling.current = true\n }\n }\n\n if (!tableRef.current) return\n\n const observerOffset = scrollOptions?.stickyHeaderOffset || 0\n\n const observerOptions = {\n rootMargin: `-${observerOffset}px 0px -${observerOffset}px 0px`,\n threshold: 0\n }\n\n const handleTableIntersection = (entries: IntersectionObserverEntry[]) => {\n if (!entries || entries.length === 0) return\n const entry = entries[0]\n\n isTableVisible.current = entry.isIntersecting\n\n if (scrollTarget) {\n if (entry.isIntersecting) {\n // add scroll listener\n scrollTarget?.addEventListener('scroll', handleScroll)\n } else {\n // remove scroll listener\n scrollTarget?.removeEventListener('scroll', handleScroll)\n }\n }\n\n setTablePosition((prevPosition) => ({\n ...prevPosition,\n isVisible: entry.isIntersecting\n }))\n }\n\n const tableObserver = new IntersectionObserver(\n handleTableIntersection,\n observerOptions\n )\n\n //only track table position if we have a sticky header or bulk actions active\n if (\n tableRef.current &&\n (scrollOptions.hasStickyHeader ||\n Object.keys(rowSelection || {}).length > 0)\n ) {\n tableObserver.observe(tableRef.current)\n }\n\n return () => {\n tableObserver.disconnect()\n if (scrollTarget) {\n scrollTarget?.removeEventListener('scroll', handleScroll)\n }\n }\n }, [\n rowSelection,\n scrollOptions.hasStickyHeader,\n scrollOptions?.stickyHeaderOffset,\n scrollTarget,\n setTablePosition\n ])\n\n const isPending = asyncDataState === AsyncDataState.PENDING\n const isEmpty = !isPending && getTotalRows() === 0\n\n const buildScrollContainerKey = (): string => {\n let controlColumnCount = 0\n\n if (getCanSomeRowsExpand() && !!enableRowSelection) {\n controlColumnCount = 2\n } else if (getCanSomeRowsExpand() || !!enableRowSelection) {\n controlColumnCount = 1\n }\n\n return `${tableId}_${controlColumnCount}_control_columns`\n }\n\n if (isEmpty) return null\n\n const tableComponent = (\n <Table\n corners=\"round\"\n size=\"lg\"\n {...props}\n ref={tableRef}\n numberOfStickyColumns={scrollOptions.numberOfStickyColumns}\n scrollContainerCls={scrollOptions.scrollContainerCls}\n scrollContainerkey={buildScrollContainerKey()}\n className={clsx(\n className,\n isPending && [\n 'opacity-50',\n 'pointer-events-none',\n 'transition-opacity',\n 'duration-250',\n 'linear',\n 'delay-150'\n ]\n )}\n >\n <DataTable.Head\n theme={theme}\n sortable={sortable}\n isSticky={scrollOptions.hasStickyHeader}\n stickyOffset={scrollOptions.stickyHeaderOffset}\n className={scrollOptions.headerCss}\n showTotalInFirstColumn={scrollOptions.showTotalInFirstColumn}\n totalSuffix={scrollOptions.totalSuffix}\n />\n <DataTable.Body striped={striped} rowAction={rowAction} />\n </Table>\n )\n\n return (\n <>\n <DataTableLoading />\n {withContainer ? (\n <TableContainer className={clsx(scrollOptions.numberOfStickyColumns === 0 && 'overflow-x-auto')}>{tableComponent}</TableContainer>\n ) : (\n tableComponent\n )}\n </>\n )\n}\n"],"names":["TableContainer","styled","DataTableTable","sortable","striped","theme","className","scrollOptions","rowAction","withContainer","props","asyncDataState","getTotalRows","getCanSomeRowsExpand","rowSelection","enableRowSelection","tableId","setTablePosition","useDataTable","tableRef","React","isTableVisible","isScrolling","scrollTarget","updatePosition","tableTop","tableBottom","prevPosition","handleScroll","observerOffset","observerOptions","handleTableIntersection","entries","entry","tableObserver","isPending","AsyncDataState","isEmpty","buildScrollContainerKey","controlColumnCount","tableComponent","Table","clsx","DataTable","DataTableLoading"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{Ellypsis as s}from"@atom-learning/icons";import t from"react";import"../accordion/Accordion.js";import{ActionIcon as c}from"../action-icon/ActionIcon.js";import"../alert-dialog/AlertDialog.js";import"../alert-dialog/alert-context/AlertContext.js";import"../avatar/Avatar.js";import"../badge/Badge.js";import"../banner/banner-regular/BannerRegular.js";import"../banner/banner-slim/BannerSlim.js";import"../box/Box.js";import"../button/Button.js";import"../carousel/Carousel.js";import"../checkbox/Checkbox.js";import"../checkbox-group/CheckboxGroup.js";import"../checkbox-tree/CheckboxTree.js";import"../checkbox-field/CheckboxField.js";import"../chip/Chip.js";import"../chip/ChipGroup.js";import"../chip-dismissible-group/index.js";import"../chip-toggle-group/index.js";import"../combobox/Combobox.js";import"../create-password-field/CreatePasswordField.js";import"../data-table/DataTableContext.js";import"../data-table/DataTable.js";import"../date-field/DateField.js";import"../date-input/DateInput.js";import"../dialog/Dialog.js";import"../dismissible/index.js";import"../dismissible-group/index.js";import"../divider/Divider.js";import"../drawer/Drawer.js";import"../dropdown-menu/DropdownMenu.js";import"../empty-state/EmptyState.js";import"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../file-input/FileInput.js";import{Flex as g}from"../flex/Flex.js";import"../form/Form.js";import"dlv";import"react-hook-form";import"../form/useFormCustomContext.js";import"../grid/Grid.js";import"../heading/Heading.js";import{Icon as f}from"../icon/Icon.js";import"../image/Image.js";import"../inline-message/InlineMessage.js";import"../input/Input.js";import"../input-field/InputField.js";import"../label/Label.js";import"../link/Link.js";import"../list/List.js";import"../loader/Loader.js";import"../markdown-content/MarkdownContent.js";import"../navigation/NavigationMenu.js";import"../navigation-menu-vertical/NavigationMenuVertical.js";import"../notification-badge/NotificationBadge.js";import"../number-input/NumberInput.js";import"../number-input-field/NumberInputField.js";import"./Pagination.js";import"../password-field/PasswordField.js";import"../password-input/PasswordInput.js";import{Popover as r}from"../popover/Popover.js";import"../progress-bar/ProgressBar.js";import"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import"../radio-button-field/RadioButtonField.js";import"../radio-card/RadioCard.js";import"@radix-ui/react-radio-group";import"../search-field/SearchField.js";import"../search-input/SearchInput.js";import"../section-message/SectionMessage.js";import"../select/Select.js";import"../select-field/SelectField.js";import"../side-bar/SideBar.js";import"../side-bar/SideBarContext.js";import"../slider/Slider.js";import"../slider-field/SliderField.js";import"../skeleton-loader/Skeleton.js";import"clsx";import"../tile/Tile.js";import"../
|
|
1
|
+
import{Ellypsis as s}from"@atom-learning/icons";import t from"react";import"../accordion/Accordion.js";import{ActionIcon as c}from"../action-icon/ActionIcon.js";import"../alert-dialog/AlertDialog.js";import"../alert-dialog/alert-context/AlertContext.js";import"../avatar/Avatar.js";import"../badge/Badge.js";import"../banner/banner-regular/BannerRegular.js";import"../banner/banner-slim/BannerSlim.js";import"../box/Box.js";import"../button/Button.js";import"../carousel/Carousel.js";import"../checkbox/Checkbox.js";import"../checkbox-group/CheckboxGroup.js";import"../checkbox-tree/CheckboxTree.js";import"../checkbox-field/CheckboxField.js";import"../chip/Chip.js";import"../chip/ChipGroup.js";import"../chip-dismissible-group/index.js";import"../chip-toggle-group/index.js";import"../combobox/Combobox.js";import"../create-password-field/CreatePasswordField.js";import"../data-table/DataTableContext.js";import"../data-table/DataTable.js";import"../date-field/DateField.js";import"../date-input/DateInput.js";import"../dialog/Dialog.js";import"../dismissible/index.js";import"../dismissible-group/index.js";import"../divider/Divider.js";import"../drawer/Drawer.js";import"../dropdown-menu/DropdownMenu.js";import"../empty-state/EmptyState.js";import"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../file-input/FileInput.js";import{Flex as g}from"../flex/Flex.js";import"../form/Form.js";import"dlv";import"react-hook-form";import"../form/useFormCustomContext.js";import"../grid/Grid.js";import"../heading/Heading.js";import{Icon as f}from"../icon/Icon.js";import"../image/Image.js";import"../inline-message/InlineMessage.js";import"../input/Input.js";import"../input-field/InputField.js";import"../label/Label.js";import"../link/Link.js";import"../list/List.js";import"../loader/Loader.js";import"../markdown-content/MarkdownContent.js";import"../navigation/NavigationMenu.js";import"../navigation-menu-vertical/NavigationMenuVertical.js";import"../notification-badge/NotificationBadge.js";import"../number-input/NumberInput.js";import"../number-input-field/NumberInputField.js";import"./Pagination.js";import"../password-field/PasswordField.js";import"../password-input/PasswordInput.js";import{Popover as r}from"../popover/Popover.js";import"../progress-bar/ProgressBar.js";import"../radio-button/RadioButton.js";import"../radio-button/RadioButtonGroup.js";import"../radio-button-field/RadioButtonField.js";import"../radio-card/RadioCard.js";import"@radix-ui/react-radio-group";import"../search-field/SearchField.js";import"../search-input/SearchInput.js";import"../section-message/SectionMessage.js";import"../select/Select.js";import"../select-field/SelectField.js";import"../side-bar/SideBar.js";import"../side-bar/SideBarContext.js";import"../slider/Slider.js";import"../slider-field/SliderField.js";import"../skeleton-loader/Skeleton.js";import"clsx";import"../tile/Tile.js";import"../table/Table.js";import"../sortable/SortableHandle.js";import"../sortable/SortableItem.js";import"../sortable/SortableRoot.js";import"../spacer/Spacer.js";import"../stepper/Stepper.js";import"../switch/Switch.js";import"../tabs/Tabs.js";import"../text/Text.js";import"../textarea/Textarea.js";import"../textarea-field/TextareaField.js";import"../tile-interactive/TileInteractive.js";import"../tile-toggle-group/index.js";import"../toast/Toast.js";import"../toast/ToastProvider.js";import"../toggle-group/ToggleGroupButton.js";import"../toggle-group/ToggleGroupItem.js";import"../toggle-group/ToggleGroupRoot.js";import"../tooltip/Tooltip.js";import"../top-bar/TopBar.js";import"../tree/Tree.js";import"../video/Video.js";import"../keyboard-shortcut/index.js";import"../segmented-control/SegmentedControlContext.js";import"../segmented-control/SegmentedControlContent.js";import"../segmented-control/SegmentedControlDescription.js";import"../segmented-control/SegmentedControlHeading.js";import"../segmented-control/SegmentedControlItem.js";import"../segmented-control/SegmentedControlItemList.js";import"../segmented-control/SegmentedControlRoot.js";import"../file-drop/FileDrop.js";import"../file-drop/FileDropContext.js";import{PaginationPage as u}from"./PaginationPage.js";import{usePagination as d}from"./usePagination.js";const E=({children:e})=>{const{pagesCount:a,labels:i}=d(),p=Array.from({length:a},(o,l)=>l+1),[n,m]=t.useState(!1);return t.createElement(r,{open:n,onOpenChange:m,defaultOpen:!1},t.createElement(r.Trigger,{asChild:!0},e||t.createElement(c,{hasTooltip:!1,size:"md",theme:"neutral",label:(i==null?void 0:i.popoverTriggerLabel)||"Open pagination popover","data-testid":"pagination_popover_trigger"},t.createElement(f,{is:s}))),t.createElement(r.Content,{size:"md",showCloseButton:!1,className:"p-0"},t.createElement(g,{className:"flex flex-wrap justify-center gap-1 p-4"},p==null?void 0:p.map(o=>t.createElement(u,{key:o,pageNumber:o,onClick:()=>m(!1)})))))};export{E as PaginationPopover};
|
|
2
2
|
//# sourceMappingURL=PaginationPopover.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PaginationPopover.js","sources":["../../../src/components/pagination/PaginationPopover.tsx"],"sourcesContent":["import { Ellypsis } from '@atom-learning/icons'\nimport React from 'react'\n\nimport { ActionIcon, Flex, Icon, Popover } from '..'\nimport { PaginationPage } from './PaginationPage'\nimport { usePagination } from './usePagination'\n\nexport const PaginationPopover = ({\n children\n}: React.PropsWithChildren<unknown>) => {\n const { pagesCount, labels } = usePagination()\n const paginationItems = Array.from(\n { length: pagesCount },\n (_, index) => index + 1\n )\n\n const [isOpen, setIsOpen] = React.useState<boolean>(false)\n\n return (\n <Popover open={isOpen} onOpenChange={setIsOpen} defaultOpen={false}>\n <Popover.Trigger asChild>\n {children || (\n <ActionIcon\n hasTooltip={false}\n size=\"md\"\n theme=\"neutral\"\n label={labels?.popoverTriggerLabel || 'Open pagination popover'}\n data-testid=\"pagination_popover_trigger\"\n >\n <Icon is={Ellypsis} />\n </ActionIcon>\n )}\n </Popover.Trigger>\n <Popover.Content size=\"md\" showCloseButton={false} className=\"p-0\">\n <Flex className=\"flex flex-wrap justify-center gap-1 p-4\">\n {paginationItems?.map((pageNumber) => {\n return (\n <PaginationPage\n key={pageNumber}\n pageNumber={pageNumber}\n onClick={() => setIsOpen(false)}\n />\n )\n })}\n </Flex>\n </Popover.Content>\n </Popover>\n )\n}\n"],"names":["PaginationPopover","children","pagesCount","labels","usePagination","paginationItems","_","index","isOpen","setIsOpen","React","Popover","ActionIcon","Icon","Ellypsis","Flex","pageNumber","PaginationPage"],"mappings":"
|
|
1
|
+
{"version":3,"file":"PaginationPopover.js","sources":["../../../src/components/pagination/PaginationPopover.tsx"],"sourcesContent":["import { Ellypsis } from '@atom-learning/icons'\nimport React from 'react'\n\nimport { ActionIcon, Flex, Icon, Popover } from '..'\nimport { PaginationPage } from './PaginationPage'\nimport { usePagination } from './usePagination'\n\nexport const PaginationPopover = ({\n children\n}: React.PropsWithChildren<unknown>) => {\n const { pagesCount, labels } = usePagination()\n const paginationItems = Array.from(\n { length: pagesCount },\n (_, index) => index + 1\n )\n\n const [isOpen, setIsOpen] = React.useState<boolean>(false)\n\n return (\n <Popover open={isOpen} onOpenChange={setIsOpen} defaultOpen={false}>\n <Popover.Trigger asChild>\n {children || (\n <ActionIcon\n hasTooltip={false}\n size=\"md\"\n theme=\"neutral\"\n label={labels?.popoverTriggerLabel || 'Open pagination popover'}\n data-testid=\"pagination_popover_trigger\"\n >\n <Icon is={Ellypsis} />\n </ActionIcon>\n )}\n </Popover.Trigger>\n <Popover.Content size=\"md\" showCloseButton={false} className=\"p-0\">\n <Flex className=\"flex flex-wrap justify-center gap-1 p-4\">\n {paginationItems?.map((pageNumber) => {\n return (\n <PaginationPage\n key={pageNumber}\n pageNumber={pageNumber}\n onClick={() => setIsOpen(false)}\n />\n )\n })}\n </Flex>\n </Popover.Content>\n </Popover>\n )\n}\n"],"names":["PaginationPopover","children","pagesCount","labels","usePagination","paginationItems","_","index","isOpen","setIsOpen","React","Popover","ActionIcon","Icon","Ellypsis","Flex","pageNumber","PaginationPage"],"mappings":"uqIAOO,MAAMA,EAAoB,CAAC,CAChC,SAAAC,CACF,IAAwC,CACtC,KAAM,CAAE,WAAAC,EAAY,OAAAC,CAAO,EAAIC,EAAc,EACvCC,EAAkB,MAAM,KAC5B,CAAE,OAAQH,CAAW,EACrB,CAACI,EAAGC,IAAUA,EAAQ,CACxB,EAEM,CAACC,EAAQC,CAAS,EAAIC,EAAM,SAAkB,EAAK,EAEzD,OACEA,EAAA,cAACC,EAAA,CAAQ,KAAMH,EAAQ,aAAcC,EAAW,YAAa,EAAA,EAC3DC,EAAA,cAACC,EAAQ,QAAR,CAAgB,QAAO,IACrBV,GACCS,EAAA,cAACE,EAAA,CACC,WAAY,GACZ,KAAK,KACL,MAAM,UACN,OAAOT,GAAA,KAAAA,OAAAA,EAAQ,sBAAuB,0BACtC,cAAY,4BAEZO,EAAAA,EAAA,cAACG,EAAA,CAAK,GAAIC,CAAAA,CAAU,CACtB,CAEJ,EACAJ,EAAA,cAACC,EAAQ,QAAR,CAAgB,KAAK,KAAK,gBAAiB,GAAO,UAAU,KAAA,EAC3DD,EAAA,cAACK,EAAA,CAAK,UAAU,yCACbV,EAAAA,GAAA,YAAAA,EAAiB,IAAKW,GAEnBN,EAAA,cAACO,EAAA,CACC,IAAKD,EACL,WAAYA,EACZ,QAAS,IAAMP,EAAU,EAAK,CAAA,CAChC,CAGN,CAAA,CACF,CACF,CAEJ"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import
|
|
1
|
+
import t from"clsx";import e from"react";import{Tile as l}from"../tile/Tile.js";import"../flex/Flex.js";const r=()=>e.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:120,height:121,fill:"none",className:"animate-shimmer"},e.createElement("mask",{id:"a",fill:"#fff"},e.createElement("path",{d:"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z",mask:"url(#a)"}),e.createElement("mask",{id:"b",fill:"#fff"},e.createElement("path",{d:"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z",mask:"url(#b)"}),e.createElement("mask",{id:"c",fill:"#fff"},e.createElement("path",{d:"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z",mask:"url(#c)"}),e.createElement("mask",{id:"d",fill:"#fff"},e.createElement("path",{d:"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z",mask:"url(#d)"}),e.createElement("mask",{id:"e",fill:"#fff"},e.createElement("path",{d:"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z"})),e.createElement("path",{className:"fill-grey-300",stroke:"#fff",strokeWidth:1.6,d:"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z",mask:"url(#e)"})),m=({containerCss:a})=>e.createElement(l,{className:t("p-6","flex-row","gap-4","relative",a)},e.createElement(r,null));export{m as SkeletonDoughnutChart};
|
|
2
2
|
//# sourceMappingURL=SkeletonDoughnutChart.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SkeletonDoughnutChart.js","sources":["../../../src/components/skeleton-loader/SkeletonDoughnutChart.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport {
|
|
1
|
+
{"version":3,"file":"SkeletonDoughnutChart.js","sources":["../../../src/components/skeleton-loader/SkeletonDoughnutChart.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport React from 'react'\n\nimport { Tile } from '../tile'\n\nconst DoughnutSvg = () => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={120}\n height={121}\n fill=\"none\"\n className=\"animate-shimmer\"\n >\n <mask id=\"a\" fill=\"#fff\">\n <path d=\"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z\" />\n </mask>\n <path\n className=\"fill-grey-300\"\n stroke=\"#fff\"\n strokeWidth={1.6}\n d=\"m117 60 3 3a60 60 0 0 1-39 53q-2 1-4-2l-5-17q-1-2 2-4a36 36 0 0 0 22-30q0-2 3-3z\"\n mask=\"url(#a)\"\n />\n <mask id=\"b\" fill=\"#fff\">\n <path d=\"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z\" />\n </mask>\n <path\n className=\"fill-grey-300\"\n stroke=\"#fff\"\n strokeWidth={1.6}\n d=\"M117 60q2 0 3-3A60 60 0 0 0 81 4l-4 2-5 17q-1 4 2 4a36 36 0 0 1 22 30q0 3 3 3z\"\n mask=\"url(#b)\"\n />\n <mask id=\"c\" fill=\"#fff\">\n <path d=\"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z\" />\n </mask>\n <path\n className=\"fill-grey-300\"\n stroke=\"#fff\"\n strokeWidth={1.6}\n d=\"M77 6q1-2-2-4a60 60 0 0 0-62 21q-1 2 1 4l14 10h5a36 36 0 0 1 35-12q3 1 4-2z\"\n mask=\"url(#c)\"\n />\n <mask id=\"d\" fill=\"#fff\">\n <path d=\"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z\" />\n </mask>\n <path\n className=\"fill-grey-300\"\n stroke=\"#fff\"\n strokeWidth={1.6}\n d=\"M14 93q-3 2-1 5a60 60 0 0 0 62 20l2-4-5-16-4-3a36 36 0 0 1-35-11q-3-3-5-1z\"\n mask=\"url(#d)\"\n />\n <mask id=\"e\" fill=\"#fff\">\n <path d=\"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z\" />\n </mask>\n <path\n className=\"fill-grey-300\"\n stroke=\"#fff\"\n strokeWidth={1.6}\n d=\"M14 27q-2-2-4 1a60 60 0 0 0 0 65q1 2 4 0l14-10q3-2 1-4a36 36 0 0 1 0-37q2-3-1-5z\"\n mask=\"url(#e)\"\n />\n </svg>\n)\n\nexport const SkeletonDoughnutChart = ({\n containerCss\n}: {\n containerCss?: string\n}) => (\n <Tile className={clsx('p-6', 'flex-row', 'gap-4', 'relative', containerCss)}>\n <DoughnutSvg />\n </Tile>\n)\n"],"names":["DoughnutSvg","React","SkeletonDoughnutChart","containerCss","Tile","clsx"],"mappings":"wGAKA,MAAMA,EAAc,IAClBC,EAAA,cAAC,MACC,CAAA,MAAM,6BACN,MAAO,IACP,OAAQ,IACR,KAAK,OACL,UAAU,iBAAA,EAEVA,EAAA,cAAC,OAAA,CAAK,GAAG,IAAI,KAAK,QAChBA,EAAA,cAAC,QAAK,EAAE,kFAAA,CAAmF,CAC7F,EACAA,EAAA,cAAC,OACC,CAAA,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,mFACF,KAAK,SAAA,CACP,EACAA,EAAA,cAAC,QAAK,GAAG,IAAI,KAAK,MAChBA,EAAAA,EAAA,cAAC,OAAK,CAAA,EAAE,iFAAiF,CAC3F,EACAA,EAAA,cAAC,OAAA,CACC,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,iFACF,KAAK,UACP,EACAA,EAAA,cAAC,OAAK,CAAA,GAAG,IAAI,KAAK,MAAA,EAChBA,EAAA,cAAC,OAAA,CAAK,EAAE,6EAA8E,CAAA,CACxF,EACAA,EAAA,cAAC,QACC,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,8EACF,KAAK,SACP,CAAA,EACAA,EAAA,cAAC,OAAA,CAAK,GAAG,IAAI,KAAK,QAChBA,EAAA,cAAC,QAAK,EAAE,4EAAA,CAA6E,CACvF,EACAA,EAAA,cAAC,OACC,CAAA,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,6EACF,KAAK,SAAA,CACP,EACAA,EAAA,cAAC,QAAK,GAAG,IAAI,KAAK,MAChBA,EAAAA,EAAA,cAAC,OAAK,CAAA,EAAE,mFAAmF,CAC7F,EACAA,EAAA,cAAC,OAAA,CACC,UAAU,gBACV,OAAO,OACP,YAAa,IACb,EAAE,mFACF,KAAK,UACP,CACF,EAGWC,EAAwB,CAAC,CACpC,aAAAC,CACF,IAGEF,EAAA,cAACG,EAAA,CAAK,UAAWC,EAAK,MAAO,WAAY,QAAS,WAAYF,CAAY,GACxEF,EAAA,cAACD,EAAA,IAAY,CACf"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import*as o from"@radix-ui/react-toggle-group";import*as t from"react";import{TileInteractive as r}from"../tile-interactive/TileInteractive.js";import{styled as n}from"../../styled.js";const i=n(r,{base:["text-left","not-disabled:data-[state=on]:active:bg-(--interactive-3)","not-disabled:data-[state=on]:hover:bg-(--interactive-2)","data-[state=on]:before:-inset-
|
|
1
|
+
import*as o from"@radix-ui/react-toggle-group";import*as t from"react";import{TileInteractive as r}from"../tile-interactive/TileInteractive.js";import{styled as n}from"../../styled.js";const i=n(r,{base:["text-left","not-disabled:data-[state=on]:active:bg-(--interactive-3)","not-disabled:data-[state=on]:hover:bg-(--interactive-2)","data-[state=on]:before:-inset-px","data-[state=on]:before:absolute","data-[state=on]:before:rounded-[inherit]","data-[state=on]:before:inset-shadow-[var(--accent-8)_0px_0px_0px_2px]","data-[state=on]:before:z-1","data-[state=on]:bg-(--interactive-1)","data-[state=on]:border-(--accent-8)"]}),s=({children:e,...a})=>t.createElement(o.Item,{...a,asChild:!0},t.createElement(i,{as:"button"},e));export{s as TileToggleGroupItem};
|
|
2
2
|
//# sourceMappingURL=TileToggleGroupItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TileToggleGroupItem.js","sources":["../../../src/components/tile-toggle-group/TileToggleGroupItem.tsx"],"sourcesContent":["import * as ToggleGroup from '@radix-ui/react-toggle-group'\nimport * as React from 'react'\n\nimport { TileInteractive } from '~/components/tile-interactive'\nimport { styled } from '~/styled'\n\nconst StyledTileToggleGroupItem = styled(TileInteractive, {\n base: [\n 'text-left',\n 'not-disabled:data-[state=on]:active:bg-(--interactive-3)',\n 'not-disabled:data-[state=on]:hover:bg-(--interactive-2)',\n 'data-[state=on]:before:-inset-
|
|
1
|
+
{"version":3,"file":"TileToggleGroupItem.js","sources":["../../../src/components/tile-toggle-group/TileToggleGroupItem.tsx"],"sourcesContent":["import * as ToggleGroup from '@radix-ui/react-toggle-group'\nimport * as React from 'react'\n\nimport { TileInteractive } from '~/components/tile-interactive'\nimport { styled } from '~/styled'\n\nconst StyledTileToggleGroupItem = styled(TileInteractive, {\n base: [\n 'text-left',\n 'not-disabled:data-[state=on]:active:bg-(--interactive-3)',\n 'not-disabled:data-[state=on]:hover:bg-(--interactive-2)',\n 'data-[state=on]:before:-inset-px',\n 'data-[state=on]:before:absolute',\n 'data-[state=on]:before:rounded-[inherit]',\n 'data-[state=on]:before:inset-shadow-[var(--accent-8)_0px_0px_0px_2px]',\n 'data-[state=on]:before:z-1',\n 'data-[state=on]:bg-(--interactive-1)',\n 'data-[state=on]:border-(--accent-8)'\n ]\n})\n\ntype TTileToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> &\n React.ComponentProps<typeof StyledTileToggleGroupItem>\n\nexport const TileToggleGroupItem = ({\n children,\n ...rest\n}: TTileToggleGroupItem) => (\n <ToggleGroup.Item {...rest} asChild>\n <StyledTileToggleGroupItem as=\"button\">\n {children}\n </StyledTileToggleGroupItem>\n </ToggleGroup.Item>\n)\n"],"names":["StyledTileToggleGroupItem","styled","TileInteractive","TileToggleGroupItem","children","rest","React","ToggleGroup"],"mappings":"yLAMA,MAAMA,EAA4BC,EAAOC,EAAiB,CACxD,KAAM,CACJ,YACA,2DACA,0DACA,mCACA,kCACA,2CACA,wEACA,6BACA,uCACA,qCACF,CACF,CAAC,EAKYC,EAAsB,CAAC,CAClC,SAAAC,EACA,GAAGC,CACL,IACEC,EAAA,cAACC,EAAY,KAAZ,CAAkB,GAAGF,EAAM,QAAO,EACjCC,EAAAA,EAAA,cAACN,EAAA,CAA0B,GAAG,QAC3BI,EAAAA,CACH,CACF"}
|