@atom-learning/components 4.5.1 → 4.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,14 @@
1
+ import * as React from 'react';
2
+ import { Flex } from '../flex';
3
+ import { type FileDropContextValue } from './types';
4
+ interface FileDropProps extends Omit<React.ComponentProps<typeof Flex>, 'onDrop'> {
5
+ onDrop: (files: File[]) => void;
6
+ children?: React.ReactNode | ((value: FileDropContextValue) => React.ReactNode);
7
+ accept?: React.InputHTMLAttributes<HTMLInputElement>['accept'];
8
+ multiple?: React.InputHTMLAttributes<HTMLInputElement>['multiple'];
9
+ }
10
+ export declare const FileDrop: {
11
+ ({ css, children, accept, multiple, onDrop, ...props }: FileDropProps): JSX.Element;
12
+ displayName: string;
13
+ };
14
+ export {};
@@ -0,0 +1,2 @@
1
+ import*as r from"react";import{Flex as x}from"../flex/Flex.js";import{FileDropContext as E}from"./FileDropContext.js";const c=({css:p,children:n,accept:s,multiple:u,onDrop:d,...f})=>{const[m,i]=r.useState(!1),[v,D]=r.useState([]),o=r.useRef(null),g=e=>{e.preventDefault(),i(!0)},y=()=>i(!1),l=e=>{if(!e)return;i(!1);const t=Array.from(e);d(t),D(t)},b=e=>{var t;["Space","Enter"].includes(e.key)&&((t=o.current)==null||t.click())},a={isDragging:m,files:v};return r.createElement(E.Provider,{value:a},r.createElement(x,{direction:"column",gap:"24",align:"center",onDragOver:g,onDragLeave:y,onDrop:e=>{e.preventDefault(),l(e.dataTransfer.files)},onClick:()=>{var e;return(e=o.current)==null?void 0:e.click()},css:{border:"1px dashed $grey500",p:"$5 $7",borderRadius:"$1",cursor:"pointer","& *":{pointerEvents:"none"},...p},role:"button",onKeyDown:b,tabIndex:0,...f},typeof n=="function"?n(a):n,r.createElement("input",{type:"file",ref:o,style:{visibility:"hidden"},accept:s,multiple:u,onChange:e=>{l(e.target.files)}})))};c.displayName="FileDrop";export{c as FileDrop};
2
+ //# sourceMappingURL=FileDrop.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FileDrop.js","sources":["../../../src/components/file-drop/FileDrop.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { Flex } from '../flex'\nimport { FileDropContext } from './FileDropContext'\nimport { type FileDropContextValue } from './types'\n\ninterface FileDropProps\n extends Omit<React.ComponentProps<typeof Flex>, 'onDrop'> {\n onDrop: (files: File[]) => void\n children?:\n | React.ReactNode\n | ((value: FileDropContextValue) => React.ReactNode)\n accept?: React.InputHTMLAttributes<HTMLInputElement>['accept']\n multiple?: React.InputHTMLAttributes<HTMLInputElement>['multiple']\n}\n\nexport const FileDrop = ({\n css,\n children,\n accept,\n multiple,\n onDrop,\n ...props\n}: FileDropProps): JSX.Element => {\n const [isDragging, setIsDragging] = React.useState(false)\n const [files, setFiles] = React.useState<File[]>([])\n const fileUploadInputRef = React.useRef<HTMLInputElement>(null)\n\n const handleDragOver = (event: React.DragEvent<HTMLDivElement>) => {\n event.preventDefault()\n setIsDragging(true)\n }\n\n const handleDragLeave = () => setIsDragging(false)\n\n const handleDrop = (fileList: FileList | null) => {\n if (!fileList) return\n\n setIsDragging(false)\n\n const files = Array.from(fileList)\n onDrop(files)\n setFiles(files)\n }\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (['Space', 'Enter'].includes(event.key)) {\n fileUploadInputRef.current?.click()\n }\n }\n\n const value: FileDropContextValue = { isDragging, files }\n\n return (\n <FileDropContext.Provider value={value}>\n <Flex\n direction=\"column\"\n gap=\"24\"\n align=\"center\"\n onDragOver={handleDragOver}\n onDragLeave={handleDragLeave}\n onDrop={(event) => {\n event.preventDefault()\n handleDrop(event.dataTransfer.files)\n }}\n onClick={() => fileUploadInputRef.current?.click()}\n css={{\n border: '1px dashed $grey500',\n p: '$5 $7',\n borderRadius: '$1',\n cursor: 'pointer',\n '& *': { pointerEvents: 'none' },\n ...css\n }}\n role=\"button\"\n onKeyDown={handleKeyDown}\n tabIndex={0}\n {...props}\n >\n {typeof children === 'function' ? children(value) : children}\n <input\n type=\"file\"\n ref={fileUploadInputRef}\n style={{ visibility: 'hidden' }}\n accept={accept}\n multiple={multiple}\n onChange={(event) => {\n handleDrop(event.target.files)\n }}\n />\n </Flex>\n </FileDropContext.Provider>\n )\n}\n\nFileDrop.displayName = 'FileDrop'\n"],"names":["FileDrop","css","children","accept","multiple","onDrop","props","isDragging","setIsDragging","React","files","setFiles","fileUploadInputRef","handleDragOver","event","handleDragLeave","handleDrop","fileList","handleKeyDown","_a","value","FileDropContext","Flex"],"mappings":"sHAgBa,MAAAA,EAAW,CAAC,CACvB,IAAAC,EACA,SAAAC,EACA,OAAAC,EACA,SAAAC,EACA,OAAAC,KACGC,CACL,IAAkC,CAChC,KAAM,CAACC,EAAYC,CAAa,EAAIC,EAAM,SAAS,EAAK,EAClD,CAACC,EAAOC,CAAQ,EAAIF,EAAM,SAAiB,EAAE,EAC7CG,EAAqBH,EAAM,OAAyB,IAAI,EAExDI,EAAkBC,GAA2C,CACjEA,EAAM,eAAA,EACNN,EAAc,EAAI,CACpB,EAEMO,EAAkB,IAAMP,EAAc,EAAK,EAE3CQ,EAAcC,GAA8B,CAChD,GAAI,CAACA,EAAU,OAEfT,EAAc,EAAK,EAEnB,MAAME,EAAQ,MAAM,KAAKO,CAAQ,EACjCZ,EAAOK,CAAK,EACZC,EAASD,CAAK,CAChB,EAEMQ,EAAiBJ,GAA+C,CA7CxE,IAAAK,EA8CQ,CAAC,QAAS,OAAO,EAAE,SAASL,EAAM,GAAG,KACvCK,EAAAP,EAAmB,UAAnB,MAAAO,EAA4B,QAEhC,EAEMC,EAA8B,CAAE,WAAAb,EAAY,MAAAG,CAAM,EAExD,OACED,EAAA,cAACY,EAAgB,SAAhB,CAAyB,MAAOD,CAC/BX,EAAAA,EAAA,cAACa,EAAA,CACC,UAAU,SACV,IAAI,KACJ,MAAM,SACN,WAAYT,EACZ,YAAaE,EACb,OAASD,GAAU,CACjBA,EAAM,iBACNE,EAAWF,EAAM,aAAa,KAAK,CACrC,EACA,QAAS,IAAG,CAjEpB,IAAAK,EAiEuB,OAAAA,EAAAP,EAAmB,UAAnB,KAAA,OAAAO,EAA4B,MAAA,CAAA,EAC3C,IAAK,CACH,OAAQ,sBACR,EAAG,QACH,aAAc,KACd,OAAQ,UACR,MAAO,CAAE,cAAe,MAAO,EAC/B,GAAGlB,CACL,EACA,KAAK,SACL,UAAWiB,EACX,SAAU,EACT,GAAGZ,CAEH,EAAA,OAAOJ,GAAa,WAAaA,EAASkB,CAAK,EAAIlB,EACpDO,EAAA,cAAC,QAAA,CACC,KAAK,OACL,IAAKG,EACL,MAAO,CAAE,WAAY,QAAS,EAC9B,OAAQT,EACR,SAAUC,EACV,SAAWU,GAAU,CACnBE,EAAWF,EAAM,OAAO,KAAK,CAC/B,CACF,CAAA,CACF,CACF,CAEJ,EAEAd,EAAS,YAAc"}
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import { FileDropContextValue } from './types';
3
+ export declare const FileDropContext: React.Context<FileDropContextValue>;
@@ -0,0 +1,2 @@
1
+ import e from"react";const t=e.createContext({isDragging:!1,files:[]});export{t as FileDropContext};
2
+ //# sourceMappingURL=FileDropContext.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FileDropContext.js","sources":["../../../src/components/file-drop/FileDropContext.ts"],"sourcesContent":["import React from 'react'\n\nimport { FileDropContextValue } from './types'\n\nexport const FileDropContext = React.createContext<FileDropContextValue>({\n isDragging: false,\n files: []\n})\n"],"names":["FileDropContext","React"],"mappings":"qBAIa,MAAAA,EAAkBC,EAAM,cAAoC,CACvE,WAAY,GACZ,MAAO,EACT,CAAC"}
@@ -0,0 +1,2 @@
1
+ export { FileDrop } from './FileDrop';
2
+ export { useFileDrop } from './useFileDrop';
@@ -0,0 +1,4 @@
1
+ export interface FileDropContextValue {
2
+ isDragging: boolean;
3
+ files: File[];
4
+ }
@@ -0,0 +1,2 @@
1
+ import { FileDropContextValue } from './types';
2
+ export declare const useFileDrop: () => FileDropContextValue;
@@ -0,0 +1,2 @@
1
+ import o from"react";import{FileDropContext as e}from"./FileDropContext.js";const t=()=>o.useContext(e);export{t as useFileDrop};
2
+ //# sourceMappingURL=useFileDrop.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useFileDrop.js","sources":["../../../src/components/file-drop/useFileDrop.ts"],"sourcesContent":["import React from 'react'\n\nimport { FileDropContext } from './FileDropContext'\nimport { FileDropContextValue } from './types'\n\nexport const useFileDrop = (): FileDropContextValue =>\n React.useContext(FileDropContext)\n"],"names":["useFileDrop","React","FileDropContext"],"mappings":"4EAKO,MAAMA,EAAc,IACzBC,EAAM,WAAWC,CAAe"}
@@ -85,3 +85,4 @@ export { Tree } from './tree';
85
85
  export { Video } from './video';
