@hjmds/react 1.26.1 → 1.27.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/THIRD_PARTY_NOTICES.md +7 -0
- package/dist/advanced-display.d.ts +1 -0
- package/dist/advanced-display.d.ts.map +1 -1
- package/dist/advanced-display.js +3 -2
- package/dist/advanced-display.js.map +1 -1
- package/dist/agreement.d.ts.map +1 -1
- package/dist/agreement.js +2 -1
- package/dist/agreement.js.map +1 -1
- package/dist/bottom-cta.d.ts.map +1 -1
- package/dist/bottom-cta.js +5 -2
- package/dist/bottom-cta.js.map +1 -1
- package/dist/bottom-navigation.d.ts.map +1 -1
- package/dist/bottom-navigation.js +3 -0
- package/dist/bottom-navigation.js.map +1 -1
- package/dist/calendar.js +1 -1
- package/dist/calendar.js.map +1 -1
- package/dist/carousel-motion.d.ts.map +1 -1
- package/dist/carousel-motion.js +4 -3
- package/dist/carousel-motion.js.map +1 -1
- package/dist/carousel.d.ts.map +1 -1
- package/dist/carousel.js +3 -2
- package/dist/carousel.js.map +1 -1
- package/dist/chart.d.ts +3 -1
- package/dist/chart.d.ts.map +1 -1
- package/dist/chart.js +9 -4
- package/dist/chart.js.map +1 -1
- package/dist/clipboard.d.ts +27 -1
- package/dist/clipboard.d.ts.map +1 -1
- package/dist/clipboard.js +26 -12
- package/dist/clipboard.js.map +1 -1
- package/dist/collapsible.d.ts +9 -0
- package/dist/collapsible.d.ts.map +1 -1
- package/dist/collapsible.js +9 -2
- package/dist/collapsible.js.map +1 -1
- package/dist/collection-editing.d.ts.map +1 -1
- package/dist/collection-editing.js +15 -10
- package/dist/collection-editing.js.map +1 -1
- package/dist/collection-rail.d.ts.map +1 -1
- package/dist/collection-rail.js +3 -2
- package/dist/collection-rail.js.map +1 -1
- package/dist/communication.d.ts.map +1 -1
- package/dist/communication.js +5 -2
- package/dist/communication.js.map +1 -1
- package/dist/context-menu.d.ts +9 -1
- package/dist/context-menu.d.ts.map +1 -1
- package/dist/context-menu.js +1 -1
- package/dist/context-menu.js.map +1 -1
- package/dist/conversation-row.js +1 -1
- package/dist/conversation-row.js.map +1 -1
- package/dist/data-workflows.d.ts.map +1 -1
- package/dist/data-workflows.js +4 -3
- package/dist/data-workflows.js.map +1 -1
- package/dist/date-picker.d.ts.map +1 -1
- package/dist/date-picker.js +5 -3
- package/dist/date-picker.js.map +1 -1
- package/dist/design-profile.d.ts.map +1 -1
- package/dist/design-profile.js +4 -2
- package/dist/design-profile.js.map +1 -1
- package/dist/effect-surface.d.ts +9 -3
- package/dist/effect-surface.d.ts.map +1 -1
- package/dist/effect-surface.js +3 -2
- package/dist/effect-surface.js.map +1 -1
- package/dist/evidence.d.ts +1 -1
- package/dist/evidence.js +1 -1
- package/dist/evidence.js.map +1 -1
- package/dist/feedback.d.ts +8 -19
- package/dist/feedback.d.ts.map +1 -1
- package/dist/feedback.js +7 -3
- package/dist/feedback.js.map +1 -1
- package/dist/field-group.d.ts.map +1 -1
- package/dist/field-group.js +15 -8
- package/dist/field-group.js.map +1 -1
- package/dist/file-picker.d.ts +14 -2
- package/dist/file-picker.d.ts.map +1 -1
- package/dist/file-picker.js +5 -2
- package/dist/file-picker.js.map +1 -1
- package/dist/folder-preview.d.ts.map +1 -1
- package/dist/folder-preview.js +2 -2
- package/dist/folder-preview.js.map +1 -1
- package/dist/forms.d.ts.map +1 -1
- package/dist/forms.js +2 -1
- package/dist/forms.js.map +1 -1
- package/dist/image-choice.d.ts +30 -0
- package/dist/image-choice.d.ts.map +1 -0
- package/dist/image-choice.js +24 -0
- package/dist/image-choice.js.map +1 -0
- package/dist/image-comparison.d.ts.map +1 -1
- package/dist/image-comparison.js +2 -1
- package/dist/image-comparison.js.map +1 -1
- package/dist/index.d.ts +3 -3
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -2
- package/dist/index.js.map +1 -1
- package/dist/internal/message-reactions.d.ts +28 -2
- package/dist/internal/message-reactions.d.ts.map +1 -1
- package/dist/internal/message-reactions.js +11 -4
- package/dist/internal/message-reactions.js.map +1 -1
- package/dist/internal/screen-exit.d.ts +11 -0
- package/dist/internal/screen-exit.d.ts.map +1 -0
- package/dist/internal/screen-exit.js +10 -0
- package/dist/internal/screen-exit.js.map +1 -0
- package/dist/internal/screen-footer.d.ts +7 -0
- package/dist/internal/screen-footer.d.ts.map +1 -0
- package/dist/internal/screen-footer.js +8 -0
- package/dist/internal/screen-footer.js.map +1 -0
- package/dist/layout.d.ts.map +1 -1
- package/dist/layout.js +8 -4
- package/dist/layout.js.map +1 -1
- package/dist/masonry.d.ts +5 -3
- package/dist/masonry.d.ts.map +1 -1
- package/dist/masonry.js +25 -3
- package/dist/masonry.js.map +1 -1
- package/dist/menu-morph.d.ts.map +1 -1
- package/dist/menu-morph.js +30 -7
- package/dist/menu-morph.js.map +1 -1
- package/dist/overlays.d.ts +2 -0
- package/dist/overlays.d.ts.map +1 -1
- package/dist/overlays.js +48 -11
- package/dist/overlays.js.map +1 -1
- package/dist/popover.d.ts +6 -0
- package/dist/popover.d.ts.map +1 -1
- package/dist/popover.js +3 -3
- package/dist/popover.js.map +1 -1
- package/dist/qr-code.js +1 -1
- package/dist/qr-code.js.map +1 -1
- package/dist/reaction-picker.d.ts.map +1 -1
- package/dist/reaction-picker.js +14 -1
- package/dist/reaction-picker.js.map +1 -1
- package/dist/saved-items.d.ts +8 -2
- package/dist/saved-items.d.ts.map +1 -1
- package/dist/saved-items.js +4 -4
- package/dist/saved-items.js.map +1 -1
- package/dist/screen-flows.d.ts +52 -6
- package/dist/screen-flows.d.ts.map +1 -1
- package/dist/screen-flows.js +48 -19
- package/dist/screen-flows.js.map +1 -1
- package/dist/screens.d.ts +56 -8
- package/dist/screens.d.ts.map +1 -1
- package/dist/screens.js +41 -15
- package/dist/screens.js.map +1 -1
- package/dist/selection.d.ts.map +1 -1
- package/dist/selection.js +4 -4
- package/dist/selection.js.map +1 -1
- package/dist/social-compositions.d.ts.map +1 -1
- package/dist/social-compositions.js +3 -2
- package/dist/social-compositions.js.map +1 -1
- package/dist/sortable.d.ts.map +1 -1
- package/dist/sortable.js +9 -3
- package/dist/sortable.js.map +1 -1
- package/dist/status-text.d.ts.map +1 -1
- package/dist/status-text.js +5 -2
- package/dist/status-text.js.map +1 -1
- package/dist/styles.css +221 -126
- package/dist/styles.layered.css +221 -126
- package/dist/table-family.d.ts +1 -1
- package/dist/table-family.d.ts.map +1 -1
- package/dist/table-family.js +24 -7
- package/dist/table-family.js.map +1 -1
- package/dist/task-controls.d.ts.map +1 -1
- package/dist/task-controls.js +9 -4
- package/dist/task-controls.js.map +1 -1
- package/dist/task-list.d.ts +1 -1
- package/dist/task-list.d.ts.map +1 -1
- package/dist/task-list.js +4 -3
- package/dist/task-list.js.map +1 -1
- package/dist/theme.d.ts.map +1 -1
- package/dist/theme.js +4 -0
- package/dist/theme.js.map +1 -1
- package/dist/top-bar.d.ts +5 -0
- package/dist/top-bar.d.ts.map +1 -1
- package/dist/top-bar.js +6 -1
- package/dist/top-bar.js.map +1 -1
- package/dist/transfer-list.d.ts.map +1 -1
- package/dist/transfer-list.js +13 -3
- package/dist/transfer-list.js.map +1 -1
- package/dist/upload-item.d.ts.map +1 -1
- package/dist/upload-item.js +3 -1
- package/dist/upload-item.js.map +1 -1
- package/fonts/pretendard/LICENSE.txt +94 -0
- package/fonts/pretendard/pretendard.css +927 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.0.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.1.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.10.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.11.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.12.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.13.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.14.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.15.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.16.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.17.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.18.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.19.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.2.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.20.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.21.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.22.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.23.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.24.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.25.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.26.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.27.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.28.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.29.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.3.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.30.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.31.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.32.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.33.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.34.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.35.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.36.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.37.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.38.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.39.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.4.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.40.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.41.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.42.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.43.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.44.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.45.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.46.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.47.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.48.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.49.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.5.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.50.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.51.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.52.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.53.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.54.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.55.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.56.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.57.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.58.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.59.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.6.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.60.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.61.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.62.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.63.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.64.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.65.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.66.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.67.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.68.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.69.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.7.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.70.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.71.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.72.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.73.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.74.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.75.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.76.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.77.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.78.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.79.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.8.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.80.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.81.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.82.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.83.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.84.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.85.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.86.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.87.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.88.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.89.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.9.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.90.woff2 +0 -0
- package/fonts/pretendard/woff2-dynamic-subset/PretendardVariable.subset.91.woff2 +0 -0
- package/package.json +10 -3
package/dist/layout.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\";\n\n// Layout renderers read profile context; declaring this granular entry keeps server-owned guide text outside the client graph.\n// Root-barrel marking would also move unrelated exports; see docs/qa/2026-10-07-rsc-profile-boundary.md.\nimport { useDesignProfileDefaults } from \"./internal.js\";\nimport {\n resolveGridLayout,\n type GridDescriptor,\n type GridGap,\n} from \"@hjmds/design-contracts/grid\";\nimport {\n resolveAspectRatioDescriptor,\n type AspectRatioValue,\n} from \"@hjmds/design-contracts/components/aspect-ratio\";\nimport {\n resolveContainerDescriptor,\n type ContainerGutter,\n type ContainerSize,\n} from \"@hjmds/design-contracts/components/container\";\nimport {\n layoutRecipe,\n validateLayoutWebDescriptor,\n type LayoutSidebarDescriptor,\n type LayoutSidebarRole,\n} from \"@hjmds/design-contracts/components/layout\";\nimport {\n surfaceDefaults,\n surfaceGeometry,\n surfaceRecipe,\n type SurfacePadding,\n type SurfaceRadius,\n type SurfaceTone,\n} from \"@hjmds/design-contracts/recipes/base\";\nimport {\n stackRecipe,\n textRecipe,\n type StackAlign,\n type StackAxis,\n type StackGap,\n type StackJustify,\n type TextEmphasis,\n type TextTone,\n} from \"@hjmds/design-contracts/recipes\";\nimport { resolveTextFontRole, type FontRole, type TextVariant } from \"@hjmds/design-contracts/foundations\";\nimport {\n createElement,\n forwardRef,\n useId,\n useRef,\n type AnchorHTMLAttributes,\n type HTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n} from \"react\";\nimport {\n classNames,\n composeRefs,\n useElementWidth,\n useWindowWidth,\n} from \"./internal.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\nexport type {\n SurfacePadding,\n SurfaceRadius,\n SurfaceTone,\n} from \"@hjmds/design-contracts/recipes/base\";\nexport type {\n StackAlign,\n StackAxis,\n StackGap,\n StackJustify,\n TextEmphasis,\n TextTone,\n} from \"@hjmds/design-contracts/recipes\";\n\ntype LayoutRegionProps = Omit<\n HTMLAttributes<HTMLElement>,\n \"children\" | \"role\"\n>;\n\ntype LayoutSidebarBase = Readonly<{\n children: ReactNode;\n role: LayoutSidebarRole;\n label: string;\n landmarkProps?: Omit<LayoutRegionProps, \"aria-label\">;\n landmarkRef?: Ref<HTMLElement>;\n}>;\n\n/**\n * A persistent sidebar is rendered in the shell grid. An overlay sidebar is\n * deliberately handed to the product's SidePanel (or equivalent) through\n * `renderOverlay`; Layout never owns a second open/dismiss lifecycle.\n */\nexport type LayoutSidebar =\n | (LayoutSidebarBase &\n Readonly<{\n mode: \"persistent\";\n renderOverlay?: never;\n }>)\n | (LayoutSidebarBase &\n Readonly<{\n mode: \"overlay\";\n renderOverlay(sidebarLandmark: ReactElement): ReactNode;\n }>);\n\nexport type LayoutProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Readonly<{\n children: ReactNode;\n header?: ReactNode;\n footer?: ReactNode;\n sidebar?: LayoutSidebar;\n skipLinkLabel?: string;\n /** Stable product id for deep links; a hydration-safe id is generated when omitted. */\n mainId?: string;\n mainRef?: Ref<HTMLElement>;\n headerProps?: LayoutRegionProps;\n mainProps?: Omit<LayoutRegionProps, \"id\" | \"tabIndex\">;\n footerProps?: LayoutRegionProps;\n skipLinkProps?: Omit<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n \"children\" | \"href\"\n >;\n /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n }>;\n\nfunction hasRegionContent(content: ReactNode | undefined): boolean {\n return content !== undefined && content !== null && content !== false;\n}\n\nfunction assertMainId(id: string): void {\n if (id.trim().length === 0) {\n throw new TypeError(\"Layout mainId must not be empty\");\n }\n if (/\\s/u.test(id)) {\n throw new TypeError(\"Layout mainId must not contain whitespace\");\n }\n}\n\n/** Accessible Web app shell with real landmarks and bypass navigation. */\nexport const Layout = forwardRef<HTMLDivElement, LayoutProps>(function Layout(\n {\n children,\n header,\n footer,\n sidebar,\n skipLinkLabel,\n mainId: mainIdProp,\n mainRef: forwardedMainRef,\n headerProps,\n mainProps,\n footerProps,\n skipLinkProps,\n className,\n layoutStyle,\n ...props\n },\n ref,\n) {\n const generatedId = `hjm-main-${useId().replaceAll(\":\", \"\")}`;\n const internalMainRef = useRef<HTMLElement>(null);\n const mainId = mainIdProp ?? generatedId;\n assertMainId(mainId);\n\n const hasHeader = hasRegionContent(header);\n const hasFooter = hasRegionContent(footer);\n const descriptor = {\n ...(hasHeader ? { hasHeader: true } : {}),\n ...(hasFooter ? { hasFooter: true } : {}),\n ...(sidebar === undefined\n ? {}\n : {\n sidebar: {\n role: sidebar.role,\n mode: sidebar.mode,\n label: sidebar.label,\n } satisfies LayoutSidebarDescriptor,\n }),\n ...(skipLinkLabel === undefined ? {} : { skipLinkLabel }),\n };\n validateLayoutWebDescriptor(descriptor);\n\n if (\n sidebar?.mode === \"overlay\" &&\n typeof sidebar.renderOverlay !== \"function\"\n ) {\n throw new TypeError(\n \"Layout overlay sidebar requires renderOverlay so SidePanel owns its lifecycle\",\n );\n }\n\n const {\n className: headerClassName,\n ...restHeaderProps\n } = headerProps ?? {};\n const {\n className: mainClassName,\n style: mainStyle,\n ...restMainProps\n } = mainProps ?? {};\n const {\n className: footerClassName,\n ...restFooterProps\n } = footerProps ?? {};\n const {\n className: skipLinkClassName,\n onClick: onSkipLinkClick,\n ...restSkipLinkProps\n } = skipLinkProps ?? {};\n\n let sidebarNode: ReactNode;\n if (sidebar !== undefined) {\n const {\n className: sidebarClassName,\n style: sidebarStyle,\n ...restSidebarProps\n } = sidebar.landmarkProps ?? {};\n const sidebarLandmark = createElement(\n sidebar.role === \"navigation\" ? \"nav\" : \"aside\",\n {\n ...restSidebarProps,\n ref: sidebar.landmarkRef,\n className: classNames(\"hjm-layout__sidebar\", sidebarClassName),\n \"aria-label\": sidebar.label,\n \"data-mode\": sidebar.mode,\n style: {\n ...(sidebar.mode === \"persistent\"\n ? { inlineSize: layoutRecipe.sidebar.width }\n : {}),\n ...sidebarStyle,\n },\n },\n sidebar.children,\n );\n sidebarNode = sidebar.mode === \"overlay\"\n ? sidebar.renderOverlay(sidebarLandmark)\n : sidebarLandmark;\n }\n\n const moveFocusToMain = (event: MouseEvent<HTMLAnchorElement>) => {\n onSkipLinkClick?.(event);\n if (event.defaultPrevented) return;\n const main = internalMainRef.current;\n if (main === null) return;\n event.preventDefault();\n const url = new URL(window.location.href);\n url.hash = mainId;\n window.history.replaceState(window.history.state, \"\", url);\n main.focus({ preventScroll: true });\n main.scrollIntoView?.({ block: \"start\" });\n };\n\n return (\n <div\n {...props}\n style={{ ...props.style, ...layoutStyle }}\n ref={ref}\n className={classNames(\"hjm-layout\", className)}\n data-hjm-component=\"Layout\"\n data-sidebar-mode={sidebar?.mode ?? \"none\"}\n >\n {skipLinkLabel === undefined ? null : (\n <a\n {...restSkipLinkProps}\n href={`#${mainId}`}\n className={classNames(\n \"hjm-layout__skip-link\",\n skipLinkClassName,\n )}\n onClick={moveFocusToMain}\n >\n {skipLinkLabel}\n </a>\n )}\n {hasHeader ? (\n <header\n {...restHeaderProps}\n className={classNames(\"hjm-layout__header\", headerClassName)}\n >\n {header}\n </header>\n ) : null}\n {sidebarNode}\n <main\n {...restMainProps}\n ref={composeRefs(internalMainRef, forwardedMainRef)}\n id={mainId}\n className={classNames(\"hjm-layout__main\", mainClassName)}\n tabIndex={-1}\n style={{\n maxInlineSize: layoutRecipe.main.maxWidth,\n paddingInline: layoutRecipe.main.paddingHorizontal,\n ...mainStyle,\n }}\n >\n {children}\n </main>\n {hasFooter ? (\n <footer\n {...restFooterProps}\n className={classNames(\"hjm-layout__footer\", footerClassName)}\n >\n {footer}\n </footer>\n ) : null}\n </div>\n );\n});\n\nexport type TextProps = Omit<HTMLAttributes<HTMLElement>, \"children\"> &\n Readonly<{\n children: ReactNode;\n as?: \"span\" | \"p\" | \"div\" | \"strong\" | \"small\";\n variant?: TextVariant;\n /** Overrides the variant family role; never changes its semantic element or metrics. */\n fontRole?: FontRole;\n tone?: TextTone;\n emphasis?: TextEmphasis;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const Text = forwardRef<HTMLElement, TextProps>(function Text(\n {\n as = \"span\",\n variant = textRecipe.defaults.variant,\n fontRole,\n tone = textRecipe.defaults.tone,\n emphasis: suppliedEmphasis,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n const profile = useDesignProfileDefaults();\n const emphasis = suppliedEmphasis ?? textRecipe.defaults.emphasis;\n return createElement(as, {\n ...props,\n ref,\n className: classNames(\"hjm-text\", className),\n \"data-variant\": variant,\n \"data-font-role\": resolveTextFontRole(variant, fontRole ?? (props.role === \"heading\" ? \"display\" : undefined)),\n \"data-tone\": tone,\n \"data-emphasis\": emphasis,\n // Placement wins over the legacy `style`, matching Surface's ordering.\n style: { ...style, ...layoutStyle, ...(profile && suppliedEmphasis === undefined ? { fontWeight: profile.tokens.typography[variant].fontWeight } : {}) },\n });\n});\n\nexport type SurfaceProps = HTMLAttributes<HTMLElement> &\n Readonly<{\n as?: \"div\" | \"section\" | \"article\" | \"button\";\n /** Native button host used by interactive Card; passive surfaces remain divs. */\n type?: \"button\";\n disabled?: boolean;\n tone?: SurfaceTone;\n bordered?: boolean;\n padding?: SurfacePadding;\n radius?: SurfaceRadius;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const Surface = forwardRef<HTMLElement, SurfaceProps>(function Surface(\n {\n as = \"div\",\n tone = surfaceDefaults.tone,\n bordered,\n padding = surfaceDefaults.padding,\n radius = surfaceDefaults.radius,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n const contract = surfaceRecipe[tone];\n return createElement(as, {\n ...props,\n ref,\n className: classNames(\"hjm-surface\", className),\n \"data-tone\": tone,\n // Canvas framing is the default; preserve the caller's explicit border opt-out.\n \"data-bordered\": bordered ?? (surfaceDefaults.bordered || contract.borderAlways),\n \"data-elevated\": contract.elevated,\n \"data-clips\": contract.clipsContent,\n \"data-padding\": padding,\n \"data-radius\": radius,\n style: {\n padding: surfaceGeometry.paddings[padding],\n borderRadius: `var(--hjm-radius-${radius})`,\n ...style,\n ...layoutStyle,\n },\n });\n});\n\nexport type StackProps = HTMLAttributes<HTMLDivElement> &\n Readonly<{\n axis?: StackAxis;\n gap?: StackGap;\n align?: StackAlign;\n justify?: StackJustify;\n wrap?: boolean;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nconst justifyValues = {\n start: \"flex-start\",\n center: \"center\",\n end: \"flex-end\",\n between: \"space-between\",\n} as const;\n\nexport const Stack = forwardRef<HTMLDivElement, StackProps>(function Stack(\n {\n axis = stackRecipe.defaults.axis,\n gap = stackRecipe.defaults.gap,\n align = stackRecipe.defaults.align,\n justify = stackRecipe.defaults.justify,\n wrap = stackRecipe.defaults.wrap,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(\"hjm-stack\", className)}\n data-axis={axis}\n data-gap={gap}\n style={{\n display: \"flex\",\n flexDirection: stackRecipe.axes[axis],\n gap: stackRecipe.gaps[gap],\n alignItems: align === \"start\" || align === \"end\" ? `flex-${align}` : align,\n justifyContent: justifyValues[justify],\n flexWrap: wrap ? \"wrap\" : \"nowrap\",\n ...style,\n ...layoutStyle,\n }}\n />\n );\n});\n\nexport type ContainerProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Readonly<{\n children?: ReactNode;\n size?: ContainerSize;\n gutter?: ContainerGutter;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\n/** A centered, token-guttered content boundary shared with Native large screens. */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(function Container(\n { size, gutter, className, layoutStyle, style, ...props },\n ref,\n) {\n const resolved = resolveContainerDescriptor({\n ...(size === undefined ? {} : { size }),\n ...(gutter === undefined ? {} : { gutter }),\n });\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(\"hjm-container\", className)}\n data-size={resolved.size}\n data-gutter={resolved.gutter}\n style={{\n maxInlineSize: resolved.maxWidth ?? undefined,\n paddingInline: resolved.paddingInline,\n ...style,\n ...layoutStyle,\n }}\n />\n );\n});\n\nexport type AspectRatioProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Readonly<{\n children?: ReactNode;\n ratio?: AspectRatioValue;\n /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n }>;\n\n/** Responsive media frame. Products retain object-fit, crop, and content semantics. */\nexport const AspectRatio = forwardRef<HTMLDivElement, AspectRatioProps>(function AspectRatio(\n { ratio, className, layoutStyle, style, ...props },\n ref,\n) {\n const resolved = resolveAspectRatioDescriptor(\n ratio === undefined ? {} : { ratio },\n );\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(\"hjm-aspect-ratio\", className)}\n data-ratio={resolved.source}\n style={{ ...layoutStyle, aspectRatio: resolved.ratio, ...style }}\n />\n );\n});\n\n// No `layoutStyle`: the element is clipped to 1px by design, so placement has no visible effect.\nexport type VisuallyHiddenProps = HTMLAttributes<HTMLSpanElement> &\n Readonly<{ children: ReactNode }>;\n\n/** Keeps meaningful copy available to assistive technology without visible layout. */\nexport const VisuallyHidden = forwardRef<HTMLSpanElement, VisuallyHiddenProps>(\n function VisuallyHidden({ className, ...props }, ref) {\n return (\n <span\n {...props}\n ref={ref}\n className={classNames(\"hjm-visually-hidden\", className)}\n />\n );\n },\n);\n\nexport type GridProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Pick<GridDescriptor, \"columns\" | \"gap\" | \"minColumnWidth\"> &\n Readonly<{\n children?: ReactNode;\n /** Test/SSR override. Browser renderers otherwise observe window.innerWidth. */\n windowWidth?: number;\n /** Container measurement override; ResizeObserver is used when omitted. */\n availableWidth?: number;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(function Grid(\n {\n columns,\n gap,\n minColumnWidth,\n windowWidth,\n availableWidth,\n className,\n layoutStyle,\n style,\n ...props\n },\n forwardedRef,\n) {\n const browserWindowWidth = useWindowWidth();\n const [measuredWidth, gridRef] = useElementWidth(forwardedRef);\n const compactSsrWidth = 320;\n const effectiveWindowWidth =\n windowWidth ??\n (browserWindowWidth > 0 ? browserWindowWidth : compactSsrWidth);\n const effectiveAvailableWidth =\n availableWidth ??\n (measuredWidth !== undefined && measuredWidth > 0\n ? measuredWidth\n : effectiveWindowWidth);\n const descriptor: GridDescriptor = {\n columns,\n ...(gap === undefined ? {} : { gap }),\n ...(minColumnWidth === undefined ? {} : { minColumnWidth }),\n };\n const layout = resolveGridLayout(descriptor, {\n windowWidth: effectiveWindowWidth,\n availableWidth: effectiveAvailableWidth,\n });\n\n return (\n <div\n {...props}\n ref={gridRef}\n className={classNames(\"hjm-grid\", className)}\n data-window-class={layout.windowClass}\n data-columns={layout.columns}\n data-requested-columns={layout.requestedColumns}\n data-state={layout.columns < layout.requestedColumns ? \"collapsed\" : \"resolved\"}\n style={{\n display: \"grid\",\n gridTemplateColumns: `repeat(${layout.columns}, minmax(0, 1fr))`,\n rowGap: layout.rowGap,\n columnGap: layout.columnGap,\n ...style,\n ...layoutStyle,\n }}\n />\n );\n});\n\nexport type SectionProps = Omit<HTMLAttributes<HTMLElement>, \"children\" | \"title\"> &\n Readonly<{\n title?: ReactNode;\n description?: ReactNode;\n action?: ReactNode;\n children: ReactNode;\n headingLevel?: 2 | 3 | 4 | 5 | 6;\n /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n }>;\n\n/** Large-text-safe semantic content section with an optional header action. */\nexport const Section = forwardRef<HTMLElement, SectionProps>(function Section(\n {\n title,\n description,\n action,\n children,\n headingLevel = 2,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n const hasHeader = title !== undefined || description !== undefined || action !== undefined;\n return (\n <section {...props} style={{ ...style, ...layoutStyle }} ref={ref} className={classNames(\"hjm-section\", className)}>\n {hasHeader ? (\n <header className=\"hjm-section__header\">\n <div className=\"hjm-section__copy\">\n {title === undefined ? null : createElement(\n `h${headingLevel}`,\n { className: \"hjm-section__title\" },\n title,\n )}\n {description === undefined ? null : (\n <div className=\"hjm-section__description\">{description}</div>\n )}\n </div>\n {action === undefined ? null : <div className=\"hjm-section__action\">{action}</div>}\n </header>\n ) : null}\n <div className=\"hjm-section__content\">{children}</div>\n </section>\n );\n});\n\nexport type { GridGap };\nexport type { AspectRatioValue, ContainerGutter, ContainerSize };\n"]}
|
|
1
|
+
{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\";\n\n// Layout renderers read profile context; declaring this granular entry keeps server-owned guide text outside the client graph.\n// Root-barrel marking would also move unrelated exports; see docs/qa/2026-10-07-rsc-profile-boundary.md.\nimport { useDesignProfileDefaults } from \"./internal.js\";\nimport {\n resolveGridLayout,\n type GridDescriptor,\n type GridGap,\n} from \"@hjmds/design-contracts/grid\";\nimport {\n resolveAspectRatioDescriptor,\n type AspectRatioValue,\n} from \"@hjmds/design-contracts/components/aspect-ratio\";\nimport {\n resolveContainerDescriptor,\n type ContainerGutter,\n type ContainerSize,\n} from \"@hjmds/design-contracts/components/container\";\nimport {\n layoutRecipe,\n validateLayoutWebDescriptor,\n type LayoutSidebarDescriptor,\n type LayoutSidebarRole,\n} from \"@hjmds/design-contracts/components/layout\";\nimport {\n surfaceDefaults,\n surfaceGeometry,\n surfaceRecipe,\n type SurfacePadding,\n type SurfaceRadius,\n type SurfaceTone,\n} from \"@hjmds/design-contracts/recipes/base\";\nimport {\n resolveTextDefaultWeight,\n stackRecipe,\n textRecipe,\n type StackAlign,\n type StackAxis,\n type StackGap,\n type StackJustify,\n type TextEmphasis,\n type TextTone,\n} from \"@hjmds/design-contracts/recipes\";\nimport { resolveTextFontRole, typography, type FontRole, type TextVariant } from \"@hjmds/design-contracts/foundations\";\nimport {\n createElement,\n forwardRef,\n useId,\n useRef,\n type AnchorHTMLAttributes,\n type HTMLAttributes,\n type MouseEvent,\n type ReactElement,\n type ReactNode,\n type Ref,\n} from \"react\";\nimport {\n classNames,\n composeRefs,\n useElementWidth,\n useWindowWidth,\n} from \"./internal.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\nexport type {\n SurfacePadding,\n SurfaceRadius,\n SurfaceTone,\n} from \"@hjmds/design-contracts/recipes/base\";\nexport type {\n StackAlign,\n StackAxis,\n StackGap,\n StackJustify,\n TextEmphasis,\n TextTone,\n} from \"@hjmds/design-contracts/recipes\";\n\ntype LayoutRegionProps = Omit<\n HTMLAttributes<HTMLElement>,\n \"children\" | \"role\"\n>;\n\ntype LayoutSidebarBase = Readonly<{\n children: ReactNode;\n role: LayoutSidebarRole;\n label: string;\n landmarkProps?: Omit<LayoutRegionProps, \"aria-label\">;\n landmarkRef?: Ref<HTMLElement>;\n}>;\n\n/**\n * A persistent sidebar is rendered in the shell grid. An overlay sidebar is\n * deliberately handed to the product's SidePanel (or equivalent) through\n * `renderOverlay`; Layout never owns a second open/dismiss lifecycle.\n */\nexport type LayoutSidebar =\n | (LayoutSidebarBase &\n Readonly<{\n mode: \"persistent\";\n renderOverlay?: never;\n }>)\n | (LayoutSidebarBase &\n Readonly<{\n mode: \"overlay\";\n renderOverlay(sidebarLandmark: ReactElement): ReactNode;\n }>);\n\nexport type LayoutProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Readonly<{\n children: ReactNode;\n header?: ReactNode;\n footer?: ReactNode;\n sidebar?: LayoutSidebar;\n skipLinkLabel?: string;\n /** Stable product id for deep links; a hydration-safe id is generated when omitted. */\n mainId?: string;\n mainRef?: Ref<HTMLElement>;\n headerProps?: LayoutRegionProps;\n mainProps?: Omit<LayoutRegionProps, \"id\" | \"tabIndex\">;\n footerProps?: LayoutRegionProps;\n skipLinkProps?: Omit<\n AnchorHTMLAttributes<HTMLAnchorElement>,\n \"children\" | \"href\"\n >;\n /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n }>;\n\nfunction hasRegionContent(content: ReactNode | undefined): boolean {\n return content !== undefined && content !== null && content !== false;\n}\n\nfunction assertMainId(id: string): void {\n if (id.trim().length === 0) {\n throw new TypeError(\"Layout mainId must not be empty\");\n }\n if (/\\s/u.test(id)) {\n throw new TypeError(\"Layout mainId must not contain whitespace\");\n }\n}\n\n/** Accessible Web app shell with real landmarks and bypass navigation. */\nexport const Layout = forwardRef<HTMLDivElement, LayoutProps>(function Layout(\n {\n children,\n header,\n footer,\n sidebar,\n skipLinkLabel,\n mainId: mainIdProp,\n mainRef: forwardedMainRef,\n headerProps,\n mainProps,\n footerProps,\n skipLinkProps,\n className,\n layoutStyle,\n ...props\n },\n ref,\n) {\n const generatedId = `hjm-main-${useId().replaceAll(\":\", \"\")}`;\n const internalMainRef = useRef<HTMLElement>(null);\n const mainId = mainIdProp ?? generatedId;\n assertMainId(mainId);\n\n const hasHeader = hasRegionContent(header);\n const hasFooter = hasRegionContent(footer);\n const descriptor = {\n ...(hasHeader ? { hasHeader: true } : {}),\n ...(hasFooter ? { hasFooter: true } : {}),\n ...(sidebar === undefined\n ? {}\n : {\n sidebar: {\n role: sidebar.role,\n mode: sidebar.mode,\n label: sidebar.label,\n } satisfies LayoutSidebarDescriptor,\n }),\n ...(skipLinkLabel === undefined ? {} : { skipLinkLabel }),\n };\n validateLayoutWebDescriptor(descriptor);\n\n if (\n sidebar?.mode === \"overlay\" &&\n typeof sidebar.renderOverlay !== \"function\"\n ) {\n throw new TypeError(\n \"Layout overlay sidebar requires renderOverlay so SidePanel owns its lifecycle\",\n );\n }\n\n const {\n className: headerClassName,\n ...restHeaderProps\n } = headerProps ?? {};\n const {\n className: mainClassName,\n style: mainStyle,\n ...restMainProps\n } = mainProps ?? {};\n const {\n className: footerClassName,\n ...restFooterProps\n } = footerProps ?? {};\n const {\n className: skipLinkClassName,\n onClick: onSkipLinkClick,\n ...restSkipLinkProps\n } = skipLinkProps ?? {};\n\n let sidebarNode: ReactNode;\n if (sidebar !== undefined) {\n const {\n className: sidebarClassName,\n style: sidebarStyle,\n ...restSidebarProps\n } = sidebar.landmarkProps ?? {};\n const sidebarLandmark = createElement(\n sidebar.role === \"navigation\" ? \"nav\" : \"aside\",\n {\n ...restSidebarProps,\n ref: sidebar.landmarkRef,\n className: classNames(\"hjm-layout__sidebar\", sidebarClassName),\n \"aria-label\": sidebar.label,\n \"data-mode\": sidebar.mode,\n style: {\n ...(sidebar.mode === \"persistent\"\n ? { inlineSize: layoutRecipe.sidebar.width }\n : {}),\n ...sidebarStyle,\n },\n },\n sidebar.children,\n );\n sidebarNode = sidebar.mode === \"overlay\"\n ? sidebar.renderOverlay(sidebarLandmark)\n : sidebarLandmark;\n }\n\n const moveFocusToMain = (event: MouseEvent<HTMLAnchorElement>) => {\n onSkipLinkClick?.(event);\n if (event.defaultPrevented) return;\n const main = internalMainRef.current;\n if (main === null) return;\n event.preventDefault();\n const url = new URL(window.location.href);\n url.hash = mainId;\n window.history.replaceState(window.history.state, \"\", url);\n main.focus({ preventScroll: true });\n main.scrollIntoView?.({ block: \"start\" });\n };\n\n return (\n <div\n {...props}\n style={{ ...props.style, ...layoutStyle }}\n ref={ref}\n className={classNames(\"hjm-layout\", className)}\n data-hjm-component=\"Layout\"\n data-sidebar-mode={sidebar?.mode ?? \"none\"}\n >\n {skipLinkLabel === undefined ? null : (\n <a\n {...restSkipLinkProps}\n href={`#${mainId}`}\n className={classNames(\n \"hjm-layout__skip-link\",\n skipLinkClassName,\n )}\n onClick={moveFocusToMain}\n >\n {skipLinkLabel}\n </a>\n )}\n {hasHeader ? (\n <header\n {...restHeaderProps}\n className={classNames(\"hjm-layout__header\", headerClassName)}\n >\n {header}\n </header>\n ) : null}\n {sidebarNode}\n <main\n {...restMainProps}\n ref={composeRefs(internalMainRef, forwardedMainRef)}\n id={mainId}\n className={classNames(\"hjm-layout__main\", mainClassName)}\n tabIndex={-1}\n style={{\n maxInlineSize: layoutRecipe.main.maxWidth,\n paddingInline: layoutRecipe.main.paddingHorizontal,\n ...mainStyle,\n }}\n >\n {children}\n </main>\n {hasFooter ? (\n <footer\n {...restFooterProps}\n className={classNames(\"hjm-layout__footer\", footerClassName)}\n >\n {footer}\n </footer>\n ) : null}\n </div>\n );\n});\n\nexport type TextProps = Omit<HTMLAttributes<HTMLElement>, \"children\"> &\n Readonly<{\n children: ReactNode;\n as?: \"span\" | \"p\" | \"div\" | \"strong\" | \"small\";\n variant?: TextVariant;\n /** Overrides the variant family role; never changes its semantic element or metrics. */\n fontRole?: FontRole;\n tone?: TextTone;\n emphasis?: TextEmphasis;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const Text = forwardRef<HTMLElement, TextProps>(function Text(\n {\n as = \"span\",\n variant = textRecipe.defaults.variant,\n fontRole,\n tone = textRecipe.defaults.tone,\n emphasis: suppliedEmphasis,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n const profile = useDesignProfileDefaults();\n const emphasis = suppliedEmphasis ?? textRecipe.defaults.emphasis;\n const defaultWeight = suppliedEmphasis === undefined\n ? resolveTextDefaultWeight(variant, profile?.tokens.typography ?? typography, profile !== undefined)\n : undefined;\n return createElement(as, {\n ...props,\n ref,\n className: classNames(\"hjm-text\", className),\n \"data-variant\": variant,\n \"data-font-role\": resolveTextFontRole(variant, fontRole ?? (props.role === \"heading\" ? \"display\" : undefined)),\n \"data-tone\": tone,\n \"data-emphasis\": emphasis,\n // The variant default weight goes first so caller `style`/placement win, matching Native's style order\n // (it used to be spread last and overrode an explicit style weight under a profile).\n style: { ...(defaultWeight === undefined ? {} : { fontWeight: defaultWeight }), ...style, ...layoutStyle },\n });\n});\n\nexport type SurfaceProps = HTMLAttributes<HTMLElement> &\n Readonly<{\n as?: \"div\" | \"section\" | \"article\" | \"button\";\n /** Native button host used by interactive Card; passive surfaces remain divs. */\n type?: \"button\";\n disabled?: boolean;\n tone?: SurfaceTone;\n bordered?: boolean;\n padding?: SurfacePadding;\n radius?: SurfaceRadius;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const Surface = forwardRef<HTMLElement, SurfaceProps>(function Surface(\n {\n as = \"div\",\n tone = surfaceDefaults.tone,\n bordered,\n padding = surfaceDefaults.padding,\n radius = surfaceDefaults.radius,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n const contract = surfaceRecipe[tone];\n return createElement(as, {\n ...props,\n ref,\n className: classNames(\"hjm-surface\", className),\n \"data-tone\": tone,\n // Canvas framing is the default; preserve the caller's explicit border opt-out.\n \"data-bordered\": bordered ?? (surfaceDefaults.bordered || contract.borderAlways),\n \"data-elevated\": contract.elevated,\n \"data-clips\": contract.clipsContent,\n \"data-padding\": padding,\n \"data-radius\": radius,\n style: {\n padding: surfaceGeometry.paddings[padding],\n borderRadius: `var(--hjm-radius-${radius})`,\n ...style,\n ...layoutStyle,\n },\n });\n});\n\nexport type StackProps = HTMLAttributes<HTMLDivElement> &\n Readonly<{\n axis?: StackAxis;\n gap?: StackGap;\n align?: StackAlign;\n justify?: StackJustify;\n wrap?: boolean;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nconst justifyValues = {\n start: \"flex-start\",\n center: \"center\",\n end: \"flex-end\",\n between: \"space-between\",\n} as const;\n\nexport const Stack = forwardRef<HTMLDivElement, StackProps>(function Stack(\n {\n axis = stackRecipe.defaults.axis,\n gap = stackRecipe.defaults.gap,\n align = stackRecipe.defaults.align,\n justify = stackRecipe.defaults.justify,\n wrap = stackRecipe.defaults.wrap,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(\"hjm-stack\", className)}\n data-axis={axis}\n data-gap={gap}\n style={{\n display: \"flex\",\n flexDirection: stackRecipe.axes[axis],\n gap: stackRecipe.gaps[gap],\n alignItems: align === \"start\" || align === \"end\" ? `flex-${align}` : align,\n justifyContent: justifyValues[justify],\n flexWrap: wrap ? \"wrap\" : \"nowrap\",\n ...style,\n ...layoutStyle,\n }}\n />\n );\n});\n\nexport type ContainerProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Readonly<{\n children?: ReactNode;\n size?: ContainerSize;\n gutter?: ContainerGutter;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\n/** A centered, token-guttered content boundary shared with Native large screens. */\nexport const Container = forwardRef<HTMLDivElement, ContainerProps>(function Container(\n { size, gutter, className, layoutStyle, style, ...props },\n ref,\n) {\n const resolved = resolveContainerDescriptor({\n ...(size === undefined ? {} : { size }),\n ...(gutter === undefined ? {} : { gutter }),\n });\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(\"hjm-container\", className)}\n data-size={resolved.size}\n data-gutter={resolved.gutter}\n style={{\n maxInlineSize: resolved.maxWidth ?? undefined,\n paddingInline: resolved.paddingInline,\n ...style,\n ...layoutStyle,\n }}\n />\n );\n});\n\nexport type AspectRatioProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Readonly<{\n children?: ReactNode;\n ratio?: AspectRatioValue;\n /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n }>;\n\n/** Responsive media frame. Products retain object-fit, crop, and content semantics. */\nexport const AspectRatio = forwardRef<HTMLDivElement, AspectRatioProps>(function AspectRatio(\n { ratio, className, layoutStyle, style, ...props },\n ref,\n) {\n const resolved = resolveAspectRatioDescriptor(\n ratio === undefined ? {} : { ratio },\n );\n return (\n <div\n {...props}\n ref={ref}\n className={classNames(\"hjm-aspect-ratio\", className)}\n data-ratio={resolved.source}\n style={{ ...layoutStyle, aspectRatio: resolved.ratio, ...style }}\n />\n );\n});\n\n// No `layoutStyle`: the element is clipped to 1px by design, so placement has no visible effect.\nexport type VisuallyHiddenProps = HTMLAttributes<HTMLSpanElement> &\n Readonly<{ children: ReactNode }>;\n\n/** Keeps meaningful copy available to assistive technology without visible layout. */\nexport const VisuallyHidden = forwardRef<HTMLSpanElement, VisuallyHiddenProps>(\n function VisuallyHidden({ className, ...props }, ref) {\n return (\n <span\n {...props}\n ref={ref}\n className={classNames(\"hjm-visually-hidden\", className)}\n />\n );\n },\n);\n\nexport type GridProps = Omit<HTMLAttributes<HTMLDivElement>, \"children\"> &\n Pick<GridDescriptor, \"columns\" | \"gap\" | \"minColumnWidth\"> &\n Readonly<{\n children?: ReactNode;\n /** Test/SSR override. Browser renderers otherwise observe window.innerWidth. */\n windowWidth?: number;\n /** Container measurement override; ResizeObserver is used when omitted. */\n availableWidth?: number;\n /** Canonical layout-only placement. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n}>;\n\nexport const Grid = forwardRef<HTMLDivElement, GridProps>(function Grid(\n {\n columns,\n gap,\n minColumnWidth,\n windowWidth,\n availableWidth,\n className,\n layoutStyle,\n style,\n ...props\n },\n forwardedRef,\n) {\n const browserWindowWidth = useWindowWidth();\n const [measuredWidth, gridRef] = useElementWidth(forwardedRef);\n const compactSsrWidth = 320;\n const effectiveWindowWidth =\n windowWidth ??\n (browserWindowWidth > 0 ? browserWindowWidth : compactSsrWidth);\n const effectiveAvailableWidth =\n availableWidth ??\n (measuredWidth !== undefined && measuredWidth > 0\n ? measuredWidth\n : effectiveWindowWidth);\n const descriptor: GridDescriptor = {\n columns,\n ...(gap === undefined ? {} : { gap }),\n ...(minColumnWidth === undefined ? {} : { minColumnWidth }),\n };\n const layout = resolveGridLayout(descriptor, {\n windowWidth: effectiveWindowWidth,\n availableWidth: effectiveAvailableWidth,\n });\n\n return (\n <div\n {...props}\n ref={gridRef}\n className={classNames(\"hjm-grid\", className)}\n data-window-class={layout.windowClass}\n data-columns={layout.columns}\n data-requested-columns={layout.requestedColumns}\n data-state={layout.columns < layout.requestedColumns ? \"collapsed\" : \"resolved\"}\n style={{\n display: \"grid\",\n gridTemplateColumns: `repeat(${layout.columns}, minmax(0, 1fr))`,\n rowGap: layout.rowGap,\n columnGap: layout.columnGap,\n ...style,\n ...layoutStyle,\n }}\n />\n );\n});\n\nexport type SectionProps = Omit<HTMLAttributes<HTMLElement>, \"children\" | \"title\"> &\n Readonly<{\n title?: ReactNode;\n description?: ReactNode;\n action?: ReactNode;\n children: ReactNode;\n headingLevel?: 2 | 3 | 4 | 5 | 6;\n /** Canonical layout-only placement on the root element. Controlled visual keys are excluded. */\n layoutStyle?: HjmCompositionStyleProp;\n }>;\n\n/** Large-text-safe semantic content section with an optional header action. */\nexport const Section = forwardRef<HTMLElement, SectionProps>(function Section(\n {\n title,\n description,\n action,\n children,\n headingLevel = 2,\n className,\n layoutStyle,\n style,\n ...props\n },\n ref,\n) {\n const hasHeader = title !== undefined || description !== undefined || action !== undefined;\n return (\n <section {...props} style={{ ...style, ...layoutStyle }} ref={ref} className={classNames(\"hjm-section\", className)}>\n {hasHeader ? (\n <header className=\"hjm-section__header\">\n <div className=\"hjm-section__copy\">\n {title === undefined ? null : createElement(\n `h${headingLevel}`,\n { className: \"hjm-section__title\" },\n title,\n )}\n {description === undefined ? null : (\n <div className=\"hjm-section__description\">{description}</div>\n )}\n </div>\n {action === undefined ? null : <div className=\"hjm-section__action\">{action}</div>}\n </header>\n ) : null}\n <div className=\"hjm-section__content\">{children}</div>\n </section>\n );\n});\n\nexport type { GridGap };\nexport type { AspectRatioValue, ContainerGutter, ContainerSize };\n"]}
|
package/dist/masonry.d.ts
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import type
|
|
1
|
+
import { type ReactNode } from "react";
|
|
2
2
|
import type { HjmCompositionStyleProp } from "./composition-style.js";
|
|
3
3
|
export type MasonryProps<T> = {
|
|
4
4
|
items: readonly T[];
|
|
5
5
|
keyExtractor: (item: T) => string;
|
|
6
6
|
renderItem: (item: T, index: number) => ReactNode;
|
|
7
7
|
getItemHeight: (item: T, itemWidth: number) => number;
|
|
8
|
-
width
|
|
8
|
+
/** Slot width. Omit it and Masonry measures its own slot; before the first measurement nothing is drawn. */
|
|
9
|
+
width?: number;
|
|
10
|
+
/** Fixed column count. Omit it and the count follows the width (`masonryRecipe.minItemWidth`). */
|
|
9
11
|
columns?: number;
|
|
10
12
|
gap?: number;
|
|
11
13
|
label: string;
|
|
@@ -13,5 +15,5 @@ export type MasonryProps<T> = {
|
|
|
13
15
|
/** Canonical layout-only placement on the root. The measured `width`/height still win: absolute item frames depend on them. */
|
|
14
16
|
layoutStyle?: HjmCompositionStyleProp;
|
|
15
17
|
};
|
|
16
|
-
export declare function Masonry<T>(
|
|
18
|
+
export declare function Masonry<T>(props: MasonryProps<T>): import("react").JSX.Element;
|
|
17
19
|
//# sourceMappingURL=masonry.d.ts.map
|
package/dist/masonry.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"masonry.d.ts","sourceRoot":"","sources":["../src/masonry.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"masonry.d.ts","sourceRoot":"","sources":["../src/masonry.tsx"],"names":[],"mappings":"AACA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGpE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AACtE,MAAM,MAAM,YAAY,CAAC,CAAC,IAAI;IAAE,KAAK,EAAE,SAAS,CAAC,EAAE,CAAC;IAAC,YAAY,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,CAAC;IAAC,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,SAAS,CAAC;IAAC,aAAa,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,MAAM,KAAK,MAAM,CAAC;IAC/L,4GAA4G;IAC5G,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kGAAkG;IAClG,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,GAAG,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,SAAS,CAAC;IACjE,+HAA+H;IAC/H,WAAW,CAAC,EAAE,uBAAuB,CAAA;CAAE,CAAC;AAC1C,wBAAgB,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,YAAY,CAAC,CAAC,CAAC,+BAchD"}
|
package/dist/masonry.js
CHANGED
|
@@ -1,9 +1,29 @@
|
|
|
1
|
+
"use client";
|
|
1
2
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
+
import { useEffect, useRef, useState } from "react";
|
|
4
|
+
import { resolveMasonryColumns, resolveMasonryLayout } from "@hjmds/design-contracts/components/masonry";
|
|
3
5
|
import { validateListKeys } from "@hjmds/design-contracts/components/virtual-list";
|
|
4
|
-
export function Masonry(
|
|
6
|
+
export function Masonry(props) {
|
|
7
|
+
const host = useRef(null);
|
|
8
|
+
const [measured, setMeasured] = useState(0);
|
|
9
|
+
const selfMeasured = props.width === undefined;
|
|
10
|
+
useEffect(() => {
|
|
11
|
+
if (!selfMeasured || !host.current)
|
|
12
|
+
return;
|
|
13
|
+
// Measure the actual slot: viewport widths also include sidebars, gutters and sheets.
|
|
14
|
+
const observer = new ResizeObserver(([entry]) => setMeasured(entry?.contentRect.width ?? 0));
|
|
15
|
+
observer.observe(host.current);
|
|
16
|
+
return () => observer.disconnect();
|
|
17
|
+
}, [selfMeasured]);
|
|
18
|
+
if (!selfMeasured)
|
|
19
|
+
return _jsx(MasonryFrame, { ...props, width: props.width });
|
|
20
|
+
const { layoutStyle, ...frame } = props;
|
|
21
|
+
return _jsx("div", { ref: host, "data-hjm-masonry-host": "", style: layoutStyle, children: measured > 0 ? _jsx(MasonryFrame, { ...frame, width: measured }) : null });
|
|
22
|
+
}
|
|
23
|
+
function MasonryFrame({ items, keyExtractor, renderItem, getItemHeight, width, columns: suppliedColumns, gap = 12, label, empty, layoutStyle }) {
|
|
5
24
|
const keys = items.map(keyExtractor);
|
|
6
25
|
validateListKeys(keys, label);
|
|
26
|
+
const columns = suppliedColumns ?? resolveMasonryColumns(width, gap);
|
|
7
27
|
const itemWidth = resolveMasonryLayout([], width, columns, gap).itemWidth;
|
|
8
28
|
const layout = resolveMasonryLayout(items.map(item => getItemHeight(item, itemWidth)), width, columns, gap);
|
|
9
29
|
// A named div without a role is not exposed with its name (ARIA prohibits aria-label on generic).
|
|
@@ -11,6 +31,8 @@ export function Masonry({ items, keyExtractor, renderItem, getItemHeight, width,
|
|
|
11
31
|
// The empty collection keeps its measured width and centers within host-allocated space.
|
|
12
32
|
if (!items.length)
|
|
13
33
|
return _jsx("div", { role: "group", "aria-label": label, style: { ...layoutStyle, width, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", textAlign: "center" }, children: empty });
|
|
14
|
-
|
|
34
|
+
// Each frame is a column flex box like a Native View, so a card with `layoutStyle={{ flex: 1 }}` fills the fixed
|
|
35
|
+
// frame on both platforms without a product-side wrapper element.
|
|
36
|
+
return _jsx("div", { "data-hjm-masonry": true, role: "list", "aria-label": label, style: { ...layoutStyle, position: "relative", width, height: layout.height }, children: items.map((item, index) => { const frame = layout.items[index]; return _jsx("div", { role: "listitem", style: { position: "absolute", insetInlineStart: frame.left, top: frame.top, width: frame.width, height: frame.height, display: "flex", flexDirection: "column" }, children: renderItem(item, index) }, keys[index]); }) });
|
|
15
37
|
}
|
|
16
38
|
//# sourceMappingURL=masonry.js.map
|
package/dist/masonry.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"masonry.js","sourceRoot":"","sources":["../src/masonry.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"masonry.js","sourceRoot":"","sources":["../src/masonry.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\";\nimport { useEffect, useRef, useState, type ReactNode } from \"react\";\nimport { resolveMasonryColumns, resolveMasonryLayout } from \"@hjmds/design-contracts/components/masonry\";\nimport { validateListKeys } from \"@hjmds/design-contracts/components/virtual-list\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\nexport type MasonryProps<T> = { items: readonly T[]; keyExtractor: (item: T) => string; renderItem: (item: T, index: number) => ReactNode; getItemHeight: (item: T, itemWidth: number) => number;\n /** Slot width. Omit it and Masonry measures its own slot; before the first measurement nothing is drawn. */\n width?: number;\n /** Fixed column count. Omit it and the count follows the width (`masonryRecipe.minItemWidth`). */\n columns?: number; gap?: number; label: string; empty?: ReactNode;\n /** Canonical layout-only placement on the root. The measured `width`/height still win: absolute item frames depend on them. */\n layoutStyle?: HjmCompositionStyleProp };\nexport function Masonry<T>(props: MasonryProps<T>) {\n const host = useRef<HTMLDivElement>(null);\n const [measured, setMeasured] = useState(0);\n const selfMeasured = props.width === undefined;\n useEffect(() => {\n if (!selfMeasured || !host.current) return;\n // Measure the actual slot: viewport widths also include sidebars, gutters and sheets.\n const observer = new ResizeObserver(([entry]) => setMeasured(entry?.contentRect.width ?? 0));\n observer.observe(host.current);\n return () => observer.disconnect();\n }, [selfMeasured]);\n if (!selfMeasured) return <MasonryFrame {...props} width={props.width!} />;\n const { layoutStyle, ...frame } = props;\n return <div ref={host} data-hjm-masonry-host=\"\" style={layoutStyle}>{measured > 0 ? <MasonryFrame {...frame} width={measured} /> : null}</div>;\n}\nfunction MasonryFrame<T>({ items, keyExtractor, renderItem, getItemHeight, width, columns: suppliedColumns, gap = 12, label, empty, layoutStyle }: MasonryProps<T> & { width: number }) {\n const keys = items.map(keyExtractor); validateListKeys(keys, label);\n const columns = suppliedColumns ?? resolveMasonryColumns(width, gap);\n const itemWidth = resolveMasonryLayout([], width, columns, gap).itemWidth;\n const layout = resolveMasonryLayout(items.map(item => getItemHeight(item, itemWidth)), width, columns, gap);\n // A named div without a role is not exposed with its name (ARIA prohibits aria-label on generic).\n // `group` keeps the collection name with the empty copy; `list` was rejected because the empty slot is not a listitem.\n // The empty collection keeps its measured width and centers within host-allocated space.\n if (!items.length) return <div role=\"group\" aria-label={label} style={{ ...layoutStyle, width, display: \"flex\", flexDirection: \"column\", alignItems: \"center\", justifyContent: \"center\", textAlign: \"center\" }}>{empty}</div>;\n // Each frame is a column flex box like a Native View, so a card with `layoutStyle={{ flex: 1 }}` fills the fixed\n // frame on both platforms without a product-side wrapper element.\n return <div data-hjm-masonry role=\"list\" aria-label={label} style={{ ...layoutStyle, position: \"relative\", width, height: layout.height }}>\n {items.map((item, index) => { const frame = layout.items[index]!; return <div role=\"listitem\" key={keys[index]} style={{ position: \"absolute\", insetInlineStart: frame.left, top: frame.top, width: frame.width, height: frame.height, display: \"flex\", flexDirection: \"column\" }}>{renderItem(item, index)}</div>; })}\n </div>;\n}\n"]}
|
package/dist/menu-morph.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu-morph.d.ts","sourceRoot":"","sources":["../src/menu-morph.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"menu-morph.d.ts","sourceRoot":"","sources":["../src/menu-morph.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAQ,KAAK,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEpD,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEtE,MAAM,MAAM,iBAAiB,GAAG;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,QAAQ,EAAE,CAAC;IAC3B,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC;;;;OAIG;IACH,WAAW,CAAC,EAAE,uBAAuB,CAAC;CACvC,CAAC;AAEF,kFAAkF;AAClF,wBAAgB,YAAY,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAgB,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,iBAAiB,+BAsFxI"}
|
package/dist/menu-morph.js
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { resolveMenuTypeahead } from "./menu-typeahead.js";
|
|
3
3
|
import { Menu as Bloom } from "bloom-menu";
|
|
4
|
-
import { useEffect, useRef, useState } from "react";
|
|
4
|
+
import { useEffect, useLayoutEffect, useRef, useState } from "react";
|
|
5
|
+
import { radius } from "@hjmds/design-contracts/foundations";
|
|
5
6
|
import { Button } from "./actions.js";
|
|
7
|
+
import { Icon } from "./supplemental-display.js";
|
|
6
8
|
import { Menu } from "./overlays.js";
|
|
7
9
|
import { useHjmTheme } from "./provider.js";
|
|
8
10
|
/** Action-only morph presentation. Selection/async menus retain the full Menu. */
|
|
@@ -14,6 +16,26 @@ export function MorphingMenu({ label, items, onAction, disabled = false, open: c
|
|
|
14
16
|
const previousOpen = useRef(false);
|
|
15
17
|
const restoreFocus = useRef(true);
|
|
16
18
|
const search = useRef({ value: "", time: 0 });
|
|
19
|
+
// Bloom needs numeric closed geometry. A hidden HJM secondary Button with the same label measures it, so the
|
|
20
|
+
// morph trigger and the canonical fallback trigger keep one size (2026-10-17 composition review).
|
|
21
|
+
const measure = useRef(null);
|
|
22
|
+
const [buttonSize, setButtonSize] = useState({ width: 160, height: 44 });
|
|
23
|
+
const motionPath = !(theme.environment.reducedMotion || theme.environment.direction === "rtl");
|
|
24
|
+
useLayoutEffect(() => {
|
|
25
|
+
const node = measure.current;
|
|
26
|
+
if (!node)
|
|
27
|
+
return;
|
|
28
|
+
const read = () => setButtonSize(current => {
|
|
29
|
+
const width = Math.ceil(node.offsetWidth), height = Math.ceil(node.offsetHeight);
|
|
30
|
+
return width > 0 && height > 0 && (width !== current.width || height !== current.height) ? { width, height } : current;
|
|
31
|
+
});
|
|
32
|
+
read();
|
|
33
|
+
if (typeof ResizeObserver === "undefined")
|
|
34
|
+
return;
|
|
35
|
+
const observer = new ResizeObserver(read);
|
|
36
|
+
observer.observe(node);
|
|
37
|
+
return () => observer.disconnect();
|
|
38
|
+
}, [motionPath, label]);
|
|
17
39
|
const change = (value) => { if (value)
|
|
18
40
|
restoreFocus.current = true; setLocalOpen(value); onOpenChange?.(value); };
|
|
19
41
|
if (!label.trim() || !items.length || new Set(items.map(item => item.id)).size !== items.length ||
|
|
@@ -32,8 +54,9 @@ export function MorphingMenu({ label, items, onAction, disabled = false, open: c
|
|
|
32
54
|
previousOpen.current = open;
|
|
33
55
|
}, [open, label]);
|
|
34
56
|
// The canonical Menu owns static/RTL behavior; Bloom's left/right geometry is physical.
|
|
35
|
-
|
|
36
|
-
|
|
57
|
+
const chevron = _jsx(Icon, { name: "chevronDown" });
|
|
58
|
+
if (!motionPath) {
|
|
59
|
+
return _jsx(Menu, { label: label, trigger: _jsx(Button, { tone: "secondary", trailing: chevron, children: label }), items: items, disabled: disabled, open: open, ...(layoutStyle === undefined ? {} : { layoutStyle }), onOpenChange: change, ...(onAction ? { onAction } : {}) });
|
|
37
60
|
}
|
|
38
61
|
const keyDown = (event) => {
|
|
39
62
|
if (!open) {
|
|
@@ -75,9 +98,9 @@ export function MorphingMenu({ label, items, onAction, disabled = false, open: c
|
|
|
75
98
|
nodes[next]?.focus();
|
|
76
99
|
}
|
|
77
100
|
};
|
|
78
|
-
return
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
101
|
+
return _jsxs("div", { ref: root, className: "hjm-menu-morph", "data-open": open, style: layoutStyle, onKeyDownCapture: keyDown, children: [_jsx(Button, { ref: measure, tone: "secondary", trailing: chevron, className: "hjm-menu-morph__measure", "aria-hidden": "true", tabIndex: -1, inert: true, children: label }), _jsx(Bloom.Root, { direction: "bottom", open: open, onOpenChange: change, modal: false, children: _jsxs(Bloom.Container, { buttonSize: buttonSize, buttonRadius: radius.md, menuWidth: 240, className: "hjm-menu-morph__surface", children: [_jsxs(Bloom.Trigger, { disabled: disabled, className: "hjm-menu-morph__trigger", children: [_jsx("span", { className: "hjm-button__label", children: label }), chevron] }), _jsx(Bloom.Content, { children: items.map(item => _jsxs("button", { type: "button", role: "menuitem", tabIndex: -1, className: "hjm-menu-morph__item", disabled: !open || disabled || (item.disabled ?? false), "data-tone": item.tone, "aria-label": item.textValue, onClick: () => { if (!disabled && !item.disabled) {
|
|
102
|
+
change(false);
|
|
103
|
+
onAction?.(item.id);
|
|
104
|
+
} }, children: [item.leading, item.label, item.trailing] }, item.id)) })] }) })] });
|
|
82
105
|
}
|
|
83
106
|
//# sourceMappingURL=menu-morph.js.map
|
package/dist/menu-morph.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu-morph.js","sourceRoot":"","sources":["../src/menu-morph.tsx"],"names":[],"mappings":"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","sourcesContent":["import { resolveMenuTypeahead } from \"./menu-typeahead.js\";\nimport { Menu as Bloom } from \"bloom-menu\";\nimport { useEffect, useRef, useState, type KeyboardEvent } from \"react\";\nimport { Button } from \"./actions.js\";\nimport { Menu, type MenuItem } from \"./overlays.js\";\nimport { useHjmTheme } from \"./provider.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\nexport type MorphingMenuProps = {\n label: string;\n items: readonly MenuItem[];\n onAction?: (id: string) => void;\n disabled?: boolean;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n /**\n * Canonical layout-only placement. Applied to the morph root, or to the\n * canonical Menu's wrapper when reduced motion/RTL falls back to it, so\n * placement survives the switch.\n */\n layoutStyle?: HjmCompositionStyleProp;\n};\n\n/** Action-only morph presentation. Selection/async menus retain the full Menu. */\nexport function MorphingMenu({ label, items, onAction, disabled = false, open: controlled, onOpenChange, layoutStyle }: MorphingMenuProps) {\n const theme = useHjmTheme();\n const [localOpen, setLocalOpen] = useState(false);\n const open = controlled ?? localOpen;\n const root = useRef<HTMLDivElement>(null);\n const previousOpen = useRef(false);\n const restoreFocus = useRef(true);\n const search = useRef({ value: \"\", time: 0 });\n const change = (value: boolean) => { if (value) restoreFocus.current = true; setLocalOpen(value); onOpenChange?.(value); };\n if (!label.trim() || !items.length || new Set(items.map(item => item.id)).size !== items.length ||\n items.some(item => !item.id.trim() || !(item.textValue ?? (typeof item.label === \"string\" ? item.label : \"\")).trim())) {\n throw new TypeError(\"MorphingMenu needs a label and unique, named items\");\n }\n useEffect(() => {\n const host = root.current;\n if (open) {\n search.current = { value: \"\", time: 0 };\n host?.querySelector('[role=\"menu\"]')?.setAttribute(\"aria-label\", label);\n host?.querySelector<HTMLElement>('[role=\"menuitem\"]:not([disabled])')?.focus();\n } else if (previousOpen.current && restoreFocus.current && (host?.contains(document.activeElement) || document.activeElement === document.body)) host?.querySelector<HTMLElement>('[role=\"button\"]')?.focus();\n previousOpen.current = open;\n }, [open, label]);\n // The canonical Menu owns static/RTL behavior; Bloom's left/right geometry is physical.\n if (theme.environment.reducedMotion || theme.environment.direction === \"rtl\") {\n return <Menu label={label} trigger={<Button tone=\"secondary\">{label}</Button>} items={items} disabled={disabled} open={open}\n {...(layoutStyle === undefined ? {} : { layoutStyle })} onOpenChange={change} {...(onAction ? { onAction } : {})} />;\n }\n const keyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (!open) {\n if (!disabled && [\"ArrowDown\", \"ArrowUp\"].includes(event.key)) { event.preventDefault(); event.stopPropagation(); change(true); }\n return;\n }\n const nodes = Array.from(root.current?.querySelectorAll<HTMLElement>('[role=\"menuitem\"]:not([disabled])') ?? []);\n const index = nodes.indexOf(document.activeElement as HTMLElement);\n let next: number | undefined;\n if (event.key === \"ArrowDown\") next = (index + 1) % nodes.length;\n if (event.key === \"ArrowUp\") next = (index - 1 + nodes.length) % nodes.length;\n if (event.key === \"Home\") next = 0;\n if (event.key === \"End\") next = nodes.length - 1;\n if (event.key === \"Escape\" || event.key === \"Tab\") { if (event.key === \"Tab\") restoreFocus.current = false; change(false); if (event.key === \"Escape\") event.preventDefault(); }\n if (event.key.length === 1 && !event.altKey && !event.ctrlKey && !event.metaKey && event.key !== \" \") {\n const result = resolveMenuTypeahead(\n items.filter(item => !item.disabled).map(item => ({\n textValue: item.textValue ?? (typeof item.label === \"string\" ? item.label : \"\"),\n })), index, event.key, search.current, Date.now(),\n );\n search.current = result.state;\n next = result.index;\n }\n if (next !== undefined && next >= 0) { event.preventDefault(); event.stopPropagation(); nodes[next]?.focus(); }\n };\n return <div ref={root} className=\"hjm-menu-morph\" style={layoutStyle} onKeyDownCapture={keyDown}>\n {/* Open toward following content; upstream defaults upward and can cover preceding values. */}\n <Bloom.Root direction=\"bottom\" open={open} onOpenChange={change} modal={false}>\n <Bloom.Container buttonSize={{ width: 160, height: 44 }} menuWidth={240}\n style={{ background: theme.palette.theme.bg, color: theme.palette.theme.text }}>\n <Bloom.Trigger disabled={disabled}>{label}</Bloom.Trigger>\n <Bloom.Content>\n {items.map(item => <button type=\"button\" role=\"menuitem\" tabIndex={-1} className=\"hjm-menu-morph__item\" key={item.id} disabled={!open || disabled || (item.disabled ?? false)}\n data-tone={item.tone} aria-label={item.textValue}\n onClick={() => { if (!disabled && !item.disabled) { change(false); onAction?.(item.id); } }}>\n {item.leading}{item.label}{item.trailing}\n </button>)}\n </Bloom.Content>\n </Bloom.Container>\n </Bloom.Root>\n </div>;\n}\n"]}
|
|
1
|
+
{"version":3,"file":"menu-morph.js","sourceRoot":"","sources":["../src/menu-morph.tsx"],"names":[],"mappings":"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","sourcesContent":["import { resolveMenuTypeahead } from \"./menu-typeahead.js\";\nimport { Menu as Bloom } from \"bloom-menu\";\nimport { useEffect, useLayoutEffect, useRef, useState, type KeyboardEvent } from \"react\";\nimport { radius } from \"@hjmds/design-contracts/foundations\";\nimport { Button } from \"./actions.js\";\nimport { Icon } from \"./supplemental-display.js\";\nimport { Menu, type MenuItem } from \"./overlays.js\";\nimport { useHjmTheme } from \"./provider.js\";\nimport type { HjmCompositionStyleProp } from \"./composition-style.js\";\n\nexport type MorphingMenuProps = {\n label: string;\n items: readonly MenuItem[];\n onAction?: (id: string) => void;\n disabled?: boolean;\n open?: boolean;\n onOpenChange?: (open: boolean) => void;\n /**\n * Canonical layout-only placement. Applied to the morph root, or to the\n * canonical Menu's wrapper when reduced motion/RTL falls back to it, so\n * placement survives the switch.\n */\n layoutStyle?: HjmCompositionStyleProp;\n};\n\n/** Action-only morph presentation. Selection/async menus retain the full Menu. */\nexport function MorphingMenu({ label, items, onAction, disabled = false, open: controlled, onOpenChange, layoutStyle }: MorphingMenuProps) {\n const theme = useHjmTheme();\n const [localOpen, setLocalOpen] = useState(false);\n const open = controlled ?? localOpen;\n const root = useRef<HTMLDivElement>(null);\n const previousOpen = useRef(false);\n const restoreFocus = useRef(true);\n const search = useRef({ value: \"\", time: 0 });\n // Bloom needs numeric closed geometry. A hidden HJM secondary Button with the same label measures it, so the\n // morph trigger and the canonical fallback trigger keep one size (2026-10-17 composition review).\n const measure = useRef<HTMLButtonElement>(null);\n const [buttonSize, setButtonSize] = useState({ width: 160, height: 44 });\n const motionPath = !(theme.environment.reducedMotion || theme.environment.direction === \"rtl\");\n useLayoutEffect(() => {\n const node = measure.current;\n if (!node) return;\n const read = () => setButtonSize(current => {\n const width = Math.ceil(node.offsetWidth), height = Math.ceil(node.offsetHeight);\n return width > 0 && height > 0 && (width !== current.width || height !== current.height) ? { width, height } : current;\n });\n read();\n if (typeof ResizeObserver === \"undefined\") return;\n const observer = new ResizeObserver(read);\n observer.observe(node);\n return () => observer.disconnect();\n }, [motionPath, label]);\n const change = (value: boolean) => { if (value) restoreFocus.current = true; setLocalOpen(value); onOpenChange?.(value); };\n if (!label.trim() || !items.length || new Set(items.map(item => item.id)).size !== items.length ||\n items.some(item => !item.id.trim() || !(item.textValue ?? (typeof item.label === \"string\" ? item.label : \"\")).trim())) {\n throw new TypeError(\"MorphingMenu needs a label and unique, named items\");\n }\n useEffect(() => {\n const host = root.current;\n if (open) {\n search.current = { value: \"\", time: 0 };\n host?.querySelector('[role=\"menu\"]')?.setAttribute(\"aria-label\", label);\n host?.querySelector<HTMLElement>('[role=\"menuitem\"]:not([disabled])')?.focus();\n } else if (previousOpen.current && restoreFocus.current && (host?.contains(document.activeElement) || document.activeElement === document.body)) host?.querySelector<HTMLElement>('[role=\"button\"]')?.focus();\n previousOpen.current = open;\n }, [open, label]);\n // The canonical Menu owns static/RTL behavior; Bloom's left/right geometry is physical.\n const chevron = <Icon name=\"chevronDown\" />;\n if (!motionPath) {\n return <Menu label={label} trigger={<Button tone=\"secondary\" trailing={chevron}>{label}</Button>} items={items} disabled={disabled} open={open}\n {...(layoutStyle === undefined ? {} : { layoutStyle })} onOpenChange={change} {...(onAction ? { onAction } : {})} />;\n }\n const keyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n if (!open) {\n if (!disabled && [\"ArrowDown\", \"ArrowUp\"].includes(event.key)) { event.preventDefault(); event.stopPropagation(); change(true); }\n return;\n }\n const nodes = Array.from(root.current?.querySelectorAll<HTMLElement>('[role=\"menuitem\"]:not([disabled])') ?? []);\n const index = nodes.indexOf(document.activeElement as HTMLElement);\n let next: number | undefined;\n if (event.key === \"ArrowDown\") next = (index + 1) % nodes.length;\n if (event.key === \"ArrowUp\") next = (index - 1 + nodes.length) % nodes.length;\n if (event.key === \"Home\") next = 0;\n if (event.key === \"End\") next = nodes.length - 1;\n if (event.key === \"Escape\" || event.key === \"Tab\") { if (event.key === \"Tab\") restoreFocus.current = false; change(false); if (event.key === \"Escape\") event.preventDefault(); }\n if (event.key.length === 1 && !event.altKey && !event.ctrlKey && !event.metaKey && event.key !== \" \") {\n const result = resolveMenuTypeahead(\n items.filter(item => !item.disabled).map(item => ({\n textValue: item.textValue ?? (typeof item.label === \"string\" ? item.label : \"\"),\n })), index, event.key, search.current, Date.now(),\n );\n search.current = result.state;\n next = result.index;\n }\n if (next !== undefined && next >= 0) { event.preventDefault(); event.stopPropagation(); nodes[next]?.focus(); }\n };\n return <div ref={root} className=\"hjm-menu-morph\" data-open={open} style={layoutStyle} onKeyDownCapture={keyDown}>\n <Button ref={measure} tone=\"secondary\" trailing={chevron} className=\"hjm-menu-morph__measure\" aria-hidden=\"true\" tabIndex={-1} inert>{label}</Button>\n {/* Open toward following content; upstream defaults upward and can cover preceding values. */}\n <Bloom.Root direction=\"bottom\" open={open} onOpenChange={change} modal={false}>\n <Bloom.Container buttonSize={buttonSize} buttonRadius={radius.md} menuWidth={240} className=\"hjm-menu-morph__surface\">\n <Bloom.Trigger disabled={disabled} className=\"hjm-menu-morph__trigger\"><span className=\"hjm-button__label\">{label}</span>{chevron}</Bloom.Trigger>\n <Bloom.Content>\n {items.map(item => <button type=\"button\" role=\"menuitem\" tabIndex={-1} className=\"hjm-menu-morph__item\" key={item.id} disabled={!open || disabled || (item.disabled ?? false)}\n data-tone={item.tone} aria-label={item.textValue}\n onClick={() => { if (!disabled && !item.disabled) { change(false); onAction?.(item.id); } }}>\n {item.leading}{item.label}{item.trailing}\n </button>)}\n </Bloom.Content>\n </Bloom.Container>\n </Bloom.Root>\n </div>;\n}\n"]}
|
package/dist/overlays.d.ts
CHANGED
|
@@ -95,6 +95,8 @@ export type SheetProps = ModalOpenState<SheetOpenChangeDetails> & Readonly<{
|
|
|
95
95
|
modalPriority?: number;
|
|
96
96
|
portalContainer?: HTMLElement;
|
|
97
97
|
className?: string;
|
|
98
|
+
/** Visible × in the header. Off by default for bottom sheets, which close by dragging (2026-10-16). */
|
|
99
|
+
showClose?: boolean;
|
|
98
100
|
}>;
|
|
99
101
|
export declare const Sheet: import("react").ForwardRefExoticComponent<SheetProps & import("react").RefAttributes<HTMLDivElement>>;
|
|
100
102
|
export type TooltipProps = OpenState<TooltipOpenChangeDetails> & Readonly<{
|
package/dist/overlays.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"overlays.d.ts","sourceRoot":"","sources":["../src/overlays.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,4CAA4C,CAAC;AAIjF,OAAO,EAKL,KAAK,2BAA2B,EAChC,KAAK,kBAAkB,EAExB,MAAM,iDAAiD,CAAC;AACzD,OAAO,
|
|
1
|
+
{"version":3,"file":"overlays.d.ts","sourceRoot":"","sources":["../src/overlays.tsx"],"names":[],"mappings":"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"}
|
package/dist/overlays.js
CHANGED
|
@@ -3,7 +3,7 @@ import { useOverlayOriginMotion } from "./internal/overlay-origin-motion.js";
|
|
|
3
3
|
import { layer } from "@hjmds/design-contracts/foundations";
|
|
4
4
|
import { resolveMenuTypeahead } from "./menu-typeahead.js";
|
|
5
5
|
import { createAlertDialogSession, getAlertDialogInitialFocus, validateAlertDialogRequest, } from "@hjmds/design-contracts/components/alert-dialog";
|
|
6
|
-
import { createSheetLifecycle, resolveNextSheetDetent,
|
|
6
|
+
import { createSheetLifecycle, resolveNextSheetDetent, resolveSheetCloseButton, resolveSheetDismissPolicy, sheetDragRecipe, } from "@hjmds/design-contracts/components/sheet";
|
|
7
7
|
import { resolveTooltipDescriptor, tooltipBehaviorDefaults, } from "@hjmds/design-contracts/components/tooltip";
|
|
8
8
|
import { dialogRecipe, menuRecipe, sheetRecipe, tooltipRecipe, } from "@hjmds/design-contracts/recipes";
|
|
9
9
|
import { cloneElement, forwardRef, useCallback, useEffect, useId, useRef, useState, useSyncExternalStore, } from "react";
|
|
@@ -177,14 +177,22 @@ export const AlertDialog = forwardRef(function AlertDialog({ trigger, request, i
|
|
|
177
177
|
changeOpen(true, { reason: "trigger" });
|
|
178
178
|
}), open ? (_jsx(HjmPortal, { ...(portalContainer === undefined ? {} : { container: portalContainer }), children: _jsx("div", { className: "hjm-overlay", "data-kind": "alert-dialog", "data-modal-priority": modalPriority, "data-state": "open", style: { zIndex: modalLayer }, children: _jsxs("div", { ref: composeRefs(contentRef, forwardedRef), id: contentId, role: "alertdialog", "aria-modal": "true", "aria-labelledby": titleId, "aria-describedby": `${descriptionId}${error ? ` ${errorId}` : ""}`, "aria-busy": busy || undefined, tabIndex: -1, className: classNames("hjm-alert-dialog", className), "data-hjm-modal-content": "", "data-size": size, "data-tone": tone, "data-state": busy ? "busy" : error ? "error" : "idle", children: [icon ? _jsx("div", { className: "hjm-alert-dialog__icon", "aria-hidden": "true", children: icon }) : null, _jsx("h2", { id: titleId, className: "hjm-alert-dialog__title", children: request.title }), _jsx("p", { id: descriptionId, className: "hjm-alert-dialog__description", children: request.description }), error ? _jsx("p", { id: errorId, className: "hjm-alert-dialog__error", role: "alert", children: error }) : null, _jsxs("div", { className: "hjm-alert-dialog__actions", children: [request.mode === "confirm" ? (_jsx(Button, { ref: cancelRef, tone: "secondary", disabled: busy || closing, onClick: () => cancel("cancel-action"), children: request.cancelLabel })) : null, _jsx(Button, { ref: confirmRef, tone: tone === "danger" ? "danger" : "primary", loading: busy, disabled: closing, onClick: () => void confirm(), children: request.confirmLabel })] })] }) }) })) : null] }));
|
|
179
179
|
});
|
|
180
|
-
export const Sheet = forwardRef(function Sheet({ trigger, title, description, children, footer, placement = sheetRecipe.defaults.placement, size = sheetRecipe.defaults.size, detents, activeDetent, onDetentChange, detentLabels, busy = false, dismissPolicy, closeLabel, initialFocusRef, returnFocusRef, onDismissComplete, modalPriority = 0, portalContainer, open: openProp, defaultOpen, onOpenChange, className, }, forwardedRef) {
|
|
180
|
+
export const Sheet = forwardRef(function Sheet({ trigger, title, description, children, footer, placement = sheetRecipe.defaults.placement, size = sheetRecipe.defaults.size, detents, activeDetent, onDetentChange, detentLabels, busy = false, dismissPolicy, closeLabel, initialFocusRef, returnFocusRef, onDismissComplete, modalPriority = 0, portalContainer, open: openProp, defaultOpen, onOpenChange, className, showClose, }, forwardedRef) {
|
|
181
181
|
const modalLayer = getModalLayer(modalPriority);
|
|
182
182
|
const [open, changeOpen] = useOpenState({
|
|
183
183
|
...(openProp === undefined ? {} : { open: openProp }),
|
|
184
184
|
...(defaultOpen === undefined ? {} : { defaultOpen }),
|
|
185
185
|
...(onOpenChange === undefined ? {} : { onOpenChange }),
|
|
186
186
|
});
|
|
187
|
-
const policy =
|
|
187
|
+
const policy = resolveSheetDismissPolicy(placement, dismissPolicy);
|
|
188
|
+
const closeVisible = resolveSheetCloseButton(placement, showClose);
|
|
189
|
+
// Drag-to-dismiss (2026-10-16 user decision): handle and header follow the pointer downward and a
|
|
190
|
+
// release past the distance or velocity threshold closes with reason "swipe".
|
|
191
|
+
const showHandle = placement === "bottom" && policy.dismissible && policy.swipeDismiss;
|
|
192
|
+
const closeBlocked = busy && !policy.dismissWhileBusy;
|
|
193
|
+
const canSwipe = showHandle && !closeBlocked;
|
|
194
|
+
const dragRef = useRef(null);
|
|
195
|
+
const [dragY, setDragY] = useState(0);
|
|
188
196
|
const lifecycleRef = useRef(createSheetLifecycle(open));
|
|
189
197
|
const previousOpenRef = useRef(open);
|
|
190
198
|
const currentOpenRef = useRef(open);
|
|
@@ -263,14 +271,43 @@ export const Sheet = forwardRef(function Sheet({ trigger, title, description, ch
|
|
|
263
271
|
event.preventDefault();
|
|
264
272
|
requestClose("outside");
|
|
265
273
|
}
|
|
266
|
-
}, children: _jsxs("div", { ref: composeRefs(contentRef, forwardedRef), id: contentId, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, "aria-describedby": description ? descriptionId : undefined, "aria-busy": busy || undefined, tabIndex: -1, className: classNames("hjm-sheet", className), "data-hjm-modal-content": "", "data-placement": placement, "data-detent": activeDetent ?? (size === "auto" ? undefined : size), "data-has-footer": footer ? true : undefined, "data-state": busy ? "busy" : "idle",
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
+
}, children: _jsxs("div", { ref: composeRefs(contentRef, forwardedRef), id: contentId, role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, "aria-describedby": description ? descriptionId : undefined, "aria-busy": busy || undefined, tabIndex: -1, className: classNames("hjm-sheet", className), "data-hjm-modal-content": "", "data-placement": placement, "data-detent": activeDetent ?? (size === "auto" ? undefined : size), "data-has-footer": footer ? true : undefined, "data-state": busy ? "busy" : "idle", "data-dragging": dragY > 0 || undefined, style: dragY > 0 ? { transform: `translateY(${dragY}px)` } : undefined, children: [_jsxs("div", { className: "hjm-sheet__drag", "data-swipe": canSwipe || undefined, onPointerDown: (event) => {
|
|
275
|
+
if (!canSwipe || event.button !== 0 || event.target.closest("a,input,textarea,select,.hjm-dialog__close"))
|
|
276
|
+
return;
|
|
277
|
+
dragRef.current = { pointerId: event.pointerId, y: event.clientY, t: event.timeStamp, moved: false };
|
|
278
|
+
}, onPointerMove: (event) => {
|
|
279
|
+
const drag = dragRef.current;
|
|
280
|
+
if (!drag || drag.pointerId !== event.pointerId)
|
|
281
|
+
return;
|
|
282
|
+
const dy = event.clientY - drag.y;
|
|
283
|
+
if (!drag.moved && dy < sheetDragRecipe.activationDistance)
|
|
284
|
+
return;
|
|
285
|
+
if (!drag.moved) {
|
|
286
|
+
drag.moved = true;
|
|
287
|
+
event.currentTarget.setPointerCapture(event.pointerId);
|
|
288
|
+
}
|
|
289
|
+
setDragY(Math.max(0, dy));
|
|
290
|
+
}, onPointerUp: (event) => {
|
|
291
|
+
const drag = dragRef.current;
|
|
292
|
+
dragRef.current = null;
|
|
293
|
+
if (!drag || drag.pointerId !== event.pointerId || !drag.moved)
|
|
294
|
+
return;
|
|
295
|
+
const dy = event.clientY - drag.y;
|
|
296
|
+
const velocity = dy / Math.max(1, event.timeStamp - drag.t);
|
|
297
|
+
const height = contentRef.current?.getBoundingClientRect().height ?? 0;
|
|
298
|
+
setDragY(0);
|
|
299
|
+
if (dy > height * sheetDragRecipe.dismissDistanceRatio || velocity > sheetDragRecipe.dismissVelocity)
|
|
300
|
+
requestClose("swipe");
|
|
301
|
+
}, onPointerCancel: () => { dragRef.current = null; setDragY(0); }, children: [detents && detentLabels && activeDetent ? (_jsx("div", { className: "hjm-sheet__handle-row", children: _jsx("button", { type: "button", className: "hjm-sheet__handle", "aria-label": resolveNextSheetDetent(detents, activeDetent, "expand") === null
|
|
302
|
+
? detentLabels.collapse
|
|
303
|
+
: detentLabels.expand, onClick: () => {
|
|
304
|
+
const expand = resolveNextSheetDetent(detents, activeDetent, "expand");
|
|
305
|
+
const next = expand ?? resolveNextSheetDetent(detents, activeDetent, "collapse");
|
|
306
|
+
if (next !== null)
|
|
307
|
+
onDetentChange?.(next);
|
|
308
|
+
}, children: _jsx("span", { "aria-hidden": "true", className: "hjm-sheet__handle-bar" }) }) })) : showHandle ? (
|
|
309
|
+
// Without detents the handle is the visible close control for keyboard and switch users.
|
|
310
|
+
_jsx("div", { className: "hjm-sheet__handle-row", children: _jsx("button", { type: "button", className: "hjm-sheet__handle", "aria-label": closeLabel, disabled: closeBlocked, onClick: () => requestClose("close-action"), children: _jsx("span", { "aria-hidden": "true", className: "hjm-sheet__handle-bar" }) }) })) : null, _jsxs("header", { className: "hjm-sheet__header", children: [_jsxs("div", { children: [_jsx("h2", { id: titleId, className: "hjm-sheet__title", children: title }), description ? _jsx("p", { id: descriptionId, className: "hjm-sheet__description", children: description }) : null] }), policy.dismissible && closeVisible ? (_jsx("button", { type: "button", className: "hjm-dialog__close", "aria-label": closeLabel, disabled: busy && !policy.dismissWhileBusy, onClick: () => requestClose("close-action"), children: "\u00D7" })) : null] })] }), children ? _jsx("div", { className: "hjm-sheet__body", children: children }) : null, footer ? _jsx("footer", { className: "hjm-sheet__footer", children: footer }) : null] }) }) })) : null] }));
|
|
274
311
|
});
|
|
275
312
|
export const Tooltip = forwardRef(function Tooltip({ trigger, content, placement, align, pointerOpenDelayMs = tooltipBehaviorDefaults.pointerOpenDelayMs, focusOpenDelayMs = tooltipBehaviorDefaults.focusOpenDelayMs, portalContainer, open: openProp, defaultOpen, onOpenChange, className, layoutStyle, }, ref) {
|
|
276
313
|
const descriptor = resolveTooltipDescriptor({
|