prime-ui-kit 0.5.1 → 0.7.1
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 +11 -2
- package/dist/components/accordion/examples/02-settings-panels.d.ts.map +1 -1
- package/dist/components/accordion/examples/04-api-docs-sections.d.ts.map +1 -1
- package/dist/components/accordion/examples/05-knowledge-base-categories.d.ts.map +1 -1
- package/dist/components/avatar/examples/app-header-nav.d.ts.map +1 -1
- package/dist/components/avatar/examples/src-from-state.d.ts.map +1 -1
- package/dist/components/banner/examples/cookie-consent-row.d.ts.map +1 -1
- package/dist/components/banner/examples/feature-promo.d.ts.map +1 -1
- package/dist/components/checkbox/examples/bulk-select-rows.d.ts.map +1 -1
- package/dist/components/checkbox/examples/empty-label-form.d.ts.map +1 -1
- package/dist/components/checkbox/examples/feature-flags-list.d.ts.map +1 -1
- package/dist/components/checkbox/examples/settings-panel.d.ts.map +1 -1
- package/dist/components/color-picker/ColorPicker.d.ts.map +1 -1
- package/dist/components/color-picker/ColorPickerRac.d.ts.map +1 -1
- package/dist/components/color-picker/examples/controlled-form-field.d.ts.map +1 -1
- package/dist/components/color-picker/examples/theme-accent.d.ts.map +1 -1
- package/dist/components/command-menu/examples/composition-tags-footer.d.ts.map +1 -1
- package/dist/components/command-menu/examples/variants-density-items.d.ts.map +1 -1
- package/dist/components/datepicker/examples/full-width-form.d.ts.map +1 -1
- package/dist/components/digit-input/examples/error-state.d.ts.map +1 -1
- package/dist/components/digit-input/examples/resend-and-clear.d.ts.map +1 -1
- package/dist/components/divider/examples/section-breaks.d.ts.map +1 -1
- package/dist/components/dropdown/Dropdown.d.ts +0 -14
- package/dist/components/dropdown/Dropdown.d.ts.map +1 -1
- package/dist/components/dropdown/examples/account-menu.d.ts.map +1 -1
- package/dist/components/dropdown/examples/actions-menu.d.ts.map +1 -1
- package/dist/components/dropdown/examples/full-width.d.ts.map +1 -1
- package/dist/components/empty-page/EmptyPage.d.ts +63 -0
- package/dist/components/empty-page/EmptyPage.d.ts.map +1 -0
- package/dist/components/empty-page/examples/canonical.d.ts +3 -0
- package/dist/components/empty-page/examples/canonical.d.ts.map +1 -0
- package/dist/components/empty-page/examples/sizes.d.ts +3 -0
- package/dist/components/empty-page/examples/sizes.d.ts.map +1 -0
- package/dist/components/empty-page/examples/table-region.d.ts +6 -0
- package/dist/components/empty-page/examples/table-region.d.ts.map +1 -0
- package/dist/components/hint/examples/a11y-describedby.d.ts.map +1 -1
- package/dist/components/hint/examples/error-hint.d.ts.map +1 -1
- package/dist/components/hint/examples/field-help.d.ts.map +1 -1
- package/dist/components/hint/examples/field-states.d.ts.map +1 -1
- package/dist/components/hint/examples/inline-tip-form.d.ts.map +1 -1
- package/dist/components/hint/examples/success-confirmation.d.ts.map +1 -1
- package/dist/components/hint/examples/variants.d.ts.map +1 -1
- package/dist/components/index.css +278 -115
- package/dist/components/index.css.map +4 -4
- package/dist/components/index.d.ts +3 -1
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +376 -356
- package/dist/components/index.js.map +4 -4
- package/dist/components/input/examples/login-email.d.ts.map +1 -1
- package/dist/components/input/examples/search.d.ts.map +1 -1
- package/dist/components/link-button/examples/disabled.d.ts.map +1 -1
- package/dist/components/link-button/examples/external.d.ts.map +1 -1
- package/dist/components/link-button/examples/inline-text-link.d.ts.map +1 -1
- package/dist/components/link-button/examples/navigation-cluster.d.ts.map +1 -1
- package/dist/components/modal/examples/pattern-controlled.d.ts.map +1 -1
- package/dist/components/modal/examples/pattern-portal-and-scroll.d.ts.map +1 -1
- package/dist/components/modal/examples/scenario-multi-field-form.d.ts.map +1 -1
- package/dist/components/notification/examples/action-toast.d.ts.map +1 -1
- package/dist/components/notification/examples/error-success.d.ts.map +1 -1
- package/dist/components/popover/Popover.d.ts +3 -3
- package/dist/components/popover/Popover.d.ts.map +1 -1
- package/dist/components/popover/examples/composition.d.ts +1 -1
- package/dist/components/popover/examples/date-trigger.d.ts.map +1 -1
- package/dist/components/popover/examples/features.d.ts.map +1 -1
- package/dist/components/popover/examples/form-in-popover.d.ts.map +1 -1
- package/dist/components/popover/examples/full-width.d.ts.map +1 -1
- package/dist/components/popover/examples/placement.d.ts.map +1 -1
- package/dist/components/popover/examples/rich-content.d.ts.map +1 -1
- package/dist/components/popover/examples/sizes.d.ts +1 -1
- package/dist/components/progress-bar/examples/step-progress.d.ts.map +1 -1
- package/dist/components/progress-circle/examples/dashboard-ring.d.ts.map +1 -1
- package/dist/components/progress-circle/examples/states.d.ts.map +1 -1
- package/dist/components/radio/examples/plan-picker.d.ts.map +1 -1
- package/dist/components/segmented-control/examples/pricing-toggle.d.ts.map +1 -1
- package/dist/components/segmented-control/examples/view-mode.d.ts.map +1 -1
- package/dist/components/select/examples/01-country.d.ts.map +1 -1
- package/dist/components/select/examples/02-controlled.d.ts.map +1 -1
- package/dist/components/select/examples/03-groups.d.ts.map +1 -1
- package/dist/components/select/examples/04-full-width-form.d.ts.map +1 -1
- package/dist/components/switch/examples/composition.d.ts.map +1 -1
- package/dist/components/switch/examples/scenario-feature-flag.d.ts.map +1 -1
- package/dist/components/tabs/examples/01-settings-vertical-rail.d.ts.map +1 -1
- package/dist/components/tag/examples/controlled.d.ts.map +1 -1
- package/dist/components/textarea/examples/01-support-ticket.d.ts.map +1 -1
- package/dist/components/textarea/examples/02-comment.d.ts.map +1 -1
- package/dist/components/textarea/examples/controlled.d.ts.map +1 -1
- package/dist/components/textarea/examples/features.d.ts.map +1 -1
- package/dist/components/tooltip/examples/composition.d.ts.map +1 -1
- package/dist/index.css +278 -115
- package/dist/index.css.map +4 -4
- package/dist/index.js +378 -357
- package/dist/index.js.map +4 -4
- package/dist/internal/states.d.ts +2 -0
- package/dist/internal/states.d.ts.map +1 -1
- package/dist/layout/app-shell/AppShell.d.ts +0 -8
- package/dist/layout/app-shell/AppShell.d.ts.map +1 -1
- package/dist/layout/index.d.ts +1 -1
- package/dist/layout/index.d.ts.map +1 -1
- package/dist/layout/sidebar/examples/01-app-shell-nav.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/accordion/COMPONENT.md +1 -1
- package/src/components/accordion/examples/01-faq-marketing.tsx +1 -1
- package/src/components/accordion/examples/02-settings-panels.tsx +1 -6
- package/src/components/accordion/examples/03-checkout-order-summary.tsx +1 -1
- package/src/components/accordion/examples/04-api-docs-sections.tsx +0 -1
- package/src/components/accordion/examples/05-knowledge-base-categories.tsx +1 -7
- package/src/components/avatar/COMPONENT.md +2 -2
- package/src/components/avatar/examples/app-header-nav.tsx +5 -13
- package/src/components/avatar/examples/comment-thread.tsx +1 -1
- package/src/components/avatar/examples/src-from-state.tsx +0 -1
- package/src/components/badge/examples/admin-tags.tsx +6 -6
- package/src/components/badge/examples/ecommerce-inventory.tsx +5 -5
- package/src/components/badge/examples/inbox-labels.tsx +5 -5
- package/src/components/badge/examples/status-presence.tsx +4 -4
- package/src/components/banner/examples/controlled-visibility.tsx +1 -1
- package/src/components/banner/examples/cookie-consent-row.tsx +0 -1
- package/src/components/banner/examples/feature-promo.tsx +0 -1
- package/src/components/button/examples/canonical-composition.tsx +4 -4
- package/src/components/button/examples/destructive-confirm.tsx +3 -3
- package/src/components/button/examples/form-submit-row.tsx +2 -2
- package/src/components/button/examples/full-width-stack.tsx +2 -2
- package/src/components/button/examples/icon-composition.tsx +6 -6
- package/src/components/button/examples/toolbar.tsx +4 -4
- package/src/components/button-group/COMPONENT.md +1 -1
- package/src/components/button-group/examples/editor-toolbar.tsx +1 -1
- package/src/components/button-group/examples/form-footer.tsx +1 -1
- package/src/components/button-group/examples/full-width.tsx +1 -1
- package/src/components/button-group/examples/view-switcher.tsx +1 -1
- package/src/components/button-group/examples/wizard-actions.tsx +1 -1
- package/src/components/checkbox/examples/bulk-select-rows.tsx +0 -2
- package/src/components/checkbox/examples/empty-label-form.tsx +1 -2
- package/src/components/checkbox/examples/feature-flags-list.tsx +0 -1
- package/src/components/checkbox/examples/settings-panel.tsx +1 -4
- package/src/components/color-picker/COMPONENT.md +2 -2
- package/src/components/color-picker/examples/brand-kit.tsx +3 -3
- package/src/components/color-picker/examples/controlled-form-field.tsx +4 -6
- package/src/components/color-picker/examples/field-eyedropper.tsx +2 -2
- package/src/components/color-picker/examples/format-variants.tsx +2 -2
- package/src/components/color-picker/examples/full-width.tsx +2 -2
- package/src/components/color-picker/examples/minimal-popover.tsx +2 -2
- package/src/components/color-picker/examples/panel-placement.tsx +4 -4
- package/src/components/color-picker/examples/product-variant-swatch.tsx +2 -2
- package/src/components/color-picker/examples/readout-trigger.tsx +2 -2
- package/src/components/color-picker/examples/states.tsx +4 -4
- package/src/components/color-picker/examples/theme-accent.tsx +2 -7
- package/src/components/command-menu/examples/app-palette.tsx +1 -1
- package/src/components/command-menu/examples/composition-tags-footer.tsx +2 -7
- package/src/components/command-menu/examples/controlled-open-search.tsx +1 -1
- package/src/components/command-menu/examples/disabled-items.tsx +1 -1
- package/src/components/command-menu/examples/file-search.tsx +1 -1
- package/src/components/command-menu/examples/full-width-panel.tsx +1 -1
- package/src/components/command-menu/examples/item-icon-as.tsx +1 -1
- package/src/components/command-menu/examples/quick-actions.tsx +1 -1
- package/src/components/command-menu/examples/variants-density-items.tsx +2 -4
- package/src/components/data-table/COMPONENT.md +2 -0
- package/src/components/datepicker/examples/birthdate.tsx +2 -2
- package/src/components/datepicker/examples/booking.tsx +2 -2
- package/src/components/datepicker/examples/full-width-form.tsx +3 -10
- package/src/components/datepicker/examples/range-report.tsx +2 -2
- package/src/components/digit-input/examples/composition.tsx +3 -3
- package/src/components/digit-input/examples/error-state.tsx +3 -5
- package/src/components/digit-input/examples/otp-login.tsx +3 -3
- package/src/components/digit-input/examples/resend-and-clear.tsx +3 -9
- package/src/components/digit-input/examples/verification-step.tsx +4 -4
- package/src/components/divider/examples/card-splits.tsx +2 -2
- package/src/components/divider/examples/inset-stack.tsx +1 -1
- package/src/components/divider/examples/line-spacing-column.tsx +3 -3
- package/src/components/divider/examples/section-breaks.tsx +2 -6
- package/src/components/drawer/COMPONENT.md +1 -1
- package/src/components/drawer/examples/cart-preview.tsx +4 -4
- package/src/components/drawer/examples/explicit-panel.tsx +3 -3
- package/src/components/drawer/examples/filters-panel.tsx +7 -7
- package/src/components/drawer/examples/mobile-nav-sheet.tsx +3 -3
- package/src/components/drawer/examples/settings-side.tsx +6 -6
- package/src/components/dropdown/COMPONENT.md +5 -18
- package/src/components/dropdown/examples/account-menu.tsx +31 -33
- package/src/components/dropdown/examples/actions-menu.tsx +0 -1
- package/src/components/dropdown/examples/composition.tsx +1 -1
- package/src/components/dropdown/examples/controlled.tsx +1 -1
- package/src/components/dropdown/examples/dropdown-examples.module.css +0 -4
- package/src/components/dropdown/examples/full-width.tsx +0 -1
- package/src/components/dropdown/examples/select-like-list.tsx +1 -1
- package/src/components/dropdown/examples/states.tsx +1 -1
- package/src/components/dropdown/examples/variants.tsx +1 -1
- package/src/components/empty-page/COMPONENT.md +143 -0
- package/src/components/empty-page/examples/canonical.tsx +22 -0
- package/src/components/empty-page/examples/examples-demos.module.css +25 -0
- package/src/components/empty-page/examples/sizes.tsx +23 -0
- package/src/components/empty-page/examples/table-region.tsx +35 -0
- package/src/components/file-upload/examples/full-width.tsx +1 -1
- package/src/components/hint/examples/a11y-describedby.tsx +2 -4
- package/src/components/hint/examples/controlled-variant.tsx +1 -1
- package/src/components/hint/examples/error-hint.tsx +3 -5
- package/src/components/hint/examples/field-help.tsx +3 -5
- package/src/components/hint/examples/field-states.tsx +9 -19
- package/src/components/hint/examples/inline-tip-form.tsx +6 -10
- package/src/components/hint/examples/success-confirmation.tsx +3 -5
- package/src/components/hint/examples/variants.tsx +3 -9
- package/src/components/hint/examples/with-icon.tsx +1 -1
- package/src/components/input/examples/affix-url-and-amount.tsx +2 -2
- package/src/components/input/examples/checkout-full-width.tsx +2 -2
- package/src/components/input/examples/login-email.tsx +1 -5
- package/src/components/input/examples/password-with-hint.tsx +1 -1
- package/src/components/input/examples/search.tsx +0 -1
- package/src/components/kbd/examples/composition-chord-icon.tsx +1 -1
- package/src/components/kbd/examples/toolbar-hints.tsx +2 -2
- package/src/components/label/examples/with-icon.tsx +1 -1
- package/src/components/link-button/COMPONENT.md +1 -1
- package/src/components/link-button/examples/composition.tsx +3 -3
- package/src/components/link-button/examples/disabled.tsx +2 -4
- package/src/components/link-button/examples/external.tsx +1 -6
- package/src/components/link-button/examples/inline-text-link.tsx +2 -4
- package/src/components/link-button/examples/navigation-cluster.tsx +4 -12
- package/src/components/modal/COMPONENT.md +4 -4
- package/src/components/modal/examples/canonical-maximal.tsx +4 -4
- package/src/components/modal/examples/pattern-close-behavior.tsx +3 -3
- package/src/components/modal/examples/pattern-controlled.tsx +3 -5
- package/src/components/modal/examples/pattern-full-width-footer.tsx +3 -3
- package/src/components/modal/examples/pattern-portal-and-scroll.tsx +3 -5
- package/src/components/modal/examples/scenario-confirm-delete.tsx +3 -3
- package/src/components/modal/examples/scenario-edit-entity.tsx +4 -4
- package/src/components/modal/examples/scenario-legal-consent.tsx +2 -2
- package/src/components/modal/examples/scenario-multi-field-form.tsx +7 -13
- package/src/components/notification/examples/action-toast.tsx +0 -2
- package/src/components/notification/examples/error-success.tsx +0 -2
- package/src/components/page-content/COMPONENT.md +10 -5
- package/src/components/popover/COMPONENT.md +1 -1
- package/src/components/popover/examples/as-child.tsx +1 -1
- package/src/components/popover/examples/canonical-panel.tsx +2 -2
- package/src/components/popover/examples/composition.tsx +7 -7
- package/src/components/popover/examples/controlled.tsx +4 -4
- package/src/components/popover/examples/date-trigger.tsx +3 -10
- package/src/components/popover/examples/features.tsx +6 -13
- package/src/components/popover/examples/form-in-popover.tsx +5 -13
- package/src/components/popover/examples/full-width.tsx +2 -9
- package/src/components/popover/examples/inset-variants.tsx +6 -6
- package/src/components/popover/examples/placement.tsx +2 -7
- package/src/components/popover/examples/rich-content.tsx +6 -8
- package/src/components/popover/examples/sizes.tsx +5 -5
- package/src/components/popover/examples/states.tsx +4 -4
- package/src/components/progress-bar/examples/indeterminate-busy-state.tsx +1 -1
- package/src/components/progress-bar/examples/step-progress.tsx +0 -1
- package/src/components/progress-bar/examples/upload-progress.tsx +1 -1
- package/src/components/progress-bar/examples/wizard-composition.tsx +1 -1
- package/src/components/progress-circle/examples/a11y-label.tsx +1 -1
- package/src/components/progress-circle/examples/composition.tsx +2 -2
- package/src/components/progress-circle/examples/dashboard-ring.tsx +1 -6
- package/src/components/progress-circle/examples/max-scale.tsx +3 -3
- package/src/components/progress-circle/examples/states.tsx +5 -13
- package/src/components/radio/examples/notification-channel.tsx +3 -3
- package/src/components/radio/examples/plan-picker.tsx +0 -3
- package/src/components/radio/examples/settings-group.tsx +4 -4
- package/src/components/radio/examples/shipping-method.tsx +3 -3
- package/src/components/segmented-control/examples/canonical-composition.tsx +7 -7
- package/src/components/segmented-control/examples/composition.tsx +7 -7
- package/src/components/segmented-control/examples/features.tsx +3 -3
- package/src/components/segmented-control/examples/full-width.tsx +1 -1
- package/src/components/segmented-control/examples/pricing-toggle.tsx +0 -1
- package/src/components/segmented-control/examples/states.tsx +3 -3
- package/src/components/segmented-control/examples/view-mode.tsx +0 -1
- package/src/components/segmented-progress-bar/examples/size-ladder.tsx +1 -1
- package/src/components/select/COMPONENT.md +3 -3
- package/src/components/select/examples/01-country.tsx +2 -4
- package/src/components/select/examples/02-controlled.tsx +2 -4
- package/src/components/select/examples/03-groups.tsx +2 -4
- package/src/components/select/examples/04-full-width-form.tsx +4 -8
- package/src/components/select/examples/pattern-composition.tsx +1 -1
- package/src/components/select/examples/pattern-controlled.tsx +1 -1
- package/src/components/select/examples/pattern-features.tsx +1 -1
- package/src/components/select/examples/pattern-full-width.tsx +1 -1
- package/src/components/select/examples/pattern-native.tsx +1 -1
- package/src/components/select/examples/pattern-states.tsx +4 -4
- package/src/components/slider/COMPONENT.md +1 -1
- package/src/components/stepper/COMPONENT.md +1 -1
- package/src/components/stepper/examples/01-checkout-horizontal.tsx +1 -1
- package/src/components/stepper/examples/02-onboarding-vertical.tsx +1 -1
- package/src/components/stepper/examples/03-vertical-primitive-rail.tsx +1 -1
- package/src/components/stepper/examples/04-checkout-step-error.tsx +1 -1
- package/src/components/stepper/examples/05-horizontal-primitive.tsx +1 -1
- package/src/components/switch/COMPONENT.md +1 -1
- package/src/components/switch/examples/canonical-maximal.tsx +1 -1
- package/src/components/switch/examples/composition.tsx +1 -2
- package/src/components/switch/examples/controlled.tsx +1 -1
- package/src/components/switch/examples/full-width.tsx +1 -1
- package/src/components/switch/examples/scenario-billing-annual.tsx +1 -1
- package/src/components/switch/examples/scenario-feature-flag.tsx +1 -6
- package/src/components/switch/examples/scenario-settings-toggle.tsx +3 -3
- package/src/components/switch/examples/states.tsx +6 -6
- package/src/components/switch/examples/variants.tsx +2 -2
- package/src/components/tabs/COMPONENT.md +1 -1
- package/src/components/tabs/examples/01-settings-vertical-rail.tsx +1 -6
- package/src/components/tag/COMPONENT.md +1 -1
- package/src/components/tag/examples/01-filter-chips.tsx +1 -1
- package/src/components/tag/examples/02-removable-selected-values.tsx +1 -1
- package/src/components/tag/examples/03-status-metadata.tsx +3 -3
- package/src/components/tag/examples/controlled.tsx +1 -6
- package/src/components/tag/examples/removable.tsx +1 -1
- package/src/components/textarea/examples/01-support-ticket.tsx +0 -1
- package/src/components/textarea/examples/02-comment.tsx +1 -2
- package/src/components/textarea/examples/composition.tsx +2 -2
- package/src/components/textarea/examples/controlled.tsx +0 -1
- package/src/components/textarea/examples/features.tsx +3 -12
- package/src/components/textarea/examples/full-width.tsx +1 -1
- package/src/components/textarea/examples/states.tsx +4 -4
- package/src/components/textarea/examples/variants.tsx +2 -2
- package/src/components/tooltip/COMPONENT.md +0 -1
- package/src/components/tooltip/examples/canonical-icon-hint.tsx +1 -1
- package/src/components/tooltip/examples/composition.tsx +3 -9
- package/src/components/tooltip/examples/controlled.tsx +2 -2
- package/src/components/tooltip/examples/delay.tsx +1 -1
- package/src/components/tooltip/examples/long-content.tsx +2 -2
- package/src/components/tooltip/examples/side.tsx +4 -4
- package/src/components/tooltip/examples/states.tsx +2 -2
- package/src/components/tooltip/examples/surfaces.tsx +2 -2
- package/src/layout/app-shell/COMPONENT.md +77 -27
- package/src/layout/sidebar/COMPONENT.md +1 -1
- package/src/layout/sidebar/examples/01-app-shell-nav.tsx +11 -13
- package/src/layout/sidebar/examples/examples.module.css +0 -10
- package/dist/components/dropdown/examples/inset.d.ts +0 -3
- package/dist/components/dropdown/examples/inset.d.ts.map +0 -1
- package/src/components/dropdown/examples/inset.tsx +0 -51
package/dist/components/index.js
CHANGED
|
@@ -120,8 +120,7 @@ function mergeRefs(...refs) {
|
|
|
120
120
|
var AppShell_default = {
|
|
121
121
|
layoutRoot: "AppShell_layoutRoot2",
|
|
122
122
|
layoutMain: "AppShell_layoutMain2",
|
|
123
|
-
layoutNav: "AppShell_layoutNav2"
|
|
124
|
-
layoutMainInset: "AppShell_layoutMainInset2"
|
|
123
|
+
layoutNav: "AppShell_layoutNav2"
|
|
125
124
|
};
|
|
126
125
|
|
|
127
126
|
// src/layout/app-shell/AppShell.tsx
|
|
@@ -153,27 +152,13 @@ var AppShellMain = React4.forwardRef(function AppShellMain2({ className, childre
|
|
|
153
152
|
overscrollBehavior: "contain",
|
|
154
153
|
className: cx(AppShell_default.layoutMain, className),
|
|
155
154
|
"data-layout-region": "main",
|
|
155
|
+
"data-app-shell-main-padded": "",
|
|
156
156
|
...rest,
|
|
157
157
|
children
|
|
158
158
|
}
|
|
159
159
|
);
|
|
160
160
|
});
|
|
161
161
|
AppShellMain.displayName = "AppShell.Main";
|
|
162
|
-
var AppShellMainInset = React4.forwardRef(
|
|
163
|
-
function AppShellMainInset2({ className, children, ...rest }, forwardedRef) {
|
|
164
|
-
return /* @__PURE__ */ jsx4(
|
|
165
|
-
"div",
|
|
166
|
-
{
|
|
167
|
-
ref: forwardedRef,
|
|
168
|
-
className: cx(AppShell_default.layoutMainInset, className),
|
|
169
|
-
"data-app-shell-main-inset": "",
|
|
170
|
-
...rest,
|
|
171
|
-
children
|
|
172
|
-
}
|
|
173
|
-
);
|
|
174
|
-
}
|
|
175
|
-
);
|
|
176
|
-
AppShellMainInset.displayName = "AppShell.MainInset";
|
|
177
162
|
function AppShellMainRouteScrollReset({
|
|
178
163
|
mainRef
|
|
179
164
|
}) {
|
|
@@ -198,7 +183,7 @@ var AppShellTemplate = React4.forwardRef(
|
|
|
198
183
|
children: [
|
|
199
184
|
/* @__PURE__ */ jsx4(AppShellNav, { ...navProps, children: nav }),
|
|
200
185
|
/* @__PURE__ */ jsxs(AppShellMain, { ref: setMainRef, ...mainProps, children: [
|
|
201
|
-
|
|
186
|
+
children,
|
|
202
187
|
inRouter ? /* @__PURE__ */ jsx4(AppShellMainRouteScrollReset, { mainRef: mainElementRef }) : null
|
|
203
188
|
] })
|
|
204
189
|
]
|
|
@@ -211,7 +196,6 @@ var AppShell = {
|
|
|
211
196
|
Root: AppShellRoot,
|
|
212
197
|
Nav: AppShellNav,
|
|
213
198
|
Main: AppShellMain,
|
|
214
|
-
MainInset: AppShellMainInset,
|
|
215
199
|
Template: AppShellTemplate
|
|
216
200
|
};
|
|
217
201
|
|
|
@@ -4798,7 +4782,6 @@ var EyeDropperButton = React38.forwardRef(function EyeDropperButton2({ children,
|
|
|
4798
4782
|
className: cx(ColorPicker_default.eyeDropperSquare, className),
|
|
4799
4783
|
disabled: true,
|
|
4800
4784
|
mode: "stroke",
|
|
4801
|
-
size: "m",
|
|
4802
4785
|
tabIndex: -1,
|
|
4803
4786
|
type,
|
|
4804
4787
|
variant: "neutral",
|
|
@@ -4815,7 +4798,6 @@ var EyeDropperButton = React38.forwardRef(function EyeDropperButton2({ children,
|
|
|
4815
4798
|
"aria-label": ariaLabel ?? "\u041F\u0438\u043F\u0435\u0442\u043A\u0430",
|
|
4816
4799
|
className: cx(ColorPicker_default.eyeDropperSquare, className),
|
|
4817
4800
|
mode: "stroke",
|
|
4818
|
-
size: "m",
|
|
4819
4801
|
variant: "neutral",
|
|
4820
4802
|
onClick: (e) => {
|
|
4821
4803
|
onClick?.(e);
|
|
@@ -6887,7 +6869,6 @@ import * as React47 from "react";
|
|
|
6887
6869
|
|
|
6888
6870
|
// src/components/dropdown/Dropdown.module.css
|
|
6889
6871
|
var Dropdown_default = {
|
|
6890
|
-
inset: "Dropdown_inset2",
|
|
6891
6872
|
content: "Dropdown_content2",
|
|
6892
6873
|
block: "Dropdown_block2",
|
|
6893
6874
|
header: "Dropdown_header2",
|
|
@@ -7282,30 +7263,10 @@ function DropdownHeaderTrailing({
|
|
|
7282
7263
|
);
|
|
7283
7264
|
}
|
|
7284
7265
|
DropdownHeaderTrailing.displayName = "DropdownHeaderTrailing";
|
|
7285
|
-
function DropdownInset({
|
|
7286
|
-
children,
|
|
7287
|
-
className,
|
|
7288
|
-
padding = "x2",
|
|
7289
|
-
gap = "x3",
|
|
7290
|
-
...rest
|
|
7291
|
-
}) {
|
|
7292
|
-
return /* @__PURE__ */ jsx35(
|
|
7293
|
-
"div",
|
|
7294
|
-
{
|
|
7295
|
-
className: cx(Dropdown_default.inset, className),
|
|
7296
|
-
"data-inset-gap": gap,
|
|
7297
|
-
"data-inset-padding": padding,
|
|
7298
|
-
...rest,
|
|
7299
|
-
children
|
|
7300
|
-
}
|
|
7301
|
-
);
|
|
7302
|
-
}
|
|
7303
|
-
DropdownInset.displayName = "DropdownInset";
|
|
7304
7266
|
var Dropdown = {
|
|
7305
7267
|
Root: DropdownRoot,
|
|
7306
7268
|
Trigger: DropdownTrigger,
|
|
7307
7269
|
Content: DropdownContent,
|
|
7308
|
-
Inset: DropdownInset,
|
|
7309
7270
|
Block: DropdownBlock,
|
|
7310
7271
|
Header: DropdownHeader,
|
|
7311
7272
|
HeaderRow: DropdownHeaderRow,
|
|
@@ -7321,12 +7282,70 @@ var Dropdown = {
|
|
|
7321
7282
|
Separator: DropdownSeparator
|
|
7322
7283
|
};
|
|
7323
7284
|
|
|
7285
|
+
// src/components/empty-page/EmptyPage.tsx
|
|
7286
|
+
import * as React48 from "react";
|
|
7287
|
+
|
|
7288
|
+
// src/components/empty-page/EmptyPage.module.css
|
|
7289
|
+
var EmptyPage_default = {
|
|
7290
|
+
root: "EmptyPage_root2",
|
|
7291
|
+
iconWrap: "EmptyPage_iconWrap2",
|
|
7292
|
+
title: "EmptyPage_title2",
|
|
7293
|
+
description: "EmptyPage_description2",
|
|
7294
|
+
actions: "EmptyPage_actions2"
|
|
7295
|
+
};
|
|
7296
|
+
|
|
7297
|
+
// src/components/empty-page/EmptyPage.tsx
|
|
7298
|
+
import { jsx as jsx36 } from "react/jsx-runtime";
|
|
7299
|
+
var EmptyPageRoot = React48.forwardRef(function EmptyPageRoot2({ size = "m", layout = "default", className, children, ...rest }, forwardedRef) {
|
|
7300
|
+
return /* @__PURE__ */ jsx36(
|
|
7301
|
+
"div",
|
|
7302
|
+
{
|
|
7303
|
+
ref: forwardedRef,
|
|
7304
|
+
className: cx(EmptyPage_default.root, className),
|
|
7305
|
+
...rest,
|
|
7306
|
+
...toDataAttributes({
|
|
7307
|
+
size,
|
|
7308
|
+
layout: layout === "fill" ? "fill" : void 0
|
|
7309
|
+
}),
|
|
7310
|
+
children: /* @__PURE__ */ jsx36(ControlSizeProvider, { value: size, children })
|
|
7311
|
+
}
|
|
7312
|
+
);
|
|
7313
|
+
});
|
|
7314
|
+
EmptyPageRoot.displayName = "EmptyPage.Root";
|
|
7315
|
+
function EmptyPageIcon({ className, children, ...rest }) {
|
|
7316
|
+
return /* @__PURE__ */ jsx36("div", { className: cx(EmptyPage_default.iconWrap, className), ...rest, children });
|
|
7317
|
+
}
|
|
7318
|
+
EmptyPageIcon.displayName = "EmptyPage.Icon";
|
|
7319
|
+
var EmptyPageTitle = React48.forwardRef(
|
|
7320
|
+
function EmptyPageTitle2({ className, children, ...rest }, forwardedRef) {
|
|
7321
|
+
return /* @__PURE__ */ jsx36("h2", { ref: forwardedRef, className: cx(EmptyPage_default.title, className), ...rest, children });
|
|
7322
|
+
}
|
|
7323
|
+
);
|
|
7324
|
+
EmptyPageTitle.displayName = "EmptyPage.Title";
|
|
7325
|
+
var EmptyPageDescription = React48.forwardRef(
|
|
7326
|
+
function EmptyPageDescription2({ className, children, ...rest }, forwardedRef) {
|
|
7327
|
+
return /* @__PURE__ */ jsx36("p", { ref: forwardedRef, className: cx(EmptyPage_default.description, className), ...rest, children });
|
|
7328
|
+
}
|
|
7329
|
+
);
|
|
7330
|
+
EmptyPageDescription.displayName = "EmptyPage.Description";
|
|
7331
|
+
function EmptyPageActions({ className, children, ...rest }) {
|
|
7332
|
+
return /* @__PURE__ */ jsx36("div", { className: cx(EmptyPage_default.actions, className), ...rest, children });
|
|
7333
|
+
}
|
|
7334
|
+
EmptyPageActions.displayName = "EmptyPage.Actions";
|
|
7335
|
+
var EmptyPage = {
|
|
7336
|
+
Root: EmptyPageRoot,
|
|
7337
|
+
Icon: EmptyPageIcon,
|
|
7338
|
+
Title: EmptyPageTitle,
|
|
7339
|
+
Description: EmptyPageDescription,
|
|
7340
|
+
Actions: EmptyPageActions
|
|
7341
|
+
};
|
|
7342
|
+
|
|
7324
7343
|
// src/components/example-frame/ExampleFrame.tsx
|
|
7325
7344
|
import { Code2, Eye as Eye2, Monitor, Smartphone, Tablet } from "lucide-react";
|
|
7326
|
-
import * as
|
|
7345
|
+
import * as React50 from "react";
|
|
7327
7346
|
|
|
7328
7347
|
// src/components/segmented-control/SegmentedControl.tsx
|
|
7329
|
-
import * as
|
|
7348
|
+
import * as React49 from "react";
|
|
7330
7349
|
|
|
7331
7350
|
// src/components/segmented-control/SegmentedControl.module.css
|
|
7332
7351
|
var SegmentedControl_default = {
|
|
@@ -7337,7 +7356,7 @@ var SegmentedControl_default = {
|
|
|
7337
7356
|
};
|
|
7338
7357
|
|
|
7339
7358
|
// src/components/segmented-control/SegmentedControl.tsx
|
|
7340
|
-
import { jsx as
|
|
7359
|
+
import { jsx as jsx37, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
7341
7360
|
function readCssWidthPx(root, widthExpression) {
|
|
7342
7361
|
const doc = root.ownerDocument;
|
|
7343
7362
|
const win = doc.defaultView;
|
|
@@ -7365,23 +7384,23 @@ function SegmentedControlRoot({
|
|
|
7365
7384
|
defaultValue,
|
|
7366
7385
|
onChange: onValueChange
|
|
7367
7386
|
});
|
|
7368
|
-
const [indicator, setIndicator] =
|
|
7387
|
+
const [indicator, setIndicator] = React49.useState({
|
|
7369
7388
|
left: 0,
|
|
7370
7389
|
top: 0,
|
|
7371
7390
|
width: 0,
|
|
7372
7391
|
height: 0
|
|
7373
7392
|
});
|
|
7374
|
-
const [animate2, setAnimate] =
|
|
7375
|
-
const containerRef =
|
|
7376
|
-
const indicatorRef =
|
|
7377
|
-
const onSelect =
|
|
7393
|
+
const [animate2, setAnimate] = React49.useState(false);
|
|
7394
|
+
const containerRef = React49.useRef(null);
|
|
7395
|
+
const indicatorRef = React49.useRef(null);
|
|
7396
|
+
const onSelect = React49.useCallback(
|
|
7378
7397
|
(nextValue) => {
|
|
7379
7398
|
setAnimate(true);
|
|
7380
7399
|
setSelectedValue(nextValue);
|
|
7381
7400
|
},
|
|
7382
7401
|
[setSelectedValue]
|
|
7383
7402
|
);
|
|
7384
|
-
|
|
7403
|
+
React49.useLayoutEffect(() => {
|
|
7385
7404
|
const root = containerRef.current;
|
|
7386
7405
|
if (!root) return;
|
|
7387
7406
|
const update = () => {
|
|
@@ -7418,12 +7437,12 @@ function SegmentedControlRoot({
|
|
|
7418
7437
|
ro?.disconnect();
|
|
7419
7438
|
};
|
|
7420
7439
|
}, []);
|
|
7421
|
-
|
|
7440
|
+
React49.useEffect(() => {
|
|
7422
7441
|
if (!animate2) return;
|
|
7423
7442
|
const id = window.setTimeout(() => setAnimate(false), 320);
|
|
7424
7443
|
return () => window.clearTimeout(id);
|
|
7425
7444
|
}, [animate2]);
|
|
7426
|
-
|
|
7445
|
+
React49.useLayoutEffect(() => {
|
|
7427
7446
|
const indicatorEl = indicatorRef.current;
|
|
7428
7447
|
if (!indicatorEl) return;
|
|
7429
7448
|
indicatorEl.style.transform = `translate3d(${indicator.left}px, ${indicator.top}px, 0)`;
|
|
@@ -7454,7 +7473,7 @@ function SegmentedControlRoot({
|
|
|
7454
7473
|
if (nextValue) onSelect(nextValue);
|
|
7455
7474
|
};
|
|
7456
7475
|
const hasSelection = selectedValue !== "";
|
|
7457
|
-
return /* @__PURE__ */
|
|
7476
|
+
return /* @__PURE__ */ jsx37(SegmentedControlProvider, { value: { value: selectedValue, onSelect, rootDisabled: disabled }, children: /* @__PURE__ */ jsxs17(
|
|
7458
7477
|
"div",
|
|
7459
7478
|
{
|
|
7460
7479
|
ref: containerRef,
|
|
@@ -7467,8 +7486,8 @@ function SegmentedControlRoot({
|
|
|
7467
7486
|
"data-size": size,
|
|
7468
7487
|
"data-animate": animate2 ? "true" : void 0,
|
|
7469
7488
|
children: [
|
|
7470
|
-
/* @__PURE__ */
|
|
7471
|
-
/* @__PURE__ */
|
|
7489
|
+
/* @__PURE__ */ jsx37(ControlSizeProvider, { value: size, children }),
|
|
7490
|
+
/* @__PURE__ */ jsx37("div", { ref: indicatorRef, className: SegmentedControl_default.indicator, "aria-hidden": "true" })
|
|
7472
7491
|
]
|
|
7473
7492
|
}
|
|
7474
7493
|
) });
|
|
@@ -7485,7 +7504,7 @@ function SegmentedControlItem({
|
|
|
7485
7504
|
const isDisabled = ctx.rootDisabled || disabled;
|
|
7486
7505
|
return (
|
|
7487
7506
|
// biome-ignore lint/a11y/useSemanticElements: compound component intentionally uses role="radio" with roving tabindex
|
|
7488
|
-
/* @__PURE__ */
|
|
7507
|
+
/* @__PURE__ */ jsx37(
|
|
7489
7508
|
"button",
|
|
7490
7509
|
{
|
|
7491
7510
|
role: "radio",
|
|
@@ -7507,7 +7526,7 @@ function SegmentedControlItem({
|
|
|
7507
7526
|
}
|
|
7508
7527
|
SegmentedControlItem.displayName = "SegmentedControl.Item";
|
|
7509
7528
|
function SegmentedControlIcon({ children, className, ...rest }) {
|
|
7510
|
-
return /* @__PURE__ */
|
|
7529
|
+
return /* @__PURE__ */ jsx37("span", { className: cx(SegmentedControl_default.icon, className), "aria-hidden": "true", ...rest, children });
|
|
7511
7530
|
}
|
|
7512
7531
|
SegmentedControlIcon.displayName = "SegmentedControl.Icon";
|
|
7513
7532
|
var SegmentedControl = {
|
|
@@ -7531,7 +7550,7 @@ var ExampleFrame_default = {
|
|
|
7531
7550
|
};
|
|
7532
7551
|
|
|
7533
7552
|
// src/components/example-frame/ExampleFrame.tsx
|
|
7534
|
-
import { Fragment as Fragment5, jsx as
|
|
7553
|
+
import { Fragment as Fragment5, jsx as jsx38, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
7535
7554
|
var [ExampleFrameProvider, useExampleFrameContext] = createComponentContext("ExampleFrame");
|
|
7536
7555
|
function ExampleFrameRoot({
|
|
7537
7556
|
code,
|
|
@@ -7549,14 +7568,14 @@ function ExampleFrameRoot({
|
|
|
7549
7568
|
previewLayout = "default",
|
|
7550
7569
|
themePreset
|
|
7551
7570
|
}) {
|
|
7552
|
-
const [pane, setPane] =
|
|
7553
|
-
const [uncontrolledViewport, setUncontrolledViewport] =
|
|
7554
|
-
const [uncontrolledScheme, setUncontrolledScheme] =
|
|
7571
|
+
const [pane, setPane] = React50.useState("preview");
|
|
7572
|
+
const [uncontrolledViewport, setUncontrolledViewport] = React50.useState(defaultViewport);
|
|
7573
|
+
const [uncontrolledScheme, setUncontrolledScheme] = React50.useState(defaultColorScheme);
|
|
7555
7574
|
const isSchemeControlled = colorSchemeProp !== void 0;
|
|
7556
7575
|
const colorScheme = isSchemeControlled ? colorSchemeProp : uncontrolledScheme;
|
|
7557
7576
|
const isViewportControlled = viewportProp !== void 0;
|
|
7558
7577
|
const viewport = isViewportControlled ? viewportProp : uncontrolledViewport;
|
|
7559
|
-
const setColorScheme =
|
|
7578
|
+
const setColorScheme = React50.useCallback(
|
|
7560
7579
|
(next) => {
|
|
7561
7580
|
if (!isSchemeControlled) {
|
|
7562
7581
|
setUncontrolledScheme(next);
|
|
@@ -7565,7 +7584,7 @@ function ExampleFrameRoot({
|
|
|
7565
7584
|
},
|
|
7566
7585
|
[isSchemeControlled, onColorSchemeChange]
|
|
7567
7586
|
);
|
|
7568
|
-
const setViewport =
|
|
7587
|
+
const setViewport = React50.useCallback(
|
|
7569
7588
|
(next) => {
|
|
7570
7589
|
if (!isViewportControlled) {
|
|
7571
7590
|
setUncontrolledViewport(next);
|
|
@@ -7574,7 +7593,7 @@ function ExampleFrameRoot({
|
|
|
7574
7593
|
},
|
|
7575
7594
|
[isViewportControlled, onViewportChange]
|
|
7576
7595
|
);
|
|
7577
|
-
const ctxValue =
|
|
7596
|
+
const ctxValue = React50.useMemo(
|
|
7578
7597
|
() => ({
|
|
7579
7598
|
code,
|
|
7580
7599
|
language,
|
|
@@ -7600,17 +7619,17 @@ function ExampleFrameRoot({
|
|
|
7600
7619
|
]
|
|
7601
7620
|
);
|
|
7602
7621
|
let previewChildren = null;
|
|
7603
|
-
|
|
7604
|
-
if (
|
|
7622
|
+
React50.Children.forEach(children, (child) => {
|
|
7623
|
+
if (React50.isValidElement(child) && child.type === ExampleFrameStage) {
|
|
7605
7624
|
previewChildren = child.props.children ?? null;
|
|
7606
7625
|
}
|
|
7607
7626
|
});
|
|
7608
7627
|
if (previewChildren === null) {
|
|
7609
7628
|
previewChildren = children;
|
|
7610
7629
|
}
|
|
7611
|
-
return /* @__PURE__ */
|
|
7612
|
-
/* @__PURE__ */
|
|
7613
|
-
pane === "preview" ? /* @__PURE__ */
|
|
7630
|
+
return /* @__PURE__ */ jsx38(ExampleFrameProvider, { value: ctxValue, children: /* @__PURE__ */ jsxs18("div", { className: cx(ExampleFrame_default.root, className), children: [
|
|
7631
|
+
/* @__PURE__ */ jsx38(ExampleFrameToolbar, {}),
|
|
7632
|
+
pane === "preview" ? /* @__PURE__ */ jsx38("div", { className: ExampleFrame_default.previewShell, children: /* @__PURE__ */ jsx38("div", { className: ExampleFrame_default.previewViewport, "data-viewport": viewport, children: /* @__PURE__ */ jsx38(
|
|
7614
7633
|
"div",
|
|
7615
7634
|
{
|
|
7616
7635
|
className: ExampleFrame_default.previewInner,
|
|
@@ -7619,14 +7638,14 @@ function ExampleFrameRoot({
|
|
|
7619
7638
|
...themePreset != null && themePreset !== "" ? { "data-theme-preset": themePreset } : {},
|
|
7620
7639
|
children: previewChildren
|
|
7621
7640
|
}
|
|
7622
|
-
) }) }) : /* @__PURE__ */
|
|
7641
|
+
) }) }) : /* @__PURE__ */ jsx38(ExampleFrameCodePane, { themePreset })
|
|
7623
7642
|
] }) });
|
|
7624
7643
|
}
|
|
7625
7644
|
ExampleFrameRoot.displayName = "ExampleFrame.Root";
|
|
7626
7645
|
function ExampleFrameToolbar() {
|
|
7627
7646
|
const ctx = useExampleFrameContext();
|
|
7628
|
-
const [copyState, setCopyState] =
|
|
7629
|
-
const handleCopy =
|
|
7647
|
+
const [copyState, setCopyState] = React50.useState("idle");
|
|
7648
|
+
const handleCopy = React50.useCallback(async () => {
|
|
7630
7649
|
try {
|
|
7631
7650
|
await navigator.clipboard.writeText(ctx.code);
|
|
7632
7651
|
setCopyState("copied");
|
|
@@ -7652,18 +7671,18 @@ function ExampleFrameToolbar() {
|
|
|
7652
7671
|
size: "s",
|
|
7653
7672
|
children: [
|
|
7654
7673
|
/* @__PURE__ */ jsxs18(SegmentedControl.Item, { value: "preview", children: [
|
|
7655
|
-
/* @__PURE__ */
|
|
7674
|
+
/* @__PURE__ */ jsx38(SegmentedControl.Icon, { children: /* @__PURE__ */ jsx38(Eye2, { size: 14, strokeWidth: 2, "aria-hidden": true }) }),
|
|
7656
7675
|
"Preview"
|
|
7657
7676
|
] }),
|
|
7658
7677
|
/* @__PURE__ */ jsxs18(SegmentedControl.Item, { value: "code", children: [
|
|
7659
|
-
/* @__PURE__ */
|
|
7678
|
+
/* @__PURE__ */ jsx38(SegmentedControl.Icon, { children: /* @__PURE__ */ jsx38(Code2, { size: 14, strokeWidth: 2, "aria-hidden": true }) }),
|
|
7660
7679
|
"Code"
|
|
7661
7680
|
] })
|
|
7662
7681
|
]
|
|
7663
7682
|
}
|
|
7664
7683
|
),
|
|
7665
7684
|
/* @__PURE__ */ jsxs18("div", { className: ExampleFrame_default.toolbarLine1End, children: [
|
|
7666
|
-
ctx.showThemeToggle ? /* @__PURE__ */
|
|
7685
|
+
ctx.showThemeToggle ? /* @__PURE__ */ jsx38(
|
|
7667
7686
|
Button.Root,
|
|
7668
7687
|
{
|
|
7669
7688
|
type: "button",
|
|
@@ -7672,10 +7691,10 @@ function ExampleFrameToolbar() {
|
|
|
7672
7691
|
size: "s",
|
|
7673
7692
|
onClick: toggleScheme,
|
|
7674
7693
|
"aria-label": ctx.colorScheme === "light" ? "\u0412\u043A\u043B\u044E\u0447\u0438\u0442\u044C \u0442\u0451\u043C\u043D\u0443\u044E \u0442\u0435\u043C\u0443" : "\u0412\u043A\u043B\u044E\u0447\u0438\u0442\u044C \u0441\u0432\u0435\u0442\u043B\u0443\u044E \u0442\u0435\u043C\u0443",
|
|
7675
|
-
children: /* @__PURE__ */
|
|
7694
|
+
children: /* @__PURE__ */ jsx38(Button.Icon, { children: ctx.colorScheme === "light" ? /* @__PURE__ */ jsx38(Icon, { name: "theme.dark", size: "s", tone: "subtle" }) : /* @__PURE__ */ jsx38(Icon, { name: "theme.light", size: "s", tone: "subtle" }) })
|
|
7676
7695
|
}
|
|
7677
7696
|
) : null,
|
|
7678
|
-
/* @__PURE__ */
|
|
7697
|
+
/* @__PURE__ */ jsx38(
|
|
7679
7698
|
Button.Root,
|
|
7680
7699
|
{
|
|
7681
7700
|
type: "button",
|
|
@@ -7684,7 +7703,7 @@ function ExampleFrameToolbar() {
|
|
|
7684
7703
|
size: "s",
|
|
7685
7704
|
onClick: handleCopy,
|
|
7686
7705
|
"aria-label": copyLabel,
|
|
7687
|
-
children: /* @__PURE__ */
|
|
7706
|
+
children: /* @__PURE__ */ jsx38(Button.Icon, { children: /* @__PURE__ */ jsx38(Icon, { name: "action.copy", size: "s", tone: "subtle" }) })
|
|
7688
7707
|
}
|
|
7689
7708
|
)
|
|
7690
7709
|
] })
|
|
@@ -7698,15 +7717,15 @@ function ExampleFrameToolbar() {
|
|
|
7698
7717
|
size: "s",
|
|
7699
7718
|
children: [
|
|
7700
7719
|
/* @__PURE__ */ jsxs18(SegmentedControl.Item, { value: "desktop", children: [
|
|
7701
|
-
/* @__PURE__ */
|
|
7720
|
+
/* @__PURE__ */ jsx38(SegmentedControl.Icon, { children: /* @__PURE__ */ jsx38(Monitor, { size: 14, strokeWidth: 2, "aria-hidden": true }) }),
|
|
7702
7721
|
"Desktop"
|
|
7703
7722
|
] }),
|
|
7704
7723
|
/* @__PURE__ */ jsxs18(SegmentedControl.Item, { value: "tablet", children: [
|
|
7705
|
-
/* @__PURE__ */
|
|
7724
|
+
/* @__PURE__ */ jsx38(SegmentedControl.Icon, { children: /* @__PURE__ */ jsx38(Tablet, { size: 14, strokeWidth: 2, "aria-hidden": true }) }),
|
|
7706
7725
|
"Tablet"
|
|
7707
7726
|
] }),
|
|
7708
7727
|
/* @__PURE__ */ jsxs18(SegmentedControl.Item, { value: "mobile", children: [
|
|
7709
|
-
/* @__PURE__ */
|
|
7728
|
+
/* @__PURE__ */ jsx38(SegmentedControl.Icon, { children: /* @__PURE__ */ jsx38(Smartphone, { size: 14, strokeWidth: 2, "aria-hidden": true }) }),
|
|
7710
7729
|
"Mobile"
|
|
7711
7730
|
] })
|
|
7712
7731
|
]
|
|
@@ -7719,11 +7738,11 @@ function ExampleFrameCodePane({ themePreset }) {
|
|
|
7719
7738
|
const ctx = useExampleFrameContext();
|
|
7720
7739
|
const trimmed = ctx.code.trimEnd();
|
|
7721
7740
|
const presetProps = themePreset != null && themePreset !== "" ? { "data-theme-preset": themePreset } : {};
|
|
7722
|
-
return /* @__PURE__ */
|
|
7741
|
+
return /* @__PURE__ */ jsx38("div", { className: ExampleFrame_default.codePane, "data-theme": ctx.colorScheme, ...presetProps, children: /* @__PURE__ */ jsx38(CodeBlock.Root, { code: trimmed, colorScheme: ctx.colorScheme }) });
|
|
7723
7742
|
}
|
|
7724
7743
|
ExampleFrameCodePane.displayName = "ExampleFrame.CodePane";
|
|
7725
7744
|
function ExampleFrameStage({ children }) {
|
|
7726
|
-
return /* @__PURE__ */
|
|
7745
|
+
return /* @__PURE__ */ jsx38(Fragment5, { children });
|
|
7727
7746
|
}
|
|
7728
7747
|
ExampleFrameStage.displayName = "ExampleFrame.Stage";
|
|
7729
7748
|
var ExampleFrame = {
|
|
@@ -7732,10 +7751,10 @@ var ExampleFrame = {
|
|
|
7732
7751
|
};
|
|
7733
7752
|
|
|
7734
7753
|
// src/components/file-upload/FileUpload.tsx
|
|
7735
|
-
import * as
|
|
7754
|
+
import * as React52 from "react";
|
|
7736
7755
|
|
|
7737
7756
|
// src/components/progress-bar/ProgressBar.tsx
|
|
7738
|
-
import * as
|
|
7757
|
+
import * as React51 from "react";
|
|
7739
7758
|
|
|
7740
7759
|
// src/components/progress-bar/ProgressBar.module.css
|
|
7741
7760
|
var ProgressBar_default = {
|
|
@@ -7745,18 +7764,18 @@ var ProgressBar_default = {
|
|
|
7745
7764
|
};
|
|
7746
7765
|
|
|
7747
7766
|
// src/components/progress-bar/ProgressBar.tsx
|
|
7748
|
-
import { jsx as
|
|
7767
|
+
import { jsx as jsx39, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
7749
7768
|
function clampProgress(value, max) {
|
|
7750
7769
|
return Math.min(max, Math.max(value, 0));
|
|
7751
7770
|
}
|
|
7752
|
-
var ProgressBarRoot =
|
|
7771
|
+
var ProgressBarRoot = React51.forwardRef(
|
|
7753
7772
|
({ value, max = 100, label, size = "m", className }, ref) => {
|
|
7754
7773
|
const safeMax = max > 0 ? max : 100;
|
|
7755
7774
|
const safeValue = clampProgress(value, safeMax);
|
|
7756
|
-
const labelId =
|
|
7775
|
+
const labelId = React51.useId();
|
|
7757
7776
|
return /* @__PURE__ */ jsxs19("div", { className: cx(ProgressBar_default.root, className), ...toDataAttributes({ size }), children: [
|
|
7758
|
-
label ? /* @__PURE__ */
|
|
7759
|
-
/* @__PURE__ */
|
|
7777
|
+
label ? /* @__PURE__ */ jsx39("span", { className: ProgressBar_default.label, id: labelId, children: label }) : null,
|
|
7778
|
+
/* @__PURE__ */ jsx39(
|
|
7760
7779
|
"progress",
|
|
7761
7780
|
{
|
|
7762
7781
|
ref,
|
|
@@ -7808,26 +7827,26 @@ var FileUpload_default = {
|
|
|
7808
7827
|
};
|
|
7809
7828
|
|
|
7810
7829
|
// src/components/file-upload/FileUpload.tsx
|
|
7811
|
-
import { jsx as
|
|
7830
|
+
import { jsx as jsx40, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
7812
7831
|
function FileUploadIcon({ className, children, ...rest }) {
|
|
7813
|
-
return /* @__PURE__ */
|
|
7832
|
+
return /* @__PURE__ */ jsx40("span", { className: cx(FileUpload_default.iconWrap, className), "aria-hidden": true, ...rest, children });
|
|
7814
7833
|
}
|
|
7815
7834
|
FileUploadIcon.displayName = "FileUpload.Icon";
|
|
7816
7835
|
function FileUploadTitle({ className, children, tone = "default", ...rest }) {
|
|
7817
|
-
return /* @__PURE__ */
|
|
7836
|
+
return /* @__PURE__ */ jsx40("p", { className: cx(FileUpload_default.title, tone === "muted" && FileUpload_default.titleMuted, className), ...rest, children });
|
|
7818
7837
|
}
|
|
7819
7838
|
FileUploadTitle.displayName = "FileUpload.Title";
|
|
7820
7839
|
function FileUploadHint({ className, children, ...rest }) {
|
|
7821
7840
|
const controlSize = useOptionalControlSize() ?? "m";
|
|
7822
|
-
return /* @__PURE__ */
|
|
7841
|
+
return /* @__PURE__ */ jsx40(Hint.Root, { size: controlSize, className, ...rest, children });
|
|
7823
7842
|
}
|
|
7824
7843
|
FileUploadHint.displayName = "FileUpload.Hint";
|
|
7825
7844
|
function FileUploadBrowseLabel({ className, children, ...rest }) {
|
|
7826
|
-
return /* @__PURE__ */
|
|
7845
|
+
return /* @__PURE__ */ jsx40("span", { className: cx(FileUpload_default.browse, className), ...rest, children });
|
|
7827
7846
|
}
|
|
7828
7847
|
FileUploadBrowseLabel.displayName = "FileUpload.BrowseLabel";
|
|
7829
|
-
var FileUploadBrowseLink =
|
|
7830
|
-
({ className, type = "button", onClick, ...rest }, ref) => /* @__PURE__ */
|
|
7848
|
+
var FileUploadBrowseLink = React52.forwardRef(
|
|
7849
|
+
({ className, type = "button", onClick, ...rest }, ref) => /* @__PURE__ */ jsx40(
|
|
7831
7850
|
"button",
|
|
7832
7851
|
{
|
|
7833
7852
|
ref,
|
|
@@ -7844,15 +7863,15 @@ var FileUploadBrowseLink = React51.forwardRef(
|
|
|
7844
7863
|
);
|
|
7845
7864
|
FileUploadBrowseLink.displayName = "FileUpload.BrowseLink";
|
|
7846
7865
|
function FileUploadDropBody({ className, children, ...rest }) {
|
|
7847
|
-
return /* @__PURE__ */
|
|
7866
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.dropBody, className), ...rest, children });
|
|
7848
7867
|
}
|
|
7849
7868
|
FileUploadDropBody.displayName = "FileUpload.DropBody";
|
|
7850
7869
|
function FileUploadActionsRow({ className, children, ...rest }) {
|
|
7851
|
-
return /* @__PURE__ */
|
|
7870
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.actionsRow, className), ...rest, children });
|
|
7852
7871
|
}
|
|
7853
7872
|
FileUploadActionsRow.displayName = "FileUpload.ActionsRow";
|
|
7854
|
-
var FileUploadChip =
|
|
7855
|
-
({ className, type = "button", onClick, ...rest }, ref) => /* @__PURE__ */
|
|
7873
|
+
var FileUploadChip = React52.forwardRef(
|
|
7874
|
+
({ className, type = "button", onClick, ...rest }, ref) => /* @__PURE__ */ jsx40(
|
|
7856
7875
|
"button",
|
|
7857
7876
|
{
|
|
7858
7877
|
ref,
|
|
@@ -7869,12 +7888,12 @@ var FileUploadChip = React51.forwardRef(
|
|
|
7869
7888
|
);
|
|
7870
7889
|
FileUploadChip.displayName = "FileUpload.Chip";
|
|
7871
7890
|
function FileUploadChipLabel({ className, children, ...rest }) {
|
|
7872
|
-
return /* @__PURE__ */
|
|
7891
|
+
return /* @__PURE__ */ jsx40("span", { className: cx(FileUpload_default.chipLabel, className), ...rest, children });
|
|
7873
7892
|
}
|
|
7874
7893
|
FileUploadChipLabel.displayName = "FileUpload.ChipLabel";
|
|
7875
7894
|
function FileUploadFormatBadge({ format, color = "gray", className }) {
|
|
7876
7895
|
const label = format.trim().slice(0, 8).toUpperCase();
|
|
7877
|
-
return /* @__PURE__ */
|
|
7896
|
+
return /* @__PURE__ */ jsx40(
|
|
7878
7897
|
"span",
|
|
7879
7898
|
{
|
|
7880
7899
|
className: cx(FileUpload_default.formatBadge, className),
|
|
@@ -7891,7 +7910,7 @@ function FileUploadItem({
|
|
|
7891
7910
|
size = "m",
|
|
7892
7911
|
...rest
|
|
7893
7912
|
}) {
|
|
7894
|
-
return /* @__PURE__ */
|
|
7913
|
+
return /* @__PURE__ */ jsx40(
|
|
7895
7914
|
"div",
|
|
7896
7915
|
{
|
|
7897
7916
|
className: cx(FileUpload_default.item, className),
|
|
@@ -7902,50 +7921,50 @@ function FileUploadItem({
|
|
|
7902
7921
|
}
|
|
7903
7922
|
FileUploadItem.displayName = "FileUpload.Item";
|
|
7904
7923
|
function FileUploadItemRow({ className, children, ...rest }) {
|
|
7905
|
-
return /* @__PURE__ */
|
|
7924
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemRow, className), ...rest, children });
|
|
7906
7925
|
}
|
|
7907
7926
|
FileUploadItemRow.displayName = "FileUpload.ItemRow";
|
|
7908
7927
|
function FileUploadItemMain({ className, children, ...rest }) {
|
|
7909
|
-
return /* @__PURE__ */
|
|
7928
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemMain, className), ...rest, children });
|
|
7910
7929
|
}
|
|
7911
7930
|
FileUploadItemMain.displayName = "FileUpload.ItemMain";
|
|
7912
7931
|
function FileUploadItemStack({ className, children, ...rest }) {
|
|
7913
|
-
return /* @__PURE__ */
|
|
7932
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemStack, className), ...rest, children });
|
|
7914
7933
|
}
|
|
7915
7934
|
FileUploadItemStack.displayName = "FileUpload.ItemStack";
|
|
7916
7935
|
function FileUploadItemTextGroup({ className, children, ...rest }) {
|
|
7917
|
-
return /* @__PURE__ */
|
|
7936
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemTextGroup, className), ...rest, children });
|
|
7918
7937
|
}
|
|
7919
7938
|
FileUploadItemTextGroup.displayName = "FileUpload.ItemTextGroup";
|
|
7920
|
-
var FileUploadItemTryAgain =
|
|
7921
|
-
({ className, type = "button", ...rest }, ref) => /* @__PURE__ */
|
|
7939
|
+
var FileUploadItemTryAgain = React52.forwardRef(
|
|
7940
|
+
({ className, type = "button", ...rest }, ref) => /* @__PURE__ */ jsx40("button", { ref, type, className: cx(FileUpload_default.itemTryAgain, className), ...rest })
|
|
7922
7941
|
);
|
|
7923
7942
|
FileUploadItemTryAgain.displayName = "FileUpload.ItemTryAgain";
|
|
7924
7943
|
function FileUploadItemName({ className, children, ...rest }) {
|
|
7925
|
-
return /* @__PURE__ */
|
|
7944
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemName, className), ...rest, children });
|
|
7926
7945
|
}
|
|
7927
7946
|
FileUploadItemName.displayName = "FileUpload.ItemName";
|
|
7928
7947
|
function FileUploadItemMeta({ className, children, ...rest }) {
|
|
7929
|
-
return /* @__PURE__ */
|
|
7948
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemMeta, className), ...rest, children });
|
|
7930
7949
|
}
|
|
7931
7950
|
FileUploadItemMeta.displayName = "FileUpload.ItemMeta";
|
|
7932
7951
|
function FileUploadItemMetaSep({ className, ...rest }) {
|
|
7933
|
-
return /* @__PURE__ */
|
|
7952
|
+
return /* @__PURE__ */ jsx40("span", { className: cx(FileUpload_default.itemMetaSep, className), "aria-hidden": true, ...rest, children: "\u2219" });
|
|
7934
7953
|
}
|
|
7935
7954
|
FileUploadItemMetaSep.displayName = "FileUpload.ItemMetaSep";
|
|
7936
7955
|
function FileUploadItemActions({ className, children, ...rest }) {
|
|
7937
|
-
return /* @__PURE__ */
|
|
7956
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemActions, className), ...rest, children });
|
|
7938
7957
|
}
|
|
7939
7958
|
FileUploadItemActions.displayName = "FileUpload.ItemActions";
|
|
7940
7959
|
function FileUploadItemFooter({ className, children, ...rest }) {
|
|
7941
|
-
return /* @__PURE__ */
|
|
7960
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemFooter, className), ...rest, children });
|
|
7942
7961
|
}
|
|
7943
7962
|
FileUploadItemFooter.displayName = "FileUpload.ItemFooter";
|
|
7944
7963
|
function FileUploadItemProgress({ value, max, className, children }) {
|
|
7945
|
-
return /* @__PURE__ */
|
|
7964
|
+
return /* @__PURE__ */ jsx40("div", { className: cx(FileUpload_default.itemProgress, className), children: children ?? (value !== void 0 ? /* @__PURE__ */ jsx40(ProgressBar.Root, { value, max }) : null) });
|
|
7946
7965
|
}
|
|
7947
7966
|
FileUploadItemProgress.displayName = "FileUpload.ItemProgress";
|
|
7948
|
-
var FileUploadRoot =
|
|
7967
|
+
var FileUploadRoot = React52.forwardRef(
|
|
7949
7968
|
({
|
|
7950
7969
|
size = "m",
|
|
7951
7970
|
appearance = "dashed",
|
|
@@ -7958,7 +7977,7 @@ var FileUploadRoot = React51.forwardRef(
|
|
|
7958
7977
|
children,
|
|
7959
7978
|
...rest
|
|
7960
7979
|
}, ref) => {
|
|
7961
|
-
const [isDragOver, setIsDragOver] =
|
|
7980
|
+
const [isDragOver, setIsDragOver] = React52.useState(false);
|
|
7962
7981
|
const mergeInputRef = useMergedRefs(inputRefProp);
|
|
7963
7982
|
const handleChange = (e) => {
|
|
7964
7983
|
const list = e.target.files;
|
|
@@ -7987,12 +8006,12 @@ var FileUploadRoot = React51.forwardRef(
|
|
|
7987
8006
|
}
|
|
7988
8007
|
};
|
|
7989
8008
|
const defaultBody = /* @__PURE__ */ jsxs20("div", { className: FileUpload_default.inner, children: [
|
|
7990
|
-
/* @__PURE__ */
|
|
8009
|
+
/* @__PURE__ */ jsx40(FileUploadIcon, { children: /* @__PURE__ */ jsx40(Icon, { name: "action.upload", size, tone: "subtle" }) }),
|
|
7991
8010
|
/* @__PURE__ */ jsxs20("div", { className: FileUpload_default.copy, children: [
|
|
7992
|
-
/* @__PURE__ */
|
|
7993
|
-
/* @__PURE__ */
|
|
8011
|
+
/* @__PURE__ */ jsx40(FileUploadTitle, { children: "Choose a file or drag & drop it here." }),
|
|
8012
|
+
/* @__PURE__ */ jsx40(FileUploadHint, { children: "JPEG, PNG, PDF, MP4 up to 50 MB." })
|
|
7994
8013
|
] }),
|
|
7995
|
-
/* @__PURE__ */
|
|
8014
|
+
/* @__PURE__ */ jsx40(FileUploadBrowseLabel, { children: "Browse file" })
|
|
7996
8015
|
] });
|
|
7997
8016
|
return /* @__PURE__ */ jsxs20(
|
|
7998
8017
|
"label",
|
|
@@ -8007,7 +8026,7 @@ var FileUploadRoot = React51.forwardRef(
|
|
|
8007
8026
|
onDragLeave: handleDragLeave,
|
|
8008
8027
|
onDrop: handleDrop,
|
|
8009
8028
|
children: [
|
|
8010
|
-
/* @__PURE__ */
|
|
8029
|
+
/* @__PURE__ */ jsx40(
|
|
8011
8030
|
"input",
|
|
8012
8031
|
{
|
|
8013
8032
|
ref: mergeInputRef,
|
|
@@ -8020,7 +8039,7 @@ var FileUploadRoot = React51.forwardRef(
|
|
|
8020
8039
|
"aria-disabled": disabled || void 0
|
|
8021
8040
|
}
|
|
8022
8041
|
),
|
|
8023
|
-
/* @__PURE__ */
|
|
8042
|
+
/* @__PURE__ */ jsx40(ControlSizeProvider, { value: size, children: children ?? defaultBody })
|
|
8024
8043
|
]
|
|
8025
8044
|
}
|
|
8026
8045
|
);
|
|
@@ -8054,7 +8073,7 @@ var FileUpload = {
|
|
|
8054
8073
|
};
|
|
8055
8074
|
|
|
8056
8075
|
// src/components/kbd/Kbd.tsx
|
|
8057
|
-
import * as
|
|
8076
|
+
import * as React53 from "react";
|
|
8058
8077
|
|
|
8059
8078
|
// src/components/kbd/Kbd.module.css
|
|
8060
8079
|
var Kbd_default = {
|
|
@@ -8062,19 +8081,19 @@ var Kbd_default = {
|
|
|
8062
8081
|
};
|
|
8063
8082
|
|
|
8064
8083
|
// src/components/kbd/Kbd.tsx
|
|
8065
|
-
import { jsx as
|
|
8066
|
-
var KbdRoot =
|
|
8084
|
+
import { jsx as jsx41 } from "react/jsx-runtime";
|
|
8085
|
+
var KbdRoot = React53.forwardRef(
|
|
8067
8086
|
({ children, className, size: sizeProp, ...rest }, ref) => {
|
|
8068
8087
|
const controlSurface = useOptionalControlSize();
|
|
8069
8088
|
const size = sizeProp ?? (controlSurface !== void 0 ? controlSurfaceToInputSize(controlSurface) : "m");
|
|
8070
|
-
return /* @__PURE__ */
|
|
8089
|
+
return /* @__PURE__ */ jsx41(
|
|
8071
8090
|
"kbd",
|
|
8072
8091
|
{
|
|
8073
8092
|
ref,
|
|
8074
8093
|
className: cx(Kbd_default.root, className),
|
|
8075
8094
|
...rest,
|
|
8076
8095
|
...toDataAttributes({ size }),
|
|
8077
|
-
children: /* @__PURE__ */
|
|
8096
|
+
children: /* @__PURE__ */ jsx41(ControlSizeProvider, { value: size, children })
|
|
8078
8097
|
}
|
|
8079
8098
|
);
|
|
8080
8099
|
}
|
|
@@ -8084,7 +8103,7 @@ var Kbd = { Root: KbdRoot };
|
|
|
8084
8103
|
|
|
8085
8104
|
// src/components/notification/Notification.tsx
|
|
8086
8105
|
import { AlertTriangle, CheckCircle2, Info, X as X3, XCircle } from "lucide-react";
|
|
8087
|
-
import * as
|
|
8106
|
+
import * as React54 from "react";
|
|
8088
8107
|
|
|
8089
8108
|
// src/components/notification/Notification.module.css
|
|
8090
8109
|
var Notification_default = {
|
|
@@ -8113,16 +8132,16 @@ var Notification_default = {
|
|
|
8113
8132
|
};
|
|
8114
8133
|
|
|
8115
8134
|
// src/components/notification/Notification.tsx
|
|
8116
|
-
import { jsx as
|
|
8135
|
+
import { jsx as jsx42, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
8117
8136
|
function useCountdown(item, paused, onExpire) {
|
|
8118
|
-
const [progress, setProgress] =
|
|
8119
|
-
const remainingRef =
|
|
8120
|
-
const lastTsRef =
|
|
8121
|
-
const pausedRef =
|
|
8122
|
-
const onExpireRef =
|
|
8137
|
+
const [progress, setProgress] = React54.useState(1);
|
|
8138
|
+
const remainingRef = React54.useRef(item.duration);
|
|
8139
|
+
const lastTsRef = React54.useRef(null);
|
|
8140
|
+
const pausedRef = React54.useRef(paused);
|
|
8141
|
+
const onExpireRef = React54.useRef(onExpire);
|
|
8123
8142
|
pausedRef.current = paused;
|
|
8124
8143
|
onExpireRef.current = onExpire;
|
|
8125
|
-
|
|
8144
|
+
React54.useEffect(() => {
|
|
8126
8145
|
if (item.persistent || item.duration <= 0) return;
|
|
8127
8146
|
remainingRef.current = item.duration;
|
|
8128
8147
|
lastTsRef.current = null;
|
|
@@ -8187,14 +8206,14 @@ function NotificationCard({
|
|
|
8187
8206
|
stackExpanded
|
|
8188
8207
|
}),
|
|
8189
8208
|
children: [
|
|
8190
|
-
/* @__PURE__ */
|
|
8209
|
+
/* @__PURE__ */ jsx42("div", { className: Notification_default.iconWrap, "aria-hidden": "true", children: item.icon ?? /* @__PURE__ */ jsx42(DefaultIcon, { className: Notification_default.icon }) }),
|
|
8191
8210
|
/* @__PURE__ */ jsxs21("div", { className: Notification_default.content, children: [
|
|
8192
8211
|
/* @__PURE__ */ jsxs21("header", { className: Notification_default.header, children: [
|
|
8193
|
-
/* @__PURE__ */
|
|
8194
|
-
item.badge !== void 0 ? /* @__PURE__ */
|
|
8212
|
+
/* @__PURE__ */ jsx42("p", { className: Notification_default.title, children: item.title }),
|
|
8213
|
+
item.badge !== void 0 ? /* @__PURE__ */ jsx42("span", { className: Notification_default.badge, children: item.badge }) : null
|
|
8195
8214
|
] }),
|
|
8196
|
-
item.description ? /* @__PURE__ */
|
|
8197
|
-
item.action ? /* @__PURE__ */
|
|
8215
|
+
item.description ? /* @__PURE__ */ jsx42("p", { className: Notification_default.description, children: item.description }) : null,
|
|
8216
|
+
item.action ? /* @__PURE__ */ jsx42("div", { className: Notification_default.actionRow, children: /* @__PURE__ */ jsx42(
|
|
8198
8217
|
Button.Root,
|
|
8199
8218
|
{
|
|
8200
8219
|
type: "button",
|
|
@@ -8206,17 +8225,17 @@ function NotificationCard({
|
|
|
8206
8225
|
}
|
|
8207
8226
|
) }) : null
|
|
8208
8227
|
] }),
|
|
8209
|
-
item.closable ? /* @__PURE__ */
|
|
8228
|
+
item.closable ? /* @__PURE__ */ jsx42(
|
|
8210
8229
|
"button",
|
|
8211
8230
|
{
|
|
8212
8231
|
type: "button",
|
|
8213
8232
|
className: Notification_default.closeButton,
|
|
8214
8233
|
"aria-label": "Dismiss notification",
|
|
8215
8234
|
onClick: () => onDismiss(item.id),
|
|
8216
|
-
children: /* @__PURE__ */
|
|
8235
|
+
children: /* @__PURE__ */ jsx42(X3, { "aria-hidden": "true" })
|
|
8217
8236
|
}
|
|
8218
8237
|
) : null,
|
|
8219
|
-
!item.persistent ? /* @__PURE__ */
|
|
8238
|
+
!item.persistent ? /* @__PURE__ */ jsx42("div", { className: Notification_default.progressTrack, "aria-hidden": "true", children: /* @__PURE__ */ jsx42("span", { className: Notification_default.progressValue, style: { transform: `scaleX(${progress})` } }) }) : null
|
|
8220
8239
|
]
|
|
8221
8240
|
}
|
|
8222
8241
|
);
|
|
@@ -8224,8 +8243,8 @@ function NotificationCard({
|
|
|
8224
8243
|
|
|
8225
8244
|
// src/components/notification/NotificationStore.tsx
|
|
8226
8245
|
import { AnimatePresence, LayoutGroup, motion } from "framer-motion";
|
|
8227
|
-
import * as
|
|
8228
|
-
import { jsx as
|
|
8246
|
+
import * as React55 from "react";
|
|
8247
|
+
import { jsx as jsx43, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
8229
8248
|
var DEFAULT_DURATION = 5e3;
|
|
8230
8249
|
var PEEK_VISIBLE = 3;
|
|
8231
8250
|
var PEEK_PX = 8;
|
|
@@ -8252,7 +8271,7 @@ var POSITIONS = [
|
|
|
8252
8271
|
"bottom-right"
|
|
8253
8272
|
];
|
|
8254
8273
|
var TYPES = ["success", "error", "warning", "info"];
|
|
8255
|
-
var StoreContext =
|
|
8274
|
+
var StoreContext = React55.createContext(null);
|
|
8256
8275
|
function newId() {
|
|
8257
8276
|
return globalThis.crypto?.randomUUID?.() ?? `ntf-${Date.now()}-${Math.random().toString(16).slice(2)}`;
|
|
8258
8277
|
}
|
|
@@ -8264,10 +8283,10 @@ function NotificationStack({
|
|
|
8264
8283
|
items,
|
|
8265
8284
|
onDismiss
|
|
8266
8285
|
}) {
|
|
8267
|
-
const [expanded, setExpanded] =
|
|
8268
|
-
const collapseTimerRef =
|
|
8286
|
+
const [expanded, setExpanded] = React55.useState(false);
|
|
8287
|
+
const collapseTimerRef = React55.useRef(null);
|
|
8269
8288
|
const top = isTop(position);
|
|
8270
|
-
const handleHover =
|
|
8289
|
+
const handleHover = React55.useCallback((hovered) => {
|
|
8271
8290
|
if (collapseTimerRef.current !== null) {
|
|
8272
8291
|
clearTimeout(collapseTimerRef.current);
|
|
8273
8292
|
collapseTimerRef.current = null;
|
|
@@ -8278,14 +8297,14 @@ function NotificationStack({
|
|
|
8278
8297
|
collapseTimerRef.current = window.setTimeout(() => setExpanded(false), 100);
|
|
8279
8298
|
}
|
|
8280
8299
|
}, []);
|
|
8281
|
-
|
|
8300
|
+
React55.useEffect(
|
|
8282
8301
|
() => () => {
|
|
8283
8302
|
if (collapseTimerRef.current !== null) clearTimeout(collapseTimerRef.current);
|
|
8284
8303
|
},
|
|
8285
8304
|
[]
|
|
8286
8305
|
);
|
|
8287
8306
|
const visible = items.filter((n) => !n.dismissing);
|
|
8288
|
-
return /* @__PURE__ */
|
|
8307
|
+
return /* @__PURE__ */ jsx43(
|
|
8289
8308
|
motion.ol,
|
|
8290
8309
|
{
|
|
8291
8310
|
layout: true,
|
|
@@ -8296,7 +8315,7 @@ function NotificationStack({
|
|
|
8296
8315
|
transition: { layout: TWEEN_SLOW },
|
|
8297
8316
|
onMouseEnter: () => handleHover(true),
|
|
8298
8317
|
onMouseLeave: () => handleHover(false),
|
|
8299
|
-
children: /* @__PURE__ */
|
|
8318
|
+
children: /* @__PURE__ */ jsx43(AnimatePresence, { children: visible.map((item, index) => /* @__PURE__ */ jsx43(
|
|
8300
8319
|
NotificationStackItem,
|
|
8301
8320
|
{
|
|
8302
8321
|
item,
|
|
@@ -8312,7 +8331,7 @@ function NotificationStack({
|
|
|
8312
8331
|
}
|
|
8313
8332
|
);
|
|
8314
8333
|
}
|
|
8315
|
-
var NotificationStackItem =
|
|
8334
|
+
var NotificationStackItem = React55.memo(function NotificationStackItem2({
|
|
8316
8335
|
item,
|
|
8317
8336
|
index,
|
|
8318
8337
|
expanded,
|
|
@@ -8327,7 +8346,7 @@ var NotificationStackItem = React54.memo(function NotificationStackItem2({
|
|
|
8327
8346
|
const rotateEnter = top ? -45 : 45;
|
|
8328
8347
|
const rotateExit = top ? 25 : -25;
|
|
8329
8348
|
const layoutDep = `${item.id}-${index}-${String(expanded)}-${String(hidden)}`;
|
|
8330
|
-
return /* @__PURE__ */
|
|
8349
|
+
return /* @__PURE__ */ jsx43(
|
|
8331
8350
|
motion.li,
|
|
8332
8351
|
{
|
|
8333
8352
|
className: Notification_default.item,
|
|
@@ -8363,7 +8382,7 @@ var NotificationStackItem = React54.memo(function NotificationStackItem2({
|
|
|
8363
8382
|
transformOrigin: top ? "top center" : "bottom center",
|
|
8364
8383
|
pointerEvents: hidden ? "none" : "auto"
|
|
8365
8384
|
},
|
|
8366
|
-
children: /* @__PURE__ */
|
|
8385
|
+
children: /* @__PURE__ */ jsx43(
|
|
8367
8386
|
NotificationCard,
|
|
8368
8387
|
{
|
|
8369
8388
|
item,
|
|
@@ -8380,7 +8399,7 @@ function NotificationToaster({
|
|
|
8380
8399
|
entries,
|
|
8381
8400
|
onDismiss
|
|
8382
8401
|
}) {
|
|
8383
|
-
const grouped =
|
|
8402
|
+
const grouped = React55.useMemo(() => {
|
|
8384
8403
|
const map = /* @__PURE__ */ new Map();
|
|
8385
8404
|
for (const entry of entries) {
|
|
8386
8405
|
if (!map.has(entry.position)) map.set(entry.position, /* @__PURE__ */ new Map());
|
|
@@ -8396,18 +8415,18 @@ function NotificationToaster({
|
|
|
8396
8415
|
}
|
|
8397
8416
|
return map;
|
|
8398
8417
|
}, [entries]);
|
|
8399
|
-
return /* @__PURE__ */
|
|
8418
|
+
return /* @__PURE__ */ jsx43(Portal, { children: /* @__PURE__ */ jsx43("div", { className: Notification_default.viewport, children: POSITIONS.map((pos) => {
|
|
8400
8419
|
const byType = grouped.get(pos);
|
|
8401
8420
|
if (!byType?.size) return null;
|
|
8402
8421
|
const [vertical, horizontal] = pos.split("-");
|
|
8403
8422
|
const stacks = TYPES.map((type) => ({ type, items: byType.get(type) ?? [] })).filter(
|
|
8404
8423
|
(s) => s.items.length > 0
|
|
8405
8424
|
);
|
|
8406
|
-
return /* @__PURE__ */
|
|
8425
|
+
return /* @__PURE__ */ jsx43(
|
|
8407
8426
|
"section",
|
|
8408
8427
|
{
|
|
8409
8428
|
className: `${Notification_default.zone} ${Notification_default[vertical]} ${Notification_default[horizontal]}`,
|
|
8410
|
-
children: /* @__PURE__ */
|
|
8429
|
+
children: /* @__PURE__ */ jsx43(LayoutGroup, { id: `zone-${pos}`, children: stacks.map((s) => /* @__PURE__ */ jsx43(
|
|
8411
8430
|
NotificationStack,
|
|
8412
8431
|
{
|
|
8413
8432
|
position: pos,
|
|
@@ -8426,18 +8445,18 @@ function NotificationProvider({
|
|
|
8426
8445
|
position = "top-right",
|
|
8427
8446
|
max = 5
|
|
8428
8447
|
}) {
|
|
8429
|
-
const [entries, setEntries] =
|
|
8430
|
-
const dismiss =
|
|
8448
|
+
const [entries, setEntries] = React55.useState([]);
|
|
8449
|
+
const dismiss = React55.useCallback((id) => {
|
|
8431
8450
|
setEntries((prev) => prev.map((n) => n.id === id ? { ...n, dismissing: true } : n));
|
|
8432
8451
|
window.setTimeout(() => {
|
|
8433
8452
|
setEntries((prev) => prev.filter((n) => n.id !== id));
|
|
8434
8453
|
}, DISMISS_CLEANUP_MS);
|
|
8435
8454
|
}, []);
|
|
8436
|
-
const dismissAll =
|
|
8455
|
+
const dismissAll = React55.useCallback(() => {
|
|
8437
8456
|
setEntries((prev) => prev.map((n) => ({ ...n, dismissing: true })));
|
|
8438
8457
|
window.setTimeout(() => setEntries([]), DISMISS_CLEANUP_MS);
|
|
8439
8458
|
}, []);
|
|
8440
|
-
const notify =
|
|
8459
|
+
const notify = React55.useCallback(
|
|
8441
8460
|
(options) => {
|
|
8442
8461
|
const id = newId();
|
|
8443
8462
|
const record = {
|
|
@@ -8463,29 +8482,29 @@ function NotificationProvider({
|
|
|
8463
8482
|
},
|
|
8464
8483
|
[position, max]
|
|
8465
8484
|
);
|
|
8466
|
-
const publicItems =
|
|
8467
|
-
const value =
|
|
8485
|
+
const publicItems = React55.useMemo(() => entries.filter((n) => !n.dismissing), [entries]);
|
|
8486
|
+
const value = React55.useMemo(
|
|
8468
8487
|
() => ({ items: publicItems, notify, dismiss, dismissAll }),
|
|
8469
8488
|
[publicItems, notify, dismiss, dismissAll]
|
|
8470
8489
|
);
|
|
8471
8490
|
return /* @__PURE__ */ jsxs22(StoreContext.Provider, { value, children: [
|
|
8472
8491
|
children,
|
|
8473
|
-
/* @__PURE__ */
|
|
8492
|
+
/* @__PURE__ */ jsx43(NotificationToaster, { entries, onDismiss: dismiss })
|
|
8474
8493
|
] });
|
|
8475
8494
|
}
|
|
8476
8495
|
function useNotifications() {
|
|
8477
|
-
const ctx =
|
|
8496
|
+
const ctx = React55.useContext(StoreContext);
|
|
8478
8497
|
if (!ctx) throw new Error("useNotifications must be used within NotificationProvider");
|
|
8479
8498
|
return { notify: ctx.notify, dismiss: ctx.dismiss, dismissAll: ctx.dismissAll };
|
|
8480
8499
|
}
|
|
8481
8500
|
function useNotificationStore() {
|
|
8482
|
-
const ctx =
|
|
8501
|
+
const ctx = React55.useContext(StoreContext);
|
|
8483
8502
|
if (!ctx) throw new Error("useNotificationStore must be used within NotificationProvider");
|
|
8484
8503
|
return ctx;
|
|
8485
8504
|
}
|
|
8486
8505
|
|
|
8487
8506
|
// src/components/page-content/PageContent.tsx
|
|
8488
|
-
import * as
|
|
8507
|
+
import * as React56 from "react";
|
|
8489
8508
|
|
|
8490
8509
|
// src/components/page-content/PageContent.module.css
|
|
8491
8510
|
var PageContent_default = {
|
|
@@ -8498,10 +8517,10 @@ var PageContent_default = {
|
|
|
8498
8517
|
};
|
|
8499
8518
|
|
|
8500
8519
|
// src/components/page-content/PageContent.tsx
|
|
8501
|
-
import { jsx as
|
|
8502
|
-
var PageContentRoot =
|
|
8520
|
+
import { jsx as jsx44 } from "react/jsx-runtime";
|
|
8521
|
+
var PageContentRoot = React56.forwardRef(
|
|
8503
8522
|
function PageContentRoot2({ maxWidth = "full", className, children, ...rest }, forwardedRef) {
|
|
8504
|
-
return /* @__PURE__ */
|
|
8523
|
+
return /* @__PURE__ */ jsx44(
|
|
8505
8524
|
"div",
|
|
8506
8525
|
{
|
|
8507
8526
|
ref: forwardedRef,
|
|
@@ -8516,25 +8535,25 @@ var PageContentRoot = React55.forwardRef(
|
|
|
8516
8535
|
}
|
|
8517
8536
|
);
|
|
8518
8537
|
PageContentRoot.displayName = "PageContent.Root";
|
|
8519
|
-
var PageContentSection =
|
|
8538
|
+
var PageContentSection = React56.forwardRef(
|
|
8520
8539
|
function PageContentSection2({ className, children, ...rest }, forwardedRef) {
|
|
8521
|
-
return /* @__PURE__ */
|
|
8540
|
+
return /* @__PURE__ */ jsx44("section", { ref: forwardedRef, className: cx(PageContent_default.section, className), ...rest, children });
|
|
8522
8541
|
}
|
|
8523
8542
|
);
|
|
8524
8543
|
PageContentSection.displayName = "PageContent.Section";
|
|
8525
8544
|
function PageContentHeader({ className, children, ...rest }) {
|
|
8526
|
-
return /* @__PURE__ */
|
|
8545
|
+
return /* @__PURE__ */ jsx44("div", { className: cx(PageContent_default.header, className), ...rest, children });
|
|
8527
8546
|
}
|
|
8528
8547
|
PageContentHeader.displayName = "PageContent.Header";
|
|
8529
|
-
var PageContentTitle =
|
|
8548
|
+
var PageContentTitle = React56.forwardRef(
|
|
8530
8549
|
function PageContentTitle2({ className, children, ...rest }, forwardedRef) {
|
|
8531
|
-
return /* @__PURE__ */
|
|
8550
|
+
return /* @__PURE__ */ jsx44("h1", { ref: forwardedRef, className: cx(PageContent_default.title, className), ...rest, children });
|
|
8532
8551
|
}
|
|
8533
8552
|
);
|
|
8534
8553
|
PageContentTitle.displayName = "PageContent.Title";
|
|
8535
|
-
var PageContentDescription =
|
|
8554
|
+
var PageContentDescription = React56.forwardRef(
|
|
8536
8555
|
function PageContentDescription2({ className, children, measure = "readable", ...rest }, forwardedRef) {
|
|
8537
|
-
return /* @__PURE__ */
|
|
8556
|
+
return /* @__PURE__ */ jsx44(
|
|
8538
8557
|
"p",
|
|
8539
8558
|
{
|
|
8540
8559
|
ref: forwardedRef,
|
|
@@ -8550,7 +8569,7 @@ var PageContentDescription = React55.forwardRef(
|
|
|
8550
8569
|
);
|
|
8551
8570
|
PageContentDescription.displayName = "PageContent.Description";
|
|
8552
8571
|
function PageContentBody({ className, children, ...rest }) {
|
|
8553
|
-
return /* @__PURE__ */
|
|
8572
|
+
return /* @__PURE__ */ jsx44("div", { className: cx(PageContent_default.body, className), ...rest, children });
|
|
8554
8573
|
}
|
|
8555
8574
|
PageContentBody.displayName = "PageContent.Body";
|
|
8556
8575
|
var PageContent = {
|
|
@@ -8563,17 +8582,17 @@ var PageContent = {
|
|
|
8563
8582
|
};
|
|
8564
8583
|
|
|
8565
8584
|
// src/components/popover/Popover.tsx
|
|
8566
|
-
import * as
|
|
8585
|
+
import * as React58 from "react";
|
|
8567
8586
|
|
|
8568
8587
|
// src/components/popover/Popover.module.css
|
|
8569
8588
|
var Popover_default = {
|
|
8570
|
-
|
|
8589
|
+
popoverScroll: "Popover_popoverScroll2",
|
|
8571
8590
|
popoverInBottom: "Popover_popoverInBottom2",
|
|
8572
8591
|
popoverInTop: "Popover_popoverInTop2"
|
|
8573
8592
|
};
|
|
8574
8593
|
|
|
8575
8594
|
// src/components/popover/usePopoverPosition.ts
|
|
8576
|
-
import * as
|
|
8595
|
+
import * as React57 from "react";
|
|
8577
8596
|
|
|
8578
8597
|
// src/components/popover/popoverGeometry.ts
|
|
8579
8598
|
var POPOVER_MIN_MAX_HEIGHT = 120;
|
|
@@ -8600,8 +8619,8 @@ function usePopoverPosition({
|
|
|
8600
8619
|
align,
|
|
8601
8620
|
sameMinWidthAsTrigger
|
|
8602
8621
|
}) {
|
|
8603
|
-
const [layout, setLayout] =
|
|
8604
|
-
const commit =
|
|
8622
|
+
const [layout, setLayout] = React57.useState(null);
|
|
8623
|
+
const commit = React57.useCallback(() => {
|
|
8605
8624
|
const trigger = triggerRef.current;
|
|
8606
8625
|
const panel = contentRef.current;
|
|
8607
8626
|
if (!trigger || !panel) return;
|
|
@@ -8638,7 +8657,7 @@ function usePopoverPosition({
|
|
|
8638
8657
|
};
|
|
8639
8658
|
setLayout((prev) => prev && layoutEqual2(prev, next) ? prev : next);
|
|
8640
8659
|
}, [triggerRef, contentRef, side, align, sameMinWidthAsTrigger]);
|
|
8641
|
-
|
|
8660
|
+
React57.useLayoutEffect(() => {
|
|
8642
8661
|
if (!open) {
|
|
8643
8662
|
setLayout(null);
|
|
8644
8663
|
return;
|
|
@@ -8675,7 +8694,7 @@ function usePopoverPosition({
|
|
|
8675
8694
|
}
|
|
8676
8695
|
|
|
8677
8696
|
// src/components/popover/Popover.tsx
|
|
8678
|
-
import { jsx as
|
|
8697
|
+
import { jsx as jsx45 } from "react/jsx-runtime";
|
|
8679
8698
|
var [PopoverProvider, usePopoverContext] = createComponentContext("Popover");
|
|
8680
8699
|
function PopoverRoot({ open, defaultOpen = false, onOpenChange, children }) {
|
|
8681
8700
|
const [isOpen, setIsOpen] = useControllableState({
|
|
@@ -8683,25 +8702,25 @@ function PopoverRoot({ open, defaultOpen = false, onOpenChange, children }) {
|
|
|
8683
8702
|
defaultValue: defaultOpen,
|
|
8684
8703
|
onChange: onOpenChange
|
|
8685
8704
|
});
|
|
8686
|
-
const id =
|
|
8705
|
+
const id = React58.useId();
|
|
8687
8706
|
const triggerId = `${id}-trigger`;
|
|
8688
8707
|
const contentId = `${id}-content`;
|
|
8689
|
-
const triggerRef =
|
|
8690
|
-
const onClose =
|
|
8691
|
-
const onToggle =
|
|
8692
|
-
const value =
|
|
8708
|
+
const triggerRef = React58.useRef(null);
|
|
8709
|
+
const onClose = React58.useCallback(() => setIsOpen(false), [setIsOpen]);
|
|
8710
|
+
const onToggle = React58.useCallback(() => setIsOpen((v) => !v), [setIsOpen]);
|
|
8711
|
+
const value = React58.useMemo(
|
|
8693
8712
|
() => ({ isOpen, onClose, onToggle, triggerId, contentId, triggerRef }),
|
|
8694
8713
|
[isOpen, onClose, onToggle, triggerId, contentId]
|
|
8695
8714
|
);
|
|
8696
|
-
return /* @__PURE__ */
|
|
8715
|
+
return /* @__PURE__ */ jsx45(PopoverProvider, { value, children });
|
|
8697
8716
|
}
|
|
8698
8717
|
PopoverRoot.displayName = "PopoverRoot";
|
|
8699
8718
|
function PopoverTrigger({ children, asChild: _asChild = true }) {
|
|
8700
8719
|
void _asChild;
|
|
8701
8720
|
const { isOpen, onToggle, triggerId, contentId, triggerRef } = usePopoverContext();
|
|
8702
|
-
const toggleRef =
|
|
8721
|
+
const toggleRef = React58.useRef(onToggle);
|
|
8703
8722
|
toggleRef.current = onToggle;
|
|
8704
|
-
const setNode =
|
|
8723
|
+
const setNode = React58.useCallback(
|
|
8705
8724
|
(el) => {
|
|
8706
8725
|
triggerRef.current = el;
|
|
8707
8726
|
},
|
|
@@ -8709,9 +8728,9 @@ function PopoverTrigger({ children, asChild: _asChild = true }) {
|
|
|
8709
8728
|
);
|
|
8710
8729
|
const child = children;
|
|
8711
8730
|
const childRef = child.props.ref ?? child.ref;
|
|
8712
|
-
const mergedRef =
|
|
8731
|
+
const mergedRef = React58.useMemo(() => mergeRefs(childRef, setNode), [childRef, setNode]);
|
|
8713
8732
|
const userClick = child.props?.onClick;
|
|
8714
|
-
return
|
|
8733
|
+
return React58.cloneElement(child, {
|
|
8715
8734
|
ref: mergedRef,
|
|
8716
8735
|
id: triggerId,
|
|
8717
8736
|
"aria-expanded": isOpen,
|
|
@@ -8731,13 +8750,13 @@ function PopoverContent({
|
|
|
8731
8750
|
size = "m",
|
|
8732
8751
|
trapFocus = false,
|
|
8733
8752
|
insetPadding = "none",
|
|
8734
|
-
insetGap = "
|
|
8753
|
+
insetGap = "pad",
|
|
8735
8754
|
children,
|
|
8736
8755
|
className
|
|
8737
8756
|
}) {
|
|
8738
8757
|
const { isOpen, onClose, triggerRef, contentId, triggerId } = usePopoverContext();
|
|
8739
8758
|
const overlayPortalLayer = useOverlayPortalLayer();
|
|
8740
|
-
const contentRef =
|
|
8759
|
+
const contentRef = React58.useRef(null);
|
|
8741
8760
|
const layout = usePopoverPosition({
|
|
8742
8761
|
open: isOpen,
|
|
8743
8762
|
triggerRef,
|
|
@@ -8750,7 +8769,7 @@ function PopoverContent({
|
|
|
8750
8769
|
enabled: isOpen && trapFocus,
|
|
8751
8770
|
restoreFocus: true
|
|
8752
8771
|
});
|
|
8753
|
-
const ref =
|
|
8772
|
+
const ref = React58.useMemo(() => mergeRefs(contentRef, trapRef), [trapRef]);
|
|
8754
8773
|
useEscapeKey({ enabled: isOpen, onEscape: onClose });
|
|
8755
8774
|
useOutsideClick({
|
|
8756
8775
|
refs: [triggerRef, contentRef],
|
|
@@ -8759,7 +8778,7 @@ function PopoverContent({
|
|
|
8759
8778
|
shouldSuppressOutsideClick: (target) => isPortaledSelectListboxOwnedByContainer(target, contentRef.current)
|
|
8760
8779
|
});
|
|
8761
8780
|
if (!isOpen) return null;
|
|
8762
|
-
return /* @__PURE__ */
|
|
8781
|
+
return /* @__PURE__ */ jsx45(Portal, { children: /* @__PURE__ */ jsx45(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx45(
|
|
8763
8782
|
ScrollContainer,
|
|
8764
8783
|
{
|
|
8765
8784
|
ref,
|
|
@@ -8773,7 +8792,7 @@ function PopoverContent({
|
|
|
8773
8792
|
"data-size": size,
|
|
8774
8793
|
"data-inset-padding": insetPadding,
|
|
8775
8794
|
"data-inset-gap": insetGap,
|
|
8776
|
-
className: cx(Popover_default.
|
|
8795
|
+
className: cx(Popover_default.popoverScroll, className),
|
|
8777
8796
|
style: layout?.style,
|
|
8778
8797
|
children
|
|
8779
8798
|
}
|
|
@@ -8787,7 +8806,7 @@ var Popover = {
|
|
|
8787
8806
|
};
|
|
8788
8807
|
|
|
8789
8808
|
// src/components/progress-circle/ProgressCircle.tsx
|
|
8790
|
-
import * as
|
|
8809
|
+
import * as React59 from "react";
|
|
8791
8810
|
|
|
8792
8811
|
// src/components/progress-circle/ProgressCircle.module.css
|
|
8793
8812
|
var ProgressCircle_default = {
|
|
@@ -8798,12 +8817,12 @@ var ProgressCircle_default = {
|
|
|
8798
8817
|
};
|
|
8799
8818
|
|
|
8800
8819
|
// src/components/progress-circle/ProgressCircle.tsx
|
|
8801
|
-
import { jsx as
|
|
8820
|
+
import { jsx as jsx46, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
8802
8821
|
var pc = primitiveTokens.progressCircle;
|
|
8803
8822
|
function clampProgress2(value, max) {
|
|
8804
8823
|
return Math.min(max, Math.max(value, 0));
|
|
8805
8824
|
}
|
|
8806
|
-
var ProgressCircleRoot =
|
|
8825
|
+
var ProgressCircleRoot = React59.forwardRef(
|
|
8807
8826
|
({ value, max = 100, size = "m", label, children, className }, ref) => {
|
|
8808
8827
|
const safeMax = max > 0 ? max : 100;
|
|
8809
8828
|
const safeValue = clampProgress2(value, safeMax);
|
|
@@ -8837,7 +8856,7 @@ var ProgressCircleRoot = React58.forwardRef(
|
|
|
8837
8856
|
"aria-valuemax": safeMax,
|
|
8838
8857
|
"aria-label": label,
|
|
8839
8858
|
children: [
|
|
8840
|
-
/* @__PURE__ */
|
|
8859
|
+
/* @__PURE__ */ jsx46(
|
|
8841
8860
|
"circle",
|
|
8842
8861
|
{
|
|
8843
8862
|
cx: center,
|
|
@@ -8848,7 +8867,7 @@ var ProgressCircleRoot = React58.forwardRef(
|
|
|
8848
8867
|
strokeWidth
|
|
8849
8868
|
}
|
|
8850
8869
|
),
|
|
8851
|
-
/* @__PURE__ */
|
|
8870
|
+
/* @__PURE__ */ jsx46(
|
|
8852
8871
|
"circle",
|
|
8853
8872
|
{
|
|
8854
8873
|
cx: center,
|
|
@@ -8865,7 +8884,7 @@ var ProgressCircleRoot = React58.forwardRef(
|
|
|
8865
8884
|
]
|
|
8866
8885
|
}
|
|
8867
8886
|
),
|
|
8868
|
-
children ? /* @__PURE__ */
|
|
8887
|
+
children ? /* @__PURE__ */ jsx46("div", { className: ProgressCircle_default.inner, children }) : null
|
|
8869
8888
|
]
|
|
8870
8889
|
}
|
|
8871
8890
|
);
|
|
@@ -8875,7 +8894,7 @@ ProgressCircleRoot.displayName = "ProgressCircleRoot";
|
|
|
8875
8894
|
var ProgressCircle = { Root: ProgressCircleRoot };
|
|
8876
8895
|
|
|
8877
8896
|
// src/components/radio/Radio.tsx
|
|
8878
|
-
import * as
|
|
8897
|
+
import * as React60 from "react";
|
|
8879
8898
|
|
|
8880
8899
|
// src/components/radio/Radio.module.css
|
|
8881
8900
|
var Radio_default = {
|
|
@@ -8891,9 +8910,9 @@ var Radio_default = {
|
|
|
8891
8910
|
};
|
|
8892
8911
|
|
|
8893
8912
|
// src/components/radio/Radio.tsx
|
|
8894
|
-
import { jsx as
|
|
8913
|
+
import { jsx as jsx47, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
8895
8914
|
var [RadioProvider, useRadioContext] = createComponentContext("Radio");
|
|
8896
|
-
var RadioRoot =
|
|
8915
|
+
var RadioRoot = React60.forwardRef(
|
|
8897
8916
|
({
|
|
8898
8917
|
id,
|
|
8899
8918
|
variant = "default",
|
|
@@ -8904,14 +8923,14 @@ var RadioRoot = React59.forwardRef(
|
|
|
8904
8923
|
children,
|
|
8905
8924
|
...inputRest
|
|
8906
8925
|
}, ref) => {
|
|
8907
|
-
const rawId =
|
|
8926
|
+
const rawId = React60.useId();
|
|
8908
8927
|
const inputId = id ?? rawId;
|
|
8909
8928
|
const hintId = `${inputId}-hint`;
|
|
8910
8929
|
const errorId = `${inputId}-error`;
|
|
8911
|
-
const [hasHint, setHasHint] =
|
|
8912
|
-
const [hasError, setHasError] =
|
|
8930
|
+
const [hasHint, setHasHint] = React60.useState(false);
|
|
8931
|
+
const [hasError, setHasError] = React60.useState(false);
|
|
8913
8932
|
const invalid = variant === "error" || hasError;
|
|
8914
|
-
const restInputPropsRef =
|
|
8933
|
+
const restInputPropsRef = React60.useRef(inputRest);
|
|
8915
8934
|
restInputPropsRef.current = inputRest;
|
|
8916
8935
|
const parts = [
|
|
8917
8936
|
ariaDescribedBy,
|
|
@@ -8919,11 +8938,11 @@ var RadioRoot = React59.forwardRef(
|
|
|
8919
8938
|
hasError ? errorId : void 0
|
|
8920
8939
|
].filter(Boolean);
|
|
8921
8940
|
const describedBy = parts.length > 0 ? parts.join(" ") : void 0;
|
|
8922
|
-
const registerHint =
|
|
8923
|
-
const unregisterHint =
|
|
8924
|
-
const registerError =
|
|
8925
|
-
const unregisterError =
|
|
8926
|
-
const ctxValue =
|
|
8941
|
+
const registerHint = React60.useCallback(() => setHasHint(true), []);
|
|
8942
|
+
const unregisterHint = React60.useCallback(() => setHasHint(false), []);
|
|
8943
|
+
const registerError = React60.useCallback(() => setHasError(true), []);
|
|
8944
|
+
const unregisterError = React60.useCallback(() => setHasError(false), []);
|
|
8945
|
+
const ctxValue = React60.useMemo(
|
|
8927
8946
|
() => ({
|
|
8928
8947
|
inputId,
|
|
8929
8948
|
hintId,
|
|
@@ -8954,7 +8973,7 @@ var RadioRoot = React59.forwardRef(
|
|
|
8954
8973
|
unregisterError
|
|
8955
8974
|
]
|
|
8956
8975
|
);
|
|
8957
|
-
return /* @__PURE__ */
|
|
8976
|
+
return /* @__PURE__ */ jsx47(RadioProvider, { value: ctxValue, children: /* @__PURE__ */ jsx47(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx47(
|
|
8958
8977
|
"div",
|
|
8959
8978
|
{
|
|
8960
8979
|
className: cx(Radio_default.field, className),
|
|
@@ -8970,9 +8989,9 @@ var RadioRoot = React59.forwardRef(
|
|
|
8970
8989
|
}
|
|
8971
8990
|
);
|
|
8972
8991
|
RadioRoot.displayName = "RadioRoot";
|
|
8973
|
-
var RadioLabel =
|
|
8992
|
+
var RadioLabel = React60.forwardRef(function RadioLabel2({ children, className, ...rest }, ref) {
|
|
8974
8993
|
const { inputId, inputRef, invalid, disabled, describedBy, restInputPropsRef, size } = useRadioContext();
|
|
8975
|
-
const filterId =
|
|
8994
|
+
const filterId = React60.useId();
|
|
8976
8995
|
const svgFilterId = `es-radio-${filterId.replace(/:/g, "")}`;
|
|
8977
8996
|
return /* @__PURE__ */ jsxs24(
|
|
8978
8997
|
Label.Root,
|
|
@@ -8985,7 +9004,7 @@ var RadioLabel = React59.forwardRef(function RadioLabel2({ children, className,
|
|
|
8985
9004
|
...rest,
|
|
8986
9005
|
children: [
|
|
8987
9006
|
/* @__PURE__ */ jsxs24("span", { className: Radio_default.controlCell, children: [
|
|
8988
|
-
/* @__PURE__ */
|
|
9007
|
+
/* @__PURE__ */ jsx47(
|
|
8989
9008
|
"input",
|
|
8990
9009
|
{
|
|
8991
9010
|
ref: inputRef,
|
|
@@ -8999,8 +9018,8 @@ var RadioLabel = React59.forwardRef(function RadioLabel2({ children, className,
|
|
|
8999
9018
|
}
|
|
9000
9019
|
),
|
|
9001
9020
|
/* @__PURE__ */ jsxs24("svg", { viewBox: "0 0 18 18", className: Radio_default.svg, "aria-hidden": "true", children: [
|
|
9002
|
-
/* @__PURE__ */
|
|
9003
|
-
/* @__PURE__ */
|
|
9021
|
+
/* @__PURE__ */ jsx47("defs", { children: /* @__PURE__ */ jsx47("filter", { id: svgFilterId, children: /* @__PURE__ */ jsx47("feDropShadow", { dx: "0", dy: "1", stdDeviation: "0.5", floodOpacity: "0.10" }) }) }),
|
|
9022
|
+
/* @__PURE__ */ jsx47(
|
|
9004
9023
|
"circle",
|
|
9005
9024
|
{
|
|
9006
9025
|
cx: "9",
|
|
@@ -9010,10 +9029,10 @@ var RadioLabel = React59.forwardRef(function RadioLabel2({ children, className,
|
|
|
9010
9029
|
filter: `url(#${svgFilterId})`
|
|
9011
9030
|
}
|
|
9012
9031
|
),
|
|
9013
|
-
/* @__PURE__ */
|
|
9032
|
+
/* @__PURE__ */ jsx47("circle", { cx: "9", cy: "9", r: "4", className: Radio_default.innerCircle })
|
|
9014
9033
|
] })
|
|
9015
9034
|
] }),
|
|
9016
|
-
children !== void 0 && children !== null ? /* @__PURE__ */
|
|
9035
|
+
children !== void 0 && children !== null ? /* @__PURE__ */ jsx47("span", { className: Radio_default.text, children }) : null
|
|
9017
9036
|
]
|
|
9018
9037
|
}
|
|
9019
9038
|
);
|
|
@@ -9021,13 +9040,13 @@ var RadioLabel = React59.forwardRef(function RadioLabel2({ children, className,
|
|
|
9021
9040
|
RadioLabel.displayName = "RadioLabel";
|
|
9022
9041
|
function RadioHint({ children, className, ...rest }) {
|
|
9023
9042
|
const { hintId, registerHint, unregisterHint, size, disabled } = useRadioContext();
|
|
9024
|
-
|
|
9043
|
+
React60.useLayoutEffect(() => {
|
|
9025
9044
|
registerHint();
|
|
9026
9045
|
return () => {
|
|
9027
9046
|
unregisterHint();
|
|
9028
9047
|
};
|
|
9029
9048
|
}, [registerHint, unregisterHint]);
|
|
9030
|
-
return /* @__PURE__ */
|
|
9049
|
+
return /* @__PURE__ */ jsx47(
|
|
9031
9050
|
Hint.Root,
|
|
9032
9051
|
{
|
|
9033
9052
|
id: hintId,
|
|
@@ -9042,13 +9061,13 @@ function RadioHint({ children, className, ...rest }) {
|
|
|
9042
9061
|
RadioHint.displayName = "RadioHint";
|
|
9043
9062
|
function RadioError({ children, className, ...rest }) {
|
|
9044
9063
|
const { errorId, registerError, unregisterError, size } = useRadioContext();
|
|
9045
|
-
|
|
9064
|
+
React60.useLayoutEffect(() => {
|
|
9046
9065
|
registerError();
|
|
9047
9066
|
return () => {
|
|
9048
9067
|
unregisterError();
|
|
9049
9068
|
};
|
|
9050
9069
|
}, [registerError, unregisterError]);
|
|
9051
|
-
return /* @__PURE__ */
|
|
9070
|
+
return /* @__PURE__ */ jsx47(
|
|
9052
9071
|
Hint.Root,
|
|
9053
9072
|
{
|
|
9054
9073
|
id: errorId,
|
|
@@ -9069,7 +9088,7 @@ var Radio = {
|
|
|
9069
9088
|
};
|
|
9070
9089
|
|
|
9071
9090
|
// src/components/segmented-progress-bar/SegmentedProgressBar.tsx
|
|
9072
|
-
import * as
|
|
9091
|
+
import * as React61 from "react";
|
|
9073
9092
|
|
|
9074
9093
|
// src/components/segmented-progress-bar/SegmentedProgressBar.module.css
|
|
9075
9094
|
var SegmentedProgressBar_default = {
|
|
@@ -9081,7 +9100,7 @@ var SegmentedProgressBar_default = {
|
|
|
9081
9100
|
};
|
|
9082
9101
|
|
|
9083
9102
|
// src/components/segmented-progress-bar/SegmentedProgressBar.tsx
|
|
9084
|
-
import { jsx as
|
|
9103
|
+
import { jsx as jsx48, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
9085
9104
|
function clampNonNegative(n) {
|
|
9086
9105
|
return Number.isFinite(n) && n > 0 ? n : 0;
|
|
9087
9106
|
}
|
|
@@ -9098,15 +9117,15 @@ function buildDistributionDescription(segments, total) {
|
|
|
9098
9117
|
});
|
|
9099
9118
|
return parts.join(", ");
|
|
9100
9119
|
}
|
|
9101
|
-
var SegmentedProgressBarRoot =
|
|
9120
|
+
var SegmentedProgressBarRoot = React61.forwardRef(
|
|
9102
9121
|
({ segments, label, size = "m", segmentGap = "none", className }, ref) => {
|
|
9103
|
-
const labelId =
|
|
9104
|
-
const descriptionId =
|
|
9105
|
-
const safe =
|
|
9122
|
+
const labelId = React61.useId();
|
|
9123
|
+
const descriptionId = React61.useId();
|
|
9124
|
+
const safe = React61.useMemo(
|
|
9106
9125
|
() => segments.map((s) => ({ ...s, value: clampNonNegative(s.value) })),
|
|
9107
9126
|
[segments]
|
|
9108
9127
|
);
|
|
9109
|
-
const total =
|
|
9128
|
+
const total = React61.useMemo(() => safe.reduce((acc, s) => acc + s.value, 0), [safe]);
|
|
9110
9129
|
const distributionText = buildDistributionDescription(safe, total);
|
|
9111
9130
|
const trackA11y = label ? { "aria-labelledby": labelId, "aria-describedby": descriptionId } : { "aria-label": distributionText };
|
|
9112
9131
|
return /* @__PURE__ */ jsxs25(
|
|
@@ -9115,10 +9134,10 @@ var SegmentedProgressBarRoot = React60.forwardRef(
|
|
|
9115
9134
|
className: cx(SegmentedProgressBar_default.root, className),
|
|
9116
9135
|
...toDataAttributes({ size, "segment-gap": segmentGap }),
|
|
9117
9136
|
children: [
|
|
9118
|
-
label ? /* @__PURE__ */
|
|
9119
|
-
label ? /* @__PURE__ */
|
|
9120
|
-
/* @__PURE__ */
|
|
9121
|
-
return /* @__PURE__ */
|
|
9137
|
+
label ? /* @__PURE__ */ jsx48("span", { className: SegmentedProgressBar_default.label, id: labelId, children: label }) : null,
|
|
9138
|
+
label ? /* @__PURE__ */ jsx48("span", { id: descriptionId, className: SegmentedProgressBar_default.visuallyHidden, children: distributionText }) : null,
|
|
9139
|
+
/* @__PURE__ */ jsx48("div", { ref, className: SegmentedProgressBar_default.track, role: "group", ...trackA11y, children: total > 0 ? safe.map((seg, i) => {
|
|
9140
|
+
return /* @__PURE__ */ jsx48(
|
|
9122
9141
|
"div",
|
|
9123
9142
|
{
|
|
9124
9143
|
className: SegmentedProgressBar_default.segment,
|
|
@@ -9138,7 +9157,7 @@ SegmentedProgressBarRoot.displayName = "SegmentedProgressBarRoot";
|
|
|
9138
9157
|
var SegmentedProgressBar = { Root: SegmentedProgressBarRoot };
|
|
9139
9158
|
|
|
9140
9159
|
// src/components/slider/Slider.tsx
|
|
9141
|
-
import * as
|
|
9160
|
+
import * as React62 from "react";
|
|
9142
9161
|
|
|
9143
9162
|
// src/components/slider/Slider.module.css
|
|
9144
9163
|
var Slider_default = {
|
|
@@ -9148,7 +9167,7 @@ var Slider_default = {
|
|
|
9148
9167
|
};
|
|
9149
9168
|
|
|
9150
9169
|
// src/components/slider/Slider.tsx
|
|
9151
|
-
import { jsx as
|
|
9170
|
+
import { jsx as jsx49, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
9152
9171
|
function clamp2(n, min, max) {
|
|
9153
9172
|
return Math.min(max, Math.max(min, n));
|
|
9154
9173
|
}
|
|
@@ -9174,7 +9193,7 @@ function SliderRoot({
|
|
|
9174
9193
|
defaultValue: clamp2(initialDefault, min, max),
|
|
9175
9194
|
onChange
|
|
9176
9195
|
});
|
|
9177
|
-
const id =
|
|
9196
|
+
const id = React62.useId();
|
|
9178
9197
|
const safeValue = clamp2(value, min, max);
|
|
9179
9198
|
const applyValueFromInput = (el) => {
|
|
9180
9199
|
const next = Number.parseFloat(el.value);
|
|
@@ -9189,9 +9208,9 @@ function SliderRoot({
|
|
|
9189
9208
|
const handleRangeInput = (e) => {
|
|
9190
9209
|
applyValueFromInput(e.currentTarget);
|
|
9191
9210
|
};
|
|
9192
|
-
return /* @__PURE__ */
|
|
9193
|
-
label ? /* @__PURE__ */
|
|
9194
|
-
/* @__PURE__ */
|
|
9211
|
+
return /* @__PURE__ */ jsx49("div", { className: cx(Slider_default.root, className), ...toDataAttributes({ size }), children: /* @__PURE__ */ jsxs26(ControlSizeProvider, { value: size, children: [
|
|
9212
|
+
label ? /* @__PURE__ */ jsx49("label", { className: Slider_default.label, htmlFor: id, children: label }) : null,
|
|
9213
|
+
/* @__PURE__ */ jsx49(
|
|
9195
9214
|
"input",
|
|
9196
9215
|
{
|
|
9197
9216
|
id: label ? id : void 0,
|
|
@@ -9213,7 +9232,7 @@ SliderRoot.displayName = "SliderRoot";
|
|
|
9213
9232
|
var Slider2 = { Root: SliderRoot };
|
|
9214
9233
|
|
|
9215
9234
|
// src/components/stepper/HorizontalStepper.tsx
|
|
9216
|
-
import * as
|
|
9235
|
+
import * as React63 from "react";
|
|
9217
9236
|
|
|
9218
9237
|
// src/components/stepper/StepperAlign.module.css
|
|
9219
9238
|
var StepperAlign_default = {
|
|
@@ -9231,10 +9250,10 @@ var StepperAlign_default = {
|
|
|
9231
9250
|
};
|
|
9232
9251
|
|
|
9233
9252
|
// src/components/stepper/stepperAlignContext.tsx
|
|
9234
|
-
import { jsx as
|
|
9253
|
+
import { jsx as jsx50 } from "react/jsx-runtime";
|
|
9235
9254
|
var [StepperAlignItemProvider, useStepperAlignItemState] = createComponentContext("StepperAlign.Item");
|
|
9236
9255
|
function StepperAlignCheckIcon({ className }) {
|
|
9237
|
-
return /* @__PURE__ */
|
|
9256
|
+
return /* @__PURE__ */ jsx50(
|
|
9238
9257
|
"svg",
|
|
9239
9258
|
{
|
|
9240
9259
|
className,
|
|
@@ -9242,7 +9261,7 @@ function StepperAlignCheckIcon({ className }) {
|
|
|
9242
9261
|
xmlns: "http://www.w3.org/2000/svg",
|
|
9243
9262
|
fill: "none",
|
|
9244
9263
|
"aria-hidden": "true",
|
|
9245
|
-
children: /* @__PURE__ */
|
|
9264
|
+
children: /* @__PURE__ */ jsx50(
|
|
9246
9265
|
"path",
|
|
9247
9266
|
{
|
|
9248
9267
|
fill: "currentColor",
|
|
@@ -9254,14 +9273,14 @@ function StepperAlignCheckIcon({ className }) {
|
|
|
9254
9273
|
}
|
|
9255
9274
|
|
|
9256
9275
|
// src/components/stepper/HorizontalStepper.tsx
|
|
9257
|
-
import { jsx as
|
|
9276
|
+
import { jsx as jsx51 } from "react/jsx-runtime";
|
|
9258
9277
|
function HorizontalStepperRoot({
|
|
9259
9278
|
className,
|
|
9260
9279
|
size = "m",
|
|
9261
9280
|
children,
|
|
9262
9281
|
...rest
|
|
9263
9282
|
}) {
|
|
9264
|
-
return /* @__PURE__ */
|
|
9283
|
+
return /* @__PURE__ */ jsx51(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx51("div", { className: cx(StepperAlign_default.hRoot, className), "data-size": size, ...rest, children }) });
|
|
9265
9284
|
}
|
|
9266
9285
|
HorizontalStepperRoot.displayName = "HorizontalStepper.Root";
|
|
9267
9286
|
function HorizontalStepperSeparatorIcon({
|
|
@@ -9270,12 +9289,12 @@ function HorizontalStepperSeparatorIcon({
|
|
|
9270
9289
|
...rest
|
|
9271
9290
|
}) {
|
|
9272
9291
|
const Component = as ?? IconChevronRight;
|
|
9273
|
-
return /* @__PURE__ */
|
|
9292
|
+
return /* @__PURE__ */ jsx51("span", { className: StepperAlign_default.hSeparator, "aria-hidden": "true", children: /* @__PURE__ */ jsx51(Component, { className: cx(StepperAlign_default.hSeparatorIcon, className), strokeWidth: 2, ...rest }) });
|
|
9274
9293
|
}
|
|
9275
9294
|
HorizontalStepperSeparatorIcon.displayName = "HorizontalStepper.SeparatorIcon";
|
|
9276
|
-
var HorizontalStepperItem =
|
|
9295
|
+
var HorizontalStepperItem = React63.forwardRef(
|
|
9277
9296
|
function HorizontalStepperItem2({ state = "default", className, type = "button", children, ...rest }, ref) {
|
|
9278
|
-
return /* @__PURE__ */
|
|
9297
|
+
return /* @__PURE__ */ jsx51(StepperAlignItemProvider, { value: { state }, children: /* @__PURE__ */ jsx51(
|
|
9279
9298
|
"button",
|
|
9280
9299
|
{
|
|
9281
9300
|
ref,
|
|
@@ -9298,9 +9317,9 @@ function HorizontalStepperItemIndicator({
|
|
|
9298
9317
|
const { state: ctxState } = useStepperAlignItemState();
|
|
9299
9318
|
const state = stateProp ?? ctxState;
|
|
9300
9319
|
if (state === "completed") {
|
|
9301
|
-
return /* @__PURE__ */
|
|
9320
|
+
return /* @__PURE__ */ jsx51("div", { className: cx(StepperAlign_default.hIndicator, className), "data-state": state, ...rest, children: /* @__PURE__ */ jsx51(StepperAlignCheckIcon, { className: StepperAlign_default.hCheck }) });
|
|
9302
9321
|
}
|
|
9303
|
-
return /* @__PURE__ */
|
|
9322
|
+
return /* @__PURE__ */ jsx51("div", { className: cx(StepperAlign_default.hIndicator, className), "data-state": state, ...rest, children });
|
|
9304
9323
|
}
|
|
9305
9324
|
HorizontalStepperItemIndicator.displayName = "HorizontalStepper.ItemIndicator";
|
|
9306
9325
|
var HorizontalStepper = {
|
|
@@ -9311,7 +9330,7 @@ var HorizontalStepper = {
|
|
|
9311
9330
|
};
|
|
9312
9331
|
|
|
9313
9332
|
// src/components/stepper/Stepper.tsx
|
|
9314
|
-
import * as
|
|
9333
|
+
import * as React65 from "react";
|
|
9315
9334
|
|
|
9316
9335
|
// src/components/stepper/Stepper.module.css
|
|
9317
9336
|
var Stepper_default = {
|
|
@@ -9324,15 +9343,15 @@ var Stepper_default = {
|
|
|
9324
9343
|
};
|
|
9325
9344
|
|
|
9326
9345
|
// src/components/stepper/VerticalStepper.tsx
|
|
9327
|
-
import * as
|
|
9328
|
-
import { jsx as
|
|
9346
|
+
import * as React64 from "react";
|
|
9347
|
+
import { jsx as jsx52 } from "react/jsx-runtime";
|
|
9329
9348
|
function VerticalStepperRoot({
|
|
9330
9349
|
className,
|
|
9331
9350
|
size = "m",
|
|
9332
9351
|
children,
|
|
9333
9352
|
...rest
|
|
9334
9353
|
}) {
|
|
9335
|
-
return /* @__PURE__ */
|
|
9354
|
+
return /* @__PURE__ */ jsx52(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx52("div", { className: cx(StepperAlign_default.vRoot, className), "data-size": size, ...rest, children }) });
|
|
9336
9355
|
}
|
|
9337
9356
|
VerticalStepperRoot.displayName = "VerticalStepper.Root";
|
|
9338
9357
|
function VerticalStepperArrow({
|
|
@@ -9341,12 +9360,12 @@ function VerticalStepperArrow({
|
|
|
9341
9360
|
...rest
|
|
9342
9361
|
}) {
|
|
9343
9362
|
const Component = as ?? IconChevronRight;
|
|
9344
|
-
return /* @__PURE__ */
|
|
9363
|
+
return /* @__PURE__ */ jsx52(Component, { className: cx(StepperAlign_default.vArrow, className), strokeWidth: 2, ...rest });
|
|
9345
9364
|
}
|
|
9346
9365
|
VerticalStepperArrow.displayName = "VerticalStepper.Arrow";
|
|
9347
|
-
var VerticalStepperItem =
|
|
9366
|
+
var VerticalStepperItem = React64.forwardRef(
|
|
9348
9367
|
function VerticalStepperItem2({ state = "default", className, type = "button", children, ...rest }, ref) {
|
|
9349
|
-
return /* @__PURE__ */
|
|
9368
|
+
return /* @__PURE__ */ jsx52(StepperAlignItemProvider, { value: { state }, children: /* @__PURE__ */ jsx52(
|
|
9350
9369
|
"button",
|
|
9351
9370
|
{
|
|
9352
9371
|
ref,
|
|
@@ -9369,9 +9388,9 @@ function VerticalStepperItemIndicator({
|
|
|
9369
9388
|
const { state: ctxState } = useStepperAlignItemState();
|
|
9370
9389
|
const state = stateProp ?? ctxState;
|
|
9371
9390
|
if (state === "completed") {
|
|
9372
|
-
return /* @__PURE__ */
|
|
9391
|
+
return /* @__PURE__ */ jsx52("div", { className: cx(StepperAlign_default.vIndicator, className), "data-state": state, ...rest, children: /* @__PURE__ */ jsx52(StepperAlignCheckIcon, { className: StepperAlign_default.vCheck }) });
|
|
9373
9392
|
}
|
|
9374
|
-
return /* @__PURE__ */
|
|
9393
|
+
return /* @__PURE__ */ jsx52("div", { className: cx(StepperAlign_default.vIndicator, className), "data-state": state, ...rest, children });
|
|
9375
9394
|
}
|
|
9376
9395
|
VerticalStepperItemIndicator.displayName = "VerticalStepper.ItemIndicator";
|
|
9377
9396
|
var VerticalStepper = {
|
|
@@ -9382,7 +9401,7 @@ var VerticalStepper = {
|
|
|
9382
9401
|
};
|
|
9383
9402
|
|
|
9384
9403
|
// src/components/stepper/Stepper.tsx
|
|
9385
|
-
import { jsx as
|
|
9404
|
+
import { jsx as jsx53, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
9386
9405
|
var [StepperRootProvider, useStepperRootContext] = createComponentContext("Stepper");
|
|
9387
9406
|
var [StepperStepProvider, useStepperStepContext] = createComponentContext("Stepper.Step");
|
|
9388
9407
|
function toAlignState(status) {
|
|
@@ -9402,18 +9421,18 @@ function StepperRoot({
|
|
|
9402
9421
|
children,
|
|
9403
9422
|
className
|
|
9404
9423
|
}) {
|
|
9405
|
-
const indexRef =
|
|
9424
|
+
const indexRef = React65.useRef(0);
|
|
9406
9425
|
indexRef.current = 0;
|
|
9407
|
-
const getNextStepIndex =
|
|
9426
|
+
const getNextStepIndex = React65.useCallback(() => {
|
|
9408
9427
|
const idx = indexRef.current;
|
|
9409
9428
|
indexRef.current += 1;
|
|
9410
9429
|
return idx;
|
|
9411
9430
|
}, []);
|
|
9412
|
-
const value =
|
|
9431
|
+
const value = React65.useMemo(
|
|
9413
9432
|
() => ({ orientation, currentStep, getNextStepIndex }),
|
|
9414
9433
|
[orientation, currentStep, getNextStepIndex]
|
|
9415
9434
|
);
|
|
9416
|
-
return /* @__PURE__ */
|
|
9435
|
+
return /* @__PURE__ */ jsx53(StepperRootProvider, { value, children: /* @__PURE__ */ jsx53(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx53(
|
|
9417
9436
|
"ol",
|
|
9418
9437
|
{
|
|
9419
9438
|
className: cx(
|
|
@@ -9428,11 +9447,11 @@ function StepperRoot({
|
|
|
9428
9447
|
}
|
|
9429
9448
|
StepperRoot.displayName = "Stepper.Root";
|
|
9430
9449
|
function StepperSeparatorIcon({ className }) {
|
|
9431
|
-
return /* @__PURE__ */
|
|
9450
|
+
return /* @__PURE__ */ jsx53("li", { className: Stepper_default.separatorLi, "aria-hidden": "true", children: /* @__PURE__ */ jsx53(HorizontalStepper.SeparatorIcon, { className }) });
|
|
9432
9451
|
}
|
|
9433
9452
|
StepperSeparatorIcon.displayName = "Stepper.SeparatorIcon";
|
|
9434
9453
|
function StepperArrow({ className, ...rest }) {
|
|
9435
|
-
return /* @__PURE__ */
|
|
9454
|
+
return /* @__PURE__ */ jsx53(VerticalStepper.Arrow, { className, ...rest });
|
|
9436
9455
|
}
|
|
9437
9456
|
StepperArrow.displayName = "Stepper.Arrow";
|
|
9438
9457
|
function StepperIndicator({ children, className }) {
|
|
@@ -9441,8 +9460,8 @@ function StepperIndicator({ children, className }) {
|
|
|
9441
9460
|
const alignState = toAlignState(status);
|
|
9442
9461
|
const indClass = orientation === "horizontal" ? StepperAlign_default.hIndicator : StepperAlign_default.vIndicator;
|
|
9443
9462
|
const checkClass = orientation === "horizontal" ? StepperAlign_default.hCheck : StepperAlign_default.vCheck;
|
|
9444
|
-
const defaultChild = status === "completed" ? /* @__PURE__ */
|
|
9445
|
-
return /* @__PURE__ */
|
|
9463
|
+
const defaultChild = status === "completed" ? /* @__PURE__ */ jsx53(StepperAlignCheckIcon, { className: checkClass }) : String(index + 1);
|
|
9464
|
+
return /* @__PURE__ */ jsx53(
|
|
9446
9465
|
"span",
|
|
9447
9466
|
{
|
|
9448
9467
|
className: cx(indClass, className),
|
|
@@ -9456,18 +9475,18 @@ function StepperIndicator({ children, className }) {
|
|
|
9456
9475
|
StepperIndicator.displayName = "Stepper.Indicator";
|
|
9457
9476
|
function StepperContent({ title, description, className }) {
|
|
9458
9477
|
return /* @__PURE__ */ jsxs27("div", { className: cx(Stepper_default.content, className), children: [
|
|
9459
|
-
/* @__PURE__ */
|
|
9460
|
-
description ? /* @__PURE__ */
|
|
9478
|
+
/* @__PURE__ */ jsx53("div", { className: Stepper_default.title, children: title }),
|
|
9479
|
+
description ? /* @__PURE__ */ jsx53("p", { className: Stepper_default.description, children: description }) : null
|
|
9461
9480
|
] });
|
|
9462
9481
|
}
|
|
9463
9482
|
StepperContent.displayName = "Stepper.Content";
|
|
9464
|
-
var StepperStep =
|
|
9483
|
+
var StepperStep = React65.forwardRef(function StepperStep2({ index: indexProp, status: statusProp, children, className, disabled, type = "button", ...rest }, ref) {
|
|
9465
9484
|
const { currentStep, orientation, getNextStepIndex } = useStepperRootContext();
|
|
9466
9485
|
const index = indexProp ?? getNextStepIndex();
|
|
9467
9486
|
const status = statusProp ?? computeStepStatus(index, currentStep);
|
|
9468
9487
|
const alignState = toAlignState(status);
|
|
9469
9488
|
const itemClass = orientation === "horizontal" ? StepperAlign_default.hItem : StepperAlign_default.vItem;
|
|
9470
|
-
return /* @__PURE__ */
|
|
9489
|
+
return /* @__PURE__ */ jsx53(StepperStepProvider, { value: { status, index }, children: /* @__PURE__ */ jsx53(StepperAlignItemProvider, { value: { state: alignState }, children: /* @__PURE__ */ jsx53("li", { className: Stepper_default.stepLi, "data-status": status, children: /* @__PURE__ */ jsx53(
|
|
9471
9490
|
"button",
|
|
9472
9491
|
{
|
|
9473
9492
|
ref,
|
|
@@ -9495,7 +9514,7 @@ var Stepper = {
|
|
|
9495
9514
|
};
|
|
9496
9515
|
|
|
9497
9516
|
// src/components/switch/Switch.tsx
|
|
9498
|
-
import * as
|
|
9517
|
+
import * as React66 from "react";
|
|
9499
9518
|
|
|
9500
9519
|
// src/components/switch/Switch.module.css
|
|
9501
9520
|
var Switch_default = {
|
|
@@ -9509,9 +9528,9 @@ var Switch_default = {
|
|
|
9509
9528
|
};
|
|
9510
9529
|
|
|
9511
9530
|
// src/components/switch/Switch.tsx
|
|
9512
|
-
import { jsx as
|
|
9531
|
+
import { jsx as jsx54, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
9513
9532
|
var [SwitchProvider, useSwitchContext] = createComponentContext("Switch");
|
|
9514
|
-
var SwitchRoot =
|
|
9533
|
+
var SwitchRoot = React66.forwardRef(
|
|
9515
9534
|
({
|
|
9516
9535
|
id,
|
|
9517
9536
|
checked,
|
|
@@ -9526,19 +9545,19 @@ var SwitchRoot = React65.forwardRef(
|
|
|
9526
9545
|
children,
|
|
9527
9546
|
...inputRest
|
|
9528
9547
|
}, ref) => {
|
|
9529
|
-
const rawId =
|
|
9548
|
+
const rawId = React66.useId();
|
|
9530
9549
|
const inputId = id ?? rawId;
|
|
9531
9550
|
const hintId = `${inputId}-hint`;
|
|
9532
9551
|
const errorId = `${inputId}-error`;
|
|
9533
|
-
const [hasHint, setHasHint] =
|
|
9534
|
-
const [hasError, setHasError] =
|
|
9552
|
+
const [hasHint, setHasHint] = React66.useState(false);
|
|
9553
|
+
const [hasError, setHasError] = React66.useState(false);
|
|
9535
9554
|
const invalid = variant === "error" || hasError;
|
|
9536
9555
|
const [isChecked, setChecked] = useControllableState({
|
|
9537
9556
|
value: checked,
|
|
9538
9557
|
defaultValue: defaultChecked,
|
|
9539
9558
|
onChange: onCheckedChange
|
|
9540
9559
|
});
|
|
9541
|
-
const handleChange =
|
|
9560
|
+
const handleChange = React66.useCallback(
|
|
9542
9561
|
(e) => {
|
|
9543
9562
|
if (readOnly) {
|
|
9544
9563
|
e.preventDefault();
|
|
@@ -9548,7 +9567,7 @@ var SwitchRoot = React65.forwardRef(
|
|
|
9548
9567
|
},
|
|
9549
9568
|
[readOnly, setChecked]
|
|
9550
9569
|
);
|
|
9551
|
-
const restInputPropsRef =
|
|
9570
|
+
const restInputPropsRef = React66.useRef(inputRest);
|
|
9552
9571
|
restInputPropsRef.current = inputRest;
|
|
9553
9572
|
const parts = [
|
|
9554
9573
|
ariaDescribedBy,
|
|
@@ -9556,11 +9575,11 @@ var SwitchRoot = React65.forwardRef(
|
|
|
9556
9575
|
hasError ? errorId : void 0
|
|
9557
9576
|
].filter(Boolean);
|
|
9558
9577
|
const describedBy = parts.length > 0 ? parts.join(" ") : void 0;
|
|
9559
|
-
const registerHint =
|
|
9560
|
-
const unregisterHint =
|
|
9561
|
-
const registerError =
|
|
9562
|
-
const unregisterError =
|
|
9563
|
-
const ctxValue =
|
|
9578
|
+
const registerHint = React66.useCallback(() => setHasHint(true), []);
|
|
9579
|
+
const unregisterHint = React66.useCallback(() => setHasHint(false), []);
|
|
9580
|
+
const registerError = React66.useCallback(() => setHasError(true), []);
|
|
9581
|
+
const unregisterError = React66.useCallback(() => setHasError(false), []);
|
|
9582
|
+
const ctxValue = React66.useMemo(
|
|
9564
9583
|
() => ({
|
|
9565
9584
|
inputId,
|
|
9566
9585
|
hintId,
|
|
@@ -9597,7 +9616,7 @@ var SwitchRoot = React65.forwardRef(
|
|
|
9597
9616
|
unregisterError
|
|
9598
9617
|
]
|
|
9599
9618
|
);
|
|
9600
|
-
return /* @__PURE__ */
|
|
9619
|
+
return /* @__PURE__ */ jsx54(SwitchProvider, { value: ctxValue, children: /* @__PURE__ */ jsx54(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsx54(
|
|
9601
9620
|
"div",
|
|
9602
9621
|
{
|
|
9603
9622
|
className: cx(Switch_default.field, className),
|
|
@@ -9615,7 +9634,7 @@ var SwitchRoot = React65.forwardRef(
|
|
|
9615
9634
|
}
|
|
9616
9635
|
);
|
|
9617
9636
|
SwitchRoot.displayName = "SwitchRoot";
|
|
9618
|
-
var SwitchLabel =
|
|
9637
|
+
var SwitchLabel = React66.forwardRef(function SwitchLabel2({ children, className, ...rest }, ref) {
|
|
9619
9638
|
const {
|
|
9620
9639
|
inputId,
|
|
9621
9640
|
inputRef,
|
|
@@ -9639,7 +9658,7 @@ var SwitchLabel = React65.forwardRef(function SwitchLabel2({ children, className
|
|
|
9639
9658
|
...rest,
|
|
9640
9659
|
children: [
|
|
9641
9660
|
/* @__PURE__ */ jsxs28("span", { className: Switch_default.controlCell, children: [
|
|
9642
|
-
/* @__PURE__ */
|
|
9661
|
+
/* @__PURE__ */ jsx54(
|
|
9643
9662
|
"input",
|
|
9644
9663
|
{
|
|
9645
9664
|
ref: inputRef,
|
|
@@ -9657,9 +9676,9 @@ var SwitchLabel = React65.forwardRef(function SwitchLabel2({ children, className
|
|
|
9657
9676
|
...restInputPropsRef.current
|
|
9658
9677
|
}
|
|
9659
9678
|
),
|
|
9660
|
-
/* @__PURE__ */
|
|
9679
|
+
/* @__PURE__ */ jsx54("span", { className: Switch_default.track, "aria-hidden": "true" })
|
|
9661
9680
|
] }),
|
|
9662
|
-
children !== void 0 && children !== null ? /* @__PURE__ */
|
|
9681
|
+
children !== void 0 && children !== null ? /* @__PURE__ */ jsx54("span", { className: Switch_default.text, children }) : null
|
|
9663
9682
|
]
|
|
9664
9683
|
}
|
|
9665
9684
|
);
|
|
@@ -9667,13 +9686,13 @@ var SwitchLabel = React65.forwardRef(function SwitchLabel2({ children, className
|
|
|
9667
9686
|
SwitchLabel.displayName = "SwitchLabel";
|
|
9668
9687
|
function SwitchHint({ children, className, ...rest }) {
|
|
9669
9688
|
const { hintId, registerHint, unregisterHint, size, disabled } = useSwitchContext();
|
|
9670
|
-
|
|
9689
|
+
React66.useLayoutEffect(() => {
|
|
9671
9690
|
registerHint();
|
|
9672
9691
|
return () => {
|
|
9673
9692
|
unregisterHint();
|
|
9674
9693
|
};
|
|
9675
9694
|
}, [registerHint, unregisterHint]);
|
|
9676
|
-
return /* @__PURE__ */
|
|
9695
|
+
return /* @__PURE__ */ jsx54(
|
|
9677
9696
|
Hint.Root,
|
|
9678
9697
|
{
|
|
9679
9698
|
id: hintId,
|
|
@@ -9688,13 +9707,13 @@ function SwitchHint({ children, className, ...rest }) {
|
|
|
9688
9707
|
SwitchHint.displayName = "SwitchHint";
|
|
9689
9708
|
function SwitchError({ children, className, ...rest }) {
|
|
9690
9709
|
const { errorId, registerError, unregisterError, size } = useSwitchContext();
|
|
9691
|
-
|
|
9710
|
+
React66.useLayoutEffect(() => {
|
|
9692
9711
|
registerError();
|
|
9693
9712
|
return () => {
|
|
9694
9713
|
unregisterError();
|
|
9695
9714
|
};
|
|
9696
9715
|
}, [registerError, unregisterError]);
|
|
9697
|
-
return /* @__PURE__ */
|
|
9716
|
+
return /* @__PURE__ */ jsx54(
|
|
9698
9717
|
Hint.Root,
|
|
9699
9718
|
{
|
|
9700
9719
|
id: errorId,
|
|
@@ -9715,7 +9734,7 @@ var Switch = {
|
|
|
9715
9734
|
};
|
|
9716
9735
|
|
|
9717
9736
|
// src/components/tabs/Tabs.tsx
|
|
9718
|
-
import * as
|
|
9737
|
+
import * as React67 from "react";
|
|
9719
9738
|
|
|
9720
9739
|
// src/components/tabs/Tabs.module.css
|
|
9721
9740
|
var Tabs_default = {
|
|
@@ -9731,7 +9750,7 @@ var Tabs_default = {
|
|
|
9731
9750
|
};
|
|
9732
9751
|
|
|
9733
9752
|
// src/components/tabs/Tabs.tsx
|
|
9734
|
-
import { jsx as
|
|
9753
|
+
import { jsx as jsx55, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
9735
9754
|
var [TabsProvider, useTabsContext] = createComponentContext("Tabs");
|
|
9736
9755
|
function TabsRoot({
|
|
9737
9756
|
value,
|
|
@@ -9742,29 +9761,29 @@ function TabsRoot({
|
|
|
9742
9761
|
children,
|
|
9743
9762
|
className
|
|
9744
9763
|
}) {
|
|
9745
|
-
const rootId =
|
|
9764
|
+
const rootId = React67.useId();
|
|
9746
9765
|
const [activeValue, setActiveValue] = useControllableState({
|
|
9747
9766
|
value,
|
|
9748
9767
|
defaultValue,
|
|
9749
9768
|
onChange: onValueChange
|
|
9750
9769
|
});
|
|
9751
|
-
const contextValue =
|
|
9770
|
+
const contextValue = React67.useMemo(
|
|
9752
9771
|
() => ({ activeValue, onSelect: setActiveValue, orientation, rootId, size }),
|
|
9753
9772
|
[activeValue, setActiveValue, orientation, rootId, size]
|
|
9754
9773
|
);
|
|
9755
|
-
return /* @__PURE__ */
|
|
9774
|
+
return /* @__PURE__ */ jsx55(TabsProvider, { value: contextValue, children: /* @__PURE__ */ jsx55("div", { className: cx(Tabs_default.root, className), "data-orientation": orientation, "data-size": size, children }) });
|
|
9756
9775
|
}
|
|
9757
9776
|
TabsRoot.displayName = "TabsRoot";
|
|
9758
9777
|
function TabsList({ children, className }) {
|
|
9759
9778
|
const { orientation, rootId, activeValue, onSelect, size } = useTabsContext();
|
|
9760
|
-
const listRef =
|
|
9761
|
-
const [indicator, setIndicator] =
|
|
9779
|
+
const listRef = React67.useRef(null);
|
|
9780
|
+
const [indicator, setIndicator] = React67.useState({
|
|
9762
9781
|
left: 0,
|
|
9763
9782
|
top: 0,
|
|
9764
9783
|
width: 0,
|
|
9765
9784
|
height: 0
|
|
9766
9785
|
});
|
|
9767
|
-
const updateIndicator =
|
|
9786
|
+
const updateIndicator = React67.useCallback(() => {
|
|
9768
9787
|
const list = listRef.current;
|
|
9769
9788
|
if (!list) return;
|
|
9770
9789
|
const active = list.querySelector('[role="tab"][aria-selected="true"]');
|
|
@@ -9779,7 +9798,7 @@ function TabsList({ children, className }) {
|
|
|
9779
9798
|
height: active.offsetHeight
|
|
9780
9799
|
});
|
|
9781
9800
|
}, []);
|
|
9782
|
-
|
|
9801
|
+
React67.useLayoutEffect(() => {
|
|
9783
9802
|
const list = listRef.current;
|
|
9784
9803
|
if (!list) return;
|
|
9785
9804
|
updateIndicator();
|
|
@@ -9844,8 +9863,8 @@ function TabsList({ children, className }) {
|
|
|
9844
9863
|
className: cx(Tabs_default.list, className),
|
|
9845
9864
|
onKeyDown: handleKeyDown,
|
|
9846
9865
|
children: [
|
|
9847
|
-
/* @__PURE__ */
|
|
9848
|
-
/* @__PURE__ */
|
|
9866
|
+
/* @__PURE__ */ jsx55(ControlSizeProvider, { value: size, children }),
|
|
9867
|
+
/* @__PURE__ */ jsx55(
|
|
9849
9868
|
"div",
|
|
9850
9869
|
{
|
|
9851
9870
|
className: cx(
|
|
@@ -9871,7 +9890,7 @@ TabsList.displayName = "TabsList";
|
|
|
9871
9890
|
function TabsTab({ value, disabled = false, children, className }) {
|
|
9872
9891
|
const { activeValue, onSelect, rootId } = useTabsContext();
|
|
9873
9892
|
const isSelected = activeValue === value;
|
|
9874
|
-
return /* @__PURE__ */
|
|
9893
|
+
return /* @__PURE__ */ jsx55(
|
|
9875
9894
|
"button",
|
|
9876
9895
|
{
|
|
9877
9896
|
role: "tab",
|
|
@@ -9893,18 +9912,18 @@ function TabsTab({ value, disabled = false, children, className }) {
|
|
|
9893
9912
|
}
|
|
9894
9913
|
TabsTab.displayName = "TabsTab";
|
|
9895
9914
|
function TabsIcon({ children, className, ...rest }) {
|
|
9896
|
-
return /* @__PURE__ */
|
|
9915
|
+
return /* @__PURE__ */ jsx55("span", { className: cx(Tabs_default.icon, className), "aria-hidden": "true", ...rest, children });
|
|
9897
9916
|
}
|
|
9898
9917
|
TabsIcon.displayName = "TabsIcon";
|
|
9899
9918
|
function TabsLabel({ children, className, ...rest }) {
|
|
9900
|
-
return /* @__PURE__ */
|
|
9919
|
+
return /* @__PURE__ */ jsx55("span", { className: cx(Tabs_default.label, className), ...rest, children });
|
|
9901
9920
|
}
|
|
9902
9921
|
TabsLabel.displayName = "TabsLabel";
|
|
9903
9922
|
function TabsPanel({ value, children, className }) {
|
|
9904
9923
|
const { activeValue, rootId } = useTabsContext();
|
|
9905
9924
|
const isActive = activeValue === value;
|
|
9906
9925
|
if (!isActive) return null;
|
|
9907
|
-
return /* @__PURE__ */
|
|
9926
|
+
return /* @__PURE__ */ jsx55(
|
|
9908
9927
|
"div",
|
|
9909
9928
|
{
|
|
9910
9929
|
role: "tabpanel",
|
|
@@ -9926,7 +9945,7 @@ var Tabs = {
|
|
|
9926
9945
|
};
|
|
9927
9946
|
|
|
9928
9947
|
// src/components/tag/Tag.tsx
|
|
9929
|
-
import * as
|
|
9948
|
+
import * as React68 from "react";
|
|
9930
9949
|
|
|
9931
9950
|
// src/components/tag/Tag.module.css
|
|
9932
9951
|
var Tag_default = {
|
|
@@ -9938,8 +9957,8 @@ var Tag_default = {
|
|
|
9938
9957
|
};
|
|
9939
9958
|
|
|
9940
9959
|
// src/components/tag/Tag.tsx
|
|
9941
|
-
import { jsx as
|
|
9942
|
-
var TagRoot =
|
|
9960
|
+
import { jsx as jsx56, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
9961
|
+
var TagRoot = React68.forwardRef(
|
|
9943
9962
|
({ size: sizeProp, onRemove, disabled, children, className, ...rest }, ref) => {
|
|
9944
9963
|
const controlSurface = useOptionalControlSize();
|
|
9945
9964
|
const size = sizeProp ?? (controlSurface !== void 0 ? controlSurfaceToInputSize(controlSurface) : "m");
|
|
@@ -9955,8 +9974,8 @@ var TagRoot = React67.forwardRef(
|
|
|
9955
9974
|
}),
|
|
9956
9975
|
...rest,
|
|
9957
9976
|
children: [
|
|
9958
|
-
/* @__PURE__ */
|
|
9959
|
-
onRemove ? /* @__PURE__ */
|
|
9977
|
+
/* @__PURE__ */ jsx56("span", { className: Tag_default.body, children: /* @__PURE__ */ jsx56(ControlSizeProvider, { value: size, children }) }),
|
|
9978
|
+
onRemove ? /* @__PURE__ */ jsx56(
|
|
9960
9979
|
"button",
|
|
9961
9980
|
{
|
|
9962
9981
|
type: "button",
|
|
@@ -9964,7 +9983,7 @@ var TagRoot = React67.forwardRef(
|
|
|
9964
9983
|
"aria-label": "Remove",
|
|
9965
9984
|
onClick: onRemove,
|
|
9966
9985
|
disabled,
|
|
9967
|
-
children: /* @__PURE__ */
|
|
9986
|
+
children: /* @__PURE__ */ jsx56("svg", { className: Tag_default.removeIcon, viewBox: "0 0 12 12", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsx56(
|
|
9968
9987
|
"path",
|
|
9969
9988
|
{
|
|
9970
9989
|
d: "M2 2l8 8M10 2l-8 8",
|
|
@@ -9982,13 +10001,13 @@ var TagRoot = React67.forwardRef(
|
|
|
9982
10001
|
);
|
|
9983
10002
|
TagRoot.displayName = "TagRoot";
|
|
9984
10003
|
function TagIcon({ children, className }) {
|
|
9985
|
-
return /* @__PURE__ */
|
|
10004
|
+
return /* @__PURE__ */ jsx56("span", { className: cx(Tag_default.icon, className), children });
|
|
9986
10005
|
}
|
|
9987
10006
|
TagIcon.displayName = "TagIcon";
|
|
9988
10007
|
var Tag = { Root: TagRoot, Icon: TagIcon };
|
|
9989
10008
|
|
|
9990
10009
|
// src/components/textarea/Textarea.tsx
|
|
9991
|
-
import * as
|
|
10010
|
+
import * as React69 from "react";
|
|
9992
10011
|
|
|
9993
10012
|
// src/components/textarea/Textarea.module.css
|
|
9994
10013
|
var Textarea_default = {
|
|
@@ -10005,7 +10024,7 @@ var Textarea_default = {
|
|
|
10005
10024
|
};
|
|
10006
10025
|
|
|
10007
10026
|
// src/components/textarea/Textarea.tsx
|
|
10008
|
-
import { jsx as
|
|
10027
|
+
import { jsx as jsx57, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
10009
10028
|
var [TextareaProvider, useTextareaContext] = createComponentContext("Textarea");
|
|
10010
10029
|
function TextareaCharCounter({ current, max }) {
|
|
10011
10030
|
const overflow = current > max;
|
|
@@ -10027,8 +10046,8 @@ TextareaCharCounter.displayName = "Textarea.CharCounter";
|
|
|
10027
10046
|
function partitionTextareaChildren(children) {
|
|
10028
10047
|
const counters = [];
|
|
10029
10048
|
const rest = [];
|
|
10030
|
-
|
|
10031
|
-
if (
|
|
10049
|
+
React69.Children.forEach(children, (child) => {
|
|
10050
|
+
if (React69.isValidElement(child) && child.type === TextareaCharCounter) {
|
|
10032
10051
|
counters.push(child);
|
|
10033
10052
|
} else if (child != null && child !== false) {
|
|
10034
10053
|
rest.push(child);
|
|
@@ -10036,7 +10055,7 @@ function partitionTextareaChildren(children) {
|
|
|
10036
10055
|
});
|
|
10037
10056
|
return { counters, rest };
|
|
10038
10057
|
}
|
|
10039
|
-
var TextareaRoot =
|
|
10058
|
+
var TextareaRoot = React69.forwardRef(
|
|
10040
10059
|
({
|
|
10041
10060
|
id,
|
|
10042
10061
|
className,
|
|
@@ -10053,12 +10072,12 @@ var TextareaRoot = React68.forwardRef(
|
|
|
10053
10072
|
children,
|
|
10054
10073
|
...rest
|
|
10055
10074
|
}, ref) => {
|
|
10056
|
-
const rawId =
|
|
10075
|
+
const rawId = React69.useId();
|
|
10057
10076
|
const inputId = id ?? rawId;
|
|
10058
10077
|
const hintId = `${inputId}-hint`;
|
|
10059
10078
|
const errorId = `${inputId}-error`;
|
|
10060
|
-
const [hasHint, setHasHint] =
|
|
10061
|
-
const [hasError, setHasError] =
|
|
10079
|
+
const [hasHint, setHasHint] = React69.useState(false);
|
|
10080
|
+
const [hasError, setHasError] = React69.useState(false);
|
|
10062
10081
|
const invalid = variant === "error" || hasError;
|
|
10063
10082
|
const resolvedAriaInvalid = ariaInvalid ?? (invalid || void 0);
|
|
10064
10083
|
const parts = [
|
|
@@ -10067,25 +10086,25 @@ var TextareaRoot = React68.forwardRef(
|
|
|
10067
10086
|
hasError ? errorId : void 0
|
|
10068
10087
|
].filter(Boolean);
|
|
10069
10088
|
const describedBy = parts.length > 0 ? parts.join(" ") : void 0;
|
|
10070
|
-
const registerHint =
|
|
10071
|
-
const unregisterHint =
|
|
10072
|
-
const registerError =
|
|
10073
|
-
const unregisterError =
|
|
10074
|
-
const wrapperRef =
|
|
10089
|
+
const registerHint = React69.useCallback(() => setHasHint(true), []);
|
|
10090
|
+
const unregisterHint = React69.useCallback(() => setHasHint(false), []);
|
|
10091
|
+
const registerError = React69.useCallback(() => setHasError(true), []);
|
|
10092
|
+
const unregisterError = React69.useCallback(() => setHasError(false), []);
|
|
10093
|
+
const wrapperRef = React69.useRef(null);
|
|
10075
10094
|
const { counters: counterChildren, rest: otherChildren } = partitionTextareaChildren(children);
|
|
10076
10095
|
const showFooter = counterChildren.length > 0;
|
|
10077
|
-
|
|
10096
|
+
React69.useLayoutEffect(() => {
|
|
10078
10097
|
if (!autoResize || !wrapperRef.current) return;
|
|
10079
10098
|
const textarea = wrapperRef.current.querySelector("textarea");
|
|
10080
10099
|
if (textarea) {
|
|
10081
10100
|
wrapperRef.current.dataset.value = textarea.value;
|
|
10082
10101
|
}
|
|
10083
10102
|
}, [autoResize]);
|
|
10084
|
-
|
|
10103
|
+
React69.useEffect(() => {
|
|
10085
10104
|
if (!autoResize || !wrapperRef.current || typeof value !== "string") return;
|
|
10086
10105
|
wrapperRef.current.dataset.value = value;
|
|
10087
10106
|
}, [autoResize, value]);
|
|
10088
|
-
const handleInput =
|
|
10107
|
+
const handleInput = React69.useCallback(
|
|
10089
10108
|
(e) => {
|
|
10090
10109
|
if (autoResize && wrapperRef.current) {
|
|
10091
10110
|
wrapperRef.current.dataset.value = e.currentTarget.value;
|
|
@@ -10094,7 +10113,7 @@ var TextareaRoot = React68.forwardRef(
|
|
|
10094
10113
|
},
|
|
10095
10114
|
[autoResize, onInput]
|
|
10096
10115
|
);
|
|
10097
|
-
const ctxValue =
|
|
10116
|
+
const ctxValue = React69.useMemo(
|
|
10098
10117
|
() => ({
|
|
10099
10118
|
hintId,
|
|
10100
10119
|
errorId,
|
|
@@ -10118,7 +10137,7 @@ var TextareaRoot = React68.forwardRef(
|
|
|
10118
10137
|
unregisterError
|
|
10119
10138
|
]
|
|
10120
10139
|
);
|
|
10121
|
-
const textareaEl = /* @__PURE__ */
|
|
10140
|
+
const textareaEl = /* @__PURE__ */ jsx57(
|
|
10122
10141
|
"textarea",
|
|
10123
10142
|
{
|
|
10124
10143
|
ref,
|
|
@@ -10134,9 +10153,9 @@ var TextareaRoot = React68.forwardRef(
|
|
|
10134
10153
|
...rest
|
|
10135
10154
|
}
|
|
10136
10155
|
);
|
|
10137
|
-
const textareaBlock = autoResize ? /* @__PURE__ */
|
|
10138
|
-
return /* @__PURE__ */
|
|
10139
|
-
/* @__PURE__ */
|
|
10156
|
+
const textareaBlock = autoResize ? /* @__PURE__ */ jsx57("div", { ref: wrapperRef, className: Textarea_default.autoResize, children: textareaEl }) : textareaEl;
|
|
10157
|
+
return /* @__PURE__ */ jsx57(TextareaProvider, { value: ctxValue, children: /* @__PURE__ */ jsx57(ControlSizeProvider, { value: size, children: /* @__PURE__ */ jsxs31("div", { className: Textarea_default.field, ...toDataAttributes({ size }), children: [
|
|
10158
|
+
/* @__PURE__ */ jsx57(
|
|
10140
10159
|
"label",
|
|
10141
10160
|
{
|
|
10142
10161
|
htmlFor: inputId,
|
|
@@ -10148,8 +10167,8 @@ var TextareaRoot = React68.forwardRef(
|
|
|
10148
10167
|
size
|
|
10149
10168
|
}),
|
|
10150
10169
|
children: /* @__PURE__ */ jsxs31("div", { className: Textarea_default.controlStack, children: [
|
|
10151
|
-
/* @__PURE__ */
|
|
10152
|
-
showFooter ? /* @__PURE__ */
|
|
10170
|
+
/* @__PURE__ */ jsx57("div", { className: Textarea_default.textareaRegion, children: textareaBlock }),
|
|
10171
|
+
showFooter ? /* @__PURE__ */ jsx57("div", { className: Textarea_default.controlFooter, children: counterChildren }) : null
|
|
10153
10172
|
] })
|
|
10154
10173
|
}
|
|
10155
10174
|
),
|
|
@@ -10160,13 +10179,13 @@ var TextareaRoot = React68.forwardRef(
|
|
|
10160
10179
|
TextareaRoot.displayName = "Textarea.Root";
|
|
10161
10180
|
function TextareaHint({ children, className, ...rest }) {
|
|
10162
10181
|
const { hintId, registerHint, unregisterHint, size, disabled, readOnly } = useTextareaContext();
|
|
10163
|
-
|
|
10182
|
+
React69.useLayoutEffect(() => {
|
|
10164
10183
|
registerHint();
|
|
10165
10184
|
return () => {
|
|
10166
10185
|
unregisterHint();
|
|
10167
10186
|
};
|
|
10168
10187
|
}, [registerHint, unregisterHint]);
|
|
10169
|
-
return /* @__PURE__ */
|
|
10188
|
+
return /* @__PURE__ */ jsx57(
|
|
10170
10189
|
Hint.Root,
|
|
10171
10190
|
{
|
|
10172
10191
|
id: hintId,
|
|
@@ -10181,13 +10200,13 @@ function TextareaHint({ children, className, ...rest }) {
|
|
|
10181
10200
|
TextareaHint.displayName = "Textarea.Hint";
|
|
10182
10201
|
function TextareaError({ children, className, ...rest }) {
|
|
10183
10202
|
const { errorId, registerError, unregisterError, size } = useTextareaContext();
|
|
10184
|
-
|
|
10203
|
+
React69.useLayoutEffect(() => {
|
|
10185
10204
|
registerError();
|
|
10186
10205
|
return () => {
|
|
10187
10206
|
unregisterError();
|
|
10188
10207
|
};
|
|
10189
10208
|
}, [registerError, unregisterError]);
|
|
10190
|
-
return /* @__PURE__ */
|
|
10209
|
+
return /* @__PURE__ */ jsx57(
|
|
10191
10210
|
Hint.Root,
|
|
10192
10211
|
{
|
|
10193
10212
|
id: errorId,
|
|
@@ -10227,6 +10246,7 @@ export {
|
|
|
10227
10246
|
Divider,
|
|
10228
10247
|
Drawer,
|
|
10229
10248
|
Dropdown,
|
|
10249
|
+
EmptyPage,
|
|
10230
10250
|
ExampleFrame,
|
|
10231
10251
|
FileUpload,
|
|
10232
10252
|
Hint,
|