86
86
  export { KeyboardShortcut } from './keyboard-shortcut';
87
87
  export { SegmentedControl } from './segmented-control';
88
+ export { FileDrop, useFileDrop } from './file-drop';
@@ -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"../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"../sortable/SortableHandle.js";import"../sortable/SortableItem.js";import"../sortable/SortableRoot.js";import"../spacer/Spacer.js";import"../stack-content/StackContent.js";import"../stepper/Stepper.js";import"../switch/Switch.js";import"../table/Table.js";import"../tabs/Tabs.js";import"../text/Text.js";import"../textarea/Textarea.js";import"../textarea-field/TextareaField.js";import"../tile/Tile.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{PaginationPage as u}from"./PaginationPage.js";import{usePagination as d}from"./usePagination.js";const E=({children:e})=>{const{pagesCount:n,labels:i}=d(),p=Array.from({length:n},(o,l)=>l+1),[a,m]=t.useState(!1);return t.createElement(r,{open:a,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,css:{p:0}},t.createElement(g,{css:{p:"$4",display:"flex",flexWrap:"wrap",gap:"$1",justifyContent:"center"}},p==null?void 0:p.map(o=>t.createElement(u,{key:o,pageNumber:o,onClick:()=>m(!1)})))))};export{E as PaginationPopover};
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"../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"../sortable/SortableHandle.js";import"../sortable/SortableItem.js";import"../sortable/SortableRoot.js";import"../spacer/Spacer.js";import"../stack-content/StackContent.js";import"../stepper/Stepper.js";import"../switch/Switch.js";import"../table/Table.js";import"../tabs/Tabs.js";import"../text/Text.js";import"../textarea/Textarea.js";import"../textarea-field/TextareaField.js";import"../tile/Tile.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:n,labels:i}=d(),p=Array.from({length:n},(o,l)=>l+1),[a,m]=t.useState(!1);return t.createElement(r,{open:a,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,css:{p:0}},t.createElement(g,{css:{p:"$4",display:"flex",flexWrap:"wrap",gap:"$1",justifyContent:"center"}},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} css={{ p: 0 }}>\n <Flex\n css={{\n p: '$4',\n display: 'flex',\n flexWrap: 'wrap',\n gap: '$1',\n justifyContent: 'center'\n }}\n >\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":"2iIAOO,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,EAC3DC,EAAAA,EAAA,cAACC,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACrBV,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,IAAK,CAAE,EAAG,CAAE,CAC7DD,EAAAA,EAAA,cAACK,EAAA,CACC,IAAK,CACH,EAAG,KACH,QAAS,OACT,SAAU,OACV,IAAK,KACL,eAAgB,QAClB,GAECV,GAAA,KAAA,OAAAA,EAAiB,IAAKW,GAEnBN,EAAA,cAACO,EAAA,CACC,IAAKD,EACL,WAAYA,EACZ,QAAS,IAAMP,EAAU,EAAK,EAChC,CAGN,CAAA,CACF,CACF,CAEJ"}
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} css={{ p: 0 }}>\n <Flex\n css={{\n p: '$4',\n display: 'flex',\n flexWrap: 'wrap',\n gap: '$1',\n justifyContent: 'center'\n }}\n >\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":"onIAOO,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,EAC3DC,EAAAA,EAAA,cAACC,EAAQ,QAAR,CAAgB,QAAO,EAAA,EACrBV,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,IAAK,CAAE,EAAG,CAAE,CAC7DD,EAAAA,EAAA,cAACK,EAAA,CACC,IAAK,CACH,EAAG,KACH,QAAS,OACT,SAAU,OACV,IAAK,KACL,eAAgB,QAClB,GAECV,GAAA,KAAA,OAAAA,EAAiB,IAAKW,GAEnBN,EAAA,cAACO,EAAA,CACC,IAAKD,EACL,WAAYA,EACZ,QAAS,IAAMP,EAAU,EAAK,EAChC,CAGN,CAAA,CACF,CACF,CAEJ"}