@lablup/ui-common 0.1.0-alpha.11 → 0.1.0-alpha.12

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.
@@ -58,6 +58,7 @@ function s({ isOpen: s, onClose: c, title: l, subtitle: u, width: d = "medium",
58
58
  onClick: I,
59
59
  role: "presentation",
60
60
  "aria-hidden": !s,
61
+ inert: !s,
61
62
  children: /* @__PURE__ */ a("aside", {
62
63
  ref: b,
63
64
  className: `drawer ${M ? "drawer--open" : ""} ${x ? "drawer--shaking" : ""} ${m}`,
@@ -1 +1 @@
1
- {"version":3,"file":"Drawer2.js","names":[],"sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["/**\n * Drawer Component\n *\n * A reusable right-side drawer panel with backdrop, animations, and accessibility features.\n * Consolidates common patterns from all drawer implementations.\n */\n\nimport { useEffect, useRef, useCallback, useState } from \"react\";\nimport \"./Drawer.css\";\n\nexport interface DrawerProps {\n /** Whether the drawer is open */\n isOpen: boolean;\n /** Callback when drawer should close */\n onClose: () => void;\n /** Drawer title */\n title: React.ReactNode;\n /** Optional subtitle */\n subtitle?: React.ReactNode;\n /** Drawer width preset or custom CSS width value */\n width?: \"narrow\" | \"medium\" | \"wide\" | (string & Record<never, never>);\n /** Drawer content */\n children: React.ReactNode;\n /** Optional footer content */\n footer?: React.ReactNode;\n /** Additional CSS class for drawer panel */\n className?: string;\n /** ARIA labelledby ID (defaults to internal title ID) */\n ariaLabelledBy?: string;\n /** ARIA describedby ID (defaults to internal subtitle ID if subtitle exists) */\n ariaDescribedBy?: string;\n /** Accessible label for the close button. Default: \"Close\" */\n closeLabel?: string;\n /**\n * Refuse dismissal by Escape or a backdrop click, shaking the panel instead.\n * The close button and any footer control still call `onClose` directly, so\n * route those through the same guard when they also need confirming.\n */\n preventDismiss?: boolean;\n /**\n * Called when `preventDismiss` blocked a dismissal, so the consumer can offer\n * an explicit way out (a discard confirmation, for instance).\n */\n onDismissAttempt?: () => void;\n}\n\nconst WIDTH_PRESETS = {\n narrow: \"400px\",\n medium: \"520px\",\n wide: \"900px\",\n};\n\nexport function Drawer({\n isOpen,\n onClose,\n title,\n subtitle,\n width = \"medium\",\n children,\n footer,\n className = \"\",\n ariaLabelledBy,\n ariaDescribedBy,\n closeLabel = \"Close\",\n preventDismiss = false,\n onDismissAttempt,\n}: DrawerProps) {\n const drawerRef = useRef<HTMLDivElement>(null);\n\n const [isShaking, setIsShaking] = useState(false);\n\n // Read the guard through refs so `blockDismiss` keeps a stable identity. The\n // focus-management effect depends on it, and if the identity changed the\n // moment the consumer marks the drawer dirty, that effect would re-run on the\n // first keystroke and steal focus from the field being typed into.\n const preventDismissRef = useRef(preventDismiss);\n preventDismissRef.current = preventDismiss;\n const onDismissAttemptRef = useRef(onDismissAttempt);\n onDismissAttemptRef.current = onDismissAttempt;\n\n /** Blocks a dismissal when the guard is on. Returns whether it blocked. */\n const blockDismiss = useCallback(() => {\n if (!preventDismissRef.current) return false;\n setIsShaking(true);\n onDismissAttemptRef.current?.();\n return true;\n }, []);\n\n // Guarded on the animation name so an unrelated animation on the panel does\n // not clear the flag early.\n const handleAnimationEnd = useCallback((e: React.AnimationEvent) => {\n if (e.animationName === \"drawer-shake\") setIsShaking(false);\n }, []);\n const previousActiveElementRef = useRef<HTMLElement | null>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n\n // Track if this is the first render to enable animation on initial open\n // Without this, when the component mounts with isOpen=true, there's no\n // transition because CSS transitions only apply to state changes, not initial renders.\n const [shouldAnimate, setShouldAnimate] = useState(false);\n const hasInitialized = useRef(false);\n\n useEffect(() => {\n if (isOpen && !hasInitialized.current) {\n // First time opening - delay adding open class to trigger animation\n hasInitialized.current = true;\n // Use double rAF to ensure the closed state is painted first\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n setShouldAnimate(true);\n });\n });\n } else if (isOpen) {\n setShouldAnimate(true);\n } else {\n setShouldAnimate(false);\n }\n }, [isOpen]);\n\n // Compute the actual open state for CSS classes\n const isVisuallyOpen = isOpen && shouldAnimate;\n\n // Compute width value\n const widthValue =\n width in WIDTH_PRESETS ? WIDTH_PRESETS[width as keyof typeof WIDTH_PRESETS] : width;\n\n // Internal IDs for ARIA\n const titleId = ariaLabelledBy || \"drawer-title\";\n const subtitleId = ariaDescribedBy || (subtitle ? \"drawer-subtitle\" : undefined);\n\n // Focus management and trap\n useEffect(() => {\n if (!isOpen) return;\n\n // Store previously focused element\n previousActiveElementRef.current = document.activeElement as HTMLElement;\n\n const drawer = drawerRef.current;\n if (!drawer) return;\n\n // Focus close button when drawer opens\n requestAnimationFrame(() => {\n closeButtonRef.current?.focus();\n });\n\n // Setup focus trap\n const focusableElements = drawer.querySelectorAll<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n );\n\n const firstFocusable = focusableElements[0];\n const lastFocusable = focusableElements[focusableElements.length - 1];\n\n const handleKeyDown = (e: KeyboardEvent) => {\n // Escape to close, unless the guard blocks it\n if (e.key === \"Escape\") {\n if (blockDismiss()) return;\n onClose();\n return;\n }\n\n // Tab key focus trap\n if (e.key === \"Tab\") {\n if (e.shiftKey) {\n // Shift + Tab\n if (document.activeElement === firstFocusable) {\n e.preventDefault();\n lastFocusable?.focus();\n }\n } else {\n // Tab\n if (document.activeElement === lastFocusable) {\n e.preventDefault();\n firstFocusable?.focus();\n }\n }\n }\n };\n\n drawer.addEventListener(\"keydown\", handleKeyDown);\n\n return () => {\n drawer.removeEventListener(\"keydown\", handleKeyDown);\n // Restore focus when drawer closes\n if (previousActiveElementRef.current) {\n previousActiveElementRef.current.focus();\n }\n };\n }, [isOpen, onClose, blockDismiss]);\n\n // Handle backdrop click\n const handleBackdropClick = useCallback(\n (e: React.MouseEvent) => {\n if (e.target === e.currentTarget) {\n if (blockDismiss()) return;\n onClose();\n }\n },\n [onClose, blockDismiss],\n );\n\n return (\n <div\n className={`drawer__backdrop ${isVisuallyOpen ? \"drawer__backdrop--open\" : \"\"}`}\n onClick={handleBackdropClick}\n role=\"presentation\"\n aria-hidden={!isOpen}\n >\n <aside\n ref={drawerRef}\n className={`drawer ${isVisuallyOpen ? \"drawer--open\" : \"\"} ${\n isShaking ? \"drawer--shaking\" : \"\"\n } ${className}`}\n style={{ width: widthValue, maxWidth: \"100vw\" }}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={titleId}\n aria-describedby={subtitleId}\n onAnimationEnd={handleAnimationEnd}\n >\n {/* Header */}\n <header className=\"drawer__header\">\n <div className=\"drawer__title-row\">\n <h2 id={titleId} className=\"drawer__title\">\n {title}\n </h2>\n <button\n ref={closeButtonRef}\n type=\"button\"\n className=\"drawer__close-btn\"\n onClick={onClose}\n aria-label={closeLabel}\n >\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M18 6L6 18\" />\n <path d=\"M6 6l12 12\" />\n </svg>\n </button>\n </div>\n {subtitle && (\n <p id={subtitleId} className=\"drawer__subtitle\">\n {subtitle}\n </p>\n )}\n </header>\n\n {/* Content */}\n <div className=\"drawer__content\">{children}</div>\n\n {/* Footer */}\n {footer && <footer className=\"drawer__footer\">{footer}</footer>}\n </aside>\n </div>\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"Drawer2.js","names":[],"sources":["../../../src/components/Drawer/Drawer.tsx"],"sourcesContent":["/**\n * Drawer Component\n *\n * A reusable right-side drawer panel with backdrop, animations, and accessibility features.\n * Consolidates common patterns from all drawer implementations.\n */\n\nimport { useEffect, useRef, useCallback, useState } from \"react\";\nimport \"./Drawer.css\";\n\nexport interface DrawerProps {\n /** Whether the drawer is open */\n isOpen: boolean;\n /** Callback when drawer should close */\n onClose: () => void;\n /** Drawer title */\n title: React.ReactNode;\n /** Optional subtitle */\n subtitle?: React.ReactNode;\n /** Drawer width preset or custom CSS width value */\n width?: \"narrow\" | \"medium\" | \"wide\" | (string & Record<never, never>);\n /** Drawer content */\n children: React.ReactNode;\n /** Optional footer content */\n footer?: React.ReactNode;\n /** Additional CSS class for drawer panel */\n className?: string;\n /** ARIA labelledby ID (defaults to internal title ID) */\n ariaLabelledBy?: string;\n /** ARIA describedby ID (defaults to internal subtitle ID if subtitle exists) */\n ariaDescribedBy?: string;\n /** Accessible label for the close button. Default: \"Close\" */\n closeLabel?: string;\n /**\n * Refuse dismissal by Escape or a backdrop click, shaking the panel instead.\n * The close button and any footer control still call `onClose` directly, so\n * route those through the same guard when they also need confirming.\n */\n preventDismiss?: boolean;\n /**\n * Called when `preventDismiss` blocked a dismissal, so the consumer can offer\n * an explicit way out (a discard confirmation, for instance).\n */\n onDismissAttempt?: () => void;\n}\n\nconst WIDTH_PRESETS = {\n narrow: \"400px\",\n medium: \"520px\",\n wide: \"900px\",\n};\n\nexport function Drawer({\n isOpen,\n onClose,\n title,\n subtitle,\n width = \"medium\",\n children,\n footer,\n className = \"\",\n ariaLabelledBy,\n ariaDescribedBy,\n closeLabel = \"Close\",\n preventDismiss = false,\n onDismissAttempt,\n}: DrawerProps) {\n const drawerRef = useRef<HTMLDivElement>(null);\n\n const [isShaking, setIsShaking] = useState(false);\n\n // Read the guard through refs so `blockDismiss` keeps a stable identity. The\n // focus-management effect depends on it, and if the identity changed the\n // moment the consumer marks the drawer dirty, that effect would re-run on the\n // first keystroke and steal focus from the field being typed into.\n const preventDismissRef = useRef(preventDismiss);\n preventDismissRef.current = preventDismiss;\n const onDismissAttemptRef = useRef(onDismissAttempt);\n onDismissAttemptRef.current = onDismissAttempt;\n\n /** Blocks a dismissal when the guard is on. Returns whether it blocked. */\n const blockDismiss = useCallback(() => {\n if (!preventDismissRef.current) return false;\n setIsShaking(true);\n onDismissAttemptRef.current?.();\n return true;\n }, []);\n\n // Guarded on the animation name so an unrelated animation on the panel does\n // not clear the flag early.\n const handleAnimationEnd = useCallback((e: React.AnimationEvent) => {\n if (e.animationName === \"drawer-shake\") setIsShaking(false);\n }, []);\n const previousActiveElementRef = useRef<HTMLElement | null>(null);\n const closeButtonRef = useRef<HTMLButtonElement>(null);\n\n // Track if this is the first render to enable animation on initial open\n // Without this, when the component mounts with isOpen=true, there's no\n // transition because CSS transitions only apply to state changes, not initial renders.\n const [shouldAnimate, setShouldAnimate] = useState(false);\n const hasInitialized = useRef(false);\n\n useEffect(() => {\n if (isOpen && !hasInitialized.current) {\n // First time opening - delay adding open class to trigger animation\n hasInitialized.current = true;\n // Use double rAF to ensure the closed state is painted first\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n setShouldAnimate(true);\n });\n });\n } else if (isOpen) {\n setShouldAnimate(true);\n } else {\n setShouldAnimate(false);\n }\n }, [isOpen]);\n\n // Compute the actual open state for CSS classes\n const isVisuallyOpen = isOpen && shouldAnimate;\n\n // Compute width value\n const widthValue =\n width in WIDTH_PRESETS ? WIDTH_PRESETS[width as keyof typeof WIDTH_PRESETS] : width;\n\n // Internal IDs for ARIA\n const titleId = ariaLabelledBy || \"drawer-title\";\n const subtitleId = ariaDescribedBy || (subtitle ? \"drawer-subtitle\" : undefined);\n\n // Focus management and trap\n useEffect(() => {\n if (!isOpen) return;\n\n // Store previously focused element\n previousActiveElementRef.current = document.activeElement as HTMLElement;\n\n const drawer = drawerRef.current;\n if (!drawer) return;\n\n // Focus close button when drawer opens\n requestAnimationFrame(() => {\n closeButtonRef.current?.focus();\n });\n\n // Setup focus trap\n const focusableElements = drawer.querySelectorAll<HTMLElement>(\n 'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])',\n );\n\n const firstFocusable = focusableElements[0];\n const lastFocusable = focusableElements[focusableElements.length - 1];\n\n const handleKeyDown = (e: KeyboardEvent) => {\n // Escape to close, unless the guard blocks it\n if (e.key === \"Escape\") {\n if (blockDismiss()) return;\n onClose();\n return;\n }\n\n // Tab key focus trap\n if (e.key === \"Tab\") {\n if (e.shiftKey) {\n // Shift + Tab\n if (document.activeElement === firstFocusable) {\n e.preventDefault();\n lastFocusable?.focus();\n }\n } else {\n // Tab\n if (document.activeElement === lastFocusable) {\n e.preventDefault();\n firstFocusable?.focus();\n }\n }\n }\n };\n\n drawer.addEventListener(\"keydown\", handleKeyDown);\n\n return () => {\n drawer.removeEventListener(\"keydown\", handleKeyDown);\n // Restore focus when drawer closes\n if (previousActiveElementRef.current) {\n previousActiveElementRef.current.focus();\n }\n };\n }, [isOpen, onClose, blockDismiss]);\n\n // Handle backdrop click\n const handleBackdropClick = useCallback(\n (e: React.MouseEvent) => {\n if (e.target === e.currentTarget) {\n if (blockDismiss()) return;\n onClose();\n }\n },\n [onClose, blockDismiss],\n );\n\n return (\n <div\n className={`drawer__backdrop ${isVisuallyOpen ? \"drawer__backdrop--open\" : \"\"}`}\n onClick={handleBackdropClick}\n role=\"presentation\"\n aria-hidden={!isOpen}\n // `aria-hidden` takes the closed drawer out of the accessibility tree but\n // leaves its focusable children in the tab sequence, so a keyboard user\n // tabs into an invisible form. `inert` removes both.\n inert={!isOpen}\n >\n <aside\n ref={drawerRef}\n className={`drawer ${isVisuallyOpen ? \"drawer--open\" : \"\"} ${\n isShaking ? \"drawer--shaking\" : \"\"\n } ${className}`}\n style={{ width: widthValue, maxWidth: \"100vw\" }}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={titleId}\n aria-describedby={subtitleId}\n onAnimationEnd={handleAnimationEnd}\n >\n {/* Header */}\n <header className=\"drawer__header\">\n <div className=\"drawer__title-row\">\n <h2 id={titleId} className=\"drawer__title\">\n {title}\n </h2>\n <button\n ref={closeButtonRef}\n type=\"button\"\n className=\"drawer__close-btn\"\n onClick={onClose}\n aria-label={closeLabel}\n >\n <svg\n width=\"20\"\n height=\"20\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M18 6L6 18\" />\n <path d=\"M6 6l12 12\" />\n </svg>\n </button>\n </div>\n {subtitle && (\n <p id={subtitleId} className=\"drawer__subtitle\">\n {subtitle}\n </p>\n )}\n </header>\n\n {/* Content */}\n <div className=\"drawer__content\">{children}</div>\n\n {/* Footer */}\n {footer && <footer className=\"drawer__footer\">{footer}</footer>}\n </aside>\n </div>\n );\n}\n"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lablup/ui-common",
3
- "version": "0.1.0-alpha.11",
3
+ "version": "0.1.0-alpha.12",
4
4
  "description": "Shared, product-neutral UI components and design tokens for Lablup products",
5
5
  "license": "Apache-2.0",
6
6
  "author": "Lablup Inc.",