@acronis-platform/ui-react 0.57.1 → 0.58.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ui/area-chart/area-chart.js +149 -0
- package/dist/components/ui/area-chart/area-chart.js.map +1 -0
- package/dist/components/ui/bar-chart/bar-chart.js +152 -77
- package/dist/components/ui/bar-chart/bar-chart.js.map +1 -1
- package/dist/components/ui/button-icon-input/button-icon-input.js +36 -0
- package/dist/components/ui/button-icon-input/button-icon-input.js.map +1 -0
- package/dist/components/ui/button-menu/button-menu.js +1 -1
- package/dist/components/ui/button-menu/button-menu.js.map +1 -1
- package/dist/components/ui/card-filter/card-filter.js +40 -27
- package/dist/components/ui/card-filter/card-filter.js.map +1 -1
- package/dist/components/ui/chart-state/chart-state.js +42 -0
- package/dist/components/ui/chart-state/chart-state.js.map +1 -0
- package/dist/components/ui/chip/chip.js +13 -13
- package/dist/components/ui/chip/chip.js.map +1 -1
- package/dist/components/ui/composed-chart/composed-chart.js +107 -0
- package/dist/components/ui/composed-chart/composed-chart.js.map +1 -0
- package/dist/components/ui/confidence-cone/confidence-cone.js +195 -0
- package/dist/components/ui/confidence-cone/confidence-cone.js.map +1 -0
- package/dist/components/ui/date-range-picker/date-range-picker.js +21 -21
- package/dist/components/ui/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/ui/dialog/dialog.js +250 -78
- package/dist/components/ui/dialog/dialog.js.map +1 -1
- package/dist/components/ui/dialog-footer-default/dialog-footer-default.js +26 -0
- package/dist/components/ui/dialog-footer-default/dialog-footer-default.js.map +1 -0
- package/dist/components/ui/dropdown-menu/dropdown-menu.js +21 -21
- package/dist/components/ui/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/components/ui/filter-search/filter-search.js +91 -90
- package/dist/components/ui/filter-search/filter-search.js.map +1 -1
- package/dist/components/ui/funnel-chart/funnel-chart.js +87 -0
- package/dist/components/ui/funnel-chart/funnel-chart.js.map +1 -0
- package/dist/components/ui/histogram/histogram.js +108 -0
- package/dist/components/ui/histogram/histogram.js.map +1 -0
- package/dist/components/ui/input-otp/input-otp.js +104 -0
- package/dist/components/ui/input-otp/input-otp.js.map +1 -0
- package/dist/components/ui/input-password/input-password.js +120 -0
- package/dist/components/ui/input-password/input-password.js.map +1 -0
- package/dist/components/ui/input-text/input-text.js +9 -9
- package/dist/components/ui/input-text/input-text.js.map +1 -1
- package/dist/components/ui/line-chart/line-chart.js +206 -0
- package/dist/components/ui/line-chart/line-chart.js.map +1 -0
- package/dist/components/ui/link/link.js +5 -5
- package/dist/components/ui/link/link.js.map +1 -1
- package/dist/components/ui/loading/loading.js +79 -0
- package/dist/components/ui/loading/loading.js.map +1 -0
- package/dist/components/ui/meter/meter.js +93 -0
- package/dist/components/ui/meter/meter.js.map +1 -0
- package/dist/components/ui/metric/metric.js +185 -0
- package/dist/components/ui/metric/metric.js.map +1 -0
- package/dist/components/ui/pie-chart/pie-chart.js +113 -0
- package/dist/components/ui/pie-chart/pie-chart.js.map +1 -0
- package/dist/components/ui/popover/popover.js +57 -27
- package/dist/components/ui/popover/popover.js.map +1 -1
- package/dist/components/ui/radar-chart/radar-chart.js +74 -0
- package/dist/components/ui/radar-chart/radar-chart.js.map +1 -0
- package/dist/components/ui/radial-bar-chart/radial-bar-chart.js +69 -0
- package/dist/components/ui/radial-bar-chart/radial-bar-chart.js.map +1 -0
- package/dist/components/ui/scatter-chart/scatter-chart.js +102 -0
- package/dist/components/ui/scatter-chart/scatter-chart.js.map +1 -0
- package/dist/components/ui/search/search.js +16 -16
- package/dist/components/ui/search/search.js.map +1 -1
- package/dist/components/ui/sheet/sheet-details.js +16 -16
- package/dist/components/ui/sheet/sheet-details.js.map +1 -1
- package/dist/components/ui/spinner/spinner.js.map +1 -1
- package/dist/components/ui/timeline/timeline.js +175 -0
- package/dist/components/ui/timeline/timeline.js.map +1 -0
- package/dist/components/ui/treemap/treemap.js +83 -0
- package/dist/components/ui/treemap/treemap.js.map +1 -0
- package/dist/components/ui/trend-indicator/trend-indicator.js +97 -0
- package/dist/components/ui/trend-indicator/trend-indicator.js.map +1 -0
- package/dist/index.js +423 -384
- package/dist/index.js.map +1 -1
- package/dist/react.js +423 -384
- package/dist/react.js.map +1 -1
- package/dist/src/components/ui/area-chart/area-chart.d.ts +49 -0
- package/dist/src/components/ui/area-chart/index.d.ts +1 -0
- package/dist/src/components/ui/avatar/avatar.d.ts +1 -1
- package/dist/src/components/ui/bar-chart/bar-chart.d.ts +42 -2
- package/dist/src/components/ui/bar-chart/index.d.ts +1 -1
- package/dist/src/components/ui/button-icon-input/button-icon-input.d.ts +21 -0
- package/dist/src/components/ui/button-icon-input/index.d.ts +1 -0
- package/dist/src/components/ui/card-filter/card-filter.d.ts +5 -0
- package/dist/src/components/ui/chart-state/chart-state.d.ts +11 -0
- package/dist/src/components/ui/chart-state/index.d.ts +1 -0
- package/dist/src/components/ui/composed-chart/composed-chart.d.ts +48 -0
- package/dist/src/components/ui/composed-chart/index.d.ts +1 -0
- package/dist/src/components/ui/confidence-cone/confidence-cone.d.ts +79 -0
- package/dist/src/components/ui/confidence-cone/index.d.ts +1 -0
- package/dist/src/components/ui/dialog/dialog.d.ts +105 -9
- package/dist/src/components/ui/dialog/dialog.docs.d.ts +82 -5
- package/dist/src/components/ui/dialog/index.d.ts +1 -1
- package/dist/src/components/ui/dialog-footer-default/dialog-footer-default.d.ts +11 -0
- package/dist/src/components/ui/dialog-footer-default/index.d.ts +1 -0
- package/dist/src/components/ui/filter-search/filter-search.d.ts +1 -1
- package/dist/src/components/ui/funnel-chart/funnel-chart.d.ts +39 -0
- package/dist/src/components/ui/funnel-chart/index.d.ts +1 -0
- package/dist/src/components/ui/histogram/histogram.d.ts +55 -0
- package/dist/src/components/ui/histogram/index.d.ts +1 -0
- package/dist/src/components/ui/input-otp/index.d.ts +1 -0
- package/dist/src/components/ui/input-otp/input-otp.d.ts +23 -0
- package/dist/src/components/ui/input-password/index.d.ts +1 -0
- package/dist/src/components/ui/input-password/input-password.d.ts +21 -0
- package/dist/src/components/ui/line-chart/index.d.ts +1 -0
- package/dist/src/components/ui/line-chart/line-chart.d.ts +83 -0
- package/dist/src/components/ui/loading/index.d.ts +1 -0
- package/dist/src/components/ui/loading/loading.d.ts +13 -0
- package/dist/src/components/ui/meter/index.d.ts +1 -0
- package/dist/src/components/ui/meter/meter.d.ts +25 -0
- package/dist/src/components/ui/metric/index.d.ts +1 -0
- package/dist/src/components/ui/metric/metric.d.ts +37 -0
- package/dist/src/components/ui/pie-chart/index.d.ts +1 -0
- package/dist/src/components/ui/pie-chart/pie-chart.d.ts +54 -0
- package/dist/src/components/ui/popover/index.d.ts +1 -1
- package/dist/src/components/ui/popover/popover.d.ts +13 -1
- package/dist/src/components/ui/radar-chart/index.d.ts +1 -0
- package/dist/src/components/ui/radar-chart/radar-chart.d.ts +40 -0
- package/dist/src/components/ui/radial-bar-chart/index.d.ts +1 -0
- package/dist/src/components/ui/radial-bar-chart/radial-bar-chart.d.ts +45 -0
- package/dist/src/components/ui/scatter-chart/index.d.ts +1 -0
- package/dist/src/components/ui/scatter-chart/scatter-chart.d.ts +50 -0
- package/dist/src/components/ui/stack/stack.d.ts +1 -1
- package/dist/src/components/ui/timeline/index.d.ts +1 -0
- package/dist/src/components/ui/timeline/timeline.d.ts +41 -0
- package/dist/src/components/ui/treemap/index.d.ts +1 -0
- package/dist/src/components/ui/treemap/treemap.d.ts +44 -0
- package/dist/src/components/ui/trend-indicator/index.d.ts +1 -0
- package/dist/src/components/ui/trend-indicator/trend-indicator.d.ts +32 -0
- package/dist/src/index.d.ts +22 -2
- package/dist/ui-react.css +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.js","sources":["../../../../src/components/ui/dialog/dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { TimesIcon } from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\n// Initial version ported from `@acronis-platform/shadcn-uikit`'s `dialog`\n// (packages/ui-legacy/src/components/ui/dialog.tsx). A modal overlay built on\n// the Base UI Dialog primitive (keyboard, focus trap, scroll lock, ARIA come\n// from Base UI). No `--ui-dialog-*` token tier exists yet, so this design-\n// pending v1 themes from the shared semantic tokens via bridged Tailwind names:\n// • overlay -> var(--ui-background-backdrop-screen) (legacy `bg-black/80`)\n// • popup -> bg-muted = --ui-background-surface-secondary\n// • header / footer -> bg-background = --ui-background-surface-primary (white\n// bars over the muted body), divided by border-border\n// • title -> text-foreground / description -> text-muted-foreground\n// • close -> text-muted-foreground → hover text-foreground (replaces the\n// legacy opacity hack), focus ring var(--ui-focus-primary)\n// Enter/exit animations use `tw-animate-css` (imported in styles/index.css),\n// keyed to Base UI's data-[open] / data-[closed] state attributes — overlay\n// fades, popup fades + zooms. The `size` scale (max-width) mirrors the reference\n// design's six widths; until a `--ui-dialog-*` tier defines them, they are plain\n// max-width utilities. Reconcile against the real design with\n// `/figma-component Dialog <url> --update` once a mockup lands.\n\n// Popup width scale. `sm` (512px) is the default and matches the pre-size width.\nconst dialogContentVariants = cva(\n 'fixed left-1/2 top-1/2 z-50 flex w-full -translate-x-1/2 -translate-y-1/2 flex-col overflow-hidden rounded-lg bg-muted text-foreground shadow-lg duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[open]:zoom-in-95 data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:zoom-out-95',\n {\n variants: {\n size: {\n xs: 'max-w-[464px]',\n sm: 'max-w-lg',\n md: 'max-w-2xl',\n lg: 'max-w-[832px]',\n xl: 'max-w-[992px]',\n '2xl': 'max-w-[1136px]',\n },\n },\n defaultVariants: {\n size: 'sm',\n },\n }\n);\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nconst DialogOverlay = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Backdrop>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Backdrop>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Backdrop\n ref={ref}\n className={cn(\n 'fixed inset-0 z-50 bg-[var(--ui-background-backdrop-screen)] duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0',\n className\n )}\n {...props}\n />\n));\nDialogOverlay.displayName = 'DialogOverlay';\n\nexport interface DialogContentProps\n extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Popup>,\n VariantProps<typeof dialogContentVariants> {\n /**\n * Popup max-width. `sm` 512 · `xs` 464 · `md` 672 · `lg` 832 · `xl` 992 ·\n * `2xl` 1136 (px). Defaults to `sm`.\n */\n size?: VariantProps<typeof dialogContentVariants>['size'];\n /**\n * Render the content inside a portal (default `true`). Base UI requires the\n * Popup to sit in a Portal for correct stacking; set `false` for inline usage\n * (e.g. when the caller supplies its own `DialogPortal`, or in tests).\n */\n portal?: boolean;\n /**\n * Portal container. Pass a shadow-root mount for isolated-style previews\n * (the docs demos do this via `useShadowMount`).\n */\n portalContainer?: DialogPrimitive.Portal.Props['container'];\n /** Keep the content mounted while closed (Base UI `Portal` prop). */\n keepMounted?: DialogPrimitive.Portal.Props['keepMounted'];\n}\n\nconst DialogContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Popup>,\n DialogContentProps\n>(\n (\n {\n className,\n children,\n size,\n portal = true,\n portalContainer,\n keepMounted,\n ...props\n },\n ref\n ) => {\n const ctxContainer = usePortalContainer();\n const resolvedContainer = portalContainer ?? ctxContainer;\n\n const popup = (\n <>\n <DialogOverlay />\n <DialogPrimitive.Popup\n ref={ref}\n className={cn(dialogContentVariants({ size }), className)}\n {...props}\n >\n {children}\n </DialogPrimitive.Popup>\n </>\n );\n\n return portal ? (\n <DialogPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n {popup}\n </DialogPrimitive.Portal>\n ) : (\n popup\n );\n }\n);\nDialogContent.displayName = 'DialogContent';\n\nconst DialogHeader = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex h-16 items-center gap-4 border-b border-border bg-background px-5 py-4',\n className\n )}\n {...props}\n />\n));\nDialogHeader.displayName = 'DialogHeader';\n\nconst DialogFooter = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex h-16 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4',\n className\n )}\n {...props}\n />\n));\nDialogFooter.displayName = 'DialogFooter';\n\nconst DialogBody = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div ref={ref} className={cn('flex-1 overflow-auto p-6', className)} {...props} />\n));\nDialogBody.displayName = 'DialogBody';\n\nconst DialogTitle = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Title\n ref={ref}\n className={cn(\n 'flex-1 text-2xl font-normal leading-8 text-foreground',\n className\n )}\n {...props}\n />\n));\nDialogTitle.displayName = 'DialogTitle';\n\nconst DialogDescription = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Description\n ref={ref}\n className={cn('text-sm text-muted-foreground', className)}\n {...props}\n />\n));\nDialogDescription.displayName = 'DialogDescription';\n\nconst DialogCloseButton = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Close>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Close\n ref={ref}\n className={cn(\n 'rounded p-1 text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none',\n className\n )}\n {...props}\n >\n <TimesIcon size={24} />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n));\nDialogCloseButton.displayName = 'DialogCloseButton';\n\nexport {\n Dialog,\n DialogPortal,\n DialogOverlay,\n DialogClose,\n DialogCloseButton,\n DialogTrigger,\n DialogContent,\n DialogHeader,\n DialogFooter,\n DialogTitle,\n DialogBody,\n DialogDescription,\n dialogContentVariants,\n};\n"],"names":["dialogContentVariants","cva","Dialog","DialogPrimitive","DialogTrigger","DialogPortal","DialogClose","DialogOverlay","React","className","props","ref","jsx","cn","DialogContent","children","size","portal","portalContainer","keepMounted","ctxContainer","usePortalContainer","resolvedContainer","popup","jsxs","Fragment","DialogHeader","DialogFooter","DialogBody","DialogTitle","DialogDescription","DialogCloseButton","TimesIcon"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dialog.js","sources":["../../../../src/components/ui/dialog/dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { TimesIcon } from '@acronis-platform/icons-react/stroke-mono';\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\nimport { Button } from '../button';\nimport { DialogFooterDefault } from '../dialog-footer-default';\nimport { InputText } from '../input-text';\nimport { Loading } from '../loading';\n\n// Initial version ported from `@acronis-platform/shadcn-uikit`'s `dialog`\n// (packages/ui-legacy/src/components/ui/dialog.tsx). A modal overlay built on\n// the Base UI Dialog primitive (keyboard, focus trap, scroll lock, ARIA come\n// from Base UI). A `--ui-dialog-*` / `--ui-button-icon-*` token tier covers the\n// container + close button (reconciled against the Figma \"DialogDefault\" node,\n// 6343:58898); the composable DialogRoot / DialogHeaderRoot / DialogFooterRoot\n// / DialogBodyRoot parts below are internal-only (no public export, no Figma\n// node of their own) and keep the prior semantic-token approach — not to be\n// confused with the recipe-local `DialogHeader`/`DialogBody` further down,\n// which back the public `Dialog` and are reconciled against Figma:\n// • overlay -> var(--ui-background-backdrop-screen) (legacy `bg-black/80`)\n// • popup -> var(--ui-dialog-container-color) / var(--ui-dialog-container-border-radius)\n// • header / footer -> bg-background = --ui-background-surface-primary (white\n// bars over the muted body), divided by border-border\n// • title -> text-foreground / description -> text-muted-foreground\n// • close -> var(--ui-button-icon-global-icon-color-*) (idle/hover/active\n// share one blue in the default brand), bg via\n// var(--ui-button-icon-global-container-color-*), focus ring var(--ui-focus-primary)\n// Enter/exit animations use `tw-animate-css` (imported in styles/index.css),\n// keyed to Base UI's data-[open] / data-[closed] state attributes — overlay\n// fades, popup fades + zooms. `size` has two values: `sm` (512px, the Figma\n// default, backed by `--ui-dialog-container-size-sm`) and `large` (832px) — the\n// latter predates the Figma node and has no token; it's kept as a plain\n// arbitrary value solely for backward compatibility with existing call sites\n// that need a wider popup (see the `Large` story).\n//\n// Dialog's composable primitive parts (this file) are internal-only — not\n// re-exported from the package root — except `DialogClose`, which stays\n// public: it's required by the `wide` variant's documented custom-`footer`\n// escape hatch (see the `footer` prop and dialog.mdx). The public `Dialog`\n// component below is the sole sanctioned entry point; it's built on these\n// parts internally. (In Figma the matching component set is named\n// \"DialogDefault\"; the code-facing name stays `Dialog` — see dialog.figma.tsx.)\n\nconst dialogContentVariants = cva(\n 'fixed left-1/2 top-1/2 z-50 flex w-full min-w-[var(--ui-dialog-container-width-min)] -translate-x-1/2 -translate-y-1/2 flex-col overflow-hidden rounded-[var(--ui-dialog-container-border-radius)] bg-[var(--ui-dialog-container-color)] text-foreground shadow-lg duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[open]:zoom-in-95 data-[closed]:animate-out data-[closed]:fade-out-0 data-[closed]:zoom-out-95',\n {\n variants: {\n size: {\n sm: 'max-w-[var(--ui-dialog-container-size-sm)]',\n large: 'max-w-[832px]',\n },\n },\n defaultVariants: {\n size: 'sm',\n },\n }\n);\n\nconst DialogRoot = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nconst DialogOverlay = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Backdrop>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Backdrop>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Backdrop\n ref={ref}\n className={cn(\n 'fixed inset-0 z-50 bg-[var(--ui-background-backdrop-screen)] duration-200 data-[open]:animate-in data-[open]:fade-in-0 data-[closed]:animate-out data-[closed]:fade-out-0',\n className\n )}\n {...props}\n />\n));\nDialogOverlay.displayName = 'DialogOverlay';\n\nexport interface DialogContentProps\n extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Popup>,\n VariantProps<typeof dialogContentVariants> {\n /**\n * Popup max-width. `sm` (512px, default) is the Figma-defined size; `large`\n * (832px) is a backward-compatibility size with no design token (see the\n * `Large` story).\n */\n size?: VariantProps<typeof dialogContentVariants>['size'];\n /**\n * Render the content inside a portal (default `true`). Base UI requires the\n * Popup to sit in a Portal for correct stacking; set `false` for inline usage\n * (e.g. when the caller supplies its own `DialogPortal`, or in tests).\n */\n portal?: boolean;\n /**\n * Portal container. Pass a shadow-root mount for isolated-style previews\n * (the docs demos do this via `useShadowMount`).\n */\n portalContainer?: DialogPrimitive.Portal.Props['container'];\n /** Keep the content mounted while closed (Base UI `Portal` prop). */\n keepMounted?: DialogPrimitive.Portal.Props['keepMounted'];\n}\n\nconst DialogContent = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Popup>,\n DialogContentProps\n>(\n (\n {\n className,\n children,\n size,\n portal = true,\n portalContainer,\n keepMounted,\n ...props\n },\n ref\n ) => {\n const ctxContainer = usePortalContainer();\n const resolvedContainer = portalContainer ?? ctxContainer;\n\n const popup = (\n <>\n <DialogOverlay />\n <DialogPrimitive.Popup\n ref={ref}\n className={cn(dialogContentVariants({ size }), className)}\n {...props}\n >\n {children}\n </DialogPrimitive.Popup>\n </>\n );\n\n return portal ? (\n <DialogPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n {popup}\n </DialogPrimitive.Portal>\n ) : (\n popup\n );\n }\n);\nDialogContent.displayName = 'DialogContent';\n\nconst DialogHeaderRoot = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex h-16 items-center gap-4 border-b border-border bg-background px-5 py-4',\n className\n )}\n {...props}\n />\n));\nDialogHeaderRoot.displayName = 'DialogHeaderRoot';\n\nconst DialogFooterRoot = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div\n ref={ref}\n className={cn(\n 'flex h-16 items-center justify-end gap-4 border-t border-border bg-background px-6 py-4',\n className\n )}\n {...props}\n />\n));\nDialogFooterRoot.displayName = 'DialogFooterRoot';\n\nconst DialogBodyRoot = React.forwardRef<\n HTMLDivElement,\n React.HTMLAttributes<HTMLDivElement>\n>(({ className, ...props }, ref) => (\n <div ref={ref} className={cn('flex-1 overflow-auto p-6', className)} {...props} />\n));\nDialogBodyRoot.displayName = 'DialogBodyRoot';\n\nconst DialogTitle = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Title>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Title\n ref={ref}\n className={cn(\n 'flex-1 text-2xl font-normal leading-8 text-foreground',\n className\n )}\n {...props}\n />\n));\nDialogTitle.displayName = 'DialogTitle';\n\nconst DialogDescription = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Description>,\n React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n <DialogPrimitive.Description\n ref={ref}\n className={cn('text-sm text-muted-foreground', className)}\n {...props}\n />\n));\nDialogDescription.displayName = 'DialogDescription';\n\nexport interface DialogCloseButtonProps\n extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Close> {\n /** Accessible name for screen readers. Defaults to `'Close'`. */\n closeLabel?: string;\n}\n\nconst DialogCloseButton = React.forwardRef<\n React.ElementRef<typeof DialogPrimitive.Close>,\n DialogCloseButtonProps\n>(({ className, closeLabel = 'Close', ...props }, ref) => (\n <DialogPrimitive.Close\n ref={ref}\n className={cn(\n 'cursor-pointer rounded p-1 text-[var(--ui-button-icon-global-icon-color-idle)] transition-colors hover:bg-[var(--ui-button-icon-global-container-color-hover)] hover:text-[var(--ui-button-icon-global-icon-color-hover)] active:bg-[var(--ui-button-icon-global-container-color-active)] active:text-[var(--ui-button-icon-global-icon-color-active)] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ui-focus-primary)] disabled:pointer-events-none disabled:cursor-default disabled:text-[var(--ui-button-icon-global-icon-color-disabled)]',\n className\n )}\n {...props}\n >\n <TimesIcon size={24} />\n <span className=\"sr-only\">{closeLabel}</span>\n </DialogPrimitive.Close>\n));\nDialogCloseButton.displayName = 'DialogCloseButton';\n\n// The recipe-specific header: title + close button, reconciled against the\n// Figma \"DialogHeader\" node (4220:3516) via the `--ui-dialog-header-*` tier.\n// Local to this file (not exported) — distinct from the generic, unstyled\n// `DialogHeaderRoot` composable primitive above.\ninterface DialogHeaderProps {\n title: string;\n closeLabel?: string;\n}\n\nfunction DialogHeader({ title, closeLabel }: DialogHeaderProps) {\n return (\n <div className=\"flex h-[var(--ui-dialog-header-height)] items-center gap-[var(--ui-dialog-header-gap)] border-b-[length:var(--ui-dialog-header-border-width)] border-[var(--ui-dialog-header-border-color)] bg-[var(--ui-dialog-header-color)] px-[var(--ui-dialog-header-padding-x)]\">\n <DialogTitle>{title}</DialogTitle>\n <DialogCloseButton closeLabel={closeLabel} />\n </div>\n );\n}\n\n// The recipe-specific body: the variant's canned copy (or the `children`\n// override), reconciled against the Figma DialogDefault node via the\n// `--ui-dialog-body-*` tier. Local to this file — distinct from the generic\n// `DialogBodyRoot` composable primitive above.\ninterface DialogBodyProps {\n children: React.ReactNode;\n /** Makes the body unfocusable/unclickable while the loading overlay is shown. */\n inert?: boolean;\n}\n\nfunction DialogBody({ children, inert }: DialogBodyProps) {\n return (\n <div\n inert={inert}\n className=\"flex min-h-[var(--ui-dialog-body-height-min)] flex-col justify-center gap-[var(--ui-dialog-body-gap)] px-4 py-[var(--ui-dialog-body-padding-y)]\"\n >\n {typeof children === 'string' ? (\n <p className=\"text-sm leading-6 text-foreground\">{children}</p>\n ) : (\n children\n )}\n </div>\n );\n}\n\n// The recipe-specific footer actions: a secondary (dismiss) button plus a\n// primary action, the latter either closing the dialog itself (`read-only`'s\n// \"Done\") or firing `onPrimaryAction` and leaving the close to the caller.\n// Local to this file — distinct from the generic `DialogFooterRoot`.\ninterface DialogFooterActionsProps {\n secondaryLabel?: string;\n primaryLabel: string;\n primaryVariant: 'default' | 'destructive';\n primaryCloses?: boolean;\n onPrimaryAction?: () => void;\n}\n\nfunction DialogFooterActions({\n secondaryLabel,\n primaryLabel,\n primaryVariant,\n primaryCloses,\n onPrimaryAction,\n}: DialogFooterActionsProps) {\n return (\n <>\n {secondaryLabel && (\n <DialogClose render={<Button variant=\"secondary\">{secondaryLabel}</Button>} />\n )}\n {primaryCloses ? (\n <DialogClose\n onClick={onPrimaryAction}\n render={<Button variant={primaryVariant}>{primaryLabel}</Button>}\n />\n ) : (\n <Button variant={primaryVariant} onClick={onPrimaryAction}>\n {primaryLabel}\n </Button>\n )}\n </>\n );\n}\n\n// A higher-level \"recipe\" built on top of the Dialog primitive parts above\n// (DialogRoot + DialogContent give the portal, backdrop, focus trap, scroll\n// lock and open state; DialogTitle wires the accessible name; DialogCloseButton\n// / DialogClose give the dismiss controls). It bakes in the seven Figma\n// \"DialogDefault\" use-cases (node 6343:58898) plus one legacy `wide` escape\n// hatch kept for backward compatibility: each `variant` picks a canned title,\n// body copy and footer buttons; `children` overrides only the body slot;\n// `title` overrides only the title; `footer` overrides only the footer's\n// action content (the free-form escape hatch `wide` relies on); `hasLoading`\n// drops a spinner overlay over the body + footer. `hasHeader`/`hasFooter`\n// (both default `true`) hide the header/footer chrome entirely — a\n// ui-react-only extension beyond the Figma DialogDefault contract, which\n// always shows both; the title stays rendered off-screen when the header is\n// hidden so the dialog keeps an accessible name.\n//\n// Colors resolve to shipped semantic tokens via the bridged Tailwind names the\n// Dialog family already uses (text-foreground, the backdrop + focus tokens\n// inside DialogContent / DialogCloseButton) and the Button / InputText token\n// tiers — nothing is hand-authored. The loading scrim renders `Loading`'s\n// `onSurfaceSecondary` variant (`--ui-loading-element-container-color-secondary`),\n// matching the design's translucent surface fill.\n//\n// Header + footer geometry/color resolve to the `--ui-dialog-header-*` /\n// `--ui-footer-*` tiers, reconciled against the DialogDefault Figma node.\n\nexport type DialogVariant =\n | 'default'\n | 'rename'\n | 'save changes'\n | 'reset password'\n | 'discard changes'\n | 'accept'\n | 'read-only'\n | 'wide';\n\ninterface DialogVariantContent {\n /**\n * The variant's canned title. A function receives `objectName` (falls back\n * to its own placeholder default when omitted) for variants whose title\n * embeds the acted-on object's name.\n */\n title: string | ((objectName?: string) => string);\n /**\n * Same `objectName` interpolation as `title`, for body copy/fields that\n * embed it. The `rename` variant's field also receives `objectNameLabel`\n * for its accessible name.\n */\n body:\n | React.ReactNode\n | ((objectName?: string, objectNameLabel?: string) => React.ReactNode);\n /** Secondary (dismiss) button label. Omitted when the variant has none. */\n secondaryLabel?: string;\n primaryLabel: string;\n primaryVariant: 'default' | 'destructive';\n /** Whether the primary button dismisses the dialog (e.g. read-only \"Done\"). */\n primaryCloses?: boolean;\n}\n\nconst DIALOG_VARIANT_CONTENT: Record<DialogVariant, DialogVariantContent> = {\n default: {\n title: 'Dialog title',\n body: 'Drop any content into this slot.',\n secondaryLabel: 'Cancel',\n primaryLabel: 'Label',\n primaryVariant: 'default',\n },\n rename: {\n title: (objectName = 'object name') => `Rename ${objectName}`,\n // `objectName` prefills the field with the real current name; the field's\n // accessible name (`objectNameLabel`) is separate — it's the label, not the value.\n body: (objectName = 'Current name', objectNameLabel = 'Object name') => (\n <InputText aria-label={objectNameLabel} defaultValue={objectName} />\n ),\n secondaryLabel: 'Cancel',\n primaryLabel: 'Rename',\n primaryVariant: 'default',\n },\n 'save changes': {\n title: 'Save changes',\n body: 'You have unsaved changes. Do you want to save them before leaving?',\n secondaryLabel: 'Go back',\n primaryLabel: 'Save',\n primaryVariant: 'default',\n },\n 'reset password': {\n title: 'Reset password',\n body: 'Further instructions will be sent to your email address.',\n secondaryLabel: 'Cancel',\n primaryLabel: 'Reset',\n primaryVariant: 'default',\n },\n 'discard changes': {\n title: 'Discard changes',\n body: (objectName = 'Object name') => (\n <p className=\"text-sm leading-6 text-foreground\">\n Are you sure you want to discard the unsaved changes to{' '}\n <strong className=\"font-semibold\">{objectName}</strong>?\n </p>\n ),\n secondaryLabel: 'Go back',\n primaryLabel: 'Confirm',\n primaryVariant: 'destructive',\n },\n accept: {\n title: (objectName = 'object name') => `Accept ${objectName}`,\n body: 'Click Accept to confirm that you have read, understood, and agree to the terms and conditions below.',\n secondaryLabel: 'Cancel',\n primaryLabel: 'Accept',\n primaryVariant: 'default',\n },\n 'read-only': {\n title: 'License agreement',\n body: 'This is a read-only dialog used to view legal documents such as the License Agreement, EULA updates, Terms of Service, and other legal documents.',\n primaryLabel: 'Done',\n primaryVariant: 'default',\n primaryCloses: true,\n },\n // No Figma preset — a legacy, free-form escape hatch (see the `footer` prop\n // and the `Large` story). This fallback title/body/footer only renders if\n // the caller supplies neither `footer` nor `title`/`children` — every real\n // `wide` call site overrides them.\n wide: {\n title: 'Dialog title',\n body: 'Drop any content into this slot.',\n secondaryLabel: 'Cancel',\n primaryLabel: 'Confirm',\n primaryVariant: 'default',\n },\n};\n\ntype DialogRootProps = React.ComponentPropsWithoutRef<typeof DialogRoot>;\n\nexport interface DialogProps extends Omit<DialogRootProps, 'children'> {\n /**\n * Selects the canned title / body / footer preset. Defaults to `'default'`.\n * `'wide'` is a legacy escape hatch (no canned preset) kept for backward\n * compatibility — pair it with `size=\"large\"` and the `footer` prop.\n */\n variant?: DialogVariant;\n /**\n * Show a spinner overlay across the body + footer, and make both `inert`\n * (unfocusable, unclickable, hidden from assistive tech) so a keyboard user\n * can't activate the visually obscured footer buttons while busy.\n */\n hasLoading?: boolean;\n /**\n * Overrides the loading overlay's accessible label. Defaults to `Loading`'s\n * own default (`'Data is loading…'`). Ignored when `hasLoading` is `false`.\n */\n loadingLabel?: string;\n /**\n * Show the header (title + close button). Defaults to `true`. When `false`,\n * the title is still rendered off-screen so the dialog keeps an accessible\n * name — only the visible bar and close button are omitted. Beyond the\n * strict Figma contract (all seven `DialogDefault` variants always show the\n * header); a ui-react-only extension, like `wide`/`size=\"large\"`.\n */\n hasHeader?: boolean;\n /**\n * Show the footer (action buttons). Defaults to `true`. Beyond the strict\n * Figma contract (all seven `DialogDefault` variants always show the\n * footer); a ui-react-only extension, like `wide`/`size=\"large\"`. When\n * `false`, `footer` (and the canned footer it would otherwise replace) is\n * not rendered either.\n */\n hasFooter?: boolean;\n /** Overrides the variant's default body content. */\n children?: React.ReactNode;\n /** Overrides the variant's default title. */\n title?: string;\n /**\n * The real name of the object being acted on (e.g. a file or resource\n * name). Interpolated into the `rename`/`discard changes`/`accept`\n * variants' canned title/body in place of the generic placeholder text;\n * ignored by variants that don't reference an object name.\n */\n objectName?: string;\n /**\n * Overrides the accessible name of the `rename` variant's text field\n * (default `'Object name'`). Ignored by every other variant.\n */\n objectNameLabel?: string;\n /**\n * Overrides the variant's default secondary (dismiss) button label. Passing\n * this for a variant with no secondary button by default (e.g. `read-only`)\n * also makes the button appear. Ignored when `footer` is provided.\n */\n secondaryLabel?: string;\n /** Overrides the variant's default primary button label. Ignored when `footer` is provided. */\n primaryLabel?: string;\n /**\n * Fires when the primary footer button is clicked. The dialog does not\n * close automatically afterwards — pair this with `open`/`onOpenChange` to\n * close it once the action completes. Ignored when `footer` is provided\n * (wire behavior onto your own buttons there instead).\n */\n onPrimaryAction?: () => void;\n /**\n * Replaces the footer's action content entirely with free-form buttons —\n * the escape hatch the `wide` variant is meant to be paired with, for\n * legacy call sites that don't fit one of the seven canned presets. Ignored\n * (along with the canned footer) when `hasFooter` is `false`.\n */\n footer?: React.ReactNode;\n /** Overrides the close button's accessible name. Defaults to `'Close'`. */\n closeLabel?: string;\n /**\n * Popup max-width (forwarded to `DialogContent`). Defaults to `'sm'`, or to\n * `'large'` when `variant` is `'wide'`.\n */\n size?: DialogContentProps['size'];\n /** Render inside a portal (forwarded to `DialogContent`). Defaults to `true`. */\n portal?: boolean;\n /** Portal container (forwarded to `DialogContent`). */\n portalContainer?: DialogContentProps['portalContainer'];\n /** Keep the content mounted while closed (forwarded to `DialogContent`). */\n keepMounted?: DialogContentProps['keepMounted'];\n /** Extra classes merged onto the popup container. */\n className?: string;\n}\n\nconst Dialog = React.forwardRef<HTMLDivElement, DialogProps>(\n (\n {\n variant = 'default',\n hasLoading = false,\n loadingLabel,\n hasHeader = true,\n hasFooter = true,\n children,\n title,\n objectName,\n objectNameLabel,\n secondaryLabel,\n primaryLabel,\n onPrimaryAction,\n footer,\n closeLabel,\n size,\n portal,\n portalContainer,\n keepMounted,\n className,\n ...rootProps\n },\n ref\n ) => {\n const content = DIALOG_VARIANT_CONTENT[variant];\n const resolvedTitle =\n typeof content.title === 'function' ? content.title(objectName) : content.title;\n const resolvedBody =\n typeof content.body === 'function'\n ? content.body(objectName, objectNameLabel)\n : content.body;\n const bodyContent = children ?? resolvedBody;\n const titleText = title ?? resolvedTitle;\n const secondaryLabelText = secondaryLabel ?? content.secondaryLabel;\n const primaryLabelText = primaryLabel ?? content.primaryLabel;\n const resolvedSize = size ?? (variant === 'wide' ? 'large' : 'sm');\n\n return (\n <DialogRoot {...rootProps}>\n <DialogContent\n ref={ref}\n size={resolvedSize}\n portal={portal}\n portalContainer={portalContainer}\n keepMounted={keepMounted}\n className={className}\n aria-busy={hasLoading || undefined}\n >\n {hasHeader ? (\n <DialogHeader title={titleText} closeLabel={closeLabel} />\n ) : (\n // Header hidden, but the dialog still needs an accessible name.\n <DialogTitle className=\"sr-only\">{titleText}</DialogTitle>\n )}\n\n <DialogBody inert={hasLoading}>{bodyContent}</DialogBody>\n\n {hasFooter && (\n <DialogFooterDefault inert={hasLoading}>\n {footer ?? (\n <DialogFooterActions\n secondaryLabel={secondaryLabelText}\n primaryLabel={primaryLabelText}\n primaryVariant={content.primaryVariant}\n primaryCloses={content.primaryCloses}\n onPrimaryAction={onPrimaryAction}\n />\n )}\n </DialogFooterDefault>\n )}\n\n {hasLoading && (\n <Loading\n variant=\"onSurfaceSecondary\"\n hasLabel={false}\n label={loadingLabel}\n className={cn(\n 'absolute inset-x-0 bottom-0 rounded-none',\n hasHeader ? 'top-[var(--ui-dialog-header-height)]' : 'top-0'\n )}\n />\n )}\n </DialogContent>\n </DialogRoot>\n );\n }\n);\nDialog.displayName = 'Dialog';\n\nexport {\n DialogRoot,\n DialogPortal,\n DialogOverlay,\n DialogClose,\n DialogCloseButton,\n DialogTrigger,\n DialogContent,\n DialogHeaderRoot,\n DialogFooterRoot,\n DialogTitle,\n DialogBodyRoot,\n DialogDescription,\n dialogContentVariants,\n Dialog,\n};\n"],"names":["dialogContentVariants","cva","DialogRoot","DialogPrimitive","DialogClose","DialogOverlay","React","className","props","ref","jsx","cn","DialogContent","children","size","portal","portalContainer","keepMounted","ctxContainer","usePortalContainer","resolvedContainer","popup","jsxs","Fragment","DialogHeaderRoot","DialogFooterRoot","DialogBodyRoot","DialogTitle","DialogDescription","DialogCloseButton","closeLabel","TimesIcon","DialogHeader","title","DialogBody","inert","DialogFooterActions","secondaryLabel","primaryLabel","primaryVariant","primaryCloses","onPrimaryAction","Button","DIALOG_VARIANT_CONTENT","objectName","objectNameLabel","InputText","Dialog","variant","hasLoading","loadingLabel","hasHeader","hasFooter","footer","rootProps","content","resolvedTitle","resolvedBody","bodyContent","titleText","secondaryLabelText","primaryLabelText","DialogFooterDefault","Loading"],"mappings":"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"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { jsxs as d, jsx as e } from "react/jsx-runtime";
|
|
2
|
+
import * as f from "react";
|
|
3
|
+
import { cn as s } from "../../../lib/utils.js";
|
|
4
|
+
const m = f.forwardRef(
|
|
5
|
+
({ className: t, description: o, link: r, children: a, ...l }, i) => /* @__PURE__ */ d(
|
|
6
|
+
"div",
|
|
7
|
+
{
|
|
8
|
+
ref: i,
|
|
9
|
+
className: s(
|
|
10
|
+
"flex h-[var(--ui-footer-global-height)] items-center gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[color:var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]",
|
|
11
|
+
!(o !== void 0 || r !== void 0) && "justify-end",
|
|
12
|
+
t
|
|
13
|
+
),
|
|
14
|
+
...l,
|
|
15
|
+
children: [
|
|
16
|
+
o !== void 0 ? /* @__PURE__ */ e("p", { className: "min-w-0 flex-1 truncate text-sm leading-6 text-foreground", children: o }) : r !== void 0 && /* @__PURE__ */ e("div", { className: "flex h-8 min-w-0 flex-1 items-center", children: r }),
|
|
17
|
+
a
|
|
18
|
+
]
|
|
19
|
+
}
|
|
20
|
+
)
|
|
21
|
+
);
|
|
22
|
+
m.displayName = "DialogFooterDefault";
|
|
23
|
+
export {
|
|
24
|
+
m as DialogFooterDefault
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=dialog-footer-default.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog-footer-default.js","sources":["../../../../src/components/ui/dialog-footer-default/dialog-footer-default.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\n// A bottom action bar (panel/dialog/sheet footer), themed by the `--ui-footer-*`\n// tier. The Figma component's `variant` (default / withDescription / withLink) is\n// structural, not a separate prop — it follows from which optional slot is\n// passed, mirroring how `Breadcrumb`'s \"current page\" is a different part\n// rather than a duplicated state prop. `description` and `link` are mutually\n// exclusive; when neither is given, actions sit flush to the end.\nexport interface DialogFooterDefaultProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n 'children'\n> {\n /** Truncated description text next to the actions. Mutually exclusive with `link`. */\n description?: string;\n /** A `Link` (or similar) element next to the actions. Mutually exclusive with `description`. */\n link?: React.ReactNode;\n /** End-aligned actions — typically a secondary and a primary `Button`. */\n children?: React.ReactNode;\n}\n\nconst DialogFooterDefault = React.forwardRef<HTMLDivElement, DialogFooterDefaultProps>(\n ({ className, description, link, children, ...props }, ref) => {\n const hasStart = description !== undefined || link !== undefined;\n return (\n <div\n ref={ref}\n className={cn(\n 'flex h-[var(--ui-footer-global-height)] items-center gap-[var(--ui-footer-global-gap)] border-t-[length:var(--ui-footer-default-border-width)] border-solid border-[color:var(--ui-footer-default-border-color)] bg-[var(--ui-footer-default-color)] px-[var(--ui-footer-global-padding-x)]',\n !hasStart && 'justify-end',\n className\n )}\n {...props}\n >\n {description !== undefined ? (\n <p className=\"min-w-0 flex-1 truncate text-sm leading-6 text-foreground\">\n {description}\n </p>\n ) : (\n link !== undefined && (\n <div className=\"flex h-8 min-w-0 flex-1 items-center\">{link}</div>\n )\n )}\n {children}\n </div>\n );\n }\n);\nDialogFooterDefault.displayName = 'DialogFooterDefault';\n\nexport { DialogFooterDefault };\n"],"names":["DialogFooterDefault","React","className","description","link","children","props","ref","jsxs","cn","jsx"],"mappings":";;;AAsBA,MAAMA,IAAsBC,EAAM;AAAA,EAChC,CAAC,EAAE,WAAAC,GAAW,aAAAC,GAAa,MAAAC,GAAM,UAAAC,GAAU,GAAGC,EAAA,GAASC,MAGnD,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWE;AAAA,QACT;AAAA,QACA,EANWN,MAAgB,UAAaC,MAAS,WAMpC;AAAA,QACbF;AAAA,MAAA;AAAA,MAED,GAAGI;AAAA,MAEH,UAAA;AAAA,QAAAH,MAAgB,SACf,gBAAAO,EAAC,KAAA,EAAE,WAAU,6DACV,UAAAP,EAAA,CACH,IAEAC,MAAS,UACP,gBAAAM,EAAC,OAAA,EAAI,WAAU,wCAAwC,UAAAN,GAAK;AAAA,QAG/DC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAIT;AACAL,EAAoB,cAAc;"}
|
|
@@ -1,37 +1,37 @@
|
|
|
1
|
-
import { jsx as r, jsxs as
|
|
1
|
+
import { jsx as r, jsxs as g } from "react/jsx-runtime";
|
|
2
2
|
import * as d from "react";
|
|
3
3
|
import { Menu as o } from "@base-ui/react/menu";
|
|
4
4
|
import { ChevronRightIcon as h } from "@acronis-platform/icons-react/stroke-mono";
|
|
5
5
|
import { cn as a } from "../../../lib/utils.js";
|
|
6
6
|
import { usePortalContainer as x } from "../../../lib/portal-container.js";
|
|
7
|
-
const _ = o.Root, k = o.Trigger, M = d.forwardRef(({ className: n, ...
|
|
7
|
+
const _ = o.Root, k = o.Trigger, M = d.forwardRef(({ className: n, ...e }, t) => /* @__PURE__ */ r(
|
|
8
8
|
o.Group,
|
|
9
9
|
{
|
|
10
|
-
ref:
|
|
10
|
+
ref: t,
|
|
11
11
|
className: a(
|
|
12
12
|
"flex flex-col items-start overflow-clip gap-[var(--ui-button-menu-dropdown-section-list-gap)] px-[var(--ui-button-menu-dropdown-section-container-padding-x)] py-[var(--ui-button-menu-dropdown-section-container-padding-y)] [&:not(:first-child)]:border-t [&:not(:first-child)]:border-[length:var(--ui-button-menu-dropdown-section-container-border-width)] [&:not(:first-child)]:border-[var(--ui-button-menu-dropdown-section-container-border-color)]",
|
|
13
13
|
n
|
|
14
14
|
),
|
|
15
|
-
...
|
|
15
|
+
...e
|
|
16
16
|
}
|
|
17
17
|
));
|
|
18
18
|
M.displayName = "DropdownMenuGroup";
|
|
19
19
|
const G = o.Portal, j = o.SubmenuRoot, p = "z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden flex flex-col gap-[var(--ui-button-menu-dropdown-container-gap)] bg-[var(--ui-button-menu-dropdown-container-color)] border-solid border-[length:var(--ui-button-menu-dropdown-container-border-width)] border-[var(--ui-button-menu-dropdown-container-border-color)] rounded-[var(--ui-button-menu-dropdown-container-border-radius)] px-[var(--ui-button-menu-dropdown-container-padding-x)] py-[var(--ui-button-menu-dropdown-container-padding-y)] shadow-md outline-none duration-200 data-[open]:animate-in data-[closed]:animate-out data-[open]:fade-in-0 data-[closed]:fade-out-0 data-[open]:zoom-in-95 data-[closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2", c = "relative flex w-full shrink-0 cursor-default select-none items-start gap-[var(--ui-button-menu-dropdown-item-container-gap)] min-h-[var(--ui-button-menu-dropdown-item-container-height)] px-[var(--ui-button-menu-dropdown-item-container-padding-x)] py-[var(--ui-button-menu-dropdown-item-container-padding-y)] text-sm font-semibold leading-6 outline-none transition-colors bg-[var(--ui-button-menu-dropdown-item-container-color-idle)] text-[var(--ui-button-menu-dropdown-item-label-color)] [&_svg]:text-[var(--ui-button-menu-dropdown-item-icon-color)] data-[highlighted]:bg-[var(--ui-button-menu-dropdown-item-container-color-hover)] data-[highlighted]:active:bg-[var(--ui-button-menu-dropdown-item-container-color-active)] [&:focus-visible:not(:hover)]:rounded-[3px] [&:focus-visible:not(:hover)]:ring-[3px] [&:focus-visible:not(:hover)]:ring-inset [&:focus-visible:not(:hover)]:ring-[var(--ui-focus-primary)] data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", N = d.forwardRef(
|
|
20
20
|
({
|
|
21
21
|
className: n,
|
|
22
|
-
side:
|
|
23
|
-
align:
|
|
22
|
+
side: e,
|
|
23
|
+
align: t,
|
|
24
24
|
sideOffset: i = 4,
|
|
25
25
|
portal: u = !0,
|
|
26
26
|
portalContainer: m,
|
|
27
27
|
keepMounted: l,
|
|
28
28
|
...b
|
|
29
29
|
}, w) => {
|
|
30
|
-
const v = x(),
|
|
30
|
+
const v = x(), f = m ?? v, s = /* @__PURE__ */ r(
|
|
31
31
|
o.Positioner,
|
|
32
32
|
{
|
|
33
|
-
side:
|
|
34
|
-
align:
|
|
33
|
+
side: e,
|
|
34
|
+
align: t,
|
|
35
35
|
sideOffset: i,
|
|
36
36
|
className: "z-50",
|
|
37
37
|
children: /* @__PURE__ */ r(
|
|
@@ -44,55 +44,55 @@ const G = o.Portal, j = o.SubmenuRoot, p = "z-50 min-w-[8rem] overflow-y-auto ov
|
|
|
44
44
|
)
|
|
45
45
|
}
|
|
46
46
|
);
|
|
47
|
-
return u ? /* @__PURE__ */ r(o.Portal, { container:
|
|
47
|
+
return u ? /* @__PURE__ */ r(o.Portal, { container: f, keepMounted: l, children: s }) : s;
|
|
48
48
|
}
|
|
49
49
|
);
|
|
50
50
|
N.displayName = "DropdownMenuContent";
|
|
51
|
-
const D = d.forwardRef(({ className: n, sideOffset:
|
|
51
|
+
const D = d.forwardRef(({ className: n, sideOffset: e = 4, ...t }, i) => /* @__PURE__ */ r(o.Positioner, { sideOffset: e, className: "z-50", children: /* @__PURE__ */ r(
|
|
52
52
|
o.Popup,
|
|
53
53
|
{
|
|
54
54
|
ref: i,
|
|
55
55
|
className: a(p, n),
|
|
56
|
-
...
|
|
56
|
+
...t
|
|
57
57
|
}
|
|
58
58
|
) }));
|
|
59
59
|
D.displayName = "DropdownMenuSubContent";
|
|
60
|
-
const y = d.forwardRef(({ className: n, inset:
|
|
60
|
+
const y = d.forwardRef(({ className: n, inset: e, ...t }, i) => /* @__PURE__ */ r(
|
|
61
61
|
o.Item,
|
|
62
62
|
{
|
|
63
63
|
ref: i,
|
|
64
|
-
className: a(c,
|
|
65
|
-
...
|
|
64
|
+
className: a(c, e && "ps-8", n),
|
|
65
|
+
...t
|
|
66
66
|
}
|
|
67
67
|
));
|
|
68
68
|
y.displayName = "DropdownMenuItem";
|
|
69
|
-
const C = d.forwardRef(({ className: n, inset:
|
|
69
|
+
const C = d.forwardRef(({ className: n, inset: e, children: t, ...i }, u) => /* @__PURE__ */ g(
|
|
70
70
|
o.SubmenuTrigger,
|
|
71
71
|
{
|
|
72
72
|
ref: u,
|
|
73
73
|
className: a(
|
|
74
74
|
c,
|
|
75
75
|
"data-[popup-open]:bg-[var(--ui-button-menu-dropdown-item-container-color-active)]",
|
|
76
|
-
|
|
76
|
+
e && "ps-8",
|
|
77
77
|
n
|
|
78
78
|
),
|
|
79
79
|
...i,
|
|
80
80
|
children: [
|
|
81
|
-
|
|
82
|
-
/* @__PURE__ */ r(h, { className: "ms-auto text-[var(--ui-button-menu-dropdown-extras-cascade-icon-color)] rtl:rotate-180" })
|
|
81
|
+
t,
|
|
82
|
+
/* @__PURE__ */ r(h, { className: "ms-auto self-center text-[var(--ui-button-menu-dropdown-extras-cascade-icon-color)] rtl:rotate-180" })
|
|
83
83
|
]
|
|
84
84
|
}
|
|
85
85
|
));
|
|
86
86
|
C.displayName = "DropdownMenuSubTrigger";
|
|
87
87
|
function R({
|
|
88
88
|
className: n,
|
|
89
|
-
...
|
|
89
|
+
...e
|
|
90
90
|
}) {
|
|
91
91
|
return /* @__PURE__ */ r(
|
|
92
92
|
"span",
|
|
93
93
|
{
|
|
94
94
|
className: a("ms-auto shrink-0 text-sm font-normal leading-6 text-[var(--ui-button-menu-dropdown-extras-shortcut-label-color)]", n),
|
|
95
|
-
...
|
|
95
|
+
...e
|
|
96
96
|
}
|
|
97
97
|
);
|
|
98
98
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dropdown-menu.js","sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { ChevronRightIcon } from '@acronis-platform/icons-react/stroke-mono';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\n// A menu of actions anchored to a trigger, built on the Base UI Menu primitive\n// (positioning, focus management, typeahead, outside-press / Esc dismissal,\n// ARIA). Themed from the `--ui-button-menu-dropdown-*` token tier generated by\n// @acronis-platform/tokens-pd (ButtonMenu/default.css). Enter/exit animations\n// use `tw-animate-css` keyed to data-[open]/[closed]/[side].\n\nconst DropdownMenu = MenuPrimitive.Root;\nconst DropdownMenuTrigger = MenuPrimitive.Trigger;\nconst DropdownMenuGroup = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Group>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Group>\n>(({ className, ...props }, ref) => (\n <MenuPrimitive.Group\n ref={ref}\n className={cn(\n 'flex flex-col items-start overflow-clip gap-[var(--ui-button-menu-dropdown-section-list-gap)] px-[var(--ui-button-menu-dropdown-section-container-padding-x)] py-[var(--ui-button-menu-dropdown-section-container-padding-y)] [&:not(:first-child)]:border-t [&:not(:first-child)]:border-[length:var(--ui-button-menu-dropdown-section-container-border-width)] [&:not(:first-child)]:border-[var(--ui-button-menu-dropdown-section-container-border-color)]',\n className\n )}\n {...props}\n />\n));\nDropdownMenuGroup.displayName = 'DropdownMenuGroup';\nconst DropdownMenuPortal = MenuPrimitive.Portal;\nconst DropdownMenuSub = MenuPrimitive.SubmenuRoot;\n\nconst popupClassName =\n 'z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden flex flex-col gap-[var(--ui-button-menu-dropdown-container-gap)] bg-[var(--ui-button-menu-dropdown-container-color)] border-solid border-[length:var(--ui-button-menu-dropdown-container-border-width)] border-[var(--ui-button-menu-dropdown-container-border-color)] rounded-[var(--ui-button-menu-dropdown-container-border-radius)] px-[var(--ui-button-menu-dropdown-container-padding-x)] py-[var(--ui-button-menu-dropdown-container-padding-y)] shadow-md outline-none duration-200 data-[open]:animate-in data-[closed]:animate-out data-[open]:fade-in-0 data-[closed]:fade-out-0 data-[open]:zoom-in-95 data-[closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2';\n\nconst itemClassName =\n 'relative flex w-full shrink-0 cursor-default select-none items-start gap-[var(--ui-button-menu-dropdown-item-container-gap)] min-h-[var(--ui-button-menu-dropdown-item-container-height)] px-[var(--ui-button-menu-dropdown-item-container-padding-x)] py-[var(--ui-button-menu-dropdown-item-container-padding-y)] text-sm font-semibold leading-6 outline-none transition-colors bg-[var(--ui-button-menu-dropdown-item-container-color-idle)] text-[var(--ui-button-menu-dropdown-item-label-color)] [&_svg]:text-[var(--ui-button-menu-dropdown-item-icon-color)] data-[highlighted]:bg-[var(--ui-button-menu-dropdown-item-container-color-hover)] data-[highlighted]:active:bg-[var(--ui-button-menu-dropdown-item-container-color-active)] [&:focus-visible:not(:hover)]:rounded-[3px] [&:focus-visible:not(:hover)]:ring-[3px] [&:focus-visible:not(:hover)]:ring-inset [&:focus-visible:not(:hover)]:ring-[var(--ui-focus-primary)] data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0';\n\nexport interface DropdownMenuContentProps\n extends React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup> {\n side?: MenuPrimitive.Positioner.Props['side'];\n align?: MenuPrimitive.Positioner.Props['align'];\n sideOffset?: number;\n /** Render inside a portal (default `true`). */\n portal?: boolean;\n /** Portal container — pass a shadow-root mount for isolated-style previews. */\n portalContainer?: MenuPrimitive.Portal.Props['container'];\n keepMounted?: MenuPrimitive.Portal.Props['keepMounted'];\n}\n\nconst DropdownMenuContent = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Popup>,\n DropdownMenuContentProps\n>(\n (\n {\n className,\n side,\n align,\n sideOffset = 4,\n portal = true,\n portalContainer,\n keepMounted,\n ...props\n },\n ref\n ) => {\n const ctxContainer = usePortalContainer();\n const resolvedContainer = portalContainer ?? ctxContainer;\n\n const positioner = (\n <MenuPrimitive.Positioner\n side={side}\n align={align}\n sideOffset={sideOffset}\n className=\"z-50\"\n >\n <MenuPrimitive.Popup\n ref={ref}\n className={cn(popupClassName, className)}\n {...props}\n />\n </MenuPrimitive.Positioner>\n );\n return portal ? (\n <MenuPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n {positioner}\n </MenuPrimitive.Portal>\n ) : (\n positioner\n );\n }\n);\nDropdownMenuContent.displayName = 'DropdownMenuContent';\n\nconst DropdownMenuSubContent = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Popup>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup> & {\n sideOffset?: number;\n }\n>(({ className, sideOffset = 4, ...props }, ref) => (\n <MenuPrimitive.Positioner sideOffset={sideOffset} className=\"z-50\">\n <MenuPrimitive.Popup\n ref={ref}\n className={cn(popupClassName, className)}\n {...props}\n />\n </MenuPrimitive.Positioner>\n));\nDropdownMenuSubContent.displayName = 'DropdownMenuSubContent';\n\nconst DropdownMenuItem = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Item> & { inset?: boolean }\n>(({ className, inset, ...props }, ref) => (\n <MenuPrimitive.Item\n ref={ref}\n className={cn(itemClassName, inset && 'ps-8', className)}\n {...props}\n />\n));\nDropdownMenuItem.displayName = 'DropdownMenuItem';\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean;\n }\n>(({ className, inset, children, ...props }, ref) => (\n <MenuPrimitive.SubmenuTrigger\n ref={ref}\n className={cn(\n itemClassName,\n 'data-[popup-open]:bg-[var(--ui-button-menu-dropdown-item-container-color-active)]',\n inset && 'ps-8',\n className\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ms-auto text-[var(--ui-button-menu-dropdown-extras-cascade-icon-color)] rtl:rotate-180\" />\n </MenuPrimitive.SubmenuTrigger>\n));\nDropdownMenuSubTrigger.displayName = 'DropdownMenuSubTrigger';\n\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) {\n return (\n <span\n className={cn('ms-auto shrink-0 text-sm font-normal leading-6 text-[var(--ui-button-menu-dropdown-extras-shortcut-label-color)]', className)}\n {...props}\n />\n );\n}\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut';\n\nexport {\n DropdownMenu,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuPortal,\n};\n"],"names":["DropdownMenu","MenuPrimitive","DropdownMenuTrigger","DropdownMenuGroup","React","className","props","ref","jsx","cn","DropdownMenuPortal","DropdownMenuSub","popupClassName","itemClassName","DropdownMenuContent","side","align","sideOffset","portal","portalContainer","keepMounted","ctxContainer","usePortalContainer","resolvedContainer","positioner","DropdownMenuSubContent","DropdownMenuItem","inset","DropdownMenuSubTrigger","children","jsxs","ChevronRightIcon","DropdownMenuShortcut"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dropdown-menu.js","sources":["../../../../src/components/ui/dropdown-menu/dropdown-menu.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport { ChevronRightIcon } from '@acronis-platform/icons-react/stroke-mono';\n\nimport { cn } from '@/lib/utils';\nimport { usePortalContainer } from '@/lib/portal-container';\n\n// A menu of actions anchored to a trigger, built on the Base UI Menu primitive\n// (positioning, focus management, typeahead, outside-press / Esc dismissal,\n// ARIA). Themed from the `--ui-button-menu-dropdown-*` token tier generated by\n// @acronis-platform/tokens-pd (ButtonMenu/default.css). Enter/exit animations\n// use `tw-animate-css` keyed to data-[open]/[closed]/[side].\n\nconst DropdownMenu = MenuPrimitive.Root;\nconst DropdownMenuTrigger = MenuPrimitive.Trigger;\nconst DropdownMenuGroup = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Group>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Group>\n>(({ className, ...props }, ref) => (\n <MenuPrimitive.Group\n ref={ref}\n className={cn(\n 'flex flex-col items-start overflow-clip gap-[var(--ui-button-menu-dropdown-section-list-gap)] px-[var(--ui-button-menu-dropdown-section-container-padding-x)] py-[var(--ui-button-menu-dropdown-section-container-padding-y)] [&:not(:first-child)]:border-t [&:not(:first-child)]:border-[length:var(--ui-button-menu-dropdown-section-container-border-width)] [&:not(:first-child)]:border-[var(--ui-button-menu-dropdown-section-container-border-color)]',\n className\n )}\n {...props}\n />\n));\nDropdownMenuGroup.displayName = 'DropdownMenuGroup';\nconst DropdownMenuPortal = MenuPrimitive.Portal;\nconst DropdownMenuSub = MenuPrimitive.SubmenuRoot;\n\nconst popupClassName =\n 'z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden flex flex-col gap-[var(--ui-button-menu-dropdown-container-gap)] bg-[var(--ui-button-menu-dropdown-container-color)] border-solid border-[length:var(--ui-button-menu-dropdown-container-border-width)] border-[var(--ui-button-menu-dropdown-container-border-color)] rounded-[var(--ui-button-menu-dropdown-container-border-radius)] px-[var(--ui-button-menu-dropdown-container-padding-x)] py-[var(--ui-button-menu-dropdown-container-padding-y)] shadow-md outline-none duration-200 data-[open]:animate-in data-[closed]:animate-out data-[open]:fade-in-0 data-[closed]:fade-out-0 data-[open]:zoom-in-95 data-[closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2';\n\nconst itemClassName =\n 'relative flex w-full shrink-0 cursor-default select-none items-start gap-[var(--ui-button-menu-dropdown-item-container-gap)] min-h-[var(--ui-button-menu-dropdown-item-container-height)] px-[var(--ui-button-menu-dropdown-item-container-padding-x)] py-[var(--ui-button-menu-dropdown-item-container-padding-y)] text-sm font-semibold leading-6 outline-none transition-colors bg-[var(--ui-button-menu-dropdown-item-container-color-idle)] text-[var(--ui-button-menu-dropdown-item-label-color)] [&_svg]:text-[var(--ui-button-menu-dropdown-item-icon-color)] data-[highlighted]:bg-[var(--ui-button-menu-dropdown-item-container-color-hover)] data-[highlighted]:active:bg-[var(--ui-button-menu-dropdown-item-container-color-active)] [&:focus-visible:not(:hover)]:rounded-[3px] [&:focus-visible:not(:hover)]:ring-[3px] [&:focus-visible:not(:hover)]:ring-inset [&:focus-visible:not(:hover)]:ring-[var(--ui-focus-primary)] data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0';\n\nexport interface DropdownMenuContentProps\n extends React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup> {\n side?: MenuPrimitive.Positioner.Props['side'];\n align?: MenuPrimitive.Positioner.Props['align'];\n sideOffset?: number;\n /** Render inside a portal (default `true`). */\n portal?: boolean;\n /** Portal container — pass a shadow-root mount for isolated-style previews. */\n portalContainer?: MenuPrimitive.Portal.Props['container'];\n keepMounted?: MenuPrimitive.Portal.Props['keepMounted'];\n}\n\nconst DropdownMenuContent = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Popup>,\n DropdownMenuContentProps\n>(\n (\n {\n className,\n side,\n align,\n sideOffset = 4,\n portal = true,\n portalContainer,\n keepMounted,\n ...props\n },\n ref\n ) => {\n const ctxContainer = usePortalContainer();\n const resolvedContainer = portalContainer ?? ctxContainer;\n\n const positioner = (\n <MenuPrimitive.Positioner\n side={side}\n align={align}\n sideOffset={sideOffset}\n className=\"z-50\"\n >\n <MenuPrimitive.Popup\n ref={ref}\n className={cn(popupClassName, className)}\n {...props}\n />\n </MenuPrimitive.Positioner>\n );\n return portal ? (\n <MenuPrimitive.Portal container={resolvedContainer} keepMounted={keepMounted}>\n {positioner}\n </MenuPrimitive.Portal>\n ) : (\n positioner\n );\n }\n);\nDropdownMenuContent.displayName = 'DropdownMenuContent';\n\nconst DropdownMenuSubContent = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Popup>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup> & {\n sideOffset?: number;\n }\n>(({ className, sideOffset = 4, ...props }, ref) => (\n <MenuPrimitive.Positioner sideOffset={sideOffset} className=\"z-50\">\n <MenuPrimitive.Popup\n ref={ref}\n className={cn(popupClassName, className)}\n {...props}\n />\n </MenuPrimitive.Positioner>\n));\nDropdownMenuSubContent.displayName = 'DropdownMenuSubContent';\n\nconst DropdownMenuItem = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.Item>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.Item> & { inset?: boolean }\n>(({ className, inset, ...props }, ref) => (\n <MenuPrimitive.Item\n ref={ref}\n className={cn(itemClassName, inset && 'ps-8', className)}\n {...props}\n />\n));\nDropdownMenuItem.displayName = 'DropdownMenuItem';\n\nconst DropdownMenuSubTrigger = React.forwardRef<\n React.ElementRef<typeof MenuPrimitive.SubmenuTrigger>,\n React.ComponentPropsWithoutRef<typeof MenuPrimitive.SubmenuTrigger> & {\n inset?: boolean;\n }\n>(({ className, inset, children, ...props }, ref) => (\n <MenuPrimitive.SubmenuTrigger\n ref={ref}\n className={cn(\n itemClassName,\n 'data-[popup-open]:bg-[var(--ui-button-menu-dropdown-item-container-color-active)]',\n inset && 'ps-8',\n className\n )}\n {...props}\n >\n {children}\n <ChevronRightIcon className=\"ms-auto self-center text-[var(--ui-button-menu-dropdown-extras-cascade-icon-color)] rtl:rotate-180\" />\n </MenuPrimitive.SubmenuTrigger>\n));\nDropdownMenuSubTrigger.displayName = 'DropdownMenuSubTrigger';\n\n\nfunction DropdownMenuShortcut({\n className,\n ...props\n}: React.HTMLAttributes<HTMLSpanElement>) {\n return (\n <span\n className={cn('ms-auto shrink-0 text-sm font-normal leading-6 text-[var(--ui-button-menu-dropdown-extras-shortcut-label-color)]', className)}\n {...props}\n />\n );\n}\nDropdownMenuShortcut.displayName = 'DropdownMenuShortcut';\n\nexport {\n DropdownMenu,\n DropdownMenuTrigger,\n DropdownMenuContent,\n DropdownMenuGroup,\n DropdownMenuItem,\n DropdownMenuShortcut,\n DropdownMenuSub,\n DropdownMenuSubContent,\n DropdownMenuSubTrigger,\n DropdownMenuPortal,\n};\n"],"names":["DropdownMenu","MenuPrimitive","DropdownMenuTrigger","DropdownMenuGroup","React","className","props","ref","jsx","cn","DropdownMenuPortal","DropdownMenuSub","popupClassName","itemClassName","DropdownMenuContent","side","align","sideOffset","portal","portalContainer","keepMounted","ctxContainer","usePortalContainer","resolvedContainer","positioner","DropdownMenuSubContent","DropdownMenuItem","inset","DropdownMenuSubTrigger","children","jsxs","ChevronRightIcon","DropdownMenuShortcut"],"mappings":"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"}
|
|
@@ -1,79 +1,80 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as n, jsxs as d } from "react/jsx-runtime";
|
|
2
2
|
import * as a from "react";
|
|
3
|
-
import { ChevronDownIcon as
|
|
4
|
-
import { cn as
|
|
5
|
-
import { deepEqual as
|
|
6
|
-
import { Chip as
|
|
7
|
-
import { Button as
|
|
8
|
-
import { Popover as
|
|
9
|
-
const
|
|
10
|
-
({ className: t, ...e },
|
|
3
|
+
import { ChevronDownIcon as A } from "@acronis-platform/icons-react/stroke-mono";
|
|
4
|
+
import { cn as u } from "../../../lib/utils.js";
|
|
5
|
+
import { deepEqual as P } from "../../../lib/deep-equal.js";
|
|
6
|
+
import { Chip as $ } from "../chip/chip.js";
|
|
7
|
+
import { Button as p } from "../button/button.js";
|
|
8
|
+
import { Popover as E, PopoverTrigger as q, PopoverContent as z } from "../popover/popover.js";
|
|
9
|
+
const B = a.forwardRef(
|
|
10
|
+
({ className: t, ...e }, r) => /* @__PURE__ */ n(
|
|
11
11
|
"div",
|
|
12
12
|
{
|
|
13
|
-
ref:
|
|
14
|
-
className:
|
|
13
|
+
ref: r,
|
|
14
|
+
className: u("flex items-center gap-4", t),
|
|
15
15
|
...e
|
|
16
16
|
}
|
|
17
17
|
)
|
|
18
18
|
);
|
|
19
|
-
|
|
20
|
-
const
|
|
19
|
+
B.displayName = "FilterSearch";
|
|
20
|
+
const I = a.forwardRef(({ className: t, ...e }, r) => /* @__PURE__ */ n(
|
|
21
21
|
"div",
|
|
22
22
|
{
|
|
23
|
-
ref:
|
|
24
|
-
className:
|
|
23
|
+
ref: r,
|
|
24
|
+
className: u("flex h-8 min-w-px flex-1 items-center justify-end gap-4", t),
|
|
25
25
|
...e
|
|
26
26
|
}
|
|
27
27
|
));
|
|
28
|
-
|
|
29
|
-
const
|
|
30
|
-
function
|
|
31
|
-
const t = a.useContext(
|
|
28
|
+
I.displayName = "FilterSearchActions";
|
|
29
|
+
const C = a.createContext(null);
|
|
30
|
+
function X() {
|
|
31
|
+
const t = a.useContext(C);
|
|
32
32
|
if (t === null)
|
|
33
33
|
throw new Error(
|
|
34
34
|
"useFilterSearchFilters must be used within a <FilterSearchFilters> popover."
|
|
35
35
|
);
|
|
36
36
|
return t;
|
|
37
37
|
}
|
|
38
|
-
const
|
|
39
|
-
const [
|
|
40
|
-
|
|
41
|
-
},
|
|
42
|
-
|
|
43
|
-
if (
|
|
44
|
-
if (!(
|
|
45
|
-
const
|
|
46
|
-
return delete
|
|
38
|
+
const J = a.forwardRef(({ value: t, onValueChange: e, onApply: r, label: s = "Filters", children: b, className: x, ...m }, v) => {
|
|
39
|
+
const [o, l] = a.useState(!1), [c, f] = a.useState(t), N = (i) => {
|
|
40
|
+
f(t), l(i);
|
|
41
|
+
}, F = a.useCallback((i, g) => {
|
|
42
|
+
f((h) => {
|
|
43
|
+
if (g === void 0) {
|
|
44
|
+
if (!(i in h)) return h;
|
|
45
|
+
const S = { ...h };
|
|
46
|
+
return delete S[i], S;
|
|
47
47
|
}
|
|
48
|
-
return { ...
|
|
48
|
+
return { ...h, [i]: g };
|
|
49
49
|
});
|
|
50
|
-
}, []),
|
|
51
|
-
() => ({ filters:
|
|
52
|
-
[
|
|
53
|
-
),
|
|
54
|
-
|
|
55
|
-
},
|
|
56
|
-
e(
|
|
57
|
-
},
|
|
58
|
-
return /* @__PURE__ */
|
|
59
|
-
/* @__PURE__ */
|
|
60
|
-
|
|
50
|
+
}, []), y = a.useMemo(
|
|
51
|
+
() => ({ filters: c, setFilter: F }),
|
|
52
|
+
[c, F]
|
|
53
|
+
), w = () => f({}), R = () => {
|
|
54
|
+
f(t), l(!1);
|
|
55
|
+
}, j = () => {
|
|
56
|
+
e(c), r == null || r(c), l(!1);
|
|
57
|
+
}, O = Object.keys(c).length === 0, D = P(c, t);
|
|
58
|
+
return /* @__PURE__ */ d(E, { open: o, onOpenChange: N, children: [
|
|
59
|
+
/* @__PURE__ */ d(
|
|
60
|
+
q,
|
|
61
61
|
{
|
|
62
|
-
ref:
|
|
63
|
-
render: /* @__PURE__ */
|
|
64
|
-
|
|
62
|
+
ref: v,
|
|
63
|
+
render: /* @__PURE__ */ n(
|
|
64
|
+
p,
|
|
65
65
|
{
|
|
66
66
|
variant: "secondary",
|
|
67
|
-
className:
|
|
67
|
+
className: u(
|
|
68
68
|
"group data-[popup-open]:border-[var(--ui-button-secondary-container-border-color-active)] data-[popup-open]:bg-[var(--ui-button-secondary-container-color-active)] data-[popup-open]:text-[var(--ui-button-secondary-label-color-active)]",
|
|
69
|
-
|
|
70
|
-
)
|
|
69
|
+
x
|
|
70
|
+
),
|
|
71
|
+
...m
|
|
71
72
|
}
|
|
72
73
|
),
|
|
73
74
|
children: [
|
|
74
|
-
|
|
75
|
-
/* @__PURE__ */
|
|
76
|
-
|
|
75
|
+
s,
|
|
76
|
+
/* @__PURE__ */ n(
|
|
77
|
+
A,
|
|
77
78
|
{
|
|
78
79
|
size: 16,
|
|
79
80
|
className: "transition-transform group-data-[popup-open]:rotate-180"
|
|
@@ -82,28 +83,28 @@ const I = a.forwardRef(({ value: t, onValueChange: e, onApply: n, label: l = "Fi
|
|
|
82
83
|
]
|
|
83
84
|
}
|
|
84
85
|
),
|
|
85
|
-
/* @__PURE__ */
|
|
86
|
+
/* @__PURE__ */ n(z, { align: "start", className: "w-96 p-0", children: /* @__PURE__ */ d(
|
|
86
87
|
"form",
|
|
87
88
|
{
|
|
88
|
-
onSubmit: (
|
|
89
|
-
|
|
89
|
+
onSubmit: (i) => {
|
|
90
|
+
i.preventDefault(), j();
|
|
90
91
|
},
|
|
91
92
|
children: [
|
|
92
|
-
/* @__PURE__ */
|
|
93
|
-
/* @__PURE__ */
|
|
94
|
-
/* @__PURE__ */
|
|
95
|
-
|
|
93
|
+
/* @__PURE__ */ n("div", { className: "flex max-h-80 flex-col gap-4 overflow-y-auto p-4", children: /* @__PURE__ */ n(C.Provider, { value: y, children: b }) }),
|
|
94
|
+
/* @__PURE__ */ d("div", { className: "flex items-center gap-2 border-t border-border p-4", children: [
|
|
95
|
+
/* @__PURE__ */ n(
|
|
96
|
+
p,
|
|
96
97
|
{
|
|
97
98
|
type: "button",
|
|
98
99
|
variant: "ghost",
|
|
99
|
-
disabled:
|
|
100
|
-
onClick:
|
|
100
|
+
disabled: O,
|
|
101
|
+
onClick: w,
|
|
101
102
|
children: "Reset filters"
|
|
102
103
|
}
|
|
103
104
|
),
|
|
104
|
-
/* @__PURE__ */
|
|
105
|
-
/* @__PURE__ */
|
|
106
|
-
/* @__PURE__ */
|
|
105
|
+
/* @__PURE__ */ d("div", { className: "ms-auto flex items-center gap-2", children: [
|
|
106
|
+
/* @__PURE__ */ n(p, { type: "button", variant: "secondary", onClick: R, children: "Cancel" }),
|
|
107
|
+
/* @__PURE__ */ n(p, { type: "submit", variant: "default", disabled: D, children: "Apply" })
|
|
107
108
|
] })
|
|
108
109
|
] })
|
|
109
110
|
]
|
|
@@ -111,41 +112,41 @@ const I = a.forwardRef(({ value: t, onValueChange: e, onApply: n, label: l = "Fi
|
|
|
111
112
|
) })
|
|
112
113
|
] });
|
|
113
114
|
});
|
|
114
|
-
|
|
115
|
-
function
|
|
116
|
-
const
|
|
117
|
-
return `${t}: ${
|
|
115
|
+
J.displayName = "FilterSearchFilters";
|
|
116
|
+
function L(t, e) {
|
|
117
|
+
const r = Array.isArray(e) ? e.map((s) => String(s)).join(", ") : typeof e == "object" && e !== null ? JSON.stringify(e) : String(e);
|
|
118
|
+
return `${t}: ${r}`;
|
|
118
119
|
}
|
|
119
|
-
const
|
|
120
|
-
const
|
|
121
|
-
if (
|
|
122
|
-
const
|
|
123
|
-
const
|
|
124
|
-
delete
|
|
120
|
+
const M = a.forwardRef(({ className: t, filters: e, onValueChange: r, getFilterChipLabel: s, ...b }, x) => {
|
|
121
|
+
const m = Object.keys(e);
|
|
122
|
+
if (m.length === 0) return null;
|
|
123
|
+
const v = (o) => {
|
|
124
|
+
const l = { ...e };
|
|
125
|
+
delete l[o], r(l);
|
|
125
126
|
};
|
|
126
|
-
return /* @__PURE__ */
|
|
127
|
+
return /* @__PURE__ */ d(
|
|
127
128
|
"div",
|
|
128
129
|
{
|
|
129
|
-
ref:
|
|
130
|
-
className:
|
|
131
|
-
...
|
|
130
|
+
ref: x,
|
|
131
|
+
className: u("flex flex-wrap items-center gap-3", t),
|
|
132
|
+
...b,
|
|
132
133
|
children: [
|
|
133
|
-
|
|
134
|
-
|
|
134
|
+
m.map((o) => /* @__PURE__ */ n(
|
|
135
|
+
$,
|
|
135
136
|
{
|
|
136
137
|
variant: "removable",
|
|
137
|
-
onRemove: () =>
|
|
138
|
-
removeLabel: `Remove ${
|
|
139
|
-
children:
|
|
138
|
+
onRemove: () => v(o),
|
|
139
|
+
removeLabel: `Remove ${o} filter`,
|
|
140
|
+
children: s ? s(o, e[o]) : L(o, e[o])
|
|
140
141
|
},
|
|
141
|
-
|
|
142
|
+
o
|
|
142
143
|
)),
|
|
143
|
-
/* @__PURE__ */
|
|
144
|
-
|
|
144
|
+
/* @__PURE__ */ n(
|
|
145
|
+
p,
|
|
145
146
|
{
|
|
146
147
|
type: "button",
|
|
147
148
|
variant: "ghost",
|
|
148
|
-
onClick: () =>
|
|
149
|
+
onClick: () => r({}),
|
|
149
150
|
children: "Reset filters"
|
|
150
151
|
}
|
|
151
152
|
)
|
|
@@ -153,12 +154,12 @@ const L = a.forwardRef(({ className: t, filters: e, onValueChange: n, getFilterC
|
|
|
153
154
|
}
|
|
154
155
|
);
|
|
155
156
|
});
|
|
156
|
-
|
|
157
|
+
M.displayName = "FilterSearchAppliedFilters";
|
|
157
158
|
export {
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
159
|
+
B as FilterSearch,
|
|
160
|
+
I as FilterSearchActions,
|
|
161
|
+
M as FilterSearchAppliedFilters,
|
|
162
|
+
J as FilterSearchFilters,
|
|
163
|
+
X as useFilterSearchFilters
|
|
163
164
|
};
|
|
164
165
|
//# sourceMappingURL=filter-search.js.map
|