@plexui/ui 0.19.1 → 0.20.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -3
- package/dist/es/components/Accordion/Accordion.js +2 -2
- package/dist/es/components/Accordion/Accordion.js.map +1 -1
- package/dist/es/components/Accordion/index.js +1 -1
- package/dist/es/components/Alert/Alert.js +6 -6
- package/dist/es/components/Alert/Alert.js.map +1 -1
- package/dist/es/components/Alert/index.js +1 -1
- package/dist/es/components/Avatar/Avatar.js +12 -5
- package/dist/es/components/Avatar/Avatar.js.map +1 -1
- package/dist/es/components/Avatar/AvatarGroup.js +2 -2
- package/dist/es/components/Avatar/AvatarGroup.js.map +1 -1
- package/dist/es/components/Avatar/index.js +2 -2
- package/dist/es/components/Badge/index.js +3 -3
- package/dist/es/components/Badge/index.js.map +1 -1
- package/dist/es/components/Breadcrumb/Breadcrumb.js +34 -0
- package/dist/es/components/Breadcrumb/Breadcrumb.js.map +1 -0
- package/dist/es/components/Breadcrumb/index.js +2 -0
- package/dist/es/components/Breadcrumb/index.js.map +1 -0
- package/dist/es/components/Button/Button.js +7 -7
- package/dist/es/components/Button/Button.js.map +1 -1
- package/dist/es/components/Button/CopyButton.js +25 -13
- package/dist/es/components/Button/CopyButton.js.map +1 -1
- package/dist/es/components/Button/index.js +2 -2
- package/dist/es/components/ButtonGroup/ButtonGroup.js +2 -2
- package/dist/es/components/ButtonGroup/ButtonGroup.js.map +1 -1
- package/dist/es/components/ButtonGroup/index.js +1 -1
- package/dist/es/components/Card/Card.js +4 -3
- package/dist/es/components/Card/Card.js.map +1 -1
- package/dist/es/components/Card/index.js +1 -1
- package/dist/es/components/Checkbox/Checkbox.js +12 -6
- package/dist/es/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/es/components/Checkbox/index.js +1 -1
- package/dist/es/components/CodeBlock/CodeBlock.js +25 -25
- package/dist/es/components/CodeBlock/CodeBlock.js.map +1 -1
- package/dist/es/components/CodeBlock/CollapsibleCodeBlock.js +6 -4
- package/dist/es/components/CodeBlock/CollapsibleCodeBlock.js.map +1 -1
- package/dist/es/components/CodeBlock/index.js +2 -2
- package/dist/es/components/DataTable/DataTable.js +108 -27
- package/dist/es/components/DataTable/DataTable.js.map +1 -1
- package/dist/es/components/DataTable/DataTableColumnHeader.js +2 -2
- package/dist/es/components/DataTable/DataTableColumnHeader.js.map +1 -1
- package/dist/es/components/DataTable/DataTablePagination.js +8 -4
- package/dist/es/components/DataTable/DataTablePagination.js.map +1 -1
- package/dist/es/components/DataTable/columnHelpers.js +3 -3
- package/dist/es/components/DataTable/index.js +4 -4
- package/dist/es/components/DateInput/DateInput.js +21 -13
- package/dist/es/components/DateInput/DateInput.js.map +1 -1
- package/dist/es/components/DateInput/index.js +1 -1
- package/dist/es/components/DatePicker/Calendar.js +136 -32
- package/dist/es/components/DatePicker/Calendar.js.map +1 -1
- package/dist/es/components/DatePicker/DatePicker.js +15 -11
- package/dist/es/components/DatePicker/DatePicker.js.map +1 -1
- package/dist/es/components/DatePicker/index.js +1 -1
- package/dist/es/components/DateRangePicker/Calendar.js +125 -22
- package/dist/es/components/DateRangePicker/Calendar.js.map +1 -1
- package/dist/es/components/DateRangePicker/DateRangePicker.js +10 -9
- package/dist/es/components/DateRangePicker/DateRangePicker.js.map +1 -1
- package/dist/es/components/DateRangePicker/Trigger.js +12 -9
- package/dist/es/components/DateRangePicker/Trigger.js.map +1 -1
- package/dist/es/components/DateRangePicker/index.js +2 -2
- package/dist/es/components/Dialog/Dialog.js +11 -6
- package/dist/es/components/Dialog/Dialog.js.map +1 -1
- package/dist/es/components/Dialog/index.js +1 -1
- package/dist/es/components/Dialog/index.js.map +1 -1
- package/dist/es/components/EmptyMessage/EmptyMessage.js +4 -4
- package/dist/es/components/EmptyMessage/EmptyMessage.js.map +1 -1
- package/dist/es/components/EmptyMessage/index.js +1 -1
- package/dist/es/components/Field/Field.js +22 -7
- package/dist/es/components/Field/Field.js.map +1 -1
- package/dist/es/components/Field/index.js +1 -1
- package/dist/es/components/FieldError/FieldError.js +4 -4
- package/dist/es/components/FieldError/FieldError.js.map +1 -1
- package/dist/es/components/FieldError/index.js +1 -1
- package/dist/es/components/FileUpload/FileUpload.js +12 -9
- package/dist/es/components/FileUpload/FileUpload.js.map +1 -1
- package/dist/es/components/FileUpload/index.js +1 -1
- package/dist/es/components/FloatingLabelInput/FloatingLabelInput.js +31 -4
- package/dist/es/components/FloatingLabelInput/FloatingLabelInput.js.map +1 -1
- package/dist/es/components/FloatingLabelInput/index.js +1 -1
- package/dist/es/components/FloatingLabelSelect/FloatingLabelSelect.js +28 -8
- package/dist/es/components/FloatingLabelSelect/FloatingLabelSelect.js.map +1 -1
- package/dist/es/components/FloatingLabelSelect/index.js +1 -1
- package/dist/es/components/Icon/aliases.js +20 -20
- package/dist/es/components/Icon/index.js +653 -653
- package/dist/es/components/Image/Image.js +19 -7
- package/dist/es/components/Image/Image.js.map +1 -1
- package/dist/es/components/Image/index.js +1 -1
- package/dist/es/components/Indicator/CircularProgress.js +3 -3
- package/dist/es/components/Indicator/CircularProgress.js.map +1 -1
- package/dist/es/components/Indicator/LoadingDots.js +1 -1
- package/dist/es/components/Indicator/LoadingDots.js.map +1 -1
- package/dist/es/components/Indicator/LoadingIndicator.js +2 -2
- package/dist/es/components/Indicator/LoadingIndicator.js.map +1 -1
- package/dist/es/components/Indicator/index.js +3 -3
- package/dist/es/components/Input/Input.js +16 -5
- package/dist/es/components/Input/Input.js.map +1 -1
- package/dist/es/components/Input/index.js +1 -1
- package/dist/es/components/InputGroup/InputGroup.js +60 -0
- package/dist/es/components/InputGroup/InputGroup.js.map +1 -0
- package/dist/es/components/InputGroup/index.js +2 -0
- package/dist/es/components/InputGroup/index.js.map +1 -0
- package/dist/es/components/Kbd/Kbd.js +13 -0
- package/dist/es/components/Kbd/Kbd.js.map +1 -0
- package/dist/es/components/Kbd/index.js +2 -0
- package/dist/es/components/Kbd/index.js.map +1 -0
- package/dist/es/components/Label/Label.js +1 -1
- package/dist/es/components/Label/Label.js.map +1 -1
- package/dist/es/components/Label/index.js +1 -1
- package/dist/es/components/Markdown/Markdown.js +8 -8
- package/dist/es/components/Markdown/Markdown.js.map +1 -1
- package/dist/es/components/Markdown/directives.js +2 -2
- package/dist/es/components/Markdown/index.js +4 -5
- package/dist/es/components/Markdown/index.js.map +1 -1
- package/dist/es/components/MarkdownEditor/MarkdownEditor.js +35 -11
- package/dist/es/components/MarkdownEditor/MarkdownEditor.js.map +1 -1
- package/dist/es/components/MarkdownEditor/index.js +1 -1
- package/dist/es/components/Menu/Menu.js +26 -18
- package/dist/es/components/Menu/Menu.js.map +1 -1
- package/dist/es/components/Menu/index.js +1 -1
- package/dist/es/components/OTPInput/OTPInput.js +51 -34
- package/dist/es/components/OTPInput/OTPInput.js.map +1 -1
- package/dist/es/components/OTPInput/index.js +1 -1
- package/dist/es/components/PlexUIProvider/PlexUIProvider.js +3 -1
- package/dist/es/components/PlexUIProvider/PlexUIProvider.js.map +1 -1
- package/dist/es/components/PlexUIProvider/index.js +1 -1
- package/dist/es/components/PlexUIProvider/internal.js +1 -1
- package/dist/es/components/Popover/Popover.js +7 -7
- package/dist/es/components/Popover/Popover.js.map +1 -1
- package/dist/es/components/Popover/index.js +2 -3
- package/dist/es/components/Popover/index.js.map +1 -1
- package/dist/es/components/Popover/usePopoverController.js +2 -2
- package/dist/es/components/Progress/Progress.js +1 -1
- package/dist/es/components/Progress/Progress.js.map +1 -1
- package/dist/es/components/Progress/index.js +1 -1
- package/dist/es/components/ProgressSteps/ProgressSteps.js +6 -4
- package/dist/es/components/ProgressSteps/ProgressSteps.js.map +1 -1
- package/dist/es/components/ProgressSteps/index.js +1 -1
- package/dist/es/components/RadioGroup/RadioGroup.js +10 -6
- package/dist/es/components/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/es/components/RadioGroup/index.js +1 -1
- package/dist/es/components/SegmentedControl/index.js +1 -1
- package/dist/es/components/Select/Select.js +103 -67
- package/dist/es/components/Select/Select.js.map +1 -1
- package/dist/es/components/Select/index.js +1 -1
- package/dist/es/components/SelectControl/SelectControl.js +10 -5
- package/dist/es/components/SelectControl/SelectControl.js.map +1 -1
- package/dist/es/components/SelectControl/index.js +1 -1
- package/dist/es/components/Separator/Separator.js +1 -1
- package/dist/es/components/Separator/Separator.js.map +1 -1
- package/dist/es/components/Separator/index.js +1 -1
- package/dist/es/components/ShimmerText/ShimmerText.js +1 -1
- package/dist/es/components/ShimmerText/ShimmerText.js.map +1 -1
- package/dist/es/components/ShimmerText/index.js +1 -1
- package/dist/es/components/Sidebar/Sidebar.js +37 -29
- package/dist/es/components/Sidebar/Sidebar.js.map +1 -1
- package/dist/es/components/Sidebar/index.js +2 -2
- package/dist/es/components/Sidebar/useSidebarContext.js +17 -19
- package/dist/es/components/Sidebar/useSidebarContext.js.map +1 -1
- package/dist/es/components/Skeleton/index.js +1 -1
- package/dist/es/components/Skeleton/index.js.map +1 -1
- package/dist/es/components/Slider/Slider.js +48 -19
- package/dist/es/components/Slider/Slider.js.map +1 -1
- package/dist/es/components/Slider/index.js +1 -1
- package/dist/es/components/StatCard/StatCard.js +5 -5
- package/dist/es/components/StatCard/StatCard.js.map +1 -1
- package/dist/es/components/StatCard/index.js +1 -1
- package/dist/es/components/Switch/Switch.js +7 -3
- package/dist/es/components/Switch/Switch.js.map +1 -1
- package/dist/es/components/Switch/index.js +1 -1
- package/dist/es/components/Table/Table.js +1 -1
- package/dist/es/components/Table/Table.js.map +1 -1
- package/dist/es/components/Table/index.js +1 -1
- package/dist/es/components/Tabs/Tabs.js +154 -6
- package/dist/es/components/Tabs/Tabs.js.map +1 -1
- package/dist/es/components/Tabs/index.js +1 -1
- package/dist/es/components/Tabs/overflow.js +44 -0
- package/dist/es/components/Tabs/overflow.js.map +1 -0
- package/dist/es/components/TagInput/TagInput.js +47 -23
- package/dist/es/components/TagInput/TagInput.js.map +1 -1
- package/dist/es/components/TagInput/index.js +1 -1
- package/dist/es/components/TextLink/TextLink.js +16 -5
- package/dist/es/components/TextLink/TextLink.js.map +1 -1
- package/dist/es/components/TextLink/index.js +1 -1
- package/dist/es/components/Textarea/Textarea.js +4 -4
- package/dist/es/components/Textarea/Textarea.js.map +1 -1
- package/dist/es/components/Textarea/index.js +1 -1
- package/dist/es/components/Toast/Toaster.js +2 -2
- package/dist/es/components/Toast/Toaster.js.map +1 -1
- package/dist/es/components/Toast/index.js +1 -1
- package/dist/es/components/Tooltip/CopyTooltip.js +30 -9
- package/dist/es/components/Tooltip/CopyTooltip.js.map +1 -1
- package/dist/es/components/Tooltip/Tooltip.js +3 -3
- package/dist/es/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/es/components/Tooltip/index.js +2 -2
- package/dist/es/components/Transition/Animate.js +4 -4
- package/dist/es/components/Transition/Animate.js.map +1 -1
- package/dist/es/components/Transition/AnimateLayout.js +4 -4
- package/dist/es/components/Transition/AnimateLayout.js.map +1 -1
- package/dist/es/components/Transition/AnimateLayoutGroup.js +12 -8
- package/dist/es/components/Transition/AnimateLayoutGroup.js.map +1 -1
- package/dist/es/components/Transition/SlotTransitionGroup.js +4 -4
- package/dist/es/components/Transition/TransitionGroup.js +5 -5
- package/dist/es/components/Transition/TransitionGroup.js.map +1 -1
- package/dist/es/components/Transition/getDisableAnimations.js +1 -1
- package/dist/es/components/Transition/index.js +5 -5
- package/dist/es/components/Transition/shared.js +7 -5
- package/dist/es/components/Transition/shared.js.map +1 -1
- package/dist/es/components/UIProvider/UIProvider.js +1 -1
- package/dist/es/components/UIProvider/index.js +1 -1
- package/dist/es/components/UIProvider/internal.js +1 -1
- package/dist/es/hooks/useAnimatedScrollTo.js +1 -1
- package/dist/es/hooks/useBreakpoints.js +8 -2
- package/dist/es/hooks/useBreakpoints.js.map +1 -1
- package/dist/es/hooks/useEscCloseStack.js +1 -1
- package/dist/es/hooks/usePrevious.js +7 -5
- package/dist/es/hooks/usePrevious.js.map +1 -1
- package/dist/es/hooks/useTextSelection.js +2 -2
- package/dist/es/hooks/useTrailingValue.js +1 -1
- package/dist/es/lib/constants.js +1 -1
- package/dist/es/lib/helpers.js +1 -1
- package/dist/es/lib/helpers.js.map +1 -1
- package/dist/es/lib/renderHelpers.js +15 -6
- package/dist/es/lib/renderHelpers.js.map +1 -1
- package/dist/es/lib/theme.js +16 -16
- package/dist/es/lib/theme.js.map +1 -1
- package/dist/es/lib/userAgent.js +3 -2
- package/dist/es/lib/userAgent.js.map +1 -1
- package/dist/es/styles/base.css +1 -102
- package/dist/es/styles/globals.css +1 -50
- package/dist/es/styles/index.css +1 -25
- package/dist/es/styles/katex.min.css +1 -1296
- package/dist/es/styles/tailwind-utilities.css +1 -1316
- package/dist/es/styles/variables-components.css +1 -626
- package/dist/es/styles/variables-primitive.css +1 -327
- package/dist/es/styles/variables-semantic.css +1 -609
- package/dist/es/styles/variables-tailwind-theme.css +1 -34
- package/dist/es/styles/variables-tokens-root.css +1 -41
- package/dist/es/types.js +1 -1
- package/dist/es/types.js.map +1 -1
- package/dist/es/vite/index.js +3 -53
- package/dist/es/vite/index.js.map +1 -1
- package/dist/types/components/Accordion/index.d.ts +1 -1
- package/dist/types/components/Alert/Alert.d.ts +8 -2
- package/dist/types/components/Alert/index.d.ts +1 -1
- package/dist/types/components/Avatar/Avatar.d.ts +1 -1
- package/dist/types/components/Avatar/index.d.ts +2 -2
- package/dist/types/components/Badge/index.d.ts +1 -1
- package/dist/types/components/Breadcrumb/Breadcrumb.d.ts +34 -0
- package/dist/types/components/Breadcrumb/index.d.ts +1 -0
- package/dist/types/components/Button/Button.d.ts +3 -3
- package/dist/types/components/Button/CopyButton.d.ts +9 -4
- package/dist/types/components/Button/index.d.ts +2 -2
- package/dist/types/components/ButtonGroup/ButtonGroup.d.ts +4 -3
- package/dist/types/components/ButtonGroup/index.d.ts +1 -1
- package/dist/types/components/Card/index.d.ts +1 -1
- package/dist/types/components/Checkbox/Checkbox.d.ts +3 -1
- package/dist/types/components/Checkbox/index.d.ts +1 -1
- package/dist/types/components/CodeBlock/index.d.ts +2 -2
- package/dist/types/components/DataTable/DataTable.d.ts +3 -2
- package/dist/types/components/DataTable/index.d.ts +4 -4
- package/dist/types/components/DateInput/DateInput.d.ts +1 -1
- package/dist/types/components/DateInput/index.d.ts +1 -1
- package/dist/types/components/DatePicker/DatePicker.d.ts +7 -6
- package/dist/types/components/DatePicker/context.d.ts +1 -1
- package/dist/types/components/DatePicker/index.d.ts +2 -2
- package/dist/types/components/DateRangePicker/Calendar.d.ts +1 -1
- package/dist/types/components/DateRangePicker/DateRangePicker.d.ts +5 -5
- package/dist/types/components/DateRangePicker/context.d.ts +2 -2
- package/dist/types/components/DateRangePicker/index.d.ts +2 -2
- package/dist/types/components/Dialog/Dialog.d.ts +19 -1
- package/dist/types/components/Dialog/index.d.ts +1 -1
- package/dist/types/components/EmptyMessage/EmptyMessage.d.ts +15 -3
- package/dist/types/components/EmptyMessage/index.d.ts +1 -1
- package/dist/types/components/Field/Field.d.ts +14 -4
- package/dist/types/components/Field/index.d.ts +1 -1
- package/dist/types/components/FieldError/FieldError.d.ts +7 -1
- package/dist/types/components/FieldError/index.d.ts +1 -1
- package/dist/types/components/FileUpload/index.d.ts +1 -1
- package/dist/types/components/FloatingLabelInput/index.d.ts +1 -1
- package/dist/types/components/FloatingLabelSelect/index.d.ts +1 -1
- package/dist/types/components/Icon/aliases.d.ts +20 -20
- package/dist/types/components/Icon/index.d.ts +653 -653
- package/dist/types/components/Image/Image.d.ts +1 -1
- package/dist/types/components/Image/index.d.ts +1 -1
- package/dist/types/components/Indicator/index.d.ts +3 -3
- package/dist/types/components/Input/Input.d.ts +2 -2
- package/dist/types/components/Input/index.d.ts +1 -1
- package/dist/types/components/InputGroup/InputGroup.d.ts +78 -0
- package/dist/types/components/InputGroup/index.d.ts +1 -0
- package/dist/types/components/Kbd/Kbd.d.ts +20 -0
- package/dist/types/components/Kbd/index.d.ts +1 -0
- package/dist/types/components/Label/index.d.ts +1 -1
- package/dist/types/components/Markdown/Markdown.d.ts +1 -1
- package/dist/types/components/Markdown/index.d.ts +4 -4
- package/dist/types/components/MarkdownEditor/MarkdownEditor.d.ts +6 -2
- package/dist/types/components/MarkdownEditor/index.d.ts +1 -1
- package/dist/types/components/Menu/Menu.d.ts +11 -3
- package/dist/types/components/Menu/index.d.ts +1 -1
- package/dist/types/components/OTPInput/index.d.ts +1 -1
- package/dist/types/components/PlexUIProvider/PlexUIProvider.d.ts +0 -11
- package/dist/types/components/PlexUIProvider/index.d.ts +1 -1
- package/dist/types/components/Popover/index.d.ts +2 -2
- package/dist/types/components/Progress/index.d.ts +1 -1
- package/dist/types/components/ProgressSteps/ProgressSteps.d.ts +1 -1
- package/dist/types/components/ProgressSteps/index.d.ts +1 -1
- package/dist/types/components/RadioGroup/RadioGroup.d.ts +3 -1
- package/dist/types/components/RadioGroup/index.d.ts +1 -1
- package/dist/types/components/SegmentedControl/index.d.ts +2 -2
- package/dist/types/components/Select/Select.d.ts +8 -1
- package/dist/types/components/Select/index.d.ts +1 -1
- package/dist/types/components/SelectControl/SelectControl.d.ts +1 -1
- package/dist/types/components/SelectControl/index.d.ts +1 -1
- package/dist/types/components/Separator/index.d.ts +1 -1
- package/dist/types/components/ShimmerText/index.d.ts +1 -1
- package/dist/types/components/Sidebar/Sidebar.d.ts +4 -8
- package/dist/types/components/Sidebar/index.d.ts +4 -4
- package/dist/types/components/Slider/Slider.d.ts +8 -0
- package/dist/types/components/Slider/index.d.ts +2 -2
- package/dist/types/components/StatCard/index.d.ts +1 -1
- package/dist/types/components/Switch/index.d.ts +1 -1
- package/dist/types/components/Table/index.d.ts +1 -1
- package/dist/types/components/Tabs/Tabs.d.ts +15 -2
- package/dist/types/components/Tabs/index.d.ts +2 -2
- package/dist/types/components/Tabs/overflow.d.ts +17 -0
- package/dist/types/components/TagInput/TagInput.d.ts +1 -1
- package/dist/types/components/TagInput/index.d.ts +1 -1
- package/dist/types/components/TextLink/index.d.ts +1 -1
- package/dist/types/components/Textarea/Textarea.d.ts +1 -1
- package/dist/types/components/Textarea/index.d.ts +1 -1
- package/dist/types/components/Toast/index.d.ts +1 -1
- package/dist/types/components/Tooltip/CopyTooltip.d.ts +6 -1
- package/dist/types/components/Tooltip/index.d.ts +2 -2
- package/dist/types/components/Transition/Animate.d.ts +2 -2
- package/dist/types/components/Transition/AnimateLayout.d.ts +2 -2
- package/dist/types/components/Transition/AnimateLayoutGroup.d.ts +2 -2
- package/dist/types/components/Transition/SlotTransitionGroup.d.ts +1 -1
- package/dist/types/components/Transition/TransitionGroup.d.ts +1 -1
- package/dist/types/components/Transition/index.d.ts +5 -5
- package/dist/types/components/UIProvider/index.d.ts +1 -1
- package/dist/types/global.d.ts +5 -1
- package/dist/types/lib/constants.d.ts +1 -1
- package/dist/types/lib/helpers.d.ts +4 -4
- package/dist/types/lib/theme.d.ts +1 -1
- package/dist/types/types.d.ts +2 -15
- package/dist/types/vite/index.d.ts +2 -55
- package/package.json +10 -18
- package/dist/es/components/Accordion/Accordion.module.css +0 -89
- package/dist/es/components/Alert/Alert.module.css +0 -187
- package/dist/es/components/Avatar/Avatar.module.css +0 -168
- package/dist/es/components/Avatar/AvatarGroup.module.css +0 -26
- package/dist/es/components/Badge/Badge.module.css +0 -196
- package/dist/es/components/Button/Button.module.css +0 -859
- package/dist/es/components/ButtonGroup/ButtonGroup.module.css +0 -159
- package/dist/es/components/Card/Card.module.css +0 -125
- package/dist/es/components/Checkbox/Checkbox.module.css +0 -198
- package/dist/es/components/CodeBlock/CodeBlock.module.css +0 -137
- package/dist/es/components/DataTable/DataTable.module.css +0 -108
- package/dist/es/components/DatePicker/Calendar.module.css +0 -271
- package/dist/es/components/DateRangePicker/Calendar.module.css +0 -295
- package/dist/es/components/DateRangePicker/Trigger.module.css +0 -25
- package/dist/es/components/Dialog/Dialog.module.css +0 -133
- package/dist/es/components/EmptyMessage/EmptyMessage.module.css +0 -82
- package/dist/es/components/Field/Field.module.css +0 -137
- package/dist/es/components/FieldError/FieldError.module.css +0 -22
- package/dist/es/components/FileUpload/FileUpload.module.css +0 -133
- package/dist/es/components/FloatingLabelInput/FloatingLabelInput.module.css +0 -220
- package/dist/es/components/FloatingLabelSelect/FloatingLabelSelect.module.css +0 -146
- package/dist/es/components/Image/Image.module.css +0 -9
- package/dist/es/components/Indicator/CircularProgress.module.css +0 -28
- package/dist/es/components/Indicator/LoadingDots.module.css +0 -35
- package/dist/es/components/Indicator/LoadingIndicator.module.css +0 -41
- package/dist/es/components/Input/Input.module.css +0 -507
- package/dist/es/components/Label/Label.module.css +0 -16
- package/dist/es/components/Markdown/Markdown.module.css +0 -233
- package/dist/es/components/MarkdownEditor/MarkdownEditor.module.css +0 -297
- package/dist/es/components/Menu/Menu.module.css +0 -377
- package/dist/es/components/OTPInput/OTPInput.module.css +0 -66
- package/dist/es/components/Popover/Popover.module.css +0 -82
- package/dist/es/components/Progress/Progress.module.css +0 -34
- package/dist/es/components/ProgressSteps/ProgressSteps.module.css +0 -246
- package/dist/es/components/RadioGroup/RadioGroup.module.css +0 -137
- package/dist/es/components/Select/Select.module.css +0 -310
- package/dist/es/components/SelectControl/SelectControl.module.css +0 -558
- package/dist/es/components/Separator/Separator.module.css +0 -16
- package/dist/es/components/ShimmerText/ShimmerText.module.css +0 -43
- package/dist/es/components/Sidebar/Sidebar.module.css +0 -909
- package/dist/es/components/Skeleton/Skeleton.module.css +0 -17
- package/dist/es/components/Slider/Slider.module.css +0 -203
- package/dist/es/components/StatCard/StatCard.module.css +0 -234
- package/dist/es/components/Switch/Switch.module.css +0 -121
- package/dist/es/components/Table/Table.module.css +0 -56
- package/dist/es/components/Tabs/Tabs.module.css +0 -672
- package/dist/es/components/TagInput/TagInput.module.css +0 -320
- package/dist/es/components/TextLink/TextLink.module.css +0 -50
- package/dist/es/components/Textarea/Textarea.module.css +0 -272
- package/dist/es/components/Toast/Toast.module.css +0 -84
- package/dist/es/components/Tooltip/Tooltip.module.css +0 -91
- package/dist/es/components/Transition/Animate.module.css +0 -54
- package/dist/es/components/Transition/AnimateLayout.module.css +0 -101
- package/dist/es/components/Transition/AnimateLayoutGroup.module.css +0 -72
- package/dist/es/components/Transition/TransitionGroup.module.css +0 -4
|
@@ -2,11 +2,13 @@
|
|
|
2
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
3
|
import clsx from "clsx";
|
|
4
4
|
import {} from "react";
|
|
5
|
-
import { useLinkComponent } from "../PlexUIProvider/internal";
|
|
6
|
-
import s from "
|
|
5
|
+
import { useLinkComponent } from "../PlexUIProvider/internal.js";
|
|
6
|
+
import s from "@plexui/styles/components/Card/Card.module.css";
|
|
7
7
|
const hasHref = (props) => typeof props.href === "string";
|
|
8
8
|
const CardRoot = (props) => {
|
|
9
9
|
const { variant = "outline", size = "md", interactive, className, } = props;
|
|
10
|
+
// Called unconditionally: hooks may not sit inside the href branch below
|
|
11
|
+
const DefaultLink = useLinkComponent();
|
|
10
12
|
const sharedProps = {
|
|
11
13
|
"className": clsx(s.Card, className),
|
|
12
14
|
"data-variant": variant,
|
|
@@ -16,7 +18,6 @@ const CardRoot = (props) => {
|
|
|
16
18
|
if (hasHref(props)) {
|
|
17
19
|
const { variant: _v, size: _s, interactive: _i, className: _c, href, external, as: OverrideComponent, ref, ...restProps } = props;
|
|
18
20
|
const isExternal = external ?? /^https?:\/\//.test(href);
|
|
19
|
-
const DefaultLink = useLinkComponent();
|
|
20
21
|
const LinkComponent = OverrideComponent || (isExternal ? "a" : DefaultLink);
|
|
21
22
|
const linkAttrs = isExternal
|
|
22
23
|
? { target: "_blank", rel: "noopener noreferrer", href }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../../src/components/Card/Card.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAON,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAA;AAC7D,OAAO,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../../src/components/Card/Card.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport {\n type AnchorHTMLAttributes,\n type ComponentProps,\n type ComponentType,\n type HTMLAttributes,\n type ReactNode,\n type Ref,\n} from \"react\"\nimport { useLinkComponent } from \"../PlexUIProvider/internal\"\nimport s from \"@plexui/styles/components/Card/Card.module.css\"\n\n/* ------------------------------------------------------------------ */\n/* Root */\n/* ------------------------------------------------------------------ */\n\nexport type CardVariant = \"outline\" | \"solid\" | \"ghost\"\nexport type CardSize = \"sm\" | \"md\" | \"lg\"\n\ntype CardCommonProps = {\n /**\n * Visual variant of the card.\n * - `\"outline\"` — 1px border, transparent background (default)\n * - `\"solid\"` — muted background, no border\n * - `\"ghost\"` — no border, no background (hover-only surface)\n * @default \"outline\"\n */\n variant?: CardVariant\n /**\n * Padding scale.\n * @default \"md\"\n */\n size?: CardSize\n /**\n * When true, adds hover/focus affordances. Automatic when `href` is provided.\n * @default false\n */\n interactive?: boolean\n /** Class applied to the card container */\n className?: string\n}\n\nexport type CardDivProps = CardCommonProps &\n Omit<HTMLAttributes<HTMLDivElement>, \"className\"> & {\n ref?: Ref<HTMLDivElement>\n }\n\nexport type CardLinkProps<\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n T extends ComponentType<any> | \"a\" = \"a\",\n> = CardCommonProps &\n Omit<AnchorHTMLAttributes<HTMLAnchorElement>, \"className\" | \"href\"> & {\n /** When provided, the Card renders as a link. */\n href: string\n /** Explicitly flag as external — otherwise detected from `href`. */\n external?: boolean\n /** Override the rendered link component (e.g. next/link). */\n as?: T\n ref?: Ref<HTMLAnchorElement>\n } & ComponentProps<T>\n\nexport type CardProps = CardDivProps | CardLinkProps\n\nconst hasHref = (props: CardProps): props is CardLinkProps =>\n typeof (props as CardLinkProps).href === \"string\"\n\nconst CardRoot = (props: CardProps): ReactNode => {\n const {\n variant = \"outline\",\n size = \"md\",\n interactive,\n className,\n } = props as CardCommonProps\n // Called unconditionally: hooks may not sit inside the href branch below\n const DefaultLink = useLinkComponent()\n\n const sharedProps = {\n \"className\": clsx(s.Card, className),\n \"data-variant\": variant,\n \"data-size\": size,\n \"data-interactive\":\n (interactive || hasHref(props)) ? \"\" : undefined,\n }\n\n if (hasHref(props)) {\n const {\n variant: _v,\n size: _s,\n interactive: _i,\n className: _c,\n href,\n external,\n as: OverrideComponent,\n ref,\n ...restProps\n } = props\n const isExternal = external ?? /^https?:\\/\\//.test(href)\n const LinkComponent = OverrideComponent || (isExternal ? \"a\" : DefaultLink)\n const linkAttrs = isExternal\n ? { target: \"_blank\", rel: \"noopener noreferrer\", href }\n : { href }\n\n return (\n <LinkComponent ref={ref} {...sharedProps} {...linkAttrs} {...restProps} />\n )\n }\n\n const {\n variant: _v,\n size: _s,\n interactive: _i,\n className: _c,\n ref,\n ...restProps\n } = props as CardDivProps\n\n return <div ref={ref} {...sharedProps} {...restProps} />\n}\n\n/* ------------------------------------------------------------------ */\n/* Compound parts */\n/* ------------------------------------------------------------------ */\n\nexport type CardSlotProps = HTMLAttributes<HTMLDivElement> & { ref?: Ref<HTMLDivElement> }\n\nconst CardHeader = ({ className, ref, ...restProps }: CardSlotProps) => (\n <div ref={ref} className={clsx(s.Header, className)} {...restProps} />\n)\n\nconst CardTitle = ({\n className,\n ref,\n ...restProps\n}: HTMLAttributes<HTMLHeadingElement> & { ref?: Ref<HTMLHeadingElement> }) => (\n <h3 ref={ref} className={clsx(s.Title, className)} {...restProps} />\n)\n\nconst CardDescription = ({\n className,\n ref,\n ...restProps\n}: HTMLAttributes<HTMLParagraphElement> & { ref?: Ref<HTMLParagraphElement> }) => (\n <p ref={ref} className={clsx(s.Description, className)} {...restProps} />\n)\n\nconst CardContent = ({ className, ref, ...restProps }: CardSlotProps) => (\n <div ref={ref} className={clsx(s.Content, className)} {...restProps} />\n)\n\nconst CardFooter = ({ className, ref, ...restProps }: CardSlotProps) => (\n <div ref={ref} className={clsx(s.Footer, className)} {...restProps} />\n)\n\nconst CardAction = ({ className, ref, ...restProps }: CardSlotProps) => (\n <div ref={ref} className={clsx(s.Action, className)} {...restProps} />\n)\n\n/* ------------------------------------------------------------------ */\n/* Export — compound API */\n/* ------------------------------------------------------------------ */\n\ntype CardComponent = typeof CardRoot & {\n Header: typeof CardHeader\n Title: typeof CardTitle\n Description: typeof CardDescription\n Content: typeof CardContent\n Footer: typeof CardFooter\n Action: typeof CardAction\n}\n\nexport const Card = CardRoot as CardComponent\nCard.Header = CardHeader\nCard.Title = CardTitle\nCard.Description = CardDescription\nCard.Content = CardContent\nCard.Footer = CardFooter\nCard.Action = CardAction\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { Card, } from "./Card";
|
|
1
|
+
export { Card, } from "./Card.js";
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -3,13 +3,19 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
|
3
3
|
import clsx from "clsx";
|
|
4
4
|
import { Checkbox as RadixCheckbox } from "radix-ui";
|
|
5
5
|
import { useId } from "react";
|
|
6
|
-
import s from "
|
|
7
|
-
export const Checkbox = ({ className, label, id: propsId, disabled, orientation = "left", pill = false, variant = "solid", ...restProps }) => {
|
|
6
|
+
import s from "@plexui/styles/components/Checkbox/Checkbox.module.css";
|
|
7
|
+
export const Checkbox = ({ className, label, description, id: propsId, disabled, orientation = "left", pill = false, variant = "solid", ...restProps }) => {
|
|
8
8
|
const reactId = useId();
|
|
9
9
|
const id = propsId ?? reactId;
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
10
|
+
// The description only renders next to a label; it comes before any ids
|
|
11
|
+
// the caller (a Field, say) passes
|
|
12
|
+
const descriptionId = label && description ? `${id}-label-description` : undefined;
|
|
13
|
+
const ariaDescribedBy = [descriptionId, restProps["aria-describedby"]].filter(Boolean).join(" ") ||
|
|
14
|
+
undefined;
|
|
15
|
+
const labelElement = label && (_jsx("label", { htmlFor: id, className: s.Label, onMouseDown: (event) => {
|
|
16
|
+
if (!event.defaultPrevented && event.detail > 1)
|
|
17
|
+
event.preventDefault();
|
|
18
|
+
}, children: label }));
|
|
19
|
+
return (_jsxs("div", { "data-disabled": disabled ? "" : undefined, "data-has-label": label ? "" : undefined, "data-orientation": orientation, className: clsx(className, s.Container), children: [_jsx(RadixCheckbox.Root, { className: s.Checkbox, id: id, disabled: disabled, "data-pill": pill ? "" : undefined, "data-variant": variant, ...restProps, "aria-describedby": ariaDescribedBy, children: _jsx(RadixCheckbox.Indicator, { className: s.CheckMark }) }), descriptionId ? (_jsxs("div", { className: s.LabelGroup, children: [labelElement, _jsx("span", { id: descriptionId, className: s.Description, children: description })] })) : (labelElement)] }));
|
|
14
20
|
};
|
|
15
21
|
//# sourceMappingURL=Checkbox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,QAAQ,IAAI,aAAa,EAAE,MAAM,UAAU,CAAA;AACpD,OAAO,EAA0C,KAAK,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,QAAQ,IAAI,aAAa,EAAE,MAAM,UAAU,CAAA;AACpD,OAAO,EAA0C,KAAK,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,CAAC,MAAM,wDAAwD,CAAA;AAiDtE,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACvB,SAAS,EACT,KAAK,EACL,WAAW,EACX,EAAE,EAAE,OAAO,EACX,QAAQ,EACR,WAAW,GAAG,MAAM,EACpB,IAAI,GAAG,KAAK,EACZ,OAAO,GAAG,OAAO,EACjB,GAAG,SAAS,EACE,EAAE,EAAE;IAClB,MAAM,OAAO,GAAG,KAAK,EAAE,CAAA;IACvB,MAAM,EAAE,GAAG,OAAO,IAAI,OAAO,CAAA;IAC7B,wEAAwE;IACxE,mCAAmC;IACnC,MAAM,aAAa,GAAG,KAAK,IAAI,WAAW,CAAC,CAAC,CAAC,GAAG,EAAE,oBAAoB,CAAC,CAAC,CAAC,SAAS,CAAA;IAClF,MAAM,eAAe,GACnB,CAAC,aAAa,EAAG,SAA6C,CAAC,kBAAkB,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;QAC7G,SAAS,CAAA;IACX,MAAM,YAAY,GAAG,KAAK,IAAI,CAC5B,gBACE,OAAO,EAAE,EAAE,EACX,SAAS,EAAE,CAAC,CAAC,KAAK,EAClB,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE;YACrB,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC;gBAAE,KAAK,CAAC,cAAc,EAAE,CAAA;QACzE,CAAC,YAEA,KAAK,GACA,CACT,CAAA;IAED,OAAO,CACL,gCACiB,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,oBACxB,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,sBACpB,WAAW,EAC7B,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC,SAAS,CAAC,aAEvC,KAAC,aAAa,CAAC,IAAI,IACjB,SAAS,EAAE,CAAC,CAAC,QAAQ,EACrB,EAAE,EAAE,EAAE,EACN,QAAQ,EAAE,QAAQ,eACP,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,kBAClB,OAAO,KACjB,SAAS,sBACK,eAAe,YAEjC,KAAC,aAAa,CAAC,SAAS,IAAC,SAAS,EAAE,CAAC,CAAC,SAAS,GAAI,GAChC,EACpB,aAAa,CAAC,CAAC,CAAC,CACf,eAAK,SAAS,EAAE,CAAC,CAAC,UAAU,aACzB,YAAY,EACb,eAAM,EAAE,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC,CAAC,WAAW,YAC9C,WAAW,GACP,IACH,CACP,CAAC,CAAC,CAAC,CACF,YAAY,CACb,IACG,CACP,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { Checkbox as RadixCheckbox } from \"radix-ui\"\nimport { type FocusEventHandler, type ReactNode, useId } from \"react\"\nimport s from \"@plexui/styles/components/Checkbox/Checkbox.module.css\"\n\nexport type CheckboxProps = {\n /** The `id` of the checkbox. */\n id?: string\n /** The state of the checkbox when it is initially rendered. Use when you do not need to control its state. */\n defaultChecked?: boolean | \"indeterminate\"\n /** The controlled state of the checkbox. Must be used in conjunction with `onCheckedChange`. */\n checked?: boolean | \"indeterminate\"\n /** Optional accessible label rendered to the right of the checkbox. */\n label?: ReactNode\n /** Optional second line below the label. Linked via `aria-describedby`. */\n description?: ReactNode\n /** Event handler called when the state of the checkbox changes. */\n onCheckedChange?: (nextState: boolean) => void\n /** Event handler called when the checkbox looses focus. */\n onBlur?: FocusEventHandler<HTMLButtonElement>\n /** Event handler called when the checkbox gains focus. */\n onFocus?: FocusEventHandler<HTMLButtonElement>\n /** When `true`, prevents the user from interacting with the checkbox. */\n disabled?: boolean\n /** When `true`, indicates that the user must check the checkbox before the owning form can be submitted. */\n required?: boolean\n /** The name of the checkbox. Submitted with its owning form as part of a name/value pair. */\n name?: string\n /** The value given as data when submitted with a `name`. */\n value?: string\n /** CSS classes applied to wrapper node */\n className?: string\n /**\n * The orientation of the checkbox relative to the label.\n *\n * @default \"left\"\n */\n orientation?: \"left\" | \"right\"\n /**\n * Determines if the checkbox should be a fully rounded pill shape.\n * @default false\n */\n pill?: boolean\n /**\n * Visual style variant for the checkbox indicator.\n * - `\"solid\"` — filled background when checked (default)\n * - `\"ghost\"` — no border or background, checkmark only\n * @default \"solid\"\n */\n variant?: \"solid\" | \"ghost\"\n}\n\nexport const Checkbox = ({\n className,\n label,\n description,\n id: propsId,\n disabled,\n orientation = \"left\",\n pill = false,\n variant = \"solid\",\n ...restProps\n}: CheckboxProps) => {\n const reactId = useId()\n const id = propsId ?? reactId\n // The description only renders next to a label; it comes before any ids\n // the caller (a Field, say) passes\n const descriptionId = label && description ? `${id}-label-description` : undefined\n const ariaDescribedBy =\n [descriptionId, (restProps as { \"aria-describedby\"?: string })[\"aria-describedby\"]].filter(Boolean).join(\" \") ||\n undefined\n const labelElement = label && (\n <label\n htmlFor={id}\n className={s.Label}\n onMouseDown={(event) => {\n if (!event.defaultPrevented && event.detail > 1) event.preventDefault()\n }}\n >\n {label}\n </label>\n )\n\n return (\n <div\n data-disabled={disabled ? \"\" : undefined}\n data-has-label={label ? \"\" : undefined}\n data-orientation={orientation}\n className={clsx(className, s.Container)}\n >\n <RadixCheckbox.Root\n className={s.Checkbox}\n id={id}\n disabled={disabled}\n data-pill={pill ? \"\" : undefined}\n data-variant={variant}\n {...restProps}\n aria-describedby={ariaDescribedBy}\n >\n <RadixCheckbox.Indicator className={s.CheckMark} />\n </RadixCheckbox.Root>\n {descriptionId ? (\n <div className={s.LabelGroup}>\n {labelElement}\n <span id={descriptionId} className={s.Description}>\n {description}\n </span>\n </div>\n ) : (\n labelElement\n )}\n </div>\n )\n}\n"]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export { Checkbox } from "./Checkbox";
|
|
1
|
+
export { Checkbox } from "./Checkbox.js";
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -3,31 +3,31 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
3
3
|
import clsx from "clsx";
|
|
4
4
|
import {} from "react";
|
|
5
5
|
import { createElement, PrismLight as SyntaxHighlighter } from "react-syntax-highlighter";
|
|
6
|
-
import bash from "react-syntax-highlighter/dist/esm/languages/prism/bash";
|
|
7
|
-
import c from "react-syntax-highlighter/dist/esm/languages/prism/c";
|
|
8
|
-
import clike from "react-syntax-highlighter/dist/esm/languages/prism/clike";
|
|
9
|
-
import css from "react-syntax-highlighter/dist/esm/languages/prism/css";
|
|
10
|
-
import diff from "react-syntax-highlighter/dist/esm/languages/prism/diff";
|
|
11
|
-
import docker from "react-syntax-highlighter/dist/esm/languages/prism/docker";
|
|
12
|
-
import go from "react-syntax-highlighter/dist/esm/languages/prism/go";
|
|
13
|
-
import java from "react-syntax-highlighter/dist/esm/languages/prism/java";
|
|
14
|
-
import javascript from "react-syntax-highlighter/dist/esm/languages/prism/javascript";
|
|
15
|
-
import json from "react-syntax-highlighter/dist/esm/languages/prism/json";
|
|
16
|
-
import jsx from "react-syntax-highlighter/dist/esm/languages/prism/jsx";
|
|
17
|
-
import kotlin from "react-syntax-highlighter/dist/esm/languages/prism/kotlin";
|
|
18
|
-
import markdown from "react-syntax-highlighter/dist/esm/languages/prism/markdown";
|
|
19
|
-
import markup from "react-syntax-highlighter/dist/esm/languages/prism/markup";
|
|
20
|
-
import php from "react-syntax-highlighter/dist/esm/languages/prism/php";
|
|
21
|
-
import python from "react-syntax-highlighter/dist/esm/languages/prism/python";
|
|
22
|
-
import ruby from "react-syntax-highlighter/dist/esm/languages/prism/ruby";
|
|
23
|
-
import scss from "react-syntax-highlighter/dist/esm/languages/prism/scss";
|
|
24
|
-
import sql from "react-syntax-highlighter/dist/esm/languages/prism/sql";
|
|
25
|
-
import toml from "react-syntax-highlighter/dist/esm/languages/prism/toml";
|
|
26
|
-
import tsx from "react-syntax-highlighter/dist/esm/languages/prism/tsx";
|
|
27
|
-
import typescript from "react-syntax-highlighter/dist/esm/languages/prism/typescript";
|
|
28
|
-
import yaml from "react-syntax-highlighter/dist/esm/languages/prism/yaml";
|
|
29
|
-
import { CopyButton } from "../Button";
|
|
30
|
-
import s from "
|
|
6
|
+
import bash from "react-syntax-highlighter/dist/esm/languages/prism/bash.js";
|
|
7
|
+
import c from "react-syntax-highlighter/dist/esm/languages/prism/c.js";
|
|
8
|
+
import clike from "react-syntax-highlighter/dist/esm/languages/prism/clike.js";
|
|
9
|
+
import css from "react-syntax-highlighter/dist/esm/languages/prism/css.js";
|
|
10
|
+
import diff from "react-syntax-highlighter/dist/esm/languages/prism/diff.js";
|
|
11
|
+
import docker from "react-syntax-highlighter/dist/esm/languages/prism/docker.js";
|
|
12
|
+
import go from "react-syntax-highlighter/dist/esm/languages/prism/go.js";
|
|
13
|
+
import java from "react-syntax-highlighter/dist/esm/languages/prism/java.js";
|
|
14
|
+
import javascript from "react-syntax-highlighter/dist/esm/languages/prism/javascript.js";
|
|
15
|
+
import json from "react-syntax-highlighter/dist/esm/languages/prism/json.js";
|
|
16
|
+
import jsx from "react-syntax-highlighter/dist/esm/languages/prism/jsx.js";
|
|
17
|
+
import kotlin from "react-syntax-highlighter/dist/esm/languages/prism/kotlin.js";
|
|
18
|
+
import markdown from "react-syntax-highlighter/dist/esm/languages/prism/markdown.js";
|
|
19
|
+
import markup from "react-syntax-highlighter/dist/esm/languages/prism/markup.js";
|
|
20
|
+
import php from "react-syntax-highlighter/dist/esm/languages/prism/php.js";
|
|
21
|
+
import python from "react-syntax-highlighter/dist/esm/languages/prism/python.js";
|
|
22
|
+
import ruby from "react-syntax-highlighter/dist/esm/languages/prism/ruby.js";
|
|
23
|
+
import scss from "react-syntax-highlighter/dist/esm/languages/prism/scss.js";
|
|
24
|
+
import sql from "react-syntax-highlighter/dist/esm/languages/prism/sql.js";
|
|
25
|
+
import toml from "react-syntax-highlighter/dist/esm/languages/prism/toml.js";
|
|
26
|
+
import tsx from "react-syntax-highlighter/dist/esm/languages/prism/tsx.js";
|
|
27
|
+
import typescript from "react-syntax-highlighter/dist/esm/languages/prism/typescript.js";
|
|
28
|
+
import yaml from "react-syntax-highlighter/dist/esm/languages/prism/yaml.js";
|
|
29
|
+
import { CopyButton } from "../Button/index.js";
|
|
30
|
+
import s from "@plexui/styles/components/CodeBlock/CodeBlock.module.css";
|
|
31
31
|
SyntaxHighlighter.registerLanguage("javascript", javascript);
|
|
32
32
|
SyntaxHighlighter.registerLanguage("jsx", jsx);
|
|
33
33
|
SyntaxHighlighter.registerLanguage("typescript", typescript);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CodeBlock.js","sourceRoot":"","sources":["../../../../src/components/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAuB,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAA;AACzF,OAAO,IAAI,MAAM,wDAAwD,CAAA;AACzE,OAAO,CAAC,MAAM,qDAAqD,CAAA;AACnE,OAAO,KAAK,MAAM,yDAAyD,CAAA;AAC3E,OAAO,GAAG,MAAM,uDAAuD,CAAA;AACvE,OAAO,IAAI,MAAM,wDAAwD,CAAA;AACzE,OAAO,MAAM,MAAM,0DAA0D,CAAA;AAC7E,OAAO,EAAE,MAAM,sDAAsD,CAAA;AACrE,OAAO,IAAI,MAAM,wDAAwD,CAAA;AACzE,OAAO,UAAU,MAAM,8DAA8D,CAAA;AACrF,OAAO,IAAI,MAAM,wDAAwD,CAAA;AACzE,OAAO,GAAG,MAAM,uDAAuD,CAAA;AACvE,OAAO,MAAM,MAAM,0DAA0D,CAAA;AAC7E,OAAO,QAAQ,MAAM,4DAA4D,CAAA;AACjF,OAAO,MAAM,MAAM,0DAA0D,CAAA;AAC7E,OAAO,GAAG,MAAM,uDAAuD,CAAA;AACvE,OAAO,MAAM,MAAM,0DAA0D,CAAA;AAC7E,OAAO,IAAI,MAAM,wDAAwD,CAAA;AACzE,OAAO,IAAI,MAAM,wDAAwD,CAAA;AACzE,OAAO,GAAG,MAAM,uDAAuD,CAAA;AACvE,OAAO,IAAI,MAAM,wDAAwD,CAAA;AACzE,OAAO,GAAG,MAAM,uDAAuD,CAAA;AACvE,OAAO,UAAU,MAAM,8DAA8D,CAAA;AACrF,OAAO,IAAI,MAAM,wDAAwD,CAAA;AAEzE,OAAO,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA;AACtC,OAAO,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"CodeBlock.js","sourceRoot":"","sources":["../../../../src/components/CodeBlock/CodeBlock.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { type ComponentProps } from \"react\"\nimport { createElement, PrismLight as SyntaxHighlighter } from \"react-syntax-highlighter\"\nimport bash from \"react-syntax-highlighter/dist/esm/languages/prism/bash\"\nimport c from \"react-syntax-highlighter/dist/esm/languages/prism/c\"\nimport clike from \"react-syntax-highlighter/dist/esm/languages/prism/clike\"\nimport css from \"react-syntax-highlighter/dist/esm/languages/prism/css\"\nimport diff from \"react-syntax-highlighter/dist/esm/languages/prism/diff\"\nimport docker from \"react-syntax-highlighter/dist/esm/languages/prism/docker\"\nimport go from \"react-syntax-highlighter/dist/esm/languages/prism/go\"\nimport java from \"react-syntax-highlighter/dist/esm/languages/prism/java\"\nimport javascript from \"react-syntax-highlighter/dist/esm/languages/prism/javascript\"\nimport json from \"react-syntax-highlighter/dist/esm/languages/prism/json\"\nimport jsx from \"react-syntax-highlighter/dist/esm/languages/prism/jsx\"\nimport kotlin from \"react-syntax-highlighter/dist/esm/languages/prism/kotlin\"\nimport markdown from \"react-syntax-highlighter/dist/esm/languages/prism/markdown\"\nimport markup from \"react-syntax-highlighter/dist/esm/languages/prism/markup\"\nimport php from \"react-syntax-highlighter/dist/esm/languages/prism/php\"\nimport python from \"react-syntax-highlighter/dist/esm/languages/prism/python\"\nimport ruby from \"react-syntax-highlighter/dist/esm/languages/prism/ruby\"\nimport scss from \"react-syntax-highlighter/dist/esm/languages/prism/scss\"\nimport sql from \"react-syntax-highlighter/dist/esm/languages/prism/sql\"\nimport toml from \"react-syntax-highlighter/dist/esm/languages/prism/toml\"\nimport tsx from \"react-syntax-highlighter/dist/esm/languages/prism/tsx\"\nimport typescript from \"react-syntax-highlighter/dist/esm/languages/prism/typescript\"\nimport yaml from \"react-syntax-highlighter/dist/esm/languages/prism/yaml\"\n\nimport { CopyButton } from \"../Button\"\nimport s from \"@plexui/styles/components/CodeBlock/CodeBlock.module.css\"\n\nSyntaxHighlighter.registerLanguage(\"javascript\", javascript)\nSyntaxHighlighter.registerLanguage(\"jsx\", jsx)\nSyntaxHighlighter.registerLanguage(\"typescript\", typescript)\nSyntaxHighlighter.registerLanguage(\"tsx\", tsx)\nSyntaxHighlighter.registerLanguage(\"markup\", markup)\nSyntaxHighlighter.registerLanguage(\"css\", css)\nSyntaxHighlighter.registerLanguage(\"scss\", scss)\nSyntaxHighlighter.registerLanguage(\"c\", c)\nSyntaxHighlighter.registerLanguage(\"clike\", clike)\nSyntaxHighlighter.registerLanguage(\"bash\", bash)\nSyntaxHighlighter.registerLanguage(\"json\", json)\nSyntaxHighlighter.registerLanguage(\"jsonc\", json)\nSyntaxHighlighter.registerLanguage(\"python\", python)\nSyntaxHighlighter.registerLanguage(\"sql\", sql)\nSyntaxHighlighter.registerLanguage(\"diff\", diff)\nSyntaxHighlighter.registerLanguage(\"markdown\", markdown)\nSyntaxHighlighter.registerLanguage(\"yaml\", yaml)\nSyntaxHighlighter.registerLanguage(\"toml\", toml)\nSyntaxHighlighter.registerLanguage(\"docker\", docker)\nSyntaxHighlighter.registerLanguage(\"java\", java)\nSyntaxHighlighter.registerLanguage(\"go\", go)\nSyntaxHighlighter.registerLanguage(\"php\", php)\nSyntaxHighlighter.registerLanguage(\"ruby\", ruby)\nSyntaxHighlighter.registerLanguage(\"kotlin\", kotlin)\n\nexport function CodeBlock({\n children,\n language,\n className,\n}: {\n children: string\n language?: string\n className?: string\n}) {\n return (\n <CodeBlockBase className={className}>\n <CodeBlockBase.Code language={language}>{children}</CodeBlockBase.Code>\n <CodeBlockBase.CopyButton copyValue={children} />\n </CodeBlockBase>\n )\n}\n\nexport function CodeBlockBase({ className, children, ...restProps }: ComponentProps<\"div\">) {\n return (\n <div className={clsx(s.CodeBlock, className)} {...restProps}>\n {children}\n </div>\n )\n}\n\nCodeBlockBase.CopyButton = function CodeBlockCopyButton({\n className,\n copyValue,\n loading,\n disabled,\n}: {\n className?: string\n copyValue: string\n disabled?: boolean\n loading?: boolean\n}) {\n return (\n <div className={clsx(s.CopyButtonContainer, className)}>\n <CopyButton\n copyValue={copyValue}\n variant=\"ghost\"\n color=\"secondary\"\n pill={false}\n size=\"2xs\"\n uniform\n loading={loading}\n disabled={disabled}\n />\n </div>\n )\n}\n\nCodeBlockBase.Code = function CodeBlockCode({\n className,\n children,\n language,\n codeTagProps,\n}: {\n className?: string\n children: string\n language?: string\n codeTagProps?: React.HTMLProps<HTMLElement>\n}) {\n return (\n <SyntaxHighlighter\n className={clsx(s.SyntaxHighlighter, className)}\n language={language}\n showLineNumbers={false}\n showInlineLineNumbers={false}\n useInlineStyles={false}\n codeTagProps={codeTagProps}\n renderer={({ rows }) => {\n return (\n <>\n {rows.map((r, i) =>\n createElement({\n key: i,\n stylesheet: {},\n useInlineStyles: true,\n node: r,\n }),\n )}\n </>\n )\n }}\n >\n {children}\n </SyntaxHighlighter>\n )\n}\n"]}
|
|
@@ -2,16 +2,18 @@
|
|
|
2
2
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import clsx from "clsx";
|
|
4
4
|
import { useState } from "react";
|
|
5
|
-
import { Button } from "../Button";
|
|
6
|
-
import { CodeBlockBase } from "./CodeBlock";
|
|
7
|
-
import s from "
|
|
5
|
+
import { Button } from "../Button/index.js";
|
|
6
|
+
import { CodeBlockBase } from "./CodeBlock.js";
|
|
7
|
+
import s from "@plexui/styles/components/CodeBlock/CodeBlock.module.css";
|
|
8
|
+
// Room for the View Code button, unless `collapsedHeight` is smaller
|
|
9
|
+
const MIN_COLLAPSED_HEIGHT = 140;
|
|
8
10
|
export function CollapsibleCodeBlock({ children, language, defaultExpanded = false, collapsedHeight = 140, maxExpandedHeight, copyable = true, className, }) {
|
|
9
11
|
const [isExpanded, setIsExpanded] = useState(defaultExpanded);
|
|
10
12
|
const containerStyle = isExpanded
|
|
11
13
|
? maxExpandedHeight
|
|
12
14
|
? { maxHeight: maxExpandedHeight }
|
|
13
15
|
: undefined
|
|
14
|
-
: { maxHeight: collapsedHeight };
|
|
16
|
+
: { maxHeight: collapsedHeight, minHeight: Math.min(collapsedHeight, MIN_COLLAPSED_HEIGHT) };
|
|
15
17
|
return (_jsxs(CodeBlockBase, { className: clsx(s.CollapsibleCodeBlock, className), "data-collapsed": !isExpanded ? "" : undefined, style: containerStyle, children: [_jsx(CodeBlockBase.Code, { language: language, children: children }), !isExpanded && (_jsxs(_Fragment, { children: [_jsx("div", { className: s.GradientOverlay }), _jsx("div", { className: s.ViewCodeButtonContainer, children: _jsx(Button, { color: "secondary", variant: "solid", size: "sm", pill: true, onClick: () => setIsExpanded(true), children: "View Code" }) })] })), isExpanded && copyable && _jsx(CodeBlockBase.CopyButton, { copyValue: children })] }));
|
|
16
18
|
}
|
|
17
19
|
//# sourceMappingURL=CollapsibleCodeBlock.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CollapsibleCodeBlock.js","sourceRoot":"","sources":["../../../../src/components/CodeBlock/CollapsibleCodeBlock.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,QAAQ,EAAuB,MAAM,OAAO,CAAA;AAErD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,OAAO,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"CollapsibleCodeBlock.js","sourceRoot":"","sources":["../../../../src/components/CodeBlock/CollapsibleCodeBlock.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,QAAQ,EAAuB,MAAM,OAAO,CAAA;AAErD,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,OAAO,CAAC,MAAM,0DAA0D,CAAA;AAExE,qEAAqE;AACrE,MAAM,oBAAoB,GAAG,GAAG,CAAA;AAmBhC,MAAM,UAAU,oBAAoB,CAAC,EACnC,QAAQ,EACR,QAAQ,EACR,eAAe,GAAG,KAAK,EACvB,eAAe,GAAG,GAAG,EACrB,iBAAiB,EACjB,QAAQ,GAAG,IAAI,EACf,SAAS,GACiB;IAC1B,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,eAAe,CAAC,CAAA;IAE7D,MAAM,cAAc,GAAmC,UAAU;QAC/D,CAAC,CAAC,iBAAiB;YACjB,CAAC,CAAC,EAAE,SAAS,EAAE,iBAAiB,EAAE;YAClC,CAAC,CAAC,SAAS;QACb,CAAC,CAAC,EAAE,SAAS,EAAE,eAAe,EAAE,SAAS,EAAE,IAAI,CAAC,GAAG,CAAC,eAAe,EAAE,oBAAoB,CAAC,EAAE,CAAA;IAE9F,OAAO,CACL,MAAC,aAAa,IACZ,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,oBAAoB,EAAE,SAAS,CAAC,oBAClC,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EAC5C,KAAK,EAAE,cAAc,aAErB,KAAC,aAAa,CAAC,IAAI,IAAC,QAAQ,EAAE,QAAQ,YAAG,QAAQ,GAAsB,EAEtE,CAAC,UAAU,IAAI,CACd,8BACE,cAAK,SAAS,EAAE,CAAC,CAAC,eAAe,GAAI,EACrC,cAAK,SAAS,EAAE,CAAC,CAAC,uBAAuB,YACvC,KAAC,MAAM,IACL,KAAK,EAAC,WAAW,EACjB,OAAO,EAAC,OAAO,EACf,IAAI,EAAC,IAAI,EACT,IAAI,QACJ,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,0BAG3B,GACL,IACL,CACJ,EAEA,UAAU,IAAI,QAAQ,IAAI,KAAC,aAAa,CAAC,UAAU,IAAC,SAAS,EAAE,QAAQ,GAAI,IAC9D,CACjB,CAAA;AACH,CAAC","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { useState, type ComponentProps } from \"react\"\n\nimport { Button } from \"../Button\"\nimport { CodeBlockBase } from \"./CodeBlock\"\nimport s from \"@plexui/styles/components/CodeBlock/CodeBlock.module.css\"\n\n// Room for the View Code button, unless `collapsedHeight` is smaller\nconst MIN_COLLAPSED_HEIGHT = 140\n\nexport type CollapsibleCodeBlockProps = {\n /** The code string to display */\n children: string\n /** Syntax highlighting language */\n language?: string\n /** Whether the code block starts expanded */\n defaultExpanded?: boolean\n /** Height of the collapsed container in pixels */\n collapsedHeight?: number\n /** Maximum height when expanded (enables scroll if exceeded) */\n maxExpandedHeight?: number\n /** Whether to show the copy button when expanded */\n copyable?: boolean\n /** Additional class name for the container */\n className?: string\n}\n\nexport function CollapsibleCodeBlock({\n children,\n language,\n defaultExpanded = false,\n collapsedHeight = 140,\n maxExpandedHeight,\n copyable = true,\n className,\n}: CollapsibleCodeBlockProps) {\n const [isExpanded, setIsExpanded] = useState(defaultExpanded)\n\n const containerStyle: ComponentProps<\"div\">[\"style\"] = isExpanded\n ? maxExpandedHeight\n ? { maxHeight: maxExpandedHeight }\n : undefined\n : { maxHeight: collapsedHeight, minHeight: Math.min(collapsedHeight, MIN_COLLAPSED_HEIGHT) }\n\n return (\n <CodeBlockBase\n className={clsx(s.CollapsibleCodeBlock, className)}\n data-collapsed={!isExpanded ? \"\" : undefined}\n style={containerStyle}\n >\n <CodeBlockBase.Code language={language}>{children}</CodeBlockBase.Code>\n\n {!isExpanded && (\n <>\n <div className={s.GradientOverlay} />\n <div className={s.ViewCodeButtonContainer}>\n <Button\n color=\"secondary\"\n variant=\"solid\"\n size=\"sm\"\n pill\n onClick={() => setIsExpanded(true)}\n >\n View Code\n </Button>\n </div>\n </>\n )}\n\n {isExpanded && copyable && <CodeBlockBase.CopyButton copyValue={children} />}\n </CodeBlockBase>\n )\n}\n"]}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { CodeBlock, CodeBlockBase } from "./CodeBlock";
|
|
2
|
-
export { CollapsibleCodeBlock } from "./CollapsibleCodeBlock";
|
|
1
|
+
export { CodeBlock, CodeBlockBase } from "./CodeBlock.js";
|
|
2
|
+
export { CollapsibleCodeBlock } from "./CollapsibleCodeBlock.js";
|
|
3
3
|
//# sourceMappingURL=index.js.map
|
|
@@ -2,39 +2,72 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { flexRender, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable, } from "@tanstack/react-table";
|
|
4
4
|
import clsx from "clsx";
|
|
5
|
-
import { useState } from "react";
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import
|
|
5
|
+
import { useEffect, useMemo, useRef, useState } from "react";
|
|
6
|
+
import { Checkbox } from "../Checkbox/index.js";
|
|
7
|
+
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../Table/index.js";
|
|
8
|
+
import { DataTablePagination } from "./DataTablePagination.js";
|
|
9
|
+
import s from "@plexui/styles/components/DataTable/DataTable.module.css";
|
|
10
|
+
// Id of the checkbox column `enableRowSelection` puts before the columns
|
|
11
|
+
const SELECT_COLUMN_ID = "select";
|
|
12
|
+
const selectColumn = {
|
|
13
|
+
id: SELECT_COLUMN_ID,
|
|
14
|
+
header: ({ table }) => (_jsx(Checkbox, { "aria-label": "Select all rows", checked: table.getIsAllRowsSelected() ? true : table.getIsSomeRowsSelected() ? "indeterminate" : false, onCheckedChange: (checked) => table.toggleAllRowsSelected(checked) })),
|
|
15
|
+
cell: ({ row }) => (_jsx(Checkbox, { "aria-label": "Select row", checked: row.getIsSelected(), onCheckedChange: (checked) => row.toggleSelected(checked) })),
|
|
16
|
+
enableHiding: false,
|
|
17
|
+
};
|
|
9
18
|
const resolveUpdater = (updater, value) => {
|
|
10
19
|
return typeof updater === "function" ? updater(value) : updater;
|
|
11
20
|
};
|
|
21
|
+
// One piece of table state: controlled when `controlled` is defined, otherwise
|
|
22
|
+
// held here, with `onChange` as a notification either way. Successive
|
|
23
|
+
// updaters build on each other instead of on the value captured at render.
|
|
24
|
+
const useTableState = (controlled, initial, onChange) => {
|
|
25
|
+
const [internal, setInternal] = useState(initial);
|
|
26
|
+
const value = controlled ?? internal;
|
|
27
|
+
// Uncontrolled: only this handler writes the state, so the last value it set
|
|
28
|
+
// is current even before React renders it (also across awaits)
|
|
29
|
+
const latestInternal = useRef(internal);
|
|
30
|
+
// Controlled: the parent may reject or rewrite a change, so accumulate only
|
|
31
|
+
// within one batch and start every new batch from the current prop
|
|
32
|
+
const batch = useRef(null);
|
|
33
|
+
const handleChange = (updater) => {
|
|
34
|
+
let next;
|
|
35
|
+
if (controlled === undefined) {
|
|
36
|
+
next = resolveUpdater(updater, latestInternal.current);
|
|
37
|
+
latestInternal.current = next;
|
|
38
|
+
setInternal(next);
|
|
39
|
+
}
|
|
40
|
+
else {
|
|
41
|
+
const pending = batch.current;
|
|
42
|
+
const previous = pending && pending.base === controlled ? pending.next : controlled;
|
|
43
|
+
next = resolveUpdater(updater, previous);
|
|
44
|
+
if (!pending) {
|
|
45
|
+
queueMicrotask(() => {
|
|
46
|
+
batch.current = null;
|
|
47
|
+
});
|
|
48
|
+
}
|
|
49
|
+
batch.current = { base: controlled, next };
|
|
50
|
+
}
|
|
51
|
+
onChange?.(next);
|
|
52
|
+
};
|
|
53
|
+
return [value, handleChange];
|
|
54
|
+
};
|
|
12
55
|
export const DataTable = ({ columns, data, variant = "default", globalFilter, onGlobalFilterChange, onRowClick, pageSize = 10, initialSorting, columnVisibility, onColumnVisibilityChange, enableRowSelection = false, rowSelection, onRowSelectionChange, getRowId, emptyMessage = "No results.", className, showPagination = true, }) => {
|
|
13
56
|
const [sorting, setSorting] = useState(initialSorting ?? []);
|
|
14
57
|
const shouldPaginate = Number.isFinite(pageSize) && pageSize > 0;
|
|
15
|
-
const handleGlobalFilterChange = onGlobalFilterChange
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
const handleColumnVisibilityChange = onColumnVisibilityChange
|
|
21
|
-
? (updater) => {
|
|
22
|
-
onColumnVisibilityChange(resolveUpdater(updater, columnVisibility ?? {}));
|
|
23
|
-
}
|
|
24
|
-
: undefined;
|
|
25
|
-
const handleRowSelectionChange = onRowSelectionChange
|
|
26
|
-
? (updater) => {
|
|
27
|
-
onRowSelectionChange(resolveUpdater(updater, rowSelection ?? {}));
|
|
28
|
-
}
|
|
29
|
-
: undefined;
|
|
58
|
+
const [effectiveGlobalFilter, handleGlobalFilterChange] = useTableState(globalFilter, "", onGlobalFilterChange);
|
|
59
|
+
const [effectiveColumnVisibility, handleColumnVisibilityChange] = useTableState(columnVisibility, {}, onColumnVisibilityChange);
|
|
60
|
+
const [effectiveRowSelection, handleRowSelectionChange] = useTableState(rowSelection, {}, onRowSelectionChange);
|
|
61
|
+
const tableColumns = useMemo(() => (enableRowSelection ? [selectColumn, ...columns] : columns), [columns, enableRowSelection]);
|
|
62
|
+
const isSelectColumn = (id) => enableRowSelection && id === SELECT_COLUMN_ID;
|
|
30
63
|
const table = useReactTable({
|
|
31
64
|
data,
|
|
32
|
-
columns,
|
|
65
|
+
columns: tableColumns,
|
|
33
66
|
state: {
|
|
34
67
|
sorting,
|
|
35
|
-
globalFilter,
|
|
36
|
-
columnVisibility,
|
|
37
|
-
rowSelection,
|
|
68
|
+
globalFilter: effectiveGlobalFilter,
|
|
69
|
+
columnVisibility: effectiveColumnVisibility,
|
|
70
|
+
rowSelection: effectiveRowSelection,
|
|
38
71
|
},
|
|
39
72
|
...(shouldPaginate ? { initialState: { pagination: { pageIndex: 0, pageSize } } } : {}),
|
|
40
73
|
onSortingChange: setSorting,
|
|
@@ -46,20 +79,68 @@ export const DataTable = ({ columns, data, variant = "default", globalFilter, on
|
|
|
46
79
|
getCoreRowModel: getCoreRowModel(),
|
|
47
80
|
getSortedRowModel: getSortedRowModel(),
|
|
48
81
|
getFilteredRowModel: getFilteredRowModel(),
|
|
82
|
+
// TanStack keeps its pagination model once created and merges options
|
|
83
|
+
// across renders, so a disabled pageSize (0 or Infinity) switches
|
|
84
|
+
// pagination off explicitly, and back on, on every render
|
|
85
|
+
manualPagination: !shouldPaginate,
|
|
49
86
|
...(shouldPaginate ? { getPaginationRowModel: getPaginationRowModel() } : {}),
|
|
50
87
|
});
|
|
88
|
+
// pageSize only seeds initialState, so apply later prop changes to the table
|
|
89
|
+
const appliedPageSize = useRef(pageSize);
|
|
90
|
+
useEffect(() => {
|
|
91
|
+
const previous = appliedPageSize.current;
|
|
92
|
+
if (previous === pageSize) {
|
|
93
|
+
return;
|
|
94
|
+
}
|
|
95
|
+
appliedPageSize.current = pageSize;
|
|
96
|
+
if (!shouldPaginate) {
|
|
97
|
+
return;
|
|
98
|
+
}
|
|
99
|
+
if (Number.isFinite(previous) && previous > 0) {
|
|
100
|
+
table.setPageSize(pageSize);
|
|
101
|
+
}
|
|
102
|
+
else {
|
|
103
|
+
// Page index is not auto-reset while pagination is off (filters may have
|
|
104
|
+
// changed since), so start over from the first page
|
|
105
|
+
table.setPagination({ pageIndex: 0, pageSize });
|
|
106
|
+
}
|
|
107
|
+
}, [table, pageSize, shouldPaginate]);
|
|
51
108
|
const rows = table.getRowModel().rows;
|
|
52
109
|
const totalRows = table.getFilteredRowModel().rows.length;
|
|
53
|
-
|
|
110
|
+
// Hidden only when every row fits on one page, both at the configured page
|
|
111
|
+
// size and at the one picked in the rows-per-page select
|
|
112
|
+
const hasPagination = shouldPaginate && totalRows > Math.min(pageSize, table.getState().pagination.pageSize);
|
|
54
113
|
const visibleColumnCount = Math.max(table.getVisibleLeafColumns().length, 1);
|
|
55
114
|
return (_jsxs("div", { className: clsx(s.DataTable, className), "data-variant": variant, "data-clickable": onRowClick ? "" : undefined, children: [_jsx("div", { className: s.TableContainer, children: _jsxs(Table, { children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => (_jsx(TableRow, { children: headerGroup.headers.map((header) => {
|
|
56
115
|
const align = header.column.columnDef.meta?.align;
|
|
57
|
-
|
|
116
|
+
// aria-sort goes on one header at a time: the primary sort
|
|
117
|
+
// column's real header, not its group placeholders
|
|
118
|
+
const sorted = !header.isPlaceholder && header.column.getSortIndex() === 0
|
|
119
|
+
? header.column.getIsSorted()
|
|
120
|
+
: false;
|
|
121
|
+
return (_jsx(TableHead, { colSpan: header.colSpan > 1 ? header.colSpan : undefined, className: isSelectColumn(header.column.id) ? s.SelectColumn : undefined, style: align ? { textAlign: align } : undefined, "aria-sort": sorted === "asc" ? "ascending" : sorted === "desc" ? "descending" : undefined, children: header.isPlaceholder
|
|
58
122
|
? null
|
|
59
123
|
: flexRender(header.column.columnDef.header, header.getContext()) }, header.id));
|
|
60
|
-
}) }, headerGroup.id))) }), _jsx(TableBody, { children: rows.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: visibleColumnCount, className: s.EmptyCell, children: emptyMessage }) })) : (rows.map((row) => (_jsx(TableRow, {
|
|
124
|
+
}) }, headerGroup.id))) }), _jsx(TableBody, { children: rows.length === 0 ? (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: visibleColumnCount, className: s.EmptyCell, children: emptyMessage }) })) : (rows.map((row) => (_jsx(TableRow, {
|
|
125
|
+
// Clickable rows are reached with Tab and activated with
|
|
126
|
+
// Enter or Space, like a button
|
|
127
|
+
tabIndex: onRowClick ? 0 : undefined, onClick: onRowClick ? () => onRowClick(row.original) : undefined, onKeyDown: onRowClick
|
|
128
|
+
? (event) => {
|
|
129
|
+
// Keys on a control inside the row are the control's
|
|
130
|
+
if (event.target !== event.currentTarget)
|
|
131
|
+
return;
|
|
132
|
+
if (event.key !== "Enter" && event.key !== " ")
|
|
133
|
+
return;
|
|
134
|
+
event.preventDefault();
|
|
135
|
+
onRowClick(row.original);
|
|
136
|
+
}
|
|
137
|
+
: undefined, children: row.getVisibleCells().map((cell) => {
|
|
61
138
|
const align = cell.column.columnDef.meta?.align;
|
|
62
|
-
return (_jsx(TableCell, { style: align ? { textAlign: align } : undefined,
|
|
139
|
+
return (_jsx(TableCell, { style: align ? { textAlign: align } : undefined,
|
|
140
|
+
// A click on a selection checkbox is not a row click
|
|
141
|
+
onClick: onRowClick && isSelectColumn(cell.column.id)
|
|
142
|
+
? (event) => event.stopPropagation()
|
|
143
|
+
: undefined, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
|
|
63
144
|
}) }, row.id)))) })] }) }), showPagination && hasPagination && _jsx(DataTablePagination, { table: table })] }));
|
|
64
145
|
};
|
|
65
146
|
//# sourceMappingURL=DataTable.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport {\n flexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n type ColumnDef,\n type OnChangeFn,\n type RowData,\n type RowSelectionState,\n type SortingState,\n type Updater,\n type VisibilityState,\n} from \"@tanstack/react-table\"\n\ndeclare module \"@tanstack/react-table\" {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n interface ColumnMeta<TData extends RowData, TValue> {\n align?: \"left\" | \"center\" | \"right\"\n }\n}\nimport clsx from \"clsx\"\nimport { useState, type ReactNode } from \"react\"\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from \"../Table\"\nimport { DataTablePagination } from \"./DataTablePagination\"\nimport s from \"./DataTable.module.css\"\n\nexport type DataTableProps<TData> = {\n /** Column definitions following TanStack Table v8 ColumnDef API */\n columns: ColumnDef<TData, unknown>[]\n /** Data array to display */\n data: TData[]\n /** Visual variant\n * - `\"default\"` — borderless table with transparent header\n * - `\"bordered\"` — rounded border around the table with a tinted header background\n * @default \"default\"\n */\n variant?: \"default\" | \"bordered\"\n /** External search/filter string (controlled) */\n globalFilter?: string\n /** Callback when global filter changes */\n onGlobalFilterChange?: (value: string) => void\n /** Click handler for rows */\n onRowClick?: (row: TData) => void\n /** Number of rows per page. Set to 0 or Infinity to disable pagination.\n * @default 10\n */\n pageSize?: number\n /** Initial sorting state */\n initialSorting?: SortingState\n /** Controlled column visibility */\n columnVisibility?: VisibilityState\n /** Callback when column visibility changes */\n onColumnVisibilityChange?: (visibility: VisibilityState) => void\n /** Enable row selection checkboxes\n * @default false\n */\n enableRowSelection?: boolean\n /** Controlled row selection state */\n rowSelection?: RowSelectionState\n /** Callback when row selection changes */\n onRowSelectionChange?: (selection: RowSelectionState) => void\n /** Custom row ID accessor */\n getRowId?: (row: TData) => string\n /** Message shown when there are no rows\n * @default \"No results.\"\n */\n emptyMessage?: ReactNode\n /** Class applied to the outermost wrapper */\n className?: string\n /** Whether to show pagination controls. Auto-hidden when all rows fit.\n * @default true\n */\n showPagination?: boolean\n}\n\nconst resolveUpdater = <T,>(updater: Updater<T>, value: T): T => {\n return typeof updater === \"function\" ? (updater as (old: T) => T)(value) : updater\n}\n\nexport const DataTable = <TData,>({\n columns,\n data,\n variant = \"default\",\n globalFilter,\n onGlobalFilterChange,\n onRowClick,\n pageSize = 10,\n initialSorting,\n columnVisibility,\n onColumnVisibilityChange,\n enableRowSelection = false,\n rowSelection,\n onRowSelectionChange,\n getRowId,\n emptyMessage = \"No results.\",\n className,\n showPagination = true,\n}: DataTableProps<TData>) => {\n const [sorting, setSorting] = useState<SortingState>(initialSorting ?? [])\n\n const shouldPaginate = Number.isFinite(pageSize) && pageSize > 0\n\n const handleGlobalFilterChange: OnChangeFn<string> | undefined = onGlobalFilterChange\n ? (updater) => {\n onGlobalFilterChange(resolveUpdater(updater, globalFilter ?? \"\"))\n }\n : undefined\n\n const handleColumnVisibilityChange: OnChangeFn<VisibilityState> | undefined =\n onColumnVisibilityChange\n ? (updater) => {\n onColumnVisibilityChange(resolveUpdater(updater, columnVisibility ?? {}))\n }\n : undefined\n\n const handleRowSelectionChange: OnChangeFn<RowSelectionState> | undefined = onRowSelectionChange\n ? (updater) => {\n onRowSelectionChange(resolveUpdater(updater, rowSelection ?? {}))\n }\n : undefined\n\n const table = useReactTable({\n data,\n columns,\n state: {\n sorting,\n globalFilter,\n columnVisibility,\n rowSelection,\n },\n ...(shouldPaginate ? { initialState: { pagination: { pageIndex: 0, pageSize } } } : {}),\n onSortingChange: setSorting,\n onGlobalFilterChange: handleGlobalFilterChange,\n onColumnVisibilityChange: handleColumnVisibilityChange,\n onRowSelectionChange: handleRowSelectionChange,\n getRowId: getRowId ? (originalRow) => getRowId(originalRow) : undefined,\n enableRowSelection,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n ...(shouldPaginate ? { getPaginationRowModel: getPaginationRowModel() } : {}),\n })\n\n const rows = table.getRowModel().rows\n const totalRows = table.getFilteredRowModel().rows.length\n const hasPagination = shouldPaginate && totalRows > pageSize\n const visibleColumnCount = Math.max(table.getVisibleLeafColumns().length, 1)\n\n return (\n <div\n className={clsx(s.DataTable, className)}\n data-variant={variant}\n data-clickable={onRowClick ? \"\" : undefined}\n >\n <div className={s.TableContainer}>\n <Table>\n <TableHeader>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n const align = header.column.columnDef.meta?.align\n return (\n <TableHead key={header.id} style={align ? { textAlign: align } : undefined}>\n {header.isPlaceholder\n ? null\n : flexRender(header.column.columnDef.header, header.getContext())}\n </TableHead>\n )\n })}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {rows.length === 0 ? (\n <TableRow>\n <TableCell colSpan={visibleColumnCount} className={s.EmptyCell}>\n {emptyMessage}\n </TableCell>\n </TableRow>\n ) : (\n rows.map((row) => (\n <TableRow\n key={row.id}\n onClick={onRowClick ? () => onRowClick(row.original) : undefined}\n >\n {row.getVisibleCells().map((cell) => {\n const align = cell.column.columnDef.meta?.align\n return (\n <TableCell key={cell.id} style={align ? { textAlign: align } : undefined}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableCell>\n )\n })}\n </TableRow>\n ))\n )}\n </TableBody>\n </Table>\n </div>\n {showPagination && hasPagination && <DataTablePagination table={table} />}\n </div>\n )\n}\n"]}
|
|
1
|
+
{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../../src/components/DataTable/DataTable.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport {\n flexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useReactTable,\n type ColumnDef,\n type OnChangeFn,\n type RowData,\n type RowSelectionState,\n type SortingState,\n type Updater,\n type VisibilityState,\n} from \"@tanstack/react-table\"\n\n// Augments table-core, which @tanstack/react-table re-exports: @plexui/vue\n// augments the same module, so both declarations merge when a project\n// type-checks the two packages together\ndeclare module \"@tanstack/table-core\" {\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n interface ColumnMeta<TData extends RowData, TValue> {\n align?: \"left\" | \"center\" | \"right\"\n }\n}\nimport clsx from \"clsx\"\nimport { useEffect, useMemo, useRef, useState, type ReactNode } from \"react\"\nimport { Checkbox } from \"../Checkbox\"\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from \"../Table\"\nimport { DataTablePagination } from \"./DataTablePagination\"\nimport s from \"@plexui/styles/components/DataTable/DataTable.module.css\"\n\nexport type DataTableProps<TData> = {\n /** Column definitions following TanStack Table v8 ColumnDef API */\n columns: ColumnDef<TData, unknown>[]\n /** Data array to display */\n data: TData[]\n /** Visual variant\n * - `\"default\"` — borderless table with transparent header\n * - `\"bordered\"` — rounded border around the table with a tinted header background\n * @default \"default\"\n */\n variant?: \"default\" | \"bordered\"\n /** External search/filter string (controlled) */\n globalFilter?: string\n /** Callback when global filter changes */\n onGlobalFilterChange?: (value: string) => void\n /** Click handler for rows */\n onRowClick?: (row: TData) => void\n /** Number of rows per page. Set to 0 or Infinity to disable pagination.\n * @default 10\n */\n pageSize?: number\n /** Initial sorting state */\n initialSorting?: SortingState\n /** Controlled column visibility */\n columnVisibility?: VisibilityState\n /** Callback when column visibility changes */\n onColumnVisibilityChange?: (visibility: VisibilityState) => void\n /** Enable row selection: adds a first column with a checkbox per row and a\n * header checkbox that selects every row\n * @default false\n */\n enableRowSelection?: boolean\n /** Controlled row selection state */\n rowSelection?: RowSelectionState\n /** Callback when row selection changes */\n onRowSelectionChange?: (selection: RowSelectionState) => void\n /** Custom row ID accessor */\n getRowId?: (row: TData) => string\n /** Message shown when there are no rows\n * @default \"No results.\"\n */\n emptyMessage?: ReactNode\n /** Class applied to the outermost wrapper */\n className?: string\n /** Whether to show pagination controls. Auto-hidden when all rows fit.\n * @default true\n */\n showPagination?: boolean\n}\n\n// Id of the checkbox column `enableRowSelection` puts before the columns\nconst SELECT_COLUMN_ID = \"select\"\n\nconst selectColumn: ColumnDef<unknown, unknown> = {\n id: SELECT_COLUMN_ID,\n header: ({ table }) => (\n <Checkbox\n aria-label=\"Select all rows\"\n checked={\n table.getIsAllRowsSelected() ? true : table.getIsSomeRowsSelected() ? \"indeterminate\" : false\n }\n onCheckedChange={(checked) => table.toggleAllRowsSelected(checked)}\n />\n ),\n cell: ({ row }) => (\n <Checkbox\n aria-label=\"Select row\"\n checked={row.getIsSelected()}\n onCheckedChange={(checked) => row.toggleSelected(checked)}\n />\n ),\n enableHiding: false,\n}\n\nconst resolveUpdater = <T,>(updater: Updater<T>, value: T): T => {\n return typeof updater === \"function\" ? (updater as (old: T) => T)(value) : updater\n}\n\n// One piece of table state: controlled when `controlled` is defined, otherwise\n// held here, with `onChange` as a notification either way. Successive\n// updaters build on each other instead of on the value captured at render.\nconst useTableState = <T,>(\n controlled: T | undefined,\n initial: T,\n onChange: ((next: T) => void) | undefined,\n): [T, OnChangeFn<T>] => {\n const [internal, setInternal] = useState<T>(initial)\n const value = controlled ?? internal\n // Uncontrolled: only this handler writes the state, so the last value it set\n // is current even before React renders it (also across awaits)\n const latestInternal = useRef(internal)\n // Controlled: the parent may reject or rewrite a change, so accumulate only\n // within one batch and start every new batch from the current prop\n const batch = useRef<{ base: T; next: T } | null>(null)\n\n const handleChange: OnChangeFn<T> = (updater) => {\n let next: T\n if (controlled === undefined) {\n next = resolveUpdater(updater, latestInternal.current)\n latestInternal.current = next\n setInternal(next)\n } else {\n const pending = batch.current\n const previous = pending && pending.base === controlled ? pending.next : controlled\n next = resolveUpdater(updater, previous)\n if (!pending) {\n queueMicrotask(() => {\n batch.current = null\n })\n }\n batch.current = { base: controlled, next }\n }\n onChange?.(next)\n }\n\n return [value, handleChange]\n}\n\nexport const DataTable = <TData,>({\n columns,\n data,\n variant = \"default\",\n globalFilter,\n onGlobalFilterChange,\n onRowClick,\n pageSize = 10,\n initialSorting,\n columnVisibility,\n onColumnVisibilityChange,\n enableRowSelection = false,\n rowSelection,\n onRowSelectionChange,\n getRowId,\n emptyMessage = \"No results.\",\n className,\n showPagination = true,\n}: DataTableProps<TData>) => {\n const [sorting, setSorting] = useState<SortingState>(initialSorting ?? [])\n\n const shouldPaginate = Number.isFinite(pageSize) && pageSize > 0\n\n const [effectiveGlobalFilter, handleGlobalFilterChange] = useTableState(\n globalFilter,\n \"\",\n onGlobalFilterChange,\n )\n const [effectiveColumnVisibility, handleColumnVisibilityChange] =\n useTableState<VisibilityState>(columnVisibility, {}, onColumnVisibilityChange)\n const [effectiveRowSelection, handleRowSelectionChange] = useTableState<RowSelectionState>(\n rowSelection,\n {},\n onRowSelectionChange,\n )\n\n const tableColumns = useMemo(\n () => (enableRowSelection ? [selectColumn as ColumnDef<TData, unknown>, ...columns] : columns),\n [columns, enableRowSelection],\n )\n const isSelectColumn = (id: string) => enableRowSelection && id === SELECT_COLUMN_ID\n\n const table = useReactTable({\n data,\n columns: tableColumns,\n state: {\n sorting,\n globalFilter: effectiveGlobalFilter,\n columnVisibility: effectiveColumnVisibility,\n rowSelection: effectiveRowSelection,\n },\n ...(shouldPaginate ? { initialState: { pagination: { pageIndex: 0, pageSize } } } : {}),\n onSortingChange: setSorting,\n onGlobalFilterChange: handleGlobalFilterChange,\n onColumnVisibilityChange: handleColumnVisibilityChange,\n onRowSelectionChange: handleRowSelectionChange,\n getRowId: getRowId ? (originalRow) => getRowId(originalRow) : undefined,\n enableRowSelection,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n // TanStack keeps its pagination model once created and merges options\n // across renders, so a disabled pageSize (0 or Infinity) switches\n // pagination off explicitly, and back on, on every render\n manualPagination: !shouldPaginate,\n ...(shouldPaginate ? { getPaginationRowModel: getPaginationRowModel() } : {}),\n })\n\n // pageSize only seeds initialState, so apply later prop changes to the table\n const appliedPageSize = useRef(pageSize)\n useEffect(() => {\n const previous = appliedPageSize.current\n if (previous === pageSize) {\n return\n }\n appliedPageSize.current = pageSize\n if (!shouldPaginate) {\n return\n }\n if (Number.isFinite(previous) && previous > 0) {\n table.setPageSize(pageSize)\n } else {\n // Page index is not auto-reset while pagination is off (filters may have\n // changed since), so start over from the first page\n table.setPagination({ pageIndex: 0, pageSize })\n }\n }, [table, pageSize, shouldPaginate])\n\n const rows = table.getRowModel().rows\n const totalRows = table.getFilteredRowModel().rows.length\n // Hidden only when every row fits on one page, both at the configured page\n // size and at the one picked in the rows-per-page select\n const hasPagination =\n shouldPaginate && totalRows > Math.min(pageSize, table.getState().pagination.pageSize)\n const visibleColumnCount = Math.max(table.getVisibleLeafColumns().length, 1)\n\n return (\n <div\n className={clsx(s.DataTable, className)}\n data-variant={variant}\n data-clickable={onRowClick ? \"\" : undefined}\n >\n <div className={s.TableContainer}>\n <Table>\n <TableHeader>\n {table.getHeaderGroups().map((headerGroup) => (\n <TableRow key={headerGroup.id}>\n {headerGroup.headers.map((header) => {\n const align = header.column.columnDef.meta?.align\n // aria-sort goes on one header at a time: the primary sort\n // column's real header, not its group placeholders\n const sorted =\n !header.isPlaceholder && header.column.getSortIndex() === 0\n ? header.column.getIsSorted()\n : false\n return (\n <TableHead\n key={header.id}\n colSpan={header.colSpan > 1 ? header.colSpan : undefined}\n className={isSelectColumn(header.column.id) ? s.SelectColumn : undefined}\n style={align ? { textAlign: align } : undefined}\n aria-sort={\n sorted === \"asc\" ? \"ascending\" : sorted === \"desc\" ? \"descending\" : undefined\n }\n >\n {header.isPlaceholder\n ? null\n : flexRender(header.column.columnDef.header, header.getContext())}\n </TableHead>\n )\n })}\n </TableRow>\n ))}\n </TableHeader>\n <TableBody>\n {rows.length === 0 ? (\n <TableRow>\n <TableCell colSpan={visibleColumnCount} className={s.EmptyCell}>\n {emptyMessage}\n </TableCell>\n </TableRow>\n ) : (\n rows.map((row) => (\n <TableRow\n key={row.id}\n // Clickable rows are reached with Tab and activated with\n // Enter or Space, like a button\n tabIndex={onRowClick ? 0 : undefined}\n onClick={onRowClick ? () => onRowClick(row.original) : undefined}\n onKeyDown={\n onRowClick\n ? (event) => {\n // Keys on a control inside the row are the control's\n if (event.target !== event.currentTarget) return\n if (event.key !== \"Enter\" && event.key !== \" \") return\n event.preventDefault()\n onRowClick(row.original)\n }\n : undefined\n }\n >\n {row.getVisibleCells().map((cell) => {\n const align = cell.column.columnDef.meta?.align\n return (\n <TableCell\n key={cell.id}\n style={align ? { textAlign: align } : undefined}\n // A click on a selection checkbox is not a row click\n onClick={\n onRowClick && isSelectColumn(cell.column.id)\n ? (event) => event.stopPropagation()\n : undefined\n }\n >\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableCell>\n )\n })}\n </TableRow>\n ))\n )}\n </TableBody>\n </Table>\n </div>\n {showPagination && hasPagination && <DataTablePagination table={table} />}\n </div>\n )\n}\n"]}
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import {} from "@tanstack/react-table";
|
|
4
4
|
import clsx from "clsx";
|
|
5
|
-
import { ArrowDownSm, ArrowUpSm, Sort } from "../Icon";
|
|
6
|
-
import s from "
|
|
5
|
+
import { ArrowDownSm, ArrowUpSm, Sort } from "../Icon/index.js";
|
|
6
|
+
import s from "@plexui/styles/components/DataTable/DataTable.module.css";
|
|
7
7
|
export const DataTableColumnHeader = ({ column, title, className, }) => {
|
|
8
8
|
if (!column.getCanSort()) {
|
|
9
9
|
return _jsx("span", { className: className, children: title });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DataTableColumnHeader.js","sourceRoot":"","sources":["../../../../src/components/DataTable/DataTableColumnHeader.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAe,MAAM,uBAAuB,CAAA;AACnD,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AACtD,OAAO,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"DataTableColumnHeader.js","sourceRoot":"","sources":["../../../../src/components/DataTable/DataTableColumnHeader.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAe,MAAM,uBAAuB,CAAA;AACnD,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,SAAS,CAAA;AACtD,OAAO,CAAC,MAAM,0DAA0D,CAAA;AAQxE,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAgB,EACnD,MAAM,EACN,KAAK,EACL,SAAS,GACiC,EAAE,EAAE;IAC9C,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE,EAAE,CAAC;QACzB,OAAO,eAAM,SAAS,EAAE,SAAS,YAAG,KAAK,GAAQ,CAAA;IACnD,CAAC;IAED,MAAM,MAAM,GAAG,MAAM,CAAC,WAAW,EAAE,CAAA;IAEnC,OAAO,CACL,kBACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,kBAAkB,EAAE,SAAS,CAAC,iBACnC,MAAM,IAAI,SAAS,EAChC,OAAO,EAAE,MAAM,CAAC,uBAAuB,EAAE,aAExC,KAAK,EACN,eAAM,SAAS,EAAE,CAAC,CAAC,QAAQ,YACxB,MAAM,KAAK,KAAK,CAAC,CAAC,CAAC,KAAC,SAAS,KAAG,CAAC,CAAC,CAAC,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,KAAC,WAAW,KAAG,CAAC,CAAC,CAAC,KAAC,IAAI,KAAG,GAC7E,IACA,CACV,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport { type Column } from \"@tanstack/react-table\"\nimport clsx from \"clsx\"\nimport { ArrowDownSm, ArrowUpSm, Sort } from \"../Icon\"\nimport s from \"@plexui/styles/components/DataTable/DataTable.module.css\"\n\nexport type DataTableColumnHeaderProps<TData, TValue> = {\n column: Column<TData, TValue>\n title: string\n className?: string\n}\n\nexport const DataTableColumnHeader = <TData, TValue>({\n column,\n title,\n className,\n}: DataTableColumnHeaderProps<TData, TValue>) => {\n if (!column.getCanSort()) {\n return <span className={className}>{title}</span>\n }\n\n const sorted = column.getIsSorted()\n\n return (\n <button\n type=\"button\"\n className={clsx(s.ColumnHeaderButton, className)}\n data-sorted={sorted || undefined}\n onClick={column.getToggleSortingHandler()}\n >\n {title}\n <span className={s.SortIcon}>\n {sorted === \"asc\" ? <ArrowUpSm /> : sorted === \"desc\" ? <ArrowDownSm /> : <Sort />}\n </span>\n </button>\n )\n}\n"]}
|