npm - @gnome-ui/react - Versions diffs - 1.49.0 → 1.49.1 - Mend

@gnome-ui/react 1.49.0 → 1.49.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.

Files changed (343) hide show

package/dist/components/InlineViewSwitcher/InlineViewSwitcher.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InlineViewSwitcher.js","names":[],"sources":["../../../src/components/InlineViewSwitcher/InlineViewSwitcher.tsx"],"sourcesContent":["import {\n Children,\n type CSSProperties,\n createContext,\n type HTMLAttributes,\n isValidElement,\n type KeyboardEvent,\n type ReactElement,\n type ReactNode,\n useContext,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { BottomSheet } from '../BottomSheet';\nimport { Icon } from '../Icon';\n\nimport styles from './InlineViewSwitcher.module.css';\nimport type { InlineViewSwitcherItemProps } from './InlineViewSwitcherItem';\n\nexport type InlineViewSwitcherVariant = 'default' \| 'flat' \| 'round' \| 'pill';\n\nexport type InlineViewSwitcherOverflow = 'wrap' \| 'scroll' \| 'compact' \| 'menu';\n\n// ─── Internal context ──────────────────────────────────────────────────────────\n\ninterface InlineViewSwitcherContextValue {\n value: string;\n onValueChange: (value: string) => void;\n compact: boolean;\n}\n\nconst InlineViewSwitcherContext = createContext<InlineViewSwitcherContextValue \| null>(null);\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useInlineViewSwitcher() {\n const ctx = useContext(InlineViewSwitcherContext);\n\n if (!ctx) {\n throw new Error('InlineViewSwitcherItem must be used inside InlineViewSwitcher');\n }\n\n return ctx;\n}\n\n// ─── InlineViewSwitcher ────────────────────────────────────────────────────────\n\nexport interface InlineViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n /** Currently active view name. /\n value: string;\n /* Called with the new value when a view is selected. /\n onValueChange: (value: string) => void;\n /\n Visual style of the switcher.\n * - `default` — card background with border and shadow (same as `ToggleGroup`).\n * - `flat` — no background or border; active indicator only.\n * - `round` — pill-shaped container and items.\n * - `pill` — segmented-control style; active item appears lifted, no accent color.\n /\n variant?: InlineViewSwitcherVariant;\n /\n Overflow strategy when the container is too narrow for all items.\n * - `wrap` — default; items overflow with no special handling.\n * - `scroll` — horizontal scroll with hidden scrollbar.\n * - `compact` — collapses item labels to icons-only when overflowing (requires icons on all items).\n * - `menu` — shows the active item and a chevron trigger; all items open in a BottomSheet.\n /\n overflow?: InlineViewSwitcherOverflow;\n /* Accessible label for the group. /\n 'aria-label'?: string;\n children?: ReactNode;\n}\n\n/\n Compact inline view switcher for placing inside content areas, cards, or\n * toolbars — wherever `ViewSwitcher` (header-bar sized) would be too heavy.\n \n Built on `ToggleGroup` internals with `flat` and `round` style variants.\n * Mirrors `AdwInlineViewSwitcher` (libadwaita 1.7 / GNOME 48).\n \n Compose with `InlineViewSwitcherItem`. Keyboard: ← / → cycle, Home / End jump.\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.InlineViewSwitcher.html\n */\nexport const InlineViewSwitcher = ({\n value,\n onValueChange,\n variant = 'default',\n overflow = 'wrap',\n 'aria-label': ariaLabel = 'View switcher',\n children,\n className,\n ...props\n}: InlineViewSwitcherProps) => {\n const groupRef = useRef<HTMLDivElement>(null);\n const naturalWidthRef = useRef<number>(0);\n const [isOverflowing, setIsOverflowing] = useState(false);\n const [sheetOpen, setSheetOpen] = useState(false);\n const [indicatorStyle, setIndicatorStyle] = useState<CSSProperties>({\n width: 0,\n transform: 'translateX(0)',\n });\n\n useEffect(() => {\n if (overflow !== 'compact' && overflow !== 'menu') {\n setIsOverflowing(false);\n return;\n }\n const el = groupRef.current;\n if (!el) {\n return;\n }\n\n const check = () => {\n setIsOverflowing((prev) => {\n if (!prev) {\n const scrollW = el.scrollWidth;\n if (scrollW > el.clientWidth) {\n naturalWidthRef.current = scrollW;\n return true;\n }\n return false;\n }\n // 30px hysteresis: stay collapsed until container is comfortably wider\n return naturalWidthRef.current > el.clientWidth + 30;\n });\n };\n\n const ro = new ResizeObserver(check);\n ro.observe(el);\n return () => ro.disconnect();\n }, [overflow]);\n\n const allItems = Children.toArray(children)\n .filter(isValidElement)\n .filter(\n (child) => (child.type as { displayName?: string }).displayName === 'InlineViewSwitcherItem',\n )\n .map((child) => (child as ReactElement<InlineViewSwitcherItemProps>).props);\n\n const activeItem = allItems.find((i) => i.name === value) ?? allItems[0];\n const compact = overflow === 'compact' && isOverflowing;\n const inMenuMode = overflow === 'menu' && isOverflowing;\n\n // Track active item position for the sliding indicator\n useLayoutEffect(() => {\n if (inMenuMode) {\n return;\n }\n const group = groupRef.current;\n if (!group) {\n return;\n }\n const activeEl = group.querySelector<HTMLElement>('[aria-checked=\"true\"]');\n if (!activeEl) {\n return;\n }\n\n setIndicatorStyle({\n width: activeEl.offsetWidth,\n transform: `translateX(${activeEl.offsetLeft}px)`,\n });\n }, [value, inMenuMode, compact]);\n\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const items = Array.from(\n groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n );\n const activeElement = document.activeElement;\n const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n if (idx === -1) {\n return;\n }\n\n let next = idx;\n if (e.key === 'ArrowRight' \|\| e.key === 'ArrowDown') {\n next = (idx + 1) % items.length;\n } else if (e.key === 'ArrowLeft' \|\| e.key === 'ArrowUp') {\n next = (idx - 1 + items.length) % items.length;\n } else if (e.key === 'Home') {\n next = 0;\n } else if (e.key === 'End') {\n next = items.length - 1;\n } else {\n return;\n }\n\n e.preventDefault();\n items[next].focus();\n items[next].click();\n }\n\n return (\n <InlineViewSwitcherContext.Provider value={{ value, onValueChange, compact }}>\n <div\n ref={groupRef}\n role={inMenuMode ? undefined : 'radiogroup'}\n aria-label={ariaLabel}\n onKeyDown={handleKeyDown}\n className={[\n styles.switcher,\n styles[variant],\n overflow === 'scroll' ? styles.overflowScroll : null,\n overflow === 'compact' \|\| overflow === 'menu' ? styles.overflowDetect : null,\n compact ? styles.compact : null,\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n {...props}\n >\n {!inMenuMode && <span className={styles.indicator} style={indicatorStyle} aria-hidden />}\n {inMenuMode ? (\n <>\n <button\n type=\"button\"\n className={[styles.item, styles.active, styles.menuTrigger].filter(Boolean).join(' ')}\n onClick={() => setSheetOpen(true)}\n aria-haspopup=\"dialog\"\n aria-label={`${ariaLabel}: ${activeItem?.label ?? activeItem?.name}`}\n >\n {activeItem?.icon && (\n <span className={styles.itemIcon}>\n <Icon icon={activeItem.icon} size=\"md\" aria-hidden />\n </span>\n )}\n {activeItem?.label && <span className={styles.itemLabel}>{activeItem.label}</span>}\n <span className={styles.menuChevron} aria-hidden=\"true\">\n ▾\n </span>\n </button>\n <BottomSheet open={sheetOpen} title={ariaLabel} onClose={() => setSheetOpen(false)}>\n <div className={styles.menuList} role=\"radiogroup\" aria-label={ariaLabel}>\n {allItems.map((item) => (\n <button\n key={item.name}\n type=\"button\"\n role=\"radio\"\n aria-checked={item.name === value}\n className={[\n styles.menuListItem,\n item.name === value ? styles.menuListItemActive : null,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={() => {\n onValueChange(item.name);\n setSheetOpen(false);\n }}\n >\n {item.icon && (\n <span className={styles.menuListItemIcon}>\n <Icon icon={item.icon} size=\"md\" aria-hidden />\n </span>\n )}\n <span className={styles.menuListItemLabel}>{item.label ?? item.name}</span>\n {item.name === value && (\n <span className={styles.menuListItemCheck} aria-hidden=\"true\">\n ✓\n </span>\n )}\n </button>\n ))}\n </div>\n </BottomSheet>\n </>\n ) : (\n children\n )}\n </div>\n </InlineViewSwitcherContext.Provider>\n );\n};\n"],"mappings":"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"}
1	+ {"version":3,"file":"InlineViewSwitcher.js","names":[],"sources":["../../../src/components/InlineViewSwitcher/InlineViewSwitcher.tsx"],"sourcesContent":["import {\n Children,\n type CSSProperties,\n createContext,\n type HTMLAttributes,\n isValidElement,\n type KeyboardEvent,\n type ReactElement,\n type ReactNode,\n useContext,\n useEffect,\n useLayoutEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { BottomSheet } from '../BottomSheet';\nimport { Icon } from '../Icon';\n\nimport styles from './InlineViewSwitcher.module.css';\nimport type { InlineViewSwitcherItemProps } from './InlineViewSwitcherItem';\n\nexport type InlineViewSwitcherVariant = 'default' \| 'flat' \| 'round' \| 'pill';\n\nexport type InlineViewSwitcherOverflow = 'wrap' \| 'scroll' \| 'compact' \| 'menu';\n\n// ─── Internal context ──────────────────────────────────────────────────────────\n\ninterface InlineViewSwitcherContextValue {\n value: string;\n onValueChange: (value: string) => void;\n compact: boolean;\n}\n\nconst InlineViewSwitcherContext = createContext<InlineViewSwitcherContextValue \| null>(null);\n\n// eslint-disable-next-line react-refresh/only-export-components\nexport function useInlineViewSwitcher() {\n const ctx = useContext(InlineViewSwitcherContext);\n\n if (!ctx) {\n throw new Error('InlineViewSwitcherItem must be used inside InlineViewSwitcher');\n }\n\n return ctx;\n}\n\n// ─── InlineViewSwitcher ────────────────────────────────────────────────────────\n\nexport interface InlineViewSwitcherProps extends HTMLAttributes<HTMLDivElement> {\n /** Currently active view name. /\n value: string;\n /* Called with the new value when a view is selected. /\n onValueChange: (value: string) => void;\n /\n Visual style of the switcher.\n * - `default` — card background with border and shadow (same as `ToggleGroup`).\n * - `flat` — no background or border; active indicator only.\n * - `round` — pill-shaped container and items.\n * - `pill` — segmented-control style; active item appears lifted, no accent color.\n /\n variant?: InlineViewSwitcherVariant;\n /\n Overflow strategy when the container is too narrow for all items.\n * - `wrap` — default; items overflow with no special handling.\n * - `scroll` — horizontal scroll with hidden scrollbar.\n * - `compact` — collapses item labels to icons-only when overflowing (requires icons on all items).\n * - `menu` — shows the active item and a chevron trigger; all items open in a BottomSheet.\n /\n overflow?: InlineViewSwitcherOverflow;\n /* Accessible label for the group. /\n 'aria-label'?: string;\n children?: ReactNode;\n}\n\n/\n Compact inline view switcher for placing inside content areas, cards, or\n * toolbars — wherever `ViewSwitcher` (header-bar sized) would be too heavy.\n \n Built on `ToggleGroup` internals with `flat` and `round` style variants.\n * Mirrors `AdwInlineViewSwitcher` (libadwaita 1.7 / GNOME 48).\n \n Compose with `InlineViewSwitcherItem`. Keyboard: ← / → cycle, Home / End jump.\n \n @see https://gnome.pages.gitlab.gnome.org/libadwaita/doc/main/class.InlineViewSwitcher.html\n */\nexport const InlineViewSwitcher = ({\n value,\n onValueChange,\n variant = 'default',\n overflow = 'wrap',\n 'aria-label': ariaLabel = 'View switcher',\n children,\n className,\n ...props\n}: InlineViewSwitcherProps) => {\n const groupRef = useRef<HTMLDivElement>(null);\n const naturalWidthRef = useRef<number>(0);\n const [isOverflowing, setIsOverflowing] = useState(false);\n const [sheetOpen, setSheetOpen] = useState(false);\n const [indicatorStyle, setIndicatorStyle] = useState<CSSProperties>({\n width: 0,\n transform: 'translateX(0)',\n });\n\n useEffect(() => {\n if (overflow !== 'compact' && overflow !== 'menu') {\n setIsOverflowing(false);\n return;\n }\n const el = groupRef.current;\n if (!el) {\n return;\n }\n\n const check = () => {\n setIsOverflowing((prev) => {\n if (!prev) {\n const scrollW = el.scrollWidth;\n if (scrollW > el.clientWidth) {\n naturalWidthRef.current = scrollW;\n return true;\n }\n return false;\n }\n // 30px hysteresis: stay collapsed until container is comfortably wider\n return naturalWidthRef.current > el.clientWidth + 30;\n });\n };\n\n const ro = new ResizeObserver(check);\n ro.observe(el);\n return () => ro.disconnect();\n }, [overflow]);\n\n const allItems = Children.toArray(children)\n .filter(isValidElement)\n .filter(\n (child) => (child.type as { displayName?: string }).displayName === 'InlineViewSwitcherItem',\n )\n .map((child) => (child as ReactElement<InlineViewSwitcherItemProps>).props);\n\n const activeItem = allItems.find((i) => i.name === value) ?? allItems[0];\n const compact = overflow === 'compact' && isOverflowing;\n const inMenuMode = overflow === 'menu' && isOverflowing;\n\n // Track active item position for the sliding indicator\n useLayoutEffect(() => {\n if (inMenuMode) {\n return;\n }\n const group = groupRef.current;\n if (!group) {\n return;\n }\n const activeEl = group.querySelector<HTMLElement>('[aria-checked=\"true\"]');\n if (!activeEl) {\n return;\n }\n\n setIndicatorStyle({\n width: activeEl.offsetWidth,\n transform: `translateX(${activeEl.offsetLeft}px)`,\n });\n }, [value, inMenuMode, compact]);\n\n function handleKeyDown(e: KeyboardEvent<HTMLDivElement>) {\n const items = Array.from(\n groupRef.current?.querySelectorAll<HTMLButtonElement>('[role=radio]:not(:disabled)') ?? [],\n );\n const { activeElement } = document;\n const idx = activeElement instanceof HTMLButtonElement ? items.indexOf(activeElement) : -1;\n\n if (idx === -1) {\n return;\n }\n\n let next = idx;\n if (e.key === 'ArrowRight' \|\| e.key === 'ArrowDown') {\n next = (idx + 1) % items.length;\n } else if (e.key === 'ArrowLeft' \|\| e.key === 'ArrowUp') {\n next = (idx - 1 + items.length) % items.length;\n } else if (e.key === 'Home') {\n next = 0;\n } else if (e.key === 'End') {\n next = items.length - 1;\n } else {\n return;\n }\n\n e.preventDefault();\n items[next].focus();\n items[next].click();\n }\n\n return (\n <InlineViewSwitcherContext.Provider value={{ value, onValueChange, compact }}>\n <div\n ref={groupRef}\n role={inMenuMode ? undefined : 'radiogroup'}\n aria-label={ariaLabel}\n onKeyDown={handleKeyDown}\n className={[\n styles.switcher,\n styles[variant],\n overflow === 'scroll' ? styles.overflowScroll : null,\n overflow === 'compact' \|\| overflow === 'menu' ? styles.overflowDetect : null,\n compact ? styles.compact : null,\n className,\n ]\n .filter(Boolean)\n .join(' ')}\n {...props}\n >\n {!inMenuMode && <span className={styles.indicator} style={indicatorStyle} aria-hidden />}\n {inMenuMode ? (\n <>\n <button\n type=\"button\"\n className={[styles.item, styles.active, styles.menuTrigger].filter(Boolean).join(' ')}\n onClick={() => setSheetOpen(true)}\n aria-haspopup=\"dialog\"\n aria-label={`${ariaLabel}: ${activeItem?.label ?? activeItem?.name}`}\n >\n {activeItem?.icon && (\n <span className={styles.itemIcon}>\n <Icon icon={activeItem.icon} size=\"md\" aria-hidden />\n </span>\n )}\n {activeItem?.label && <span className={styles.itemLabel}>{activeItem.label}</span>}\n <span className={styles.menuChevron} aria-hidden=\"true\">\n ▾\n </span>\n </button>\n <BottomSheet open={sheetOpen} title={ariaLabel} onClose={() => setSheetOpen(false)}>\n <div className={styles.menuList} role=\"radiogroup\" aria-label={ariaLabel}>\n {allItems.map((item) => (\n <button\n key={item.name}\n type=\"button\"\n role=\"radio\"\n aria-checked={item.name === value}\n className={[\n styles.menuListItem,\n item.name === value ? styles.menuListItemActive : null,\n ]\n .filter(Boolean)\n .join(' ')}\n onClick={() => {\n onValueChange(item.name);\n setSheetOpen(false);\n }}\n >\n {item.icon && (\n <span className={styles.menuListItemIcon}>\n <Icon icon={item.icon} size=\"md\" aria-hidden />\n </span>\n )}\n <span className={styles.menuListItemLabel}>{item.label ?? item.name}</span>\n {item.name === value && (\n <span className={styles.menuListItemCheck} aria-hidden=\"true\">\n ✓\n </span>\n )}\n </button>\n ))}\n </div>\n </BottomSheet>\n </>\n ) : (\n children\n )}\n </div>\n </InlineViewSwitcherContext.Provider>\n );\n};\n"],"mappings":"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"}

package/dist/components/InlineViewSwitcher/InlineViewSwitcher.module.css.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={switcher:`_switcher_l6v4v_3`,indicator:`_indicator_l6v4v_11`,item:`_item_l6v4v_26`,iconOnly:`_iconOnly_l6v4v_57`,itemIcon:`_itemIcon_l6v4v_62`,itemLabel:`_itemLabel_l6v4v_68`,default:`_default_l6v4v_74`,active:`_active_l6v4v_87`,flat:`_flat_l6v4v_148`,round:`_round_l6v4v_202`,pill:`_pill_l6v4v_271`,overflowDetect:`_overflowDetect_l6v4v_342`,overflowScroll:`_overflowScroll_l6v4v_350`,compact:`_compact_l6v4v_370`,menuTrigger:`_menuTrigger_l6v4v_376`,menuChevron:`_menuChevron_l6v4v_380`,menuList:`_menuList_l6v4v_388`,menuListItem:`_menuListItem_l6v4v_395`,menuListItemActive:`_menuListItemActive_l6v4v_434`,menuListItemIcon:`_menuListItemIcon_l6v4v_439`,menuListItemLabel:`_menuListItemLabel_l6v4v_445`,menuListItemCheck:`_menuListItemCheck_l6v4v_449`};exports.default=e;
+var e={switcher:`_switcher_1pziq_3`,indicator:`_indicator_1pziq_11`,item:`_item_1pziq_26`,iconOnly:`_iconOnly_1pziq_51`,itemIcon:`_itemIcon_1pziq_56`,itemLabel:`_itemLabel_1pziq_62`,default:`_default_1pziq_68`,active:`_active_1pziq_81`,flat:`_flat_1pziq_142`,round:`_round_1pziq_196`,pill:`_pill_1pziq_265`,overflowDetect:`_overflowDetect_1pziq_336`,overflowScroll:`_overflowScroll_1pziq_344`,compact:`_compact_1pziq_363`,menuTrigger:`_menuTrigger_1pziq_369`,menuChevron:`_menuChevron_1pziq_373`,menuList:`_menuList_1pziq_381`,menuListItem:`_menuListItem_1pziq_388`,menuListItemActive:`_menuListItemActive_1pziq_423`,menuListItemIcon:`_menuListItemIcon_1pziq_428`,menuListItemLabel:`_menuListItemLabel_1pziq_434`,menuListItemCheck:`_menuListItemCheck_1pziq_438`};exports.default=e;
 //# sourceMappingURL=InlineViewSwitcher.module.css.cjs.map

package/dist/components/InlineViewSwitcher/InlineViewSwitcher.module.css.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InlineViewSwitcher.module.css.cjs","names":[],"sources":["../../../src/components/InlineViewSwitcher/InlineViewSwitcher.module.css"],"sourcesContent":["/* ─── Switcher container ────────────────────────────────────────────────────── /\n\n.switcher {\n display: inline-flex;\n align-items: stretch;\n position: relative;\n}\n\n/ ─── Sliding indicator ─────────────────────────────────────────────────────── /\n\n.indicator {\n position: absolute;\n top: 2px;\n bottom: 2px;\n left: 0;\n border-radius: calc(var(--gnome-radius-md) - 2px);\n pointer-events: none;\n z-index: 0;\n transition:\n transform 160ms cubic-bezier(0.34, 1.2, 0.64, 1),\n width 160ms var(--gnome-easing-default, ease);\n}\n\n/ ─── Item base ─────────────────────────────────────────────────────────────── /\n\n.item {\n appearance: none;\n -webkit-appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--gnome-space-1, 6px);\n\n padding: 4px var(--gnome-space-2, 12px);\n min-height: 28px;\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n white-space: nowrap;\n\n transition:\n background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n box-shadow var(--gnome-duration-fast) var(--gnome-easing-default);\n\n position: relative;\n z-index: 1;\n}\n\n.iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.itemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.itemLabel {\n line-height: 1;\n}\n\n/ ─── Variant: default ──────────────────────────────────────────────────────── /\n\n.default {\n background-color: var(--gnome-card-bg-color, #ffffff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-md);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.default .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n}\n\n.default .item:hover:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.06);\n}\n\n.default .item:active:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.12);\n}\n\n.default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #ffffff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 40%, transparent);\n}\n\n.default .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .default {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgba(255, 255, 255, 0.12);\n box-shadow: none;\n }\n\n .default .item:hover:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.08);\n }\n\n .default .item:active:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.14);\n }\n\n .default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 50%, transparent);\n }\n\n .default .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: flat ─────────────────────────────────────────────────────────── /\n\n.flat {\n background: transparent;\n border: none;\n box-shadow: none;\n border-radius: var(--gnome-radius-md);\n padding: 2px;\n gap: 2px;\n}\n\n.flat .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.6));\n}\n\n.flat .item:hover:not(:disabled):not(.active) {\n background-color: var(--gnome-hover-overlay);\n}\n\n.flat .item:active:not(:disabled):not(.active) {\n background-color: var(--gnome-active-overlay);\n}\n\n.flat .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n}\n\n.flat .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .flat .item {\n color: var(--gnome-window-fg-color, rgba(255, 255, 255, 0.6));\n }\n\n .flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n }\n\n .flat .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: round ────────────────────────────────────────────────────────── /\n\n.round {\n background-color: var(--gnome-card-bg-color, #ffffff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.round .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 4px var(--gnome-space-2, 12px);\n}\n\n.round .iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.round .item:hover:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.06);\n}\n\n.round .item:active:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.12);\n}\n\n.round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #ffffff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.round .indicator {\n background-color: var(--gnome-accent-bg-color, #3584e4);\n border-radius: var(--gnome-radius-pill, 9999px);\n}\n\n.round .active {\n color: var(--gnome-accent-fg-color, #ffffff);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .round {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgba(255, 255, 255, 0.12);\n box-shadow: none;\n }\n\n .round .item:hover:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.08);\n }\n\n .round .item:active:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.14);\n }\n\n .round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n}\n\n/ ─── Variant: pill ─────────────────────────────────────────────────────────── /\n\n.pill {\n background-color: var(--gnome-hover-overlay, rgba(0, 0, 0, 0.06));\n border: none;\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: none;\n padding: 3px;\n gap: 2px;\n}\n\n.pill .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 5px var(--gnome-space-2, 16px);\n color: var(--gnome-window-fg-color);\n}\n\n.pill .item:hover:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.04);\n}\n\n.pill .item:active:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.08);\n}\n\n.pill .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) transparent,\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.pill .indicator {\n background-color: var(--gnome-card-bg-color, #ffffff);\n box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.12));\n border-radius: var(--gnome-radius-pill, 9999px);\n top: 3px;\n bottom: 3px;\n}\n\n.pill .active {\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-window-fg-color);\n}\n\n@media (prefers-color-scheme: dark) {\n .pill {\n background-color: var(--gnome-hover-overlay, rgba(255, 255, 255, 0.08));\n }\n\n .pill .item:hover:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.05);\n }\n\n .pill .item:active:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.1);\n }\n\n .pill .indicator {\n background-color: var(--gnome-card-bg-color, #383838);\n box-shadow: none;\n }\n}\n\n/ ─── Disabled ──────────────────────────────────────────────────────────────── /\n\n.item:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Overflow: detect (compact / menu) — must be display:flex so clientWidth is constrained ── /\n\n.overflowDetect {\n display: flex;\n min-width: 0;\n width: 100%;\n}\n\n/ ─── Overflow: scroll ──────────────────────────────────────────────────────── /\n\n.overflowScroll {\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: none;\n -webkit-overflow-scrolling: touch;\n scroll-snap-type: x mandatory;\n}\n\n.overflowScroll::-webkit-scrollbar {\n display: none;\n}\n\n.overflowScroll .item {\n scroll-snap-align: start;\n flex-shrink: 0;\n}\n\n/ ─── Overflow: compact (icon-only) ─────────────────────────────────────────── /\n\n.compact .itemLabel {\n display: none;\n}\n\n/ ─── Overflow: menu trigger ────────────────────────────────────────────────── /\n\n.menuTrigger {\n gap: var(--gnome-space-1, 6px);\n}\n\n.menuChevron {\n font-size: 0.75rem;\n opacity: 0.6;\n margin-left: 2px;\n}\n\n/ ─── Overflow: menu BottomSheet list ───────────────────────────────────────── /\n\n.menuList {\n display: flex;\n flex-direction: column;\n gap: 2px;\n padding: 4px 0;\n}\n\n.menuListItem {\n appearance: none;\n -webkit-appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 12px);\n padding: var(--gnome-space-2, 12px) var(--gnome-space-3, 16px);\n border-radius: var(--gnome-radius-md);\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n text-align: left;\n width: 100%;\n\n transition: background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.menuListItem:hover:not(:disabled) {\n background-color: rgba(0, 0, 0, 0.06);\n}\n\n.menuListItem:active:not(:disabled) {\n background-color: rgba(0, 0, 0, 0.12);\n}\n\n.menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.menuListItemActive {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.menuListItemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.menuListItemLabel {\n flex: 1;\n}\n\n.menuListItemCheck {\n color: var(--gnome-accent-color, #3584e4);\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .menuListItem:hover:not(:disabled) {\n background-color: rgba(255, 255, 255, 0.08);\n }\n\n .menuListItem:active:not(:disabled) {\n background-color: rgba(255, 255, 255, 0.14);\n }\n\n .menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #1e1e1e),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .menuListItemActive {\n color: var(--gnome-accent-color, #78aeed);\n }\n\n .menuListItemCheck {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .item,\n .indicator,\n .menuListItem {\n transition: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"InlineViewSwitcher.module.css.cjs","names":[],"sources":["../../../src/components/InlineViewSwitcher/InlineViewSwitcher.module.css"],"sourcesContent":["/* ─── Switcher container ────────────────────────────────────────────────────── /\n\n.switcher {\n display: inline-flex;\n align-items: stretch;\n position: relative;\n}\n\n/ ─── Sliding indicator ─────────────────────────────────────────────────────── /\n\n.indicator {\n position: absolute;\n top: 2px;\n bottom: 2px;\n left: 0;\n border-radius: calc(var(--gnome-radius-md) - 2px);\n pointer-events: none;\n z-index: 0;\n transition:\n transform 160ms cubic-bezier(0.34, 1.2, 0.64, 1),\n width 160ms var(--gnome-easing-default, ease);\n}\n\n/ ─── Item base ─────────────────────────────────────────────────────────────── /\n\n.item {\n appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--gnome-space-1, 6px);\n padding: 4px var(--gnome-space-2, 12px);\n min-height: 28px;\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n white-space: nowrap;\n transition:\n background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n box-shadow var(--gnome-duration-fast) var(--gnome-easing-default);\n position: relative;\n z-index: 1;\n}\n\n.iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.itemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.itemLabel {\n line-height: 1;\n}\n\n/ ─── Variant: default ──────────────────────────────────────────────────────── /\n\n.default {\n background-color: var(--gnome-card-bg-color, #fff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-md);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.default .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n}\n\n.default .item:hover:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.06);\n}\n\n.default .item:active:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.12);\n}\n\n.default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #fff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 40%, transparent);\n}\n\n.default .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .default {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgb(255 255 255 / 0.12);\n box-shadow: none;\n }\n\n .default .item:hover:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.08);\n }\n\n .default .item:active:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.14);\n }\n\n .default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 50%, transparent);\n }\n\n .default .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: flat ─────────────────────────────────────────────────────────── /\n\n.flat {\n background: transparent;\n border: none;\n box-shadow: none;\n border-radius: var(--gnome-radius-md);\n padding: 2px;\n gap: 2px;\n}\n\n.flat .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.6));\n}\n\n.flat .item:hover:not(:disabled, .active) {\n background-color: var(--gnome-hover-overlay);\n}\n\n.flat .item:active:not(:disabled, .active) {\n background-color: var(--gnome-active-overlay);\n}\n\n.flat .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n}\n\n.flat .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .flat .item {\n color: var(--gnome-window-fg-color, rgb(255 255 255 / 0.6));\n }\n\n .flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n }\n\n .flat .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: round ────────────────────────────────────────────────────────── /\n\n.round {\n background-color: var(--gnome-card-bg-color, #fff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.round .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 4px var(--gnome-space-2, 12px);\n}\n\n.round .iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.round .item:hover:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.06);\n}\n\n.round .item:active:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.12);\n}\n\n.round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #fff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.round .indicator {\n background-color: var(--gnome-accent-bg-color, #3584e4);\n border-radius: var(--gnome-radius-pill, 9999px);\n}\n\n.round .active {\n color: var(--gnome-accent-fg-color, #fff);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .round {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgb(255 255 255 / 0.12);\n box-shadow: none;\n }\n\n .round .item:hover:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.08);\n }\n\n .round .item:active:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.14);\n }\n\n .round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n}\n\n/ ─── Variant: pill ─────────────────────────────────────────────────────────── /\n\n.pill {\n background-color: var(--gnome-hover-overlay, rgb(0 0 0 / 0.06));\n border: none;\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: none;\n padding: 3px;\n gap: 2px;\n}\n\n.pill .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 5px var(--gnome-space-2, 16px);\n color: var(--gnome-window-fg-color);\n}\n\n.pill .item:hover:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.04);\n}\n\n.pill .item:active:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.08);\n}\n\n.pill .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) transparent,\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.pill .indicator {\n background-color: var(--gnome-card-bg-color, #fff);\n box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgb(0 0 0 / 0.12));\n border-radius: var(--gnome-radius-pill, 9999px);\n top: 3px;\n bottom: 3px;\n}\n\n.pill .active {\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-window-fg-color);\n}\n\n@media (prefers-color-scheme: dark) {\n .pill {\n background-color: var(--gnome-hover-overlay, rgb(255 255 255 / 0.08));\n }\n\n .pill .item:hover:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.05);\n }\n\n .pill .item:active:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.1);\n }\n\n .pill .indicator {\n background-color: var(--gnome-card-bg-color, #383838);\n box-shadow: none;\n }\n}\n\n/ ─── Disabled ──────────────────────────────────────────────────────────────── /\n\n.item:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Overflow: detect (compact / menu) — must be display:flex so clientWidth is constrained ── /\n\n.overflowDetect {\n display: flex;\n min-width: 0;\n width: 100%;\n}\n\n/ ─── Overflow: scroll ──────────────────────────────────────────────────────── /\n\n.overflowScroll {\n max-width: 100%;\n overflow: auto hidden;\n scrollbar-width: none;\n -webkit-overflow-scrolling: touch;\n scroll-snap-type: x mandatory;\n}\n\n.overflowScroll::-webkit-scrollbar {\n display: none;\n}\n\n.overflowScroll .item {\n scroll-snap-align: start;\n flex-shrink: 0;\n}\n\n/ ─── Overflow: compact (icon-only) ─────────────────────────────────────────── /\n\n.compact .itemLabel {\n display: none;\n}\n\n/ ─── Overflow: menu trigger ────────────────────────────────────────────────── /\n\n.menuTrigger {\n gap: var(--gnome-space-1, 6px);\n}\n\n.menuChevron {\n font-size: 0.75rem;\n opacity: 0.6;\n margin-left: 2px;\n}\n\n/ ─── Overflow: menu BottomSheet list ───────────────────────────────────────── /\n\n.menuList {\n display: flex;\n flex-direction: column;\n gap: 2px;\n padding: 4px 0;\n}\n\n.menuListItem {\n appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 12px);\n padding: var(--gnome-space-2, 12px) var(--gnome-space-3, 16px);\n border-radius: var(--gnome-radius-md);\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n text-align: left;\n width: 100%;\n transition: background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.menuListItem:hover:not(:disabled) {\n background-color: rgb(0 0 0 / 0.06);\n}\n\n.menuListItem:active:not(:disabled) {\n background-color: rgb(0 0 0 / 0.12);\n}\n\n.menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.menuListItemActive {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.menuListItemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.menuListItemLabel {\n flex: 1;\n}\n\n.menuListItemCheck {\n color: var(--gnome-accent-color, #3584e4);\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .menuListItem:hover:not(:disabled) {\n background-color: rgb(255 255 255 / 0.08);\n }\n\n .menuListItem:active:not(:disabled) {\n background-color: rgb(255 255 255 / 0.14);\n }\n\n .menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #1e1e1e),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .menuListItemActive {\n color: var(--gnome-accent-color, #78aeed);\n }\n\n .menuListItemCheck {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .item,\n .indicator,\n .menuListItem {\n transition: none;\n }\n}\n"],"mappings":""}

package/dist/components/InlineViewSwitcher/InlineViewSwitcher.module.css.js CHANGED Viewed

@@ -1,26 +1,26 @@
 var e = {
-	switcher: "_switcher_l6v4v_3",
-	indicator: "_indicator_l6v4v_11",
-	item: "_item_l6v4v_26",
-	iconOnly: "_iconOnly_l6v4v_57",
-	itemIcon: "_itemIcon_l6v4v_62",
-	itemLabel: "_itemLabel_l6v4v_68",
-	default: "_default_l6v4v_74",
-	active: "_active_l6v4v_87",
-	flat: "_flat_l6v4v_148",
-	round: "_round_l6v4v_202",
-	pill: "_pill_l6v4v_271",
-	overflowDetect: "_overflowDetect_l6v4v_342",
-	overflowScroll: "_overflowScroll_l6v4v_350",
-	compact: "_compact_l6v4v_370",
-	menuTrigger: "_menuTrigger_l6v4v_376",
-	menuChevron: "_menuChevron_l6v4v_380",
-	menuList: "_menuList_l6v4v_388",
-	menuListItem: "_menuListItem_l6v4v_395",
-	menuListItemActive: "_menuListItemActive_l6v4v_434",
-	menuListItemIcon: "_menuListItemIcon_l6v4v_439",
-	menuListItemLabel: "_menuListItemLabel_l6v4v_445",
-	menuListItemCheck: "_menuListItemCheck_l6v4v_449"
+	switcher: "_switcher_1pziq_3",
+	indicator: "_indicator_1pziq_11",
+	item: "_item_1pziq_26",
+	iconOnly: "_iconOnly_1pziq_51",
+	itemIcon: "_itemIcon_1pziq_56",
+	itemLabel: "_itemLabel_1pziq_62",
+	default: "_default_1pziq_68",
+	active: "_active_1pziq_81",
+	flat: "_flat_1pziq_142",
+	round: "_round_1pziq_196",
+	pill: "_pill_1pziq_265",
+	overflowDetect: "_overflowDetect_1pziq_336",
+	overflowScroll: "_overflowScroll_1pziq_344",
+	compact: "_compact_1pziq_363",
+	menuTrigger: "_menuTrigger_1pziq_369",
+	menuChevron: "_menuChevron_1pziq_373",
+	menuList: "_menuList_1pziq_381",
+	menuListItem: "_menuListItem_1pziq_388",
+	menuListItemActive: "_menuListItemActive_1pziq_423",
+	menuListItemIcon: "_menuListItemIcon_1pziq_428",
+	menuListItemLabel: "_menuListItemLabel_1pziq_434",
+	menuListItemCheck: "_menuListItemCheck_1pziq_438"
 };
 //#endregion
 export { e as default };

package/dist/components/InlineViewSwitcher/InlineViewSwitcher.module.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"InlineViewSwitcher.module.css.js","names":[],"sources":["../../../src/components/InlineViewSwitcher/InlineViewSwitcher.module.css"],"sourcesContent":["/* ─── Switcher container ────────────────────────────────────────────────────── /\n\n.switcher {\n display: inline-flex;\n align-items: stretch;\n position: relative;\n}\n\n/ ─── Sliding indicator ─────────────────────────────────────────────────────── /\n\n.indicator {\n position: absolute;\n top: 2px;\n bottom: 2px;\n left: 0;\n border-radius: calc(var(--gnome-radius-md) - 2px);\n pointer-events: none;\n z-index: 0;\n transition:\n transform 160ms cubic-bezier(0.34, 1.2, 0.64, 1),\n width 160ms var(--gnome-easing-default, ease);\n}\n\n/ ─── Item base ─────────────────────────────────────────────────────────────── /\n\n.item {\n appearance: none;\n -webkit-appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--gnome-space-1, 6px);\n\n padding: 4px var(--gnome-space-2, 12px);\n min-height: 28px;\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n white-space: nowrap;\n\n transition:\n background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n box-shadow var(--gnome-duration-fast) var(--gnome-easing-default);\n\n position: relative;\n z-index: 1;\n}\n\n.iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.itemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.itemLabel {\n line-height: 1;\n}\n\n/ ─── Variant: default ──────────────────────────────────────────────────────── /\n\n.default {\n background-color: var(--gnome-card-bg-color, #ffffff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-md);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.default .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n}\n\n.default .item:hover:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.06);\n}\n\n.default .item:active:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.12);\n}\n\n.default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #ffffff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 40%, transparent);\n}\n\n.default .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .default {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgba(255, 255, 255, 0.12);\n box-shadow: none;\n }\n\n .default .item:hover:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.08);\n }\n\n .default .item:active:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.14);\n }\n\n .default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 50%, transparent);\n }\n\n .default .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: flat ─────────────────────────────────────────────────────────── /\n\n.flat {\n background: transparent;\n border: none;\n box-shadow: none;\n border-radius: var(--gnome-radius-md);\n padding: 2px;\n gap: 2px;\n}\n\n.flat .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.6));\n}\n\n.flat .item:hover:not(:disabled):not(.active) {\n background-color: var(--gnome-hover-overlay);\n}\n\n.flat .item:active:not(:disabled):not(.active) {\n background-color: var(--gnome-active-overlay);\n}\n\n.flat .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n}\n\n.flat .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .flat .item {\n color: var(--gnome-window-fg-color, rgba(255, 255, 255, 0.6));\n }\n\n .flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n }\n\n .flat .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: round ────────────────────────────────────────────────────────── /\n\n.round {\n background-color: var(--gnome-card-bg-color, #ffffff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.round .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 4px var(--gnome-space-2, 12px);\n}\n\n.round .iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.round .item:hover:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.06);\n}\n\n.round .item:active:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.12);\n}\n\n.round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #ffffff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.round .indicator {\n background-color: var(--gnome-accent-bg-color, #3584e4);\n border-radius: var(--gnome-radius-pill, 9999px);\n}\n\n.round .active {\n color: var(--gnome-accent-fg-color, #ffffff);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .round {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgba(255, 255, 255, 0.12);\n box-shadow: none;\n }\n\n .round .item:hover:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.08);\n }\n\n .round .item:active:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.14);\n }\n\n .round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n}\n\n/ ─── Variant: pill ─────────────────────────────────────────────────────────── /\n\n.pill {\n background-color: var(--gnome-hover-overlay, rgba(0, 0, 0, 0.06));\n border: none;\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: none;\n padding: 3px;\n gap: 2px;\n}\n\n.pill .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 5px var(--gnome-space-2, 16px);\n color: var(--gnome-window-fg-color);\n}\n\n.pill .item:hover:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.04);\n}\n\n.pill .item:active:not(:disabled):not(.active) {\n background-color: rgba(0, 0, 0, 0.08);\n}\n\n.pill .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) transparent,\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.pill .indicator {\n background-color: var(--gnome-card-bg-color, #ffffff);\n box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.12));\n border-radius: var(--gnome-radius-pill, 9999px);\n top: 3px;\n bottom: 3px;\n}\n\n.pill .active {\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-window-fg-color);\n}\n\n@media (prefers-color-scheme: dark) {\n .pill {\n background-color: var(--gnome-hover-overlay, rgba(255, 255, 255, 0.08));\n }\n\n .pill .item:hover:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.05);\n }\n\n .pill .item:active:not(:disabled):not(.active) {\n background-color: rgba(255, 255, 255, 0.1);\n }\n\n .pill .indicator {\n background-color: var(--gnome-card-bg-color, #383838);\n box-shadow: none;\n }\n}\n\n/ ─── Disabled ──────────────────────────────────────────────────────────────── /\n\n.item:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Overflow: detect (compact / menu) — must be display:flex so clientWidth is constrained ── /\n\n.overflowDetect {\n display: flex;\n min-width: 0;\n width: 100%;\n}\n\n/ ─── Overflow: scroll ──────────────────────────────────────────────────────── /\n\n.overflowScroll {\n max-width: 100%;\n overflow-x: auto;\n overflow-y: hidden;\n scrollbar-width: none;\n -webkit-overflow-scrolling: touch;\n scroll-snap-type: x mandatory;\n}\n\n.overflowScroll::-webkit-scrollbar {\n display: none;\n}\n\n.overflowScroll .item {\n scroll-snap-align: start;\n flex-shrink: 0;\n}\n\n/ ─── Overflow: compact (icon-only) ─────────────────────────────────────────── /\n\n.compact .itemLabel {\n display: none;\n}\n\n/ ─── Overflow: menu trigger ────────────────────────────────────────────────── /\n\n.menuTrigger {\n gap: var(--gnome-space-1, 6px);\n}\n\n.menuChevron {\n font-size: 0.75rem;\n opacity: 0.6;\n margin-left: 2px;\n}\n\n/ ─── Overflow: menu BottomSheet list ───────────────────────────────────────── /\n\n.menuList {\n display: flex;\n flex-direction: column;\n gap: 2px;\n padding: 4px 0;\n}\n\n.menuListItem {\n appearance: none;\n -webkit-appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 12px);\n padding: var(--gnome-space-2, 12px) var(--gnome-space-3, 16px);\n border-radius: var(--gnome-radius-md);\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n color: var(--gnome-window-fg-color, rgba(0, 0, 0, 0.8));\n text-align: left;\n width: 100%;\n\n transition: background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.menuListItem:hover:not(:disabled) {\n background-color: rgba(0, 0, 0, 0.06);\n}\n\n.menuListItem:active:not(:disabled) {\n background-color: rgba(0, 0, 0, 0.12);\n}\n\n.menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.menuListItemActive {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.menuListItemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.menuListItemLabel {\n flex: 1;\n}\n\n.menuListItemCheck {\n color: var(--gnome-accent-color, #3584e4);\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .menuListItem:hover:not(:disabled) {\n background-color: rgba(255, 255, 255, 0.08);\n }\n\n .menuListItem:active:not(:disabled) {\n background-color: rgba(255, 255, 255, 0.14);\n }\n\n .menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #1e1e1e),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .menuListItemActive {\n color: var(--gnome-accent-color, #78aeed);\n }\n\n .menuListItemCheck {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .item,\n .indicator,\n .menuListItem {\n transition: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"InlineViewSwitcher.module.css.js","names":[],"sources":["../../../src/components/InlineViewSwitcher/InlineViewSwitcher.module.css"],"sourcesContent":["/* ─── Switcher container ────────────────────────────────────────────────────── /\n\n.switcher {\n display: inline-flex;\n align-items: stretch;\n position: relative;\n}\n\n/ ─── Sliding indicator ─────────────────────────────────────────────────────── /\n\n.indicator {\n position: absolute;\n top: 2px;\n bottom: 2px;\n left: 0;\n border-radius: calc(var(--gnome-radius-md) - 2px);\n pointer-events: none;\n z-index: 0;\n transition:\n transform 160ms cubic-bezier(0.34, 1.2, 0.64, 1),\n width 160ms var(--gnome-easing-default, ease);\n}\n\n/ ─── Item base ─────────────────────────────────────────────────────────────── /\n\n.item {\n appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--gnome-space-1, 6px);\n padding: 4px var(--gnome-space-2, 12px);\n min-height: 28px;\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n white-space: nowrap;\n transition:\n background-color var(--gnome-duration-fast) var(--gnome-easing-default),\n box-shadow var(--gnome-duration-fast) var(--gnome-easing-default);\n position: relative;\n z-index: 1;\n}\n\n.iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.itemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.itemLabel {\n line-height: 1;\n}\n\n/ ─── Variant: default ──────────────────────────────────────────────────────── /\n\n.default {\n background-color: var(--gnome-card-bg-color, #fff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-md);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.default .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n}\n\n.default .item:hover:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.06);\n}\n\n.default .item:active:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.12);\n}\n\n.default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #fff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 40%, transparent);\n}\n\n.default .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .default {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgb(255 255 255 / 0.12);\n box-shadow: none;\n }\n\n .default .item:hover:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.08);\n }\n\n .default .item:active:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.14);\n }\n\n .default .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .default .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n box-shadow: inset 0 0 0 1px\n color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 50%, transparent);\n }\n\n .default .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: flat ─────────────────────────────────────────────────────────── /\n\n.flat {\n background: transparent;\n border: none;\n box-shadow: none;\n border-radius: var(--gnome-radius-md);\n padding: 2px;\n gap: 2px;\n}\n\n.flat .item {\n border-radius: calc(var(--gnome-radius-md) - 2px);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.6));\n}\n\n.flat .item:hover:not(:disabled, .active) {\n background-color: var(--gnome-hover-overlay);\n}\n\n.flat .item:active:not(:disabled, .active) {\n background-color: var(--gnome-active-overlay);\n}\n\n.flat .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 15%, transparent);\n}\n\n.flat .active {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .flat .item {\n color: var(--gnome-window-fg-color, rgb(255 255 255 / 0.6));\n }\n\n .flat .indicator {\n background-color: color-mix(in srgb, var(--gnome-accent-bg-color, #3584e4) 25%, transparent);\n }\n\n .flat .active {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Variant: round ────────────────────────────────────────────────────────── /\n\n.round {\n background-color: var(--gnome-card-bg-color, #fff);\n border: 1px solid var(--gnome-light-3, #deddda);\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: var(--gnome-shadow-sm);\n padding: 2px;\n gap: 2px;\n}\n\n.round .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 4px var(--gnome-space-2, 12px);\n}\n\n.round .iconOnly {\n padding: 4px;\n min-width: 28px;\n}\n\n.round .item:hover:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.06);\n}\n\n.round .item:active:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.12);\n}\n\n.round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #fff),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.round .indicator {\n background-color: var(--gnome-accent-bg-color, #3584e4);\n border-radius: var(--gnome-radius-pill, 9999px);\n}\n\n.round .active {\n color: var(--gnome-accent-fg-color, #fff);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n@media (prefers-color-scheme: dark) {\n .round {\n background-color: var(--gnome-card-bg-color, #383838);\n border-color: rgb(255 255 255 / 0.12);\n box-shadow: none;\n }\n\n .round .item:hover:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.08);\n }\n\n .round .item:active:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.14);\n }\n\n .round .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-card-bg-color, #383838),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n}\n\n/ ─── Variant: pill ─────────────────────────────────────────────────────────── /\n\n.pill {\n background-color: var(--gnome-hover-overlay, rgb(0 0 0 / 0.06));\n border: none;\n border-radius: var(--gnome-radius-pill, 9999px);\n box-shadow: none;\n padding: 3px;\n gap: 2px;\n}\n\n.pill .item {\n border-radius: var(--gnome-radius-pill, 9999px);\n padding: 5px var(--gnome-space-2, 16px);\n color: var(--gnome-window-fg-color);\n}\n\n.pill .item:hover:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.04);\n}\n\n.pill .item:active:not(:disabled, .active) {\n background-color: rgb(0 0 0 / 0.08);\n}\n\n.pill .item:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) transparent,\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.pill .indicator {\n background-color: var(--gnome-card-bg-color, #fff);\n box-shadow: var(--gnome-shadow-sm, 0 1px 2px rgb(0 0 0 / 0.12));\n border-radius: var(--gnome-radius-pill, 9999px);\n top: 3px;\n bottom: 3px;\n}\n\n.pill .active {\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-window-fg-color);\n}\n\n@media (prefers-color-scheme: dark) {\n .pill {\n background-color: var(--gnome-hover-overlay, rgb(255 255 255 / 0.08));\n }\n\n .pill .item:hover:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.05);\n }\n\n .pill .item:active:not(:disabled, .active) {\n background-color: rgb(255 255 255 / 0.1);\n }\n\n .pill .indicator {\n background-color: var(--gnome-card-bg-color, #383838);\n box-shadow: none;\n }\n}\n\n/ ─── Disabled ──────────────────────────────────────────────────────────────── /\n\n.item:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Overflow: detect (compact / menu) — must be display:flex so clientWidth is constrained ── /\n\n.overflowDetect {\n display: flex;\n min-width: 0;\n width: 100%;\n}\n\n/ ─── Overflow: scroll ──────────────────────────────────────────────────────── /\n\n.overflowScroll {\n max-width: 100%;\n overflow: auto hidden;\n scrollbar-width: none;\n -webkit-overflow-scrolling: touch;\n scroll-snap-type: x mandatory;\n}\n\n.overflowScroll::-webkit-scrollbar {\n display: none;\n}\n\n.overflowScroll .item {\n scroll-snap-align: start;\n flex-shrink: 0;\n}\n\n/ ─── Overflow: compact (icon-only) ─────────────────────────────────────────── /\n\n.compact .itemLabel {\n display: none;\n}\n\n/ ─── Overflow: menu trigger ────────────────────────────────────────────────── /\n\n.menuTrigger {\n gap: var(--gnome-space-1, 6px);\n}\n\n.menuChevron {\n font-size: 0.75rem;\n opacity: 0.6;\n margin-left: 2px;\n}\n\n/ ─── Overflow: menu BottomSheet list ───────────────────────────────────────── /\n\n.menuList {\n display: flex;\n flex-direction: column;\n gap: 2px;\n padding: 4px 0;\n}\n\n.menuListItem {\n appearance: none;\n border: none;\n background: transparent;\n font: inherit;\n cursor: pointer;\n outline: none;\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 12px);\n padding: var(--gnome-space-2, 12px) var(--gnome-space-3, 16px);\n border-radius: var(--gnome-radius-md);\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n text-align: left;\n width: 100%;\n transition: background-color var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.menuListItem:hover:not(:disabled) {\n background-color: rgb(0 0 0 / 0.06);\n}\n\n.menuListItem:active:not(:disabled) {\n background-color: rgb(0 0 0 / 0.12);\n}\n\n.menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #fafafa),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #3584e4);\n}\n\n.menuListItemActive {\n color: var(--gnome-accent-color, #3584e4);\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.menuListItemIcon {\n display: flex;\n align-items: center;\n flex-shrink: 0;\n}\n\n.menuListItemLabel {\n flex: 1;\n}\n\n.menuListItemCheck {\n color: var(--gnome-accent-color, #3584e4);\n font-size: 1rem;\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .menuListItem:hover:not(:disabled) {\n background-color: rgb(255 255 255 / 0.08);\n }\n\n .menuListItem:active:not(:disabled) {\n background-color: rgb(255 255 255 / 0.14);\n }\n\n .menuListItem:focus-visible {\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset, 2px) var(--gnome-window-bg-color, #1e1e1e),\n 0 0 0 calc(var(--gnome-focus-ring-offset, 2px) + var(--gnome-focus-ring-width, 2px))\n var(--gnome-focus-ring-color, #78aeed);\n }\n\n .menuListItemActive {\n color: var(--gnome-accent-color, #78aeed);\n }\n\n .menuListItemCheck {\n color: var(--gnome-accent-color, #78aeed);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .item,\n .indicator,\n .menuListItem {\n transition: none;\n }\n}\n"],"mappings":""}

package/dist/components/Link/Link.module.css.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={link:`_link_1xc0b_1`,externalIcon:`_externalIcon_1xc0b_37`};exports.default=e;
+var e={link:`_link_1wyba_1`,externalIcon:`_externalIcon_1wyba_37`};exports.default=e;
 //# sourceMappingURL=Link.module.css.cjs.map

package/dist/components/Link/Link.module.css.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.module.css.cjs","names":[],"sources":["../../../src/components/Link/Link.module.css"],"sourcesContent":[".link {\n color: var(--gnome-accent-color);\n text-decoration: none;\n cursor: pointer;\n outline: none;\n\n /* Smooth underline on hover /\n background-image: linear-gradient(~~currentColor~~, ~~currentColor~~);\n background-position: 0 100%;\n background-repeat: no-repeat;\n background-size: 0% 1px;\n transition:\n background-size var(--gnome-duration-fast) var(--gnome-easing-default),\n opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.link:hover {\n background-size: 100% 1px;\n}\n\n.link:active {\n opacity: 0.7;\n}\n\n/ ─── Focus ────────────────────────────────────────────────────── /\n\n.link:focus-visible {\n border-radius: 2px;\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset) var(--gnome-window-bg-color),\n 0 0 0 calc(var(--gnome-focus-ring-offset) + var(--gnome-focus-ring-width))\n var(--gnome-focus-ring-color);\n}\n\n/ ─── External indicator ──────────────────────────────────────── /\n\n.externalIcon {\n display: inline-block;\n margin-inline-start: 0.15em;\n font-size: 0.8em;\n vertical-align: super;\n line-height: 1;\n / don't underline the icon itself /\n background-image: none;\n}\n\n/ ─── Reduced motion ──────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .link {\n transition: none;\n }\n\n .link:hover {\n text-decoration: underline;\n background-size: 0%;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Link.module.css.cjs","names":[],"sources":["../../../src/components/Link/Link.module.css"],"sourcesContent":[".link {\n color: var(--gnome-accent-color);\n text-decoration: none;\n cursor: pointer;\n outline: none;\n\n /* Smooth underline on hover /\n background-image: linear-gradient(currentcolor, currentcolor);\n background-position: 0 100%;\n background-repeat: no-repeat;\n background-size: 0% 1px;\n transition:\n background-size var(--gnome-duration-fast) var(--gnome-easing-default),\n opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.link:hover {\n background-size: 100% 1px;\n}\n\n.link:active {\n opacity: 0.7;\n}\n\n/ ─── Focus ────────────────────────────────────────────────────── /\n\n.link:focus-visible {\n border-radius: 2px;\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset) var(--gnome-window-bg-color),\n 0 0 0 calc(var(--gnome-focus-ring-offset) + var(--gnome-focus-ring-width))\n var(--gnome-focus-ring-color);\n}\n\n/ ─── External indicator ──────────────────────────────────────── /\n\n.externalIcon {\n display: inline-block;\n margin-inline-start: 0.15em;\n font-size: 0.8em;\n vertical-align: super;\n line-height: 1;\n\n / don't underline the icon itself /\n background-image: none;\n}\n\n/ ─── Reduced motion ──────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .link {\n transition: none;\n }\n\n .link:hover {\n text-decoration: underline;\n background-size: 0%;\n }\n}\n"],"mappings":""}

package/dist/components/Link/Link.module.css.js CHANGED Viewed

@@ -1,6 +1,6 @@
 var e = {
-	link: "_link_1xc0b_1",
-	externalIcon: "_externalIcon_1xc0b_37"
+	link: "_link_1wyba_1",
+	externalIcon: "_externalIcon_1wyba_37"
 };
 //#endregion
 export { e as default };

package/dist/components/Link/Link.module.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Link.module.css.js","names":[],"sources":["../../../src/components/Link/Link.module.css"],"sourcesContent":[".link {\n color: var(--gnome-accent-color);\n text-decoration: none;\n cursor: pointer;\n outline: none;\n\n /* Smooth underline on hover /\n background-image: linear-gradient(~~currentColor~~, ~~currentColor~~);\n background-position: 0 100%;\n background-repeat: no-repeat;\n background-size: 0% 1px;\n transition:\n background-size var(--gnome-duration-fast) var(--gnome-easing-default),\n opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.link:hover {\n background-size: 100% 1px;\n}\n\n.link:active {\n opacity: 0.7;\n}\n\n/ ─── Focus ────────────────────────────────────────────────────── /\n\n.link:focus-visible {\n border-radius: 2px;\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset) var(--gnome-window-bg-color),\n 0 0 0 calc(var(--gnome-focus-ring-offset) + var(--gnome-focus-ring-width))\n var(--gnome-focus-ring-color);\n}\n\n/ ─── External indicator ──────────────────────────────────────── /\n\n.externalIcon {\n display: inline-block;\n margin-inline-start: 0.15em;\n font-size: 0.8em;\n vertical-align: super;\n line-height: 1;\n / don't underline the icon itself /\n background-image: none;\n}\n\n/ ─── Reduced motion ──────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .link {\n transition: none;\n }\n\n .link:hover {\n text-decoration: underline;\n background-size: 0%;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Link.module.css.js","names":[],"sources":["../../../src/components/Link/Link.module.css"],"sourcesContent":[".link {\n color: var(--gnome-accent-color);\n text-decoration: none;\n cursor: pointer;\n outline: none;\n\n /* Smooth underline on hover /\n background-image: linear-gradient(currentcolor, currentcolor);\n background-position: 0 100%;\n background-repeat: no-repeat;\n background-size: 0% 1px;\n transition:\n background-size var(--gnome-duration-fast) var(--gnome-easing-default),\n opacity var(--gnome-duration-fast) var(--gnome-easing-default);\n}\n\n.link:hover {\n background-size: 100% 1px;\n}\n\n.link:active {\n opacity: 0.7;\n}\n\n/ ─── Focus ────────────────────────────────────────────────────── /\n\n.link:focus-visible {\n border-radius: 2px;\n box-shadow:\n 0 0 0 var(--gnome-focus-ring-offset) var(--gnome-window-bg-color),\n 0 0 0 calc(var(--gnome-focus-ring-offset) + var(--gnome-focus-ring-width))\n var(--gnome-focus-ring-color);\n}\n\n/ ─── External indicator ──────────────────────────────────────── /\n\n.externalIcon {\n display: inline-block;\n margin-inline-start: 0.15em;\n font-size: 0.8em;\n vertical-align: super;\n line-height: 1;\n\n / don't underline the icon itself /\n background-image: none;\n}\n\n/ ─── Reduced motion ──────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .link {\n transition: none;\n }\n\n .link:hover {\n text-decoration: underline;\n background-size: 0%;\n }\n}\n"],"mappings":""}

package/dist/components/Modal/Modal.module.css.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={backdrop:`_backdrop_1g4xm_3`,"backdrop-in":`_backdrop-in_1g4xm_1`,closing:`_closing_1g4xm_19`,"backdrop-out":`_backdrop-out_1g4xm_1`,modal:`_modal_1g4xm_43`,entering:`_entering_1g4xm_60`,"modal-in":`_modal-in_1g4xm_1`,"modal-out":`_modal-out_1g4xm_1`,header:`_header_1g4xm_92`,closeBtn:`_closeBtn_1g4xm_103`,title:`_title_1g4xm_144`,actions:`_actions_1g4xm_156`,btn:`_btn_1g4xm_165`,"btn-default":`_btn-default_1g4xm_210`,"btn-suggested":`_btn-suggested_1g4xm_214`,"btn-destructive":`_btn-destructive_1g4xm_228`,body:`_body_1g4xm_236`};exports.default=e;
+var e={backdrop:`_backdrop_y62af_3`,"backdrop-in":`_backdrop-in_y62af_1`,closing:`_closing_y62af_15`,"backdrop-out":`_backdrop-out_y62af_1`,modal:`_modal_y62af_41`,entering:`_entering_y62af_55`,"modal-in":`_modal-in_y62af_1`,"modal-out":`_modal-out_y62af_1`,header:`_header_y62af_89`,closeBtn:`_closeBtn_y62af_100`,title:`_title_y62af_138`,actions:`_actions_y62af_149`,btn:`_btn_y62af_158`,"btn-default":`_btn-default_y62af_198`,"btn-suggested":`_btn-suggested_y62af_202`,"btn-destructive":`_btn-destructive_y62af_216`,body:`_body_y62af_222`};exports.default=e;
 //# sourceMappingURL=Modal.module.css.cjs.map

package/dist/components/Modal/Modal.module.css.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.module.css.cjs","names":[],"sources":["../../../src/components/Modal/Modal.module.css"],"sourcesContent":["/* ─── Backdrop ──────────────────────────────────────────────────────────────── /\n\n.backdrop {\n position: fixed;\n inset: 0;\n z-index: 10000;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n background-color: var(--gnome-dialog-backdrop-color, ~~rgba~~(0, 0, 0, 0.5));\n backdrop-filter: blur(var(--gnome-dialog-backdrop-blur, 4px));\n ~~-webkit-backdrop-filter: blur(var(--gnome-dialog-backdrop-blur, 4px));\n\n~~ animation: backdrop-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.backdrop.closing {\n animation: backdrop-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes backdrop-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdrop-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n/ ─── Modal card ────────────────────────────────────────────────────────────── /\n\n.modal {\n width: min(720px, calc(100vw - 48px));\n max-height: 90dvh;\n display: flex;\n flex-direction: column;\n\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #fafafa));\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n\n border-radius: var(--gnome-radius-xl, 16px);\n box-shadow:\n 0 8px 40px ~~rgba~~(0, 0, 0, 0.22),\n 0 0 0 1px ~~rgba~~(0, 0, 0, 0.06);\n\n overflow: hidden;\n}\n\n.modal.entering {\n animation: modal-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.modal.closing {\n animation: modal-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes modal-in {\n from {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n@keyframes modal-out {\n from {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n to {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n}\n\n/ ─── Header ────────────────────────────────────────────────────────────────── /\n\n.header {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 8px);\n padding: 10px var(--gnome-space-3, 16px);\n border-bottom: 1px solid var(--gnome-card-shade-color, ~~rgba~~(0, 0, 0, 0.08));\n flex-shrink: 0;\n}\n\n/ ─── Close button ──────────────────────────────────────────────────────────── /\n\n.closeBtn {\n appearance: none;\n border: none;\n background: transparent;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n flex-shrink: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n font-size: 1.25rem;\n line-height: 1;\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n\n cursor: pointer;\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.closeBtn:hover {\n background-color: color-mix(in srgb, ~~currentColor~~ 10%, transparent);\n}\n\n.closeBtn:active {\n background-color: color-mix(in srgb, ~~currentColor~~ 18%, transparent);\n}\n\n.closeBtn:focus {\n outline: none;\n}\n\n.closeBtn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n/ ─── Title ─────────────────────────────────────────────────────────────────── /\n\n/ Grows to fill center space — always present to keep actions right-aligned /\n.title {\n flex: 1 1 auto;\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-title-4, 1.125rem);\n font-weight: var(--gnome-font-weight-bold, 700);\n line-height: var(--gnome-line-height-title, 1.3);\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n/ ─── Actions ───────────────────────────────────────────────────────────────── /\n\n.actions {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-1, 6px);\n flex-shrink: 0;\n}\n\n/ ─── Action buttons ────────────────────────────────────────────────────────── /\n\n.btn {\n appearance: none;\n border: none;\n background: transparent;\n padding: 6px 14px;\n border-radius: var(--gnome-radius-sm, 6px);\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n line-height: var(--gnome-line-height-body, 1.5);\n color: var(--gnome-accent-color, #3584e4);\n\n cursor: pointer;\n white-space: nowrap;\n\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.btn:hover:not(:disabled) {\n background-color: color-mix(in srgb, ~~currentColor~~ 8%, transparent);\n}\n\n.btn:active:not(:disabled) {\n background-color: color-mix(in srgb, ~~currentColor~~ 16%, transparent);\n}\n\n.btn:focus {\n outline: none;\n}\n\n.btn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n.btn:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Button variants ───────────────────────────────────────────────────────── /\n\n~~/ stylelint-disable selector-class-pattern /\n\n~~.btn-default {\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n.btn-suggested {\n background-color: var(--gnome-accent-color, #3584e4);\n color: #fff;\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.btn-suggested:hover:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 85%, #000);\n}\n\n.btn-suggested:active:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 70%, #000);\n}\n\n.btn-destructive {\n color: var(--gnome-destructive-color, #e01b24);\n}\n\n/ stylelint-enable selector-class-pattern /\n\n/ ─── Body ──────────────────────────────────────────────────────────────────── /\n\n.body {\n flex: 1 1 auto;\n overflow-y: auto;\n padding: var(--gnome-space-4, 24px);\n}\n\n/ ─── Dark mode ─────────────────────────────────────────────────────────────── /\n\n@media (prefers-color-scheme: dark) {\n .modal {\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #242424));\n box-shadow:\n 0 8px 40px ~~rgba~~(0, 0, 0, 0.5),\n 0 0 0 1px ~~rgba~~(255, 255, 255, 0.08);\n }\n\n .header {\n border-bottom-color: ~~rgba~~(255, 255, 255, 0.08);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .backdrop,\n .backdrop.closing,\n .modal.entering,\n .modal.closing {\n animation: none;\n }\n\n .btn,\n .closeBtn {\n transition: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Modal.module.css.cjs","names":[],"sources":["../../../src/components/Modal/Modal.module.css"],"sourcesContent":["/* ─── Backdrop ──────────────────────────────────────────────────────────────── /\n\n.backdrop {\n position: fixed;\n inset: 0;\n z-index: 10000;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--gnome-dialog-backdrop-color, rgb(0 0 0 / 0.5));\n backdrop-filter: blur(var(--gnome-dialog-backdrop-blur, 4px));\n animation: backdrop-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.backdrop.closing {\n animation: backdrop-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes backdrop-in {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdrop-out {\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n}\n\n/ ─── Modal card ────────────────────────────────────────────────────────────── /\n\n.modal {\n width: min(720px, calc(100vw - 48px));\n max-height: 90dvh;\n display: flex;\n flex-direction: column;\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #fafafa));\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n border-radius: var(--gnome-radius-xl, 16px);\n box-shadow:\n 0 8px 40px rgb(0 0 0 / 0.22),\n 0 0 0 1px rgb(0 0 0 / 0.06);\n overflow: hidden;\n}\n\n.modal.entering {\n animation: modal-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.modal.closing {\n animation: modal-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes modal-in {\n from {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n@keyframes modal-out {\n from {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n\n to {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n}\n\n/ ─── Header ────────────────────────────────────────────────────────────────── /\n\n.header {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 8px);\n padding: 10px var(--gnome-space-3, 16px);\n border-bottom: 1px solid var(--gnome-card-shade-color, rgb(0 0 0 / 0.08));\n flex-shrink: 0;\n}\n\n/ ─── Close button ──────────────────────────────────────────────────────────── /\n\n.closeBtn {\n appearance: none;\n border: none;\n background: transparent;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.25rem;\n line-height: 1;\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n cursor: pointer;\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.closeBtn:hover {\n background-color: color-mix(in srgb, currentcolor 10%, transparent);\n}\n\n.closeBtn:active {\n background-color: color-mix(in srgb, currentcolor 18%, transparent);\n}\n\n.closeBtn:focus {\n outline: none;\n}\n\n.closeBtn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n/ ─── Title ─────────────────────────────────────────────────────────────────── /\n\n/ Grows to fill center space — always present to keep actions right-aligned /\n.title {\n flex: 1 1 auto;\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-title-4, 1.125rem);\n font-weight: var(--gnome-font-weight-bold, 700);\n line-height: var(--gnome-line-height-title, 1.3);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n}\n\n/ ─── Actions ───────────────────────────────────────────────────────────────── /\n\n.actions {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-1, 6px);\n flex-shrink: 0;\n}\n\n/ ─── Action buttons ────────────────────────────────────────────────────────── /\n\n.btn {\n appearance: none;\n border: none;\n background: transparent;\n padding: 6px 14px;\n border-radius: var(--gnome-radius-sm, 6px);\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n line-height: var(--gnome-line-height-body, 1.5);\n color: var(--gnome-accent-color, #3584e4);\n cursor: pointer;\n white-space: nowrap;\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.btn:hover:not(:disabled) {\n background-color: color-mix(in srgb, currentcolor 8%, transparent);\n}\n\n.btn:active:not(:disabled) {\n background-color: color-mix(in srgb, currentcolor 16%, transparent);\n}\n\n.btn:focus {\n outline: none;\n}\n\n.btn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n.btn:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Button variants ───────────────────────────────────────────────────────── /\n\n.btn-default {\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n}\n\n.btn-suggested {\n background-color: var(--gnome-accent-color, #3584e4);\n color: #fff;\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.btn-suggested:hover:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 85%, #000);\n}\n\n.btn-suggested:active:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 70%, #000);\n}\n\n.btn-destructive {\n color: var(--gnome-destructive-color, #e01b24);\n}\n\n/ ─── Body ──────────────────────────────────────────────────────────────────── /\n\n.body {\n flex: 1 1 auto;\n overflow-y: auto;\n padding: var(--gnome-space-4, 24px);\n}\n\n/ ─── Dark mode ─────────────────────────────────────────────────────────────── /\n\n@media (prefers-color-scheme: dark) {\n .modal {\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #242424));\n box-shadow:\n 0 8px 40px rgb(0 0 0 / 0.5),\n 0 0 0 1px rgb(255 255 255 / 0.08);\n }\n\n .header {\n border-bottom-color: rgb(255 255 255 / 0.08);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .backdrop,\n .backdrop.closing,\n .modal.entering,\n .modal.closing {\n animation: none;\n }\n\n .btn,\n .closeBtn {\n transition: none;\n }\n}\n"],"mappings":""}

package/dist/components/Modal/Modal.module.css.js CHANGED Viewed

@@ -1,21 +1,21 @@
 var e = {
-	backdrop: "_backdrop_1g4xm_3",
-	"backdrop-in": "_backdrop-in_1g4xm_1",
-	closing: "_closing_1g4xm_19",
-	"backdrop-out": "_backdrop-out_1g4xm_1",
-	modal: "_modal_1g4xm_43",
-	entering: "_entering_1g4xm_60",
-	"modal-in": "_modal-in_1g4xm_1",
-	"modal-out": "_modal-out_1g4xm_1",
-	header: "_header_1g4xm_92",
-	closeBtn: "_closeBtn_1g4xm_103",
-	title: "_title_1g4xm_144",
-	actions: "_actions_1g4xm_156",
-	btn: "_btn_1g4xm_165",
-	"btn-default": "_btn-default_1g4xm_210",
-	"btn-suggested": "_btn-suggested_1g4xm_214",
-	"btn-destructive": "_btn-destructive_1g4xm_228",
-	body: "_body_1g4xm_236"
+	backdrop: "_backdrop_y62af_3",
+	"backdrop-in": "_backdrop-in_y62af_1",
+	closing: "_closing_y62af_15",
+	"backdrop-out": "_backdrop-out_y62af_1",
+	modal: "_modal_y62af_41",
+	entering: "_entering_y62af_55",
+	"modal-in": "_modal-in_y62af_1",
+	"modal-out": "_modal-out_y62af_1",
+	header: "_header_y62af_89",
+	closeBtn: "_closeBtn_y62af_100",
+	title: "_title_y62af_138",
+	actions: "_actions_y62af_149",
+	btn: "_btn_y62af_158",
+	"btn-default": "_btn-default_y62af_198",
+	"btn-suggested": "_btn-suggested_y62af_202",
+	"btn-destructive": "_btn-destructive_y62af_216",
+	body: "_body_y62af_222"
 };
 //#endregion
 export { e as default };

package/dist/components/Modal/Modal.module.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Modal.module.css.js","names":[],"sources":["../../../src/components/Modal/Modal.module.css"],"sourcesContent":["/* ─── Backdrop ──────────────────────────────────────────────────────────────── /\n\n.backdrop {\n position: fixed;\n inset: 0;\n z-index: 10000;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n background-color: var(--gnome-dialog-backdrop-color, ~~rgba~~(0, 0, 0, 0.5));\n backdrop-filter: blur(var(--gnome-dialog-backdrop-blur, 4px));\n ~~-webkit-backdrop-filter: blur(var(--gnome-dialog-backdrop-blur, 4px));\n\n~~ animation: backdrop-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.backdrop.closing {\n animation: backdrop-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes backdrop-in {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdrop-out {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n}\n\n/ ─── Modal card ────────────────────────────────────────────────────────────── /\n\n.modal {\n width: min(720px, calc(100vw - 48px));\n max-height: 90dvh;\n display: flex;\n flex-direction: column;\n\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #fafafa));\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n\n border-radius: var(--gnome-radius-xl, 16px);\n box-shadow:\n 0 8px 40px ~~rgba~~(0, 0, 0, 0.22),\n 0 0 0 1px ~~rgba~~(0, 0, 0, 0.06);\n\n overflow: hidden;\n}\n\n.modal.entering {\n animation: modal-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.modal.closing {\n animation: modal-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes modal-in {\n from {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n@keyframes modal-out {\n from {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n to {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n}\n\n/ ─── Header ────────────────────────────────────────────────────────────────── /\n\n.header {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 8px);\n padding: 10px var(--gnome-space-3, 16px);\n border-bottom: 1px solid var(--gnome-card-shade-color, ~~rgba~~(0, 0, 0, 0.08));\n flex-shrink: 0;\n}\n\n/ ─── Close button ──────────────────────────────────────────────────────────── /\n\n.closeBtn {\n appearance: none;\n border: none;\n background: transparent;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n flex-shrink: 0;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n font-size: 1.25rem;\n line-height: 1;\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n\n cursor: pointer;\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.closeBtn:hover {\n background-color: color-mix(in srgb, ~~currentColor~~ 10%, transparent);\n}\n\n.closeBtn:active {\n background-color: color-mix(in srgb, ~~currentColor~~ 18%, transparent);\n}\n\n.closeBtn:focus {\n outline: none;\n}\n\n.closeBtn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n/ ─── Title ─────────────────────────────────────────────────────────────────── /\n\n/ Grows to fill center space — always present to keep actions right-aligned /\n.title {\n flex: 1 1 auto;\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-title-4, 1.125rem);\n font-weight: var(--gnome-font-weight-bold, 700);\n line-height: var(--gnome-line-height-title, 1.3);\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n/ ─── Actions ───────────────────────────────────────────────────────────────── /\n\n.actions {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-1, 6px);\n flex-shrink: 0;\n}\n\n/ ─── Action buttons ────────────────────────────────────────────────────────── /\n\n.btn {\n appearance: none;\n border: none;\n background: transparent;\n padding: 6px 14px;\n border-radius: var(--gnome-radius-sm, 6px);\n\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n line-height: var(--gnome-line-height-body, 1.5);\n color: var(--gnome-accent-color, #3584e4);\n\n cursor: pointer;\n white-space: nowrap;\n\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.btn:hover:not(:disabled) {\n background-color: color-mix(in srgb, ~~currentColor~~ 8%, transparent);\n}\n\n.btn:active:not(:disabled) {\n background-color: color-mix(in srgb, ~~currentColor~~ 16%, transparent);\n}\n\n.btn:focus {\n outline: none;\n}\n\n.btn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n.btn:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Button variants ───────────────────────────────────────────────────────── /\n\n~~/ stylelint-disable selector-class-pattern /\n\n~~.btn-default {\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n.btn-suggested {\n background-color: var(--gnome-accent-color, #3584e4);\n color: #fff;\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.btn-suggested:hover:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 85%, #000);\n}\n\n.btn-suggested:active:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 70%, #000);\n}\n\n.btn-destructive {\n color: var(--gnome-destructive-color, #e01b24);\n}\n\n/ stylelint-enable selector-class-pattern /\n\n/ ─── Body ──────────────────────────────────────────────────────────────────── /\n\n.body {\n flex: 1 1 auto;\n overflow-y: auto;\n padding: var(--gnome-space-4, 24px);\n}\n\n/ ─── Dark mode ─────────────────────────────────────────────────────────────── /\n\n@media (prefers-color-scheme: dark) {\n .modal {\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #242424));\n box-shadow:\n 0 8px 40px ~~rgba~~(0, 0, 0, 0.5),\n 0 0 0 1px ~~rgba~~(255, 255, 255, 0.08);\n }\n\n .header {\n border-bottom-color: ~~rgba~~(255, 255, 255, 0.08);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .backdrop,\n .backdrop.closing,\n .modal.entering,\n .modal.closing {\n animation: none;\n }\n\n .btn,\n .closeBtn {\n transition: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"Modal.module.css.js","names":[],"sources":["../../../src/components/Modal/Modal.module.css"],"sourcesContent":["/* ─── Backdrop ──────────────────────────────────────────────────────────────── /\n\n.backdrop {\n position: fixed;\n inset: 0;\n z-index: 10000;\n display: flex;\n align-items: center;\n justify-content: center;\n background-color: var(--gnome-dialog-backdrop-color, rgb(0 0 0 / 0.5));\n backdrop-filter: blur(var(--gnome-dialog-backdrop-blur, 4px));\n animation: backdrop-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.backdrop.closing {\n animation: backdrop-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes backdrop-in {\n from {\n opacity: 0;\n }\n\n to {\n opacity: 1;\n }\n}\n\n@keyframes backdrop-out {\n from {\n opacity: 1;\n }\n\n to {\n opacity: 0;\n }\n}\n\n/ ─── Modal card ────────────────────────────────────────────────────────────── /\n\n.modal {\n width: min(720px, calc(100vw - 48px));\n max-height: 90dvh;\n display: flex;\n flex-direction: column;\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #fafafa));\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n border-radius: var(--gnome-radius-xl, 16px);\n box-shadow:\n 0 8px 40px rgb(0 0 0 / 0.22),\n 0 0 0 1px rgb(0 0 0 / 0.06);\n overflow: hidden;\n}\n\n.modal.entering {\n animation: modal-in var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n.modal.closing {\n animation: modal-out var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease) both;\n}\n\n@keyframes modal-in {\n from {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n\n to {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n}\n\n@keyframes modal-out {\n from {\n opacity: 1;\n transform: scale(1) translateY(0);\n }\n\n to {\n opacity: 0;\n transform: scale(0.94) translateY(-8px);\n }\n}\n\n/ ─── Header ────────────────────────────────────────────────────────────────── /\n\n.header {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-2, 8px);\n padding: 10px var(--gnome-space-3, 16px);\n border-bottom: 1px solid var(--gnome-card-shade-color, rgb(0 0 0 / 0.08));\n flex-shrink: 0;\n}\n\n/ ─── Close button ──────────────────────────────────────────────────────────── /\n\n.closeBtn {\n appearance: none;\n border: none;\n background: transparent;\n width: 32px;\n height: 32px;\n border-radius: 50%;\n flex-shrink: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.25rem;\n line-height: 1;\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n cursor: pointer;\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.closeBtn:hover {\n background-color: color-mix(in srgb, currentcolor 10%, transparent);\n}\n\n.closeBtn:active {\n background-color: color-mix(in srgb, currentcolor 18%, transparent);\n}\n\n.closeBtn:focus {\n outline: none;\n}\n\n.closeBtn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n/ ─── Title ─────────────────────────────────────────────────────────────────── /\n\n/ Grows to fill center space — always present to keep actions right-aligned /\n.title {\n flex: 1 1 auto;\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-title-4, 1.125rem);\n font-weight: var(--gnome-font-weight-bold, 700);\n line-height: var(--gnome-line-height-title, 1.3);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n}\n\n/ ─── Actions ───────────────────────────────────────────────────────────────── /\n\n.actions {\n display: flex;\n align-items: center;\n gap: var(--gnome-space-1, 6px);\n flex-shrink: 0;\n}\n\n/ ─── Action buttons ────────────────────────────────────────────────────────── /\n\n.btn {\n appearance: none;\n border: none;\n background: transparent;\n padding: 6px 14px;\n border-radius: var(--gnome-radius-sm, 6px);\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-normal, 400);\n line-height: var(--gnome-line-height-body, 1.5);\n color: var(--gnome-accent-color, #3584e4);\n cursor: pointer;\n white-space: nowrap;\n transition: background-color var(--gnome-duration-fast, 100ms) var(--gnome-easing-default, ease);\n}\n\n.btn:hover:not(:disabled) {\n background-color: color-mix(in srgb, currentcolor 8%, transparent);\n}\n\n.btn:active:not(:disabled) {\n background-color: color-mix(in srgb, currentcolor 16%, transparent);\n}\n\n.btn:focus {\n outline: none;\n}\n\n.btn:focus-visible {\n outline: var(--gnome-focus-ring-width, 3px) solid var(--gnome-focus-ring-color, #3584e4);\n outline-offset: 2px;\n}\n\n.btn:disabled {\n opacity: var(--gnome-opacity-disabled, 0.5);\n cursor: not-allowed;\n}\n\n/ ─── Button variants ───────────────────────────────────────────────────────── /\n\n.btn-default {\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n}\n\n.btn-suggested {\n background-color: var(--gnome-accent-color, #3584e4);\n color: #fff;\n font-weight: var(--gnome-font-weight-semibold, 600);\n}\n\n.btn-suggested:hover:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 85%, #000);\n}\n\n.btn-suggested:active:not(:disabled) {\n background-color: color-mix(in srgb, var(--gnome-accent-color, #3584e4) 70%, #000);\n}\n\n.btn-destructive {\n color: var(--gnome-destructive-color, #e01b24);\n}\n\n/ ─── Body ──────────────────────────────────────────────────────────────────── /\n\n.body {\n flex: 1 1 auto;\n overflow-y: auto;\n padding: var(--gnome-space-4, 24px);\n}\n\n/ ─── Dark mode ─────────────────────────────────────────────────────────────── /\n\n@media (prefers-color-scheme: dark) {\n .modal {\n background-color: var(--gnome-dialog-bg-color, var(--gnome-window-bg-color, #242424));\n box-shadow:\n 0 8px 40px rgb(0 0 0 / 0.5),\n 0 0 0 1px rgb(255 255 255 / 0.08);\n }\n\n .header {\n border-bottom-color: rgb(255 255 255 / 0.08);\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .backdrop,\n .backdrop.closing,\n .modal.entering,\n .modal.closing {\n animation: none;\n }\n\n .btn,\n .closeBtn {\n transition: none;\n }\n}\n"],"mappings":""}

package/dist/components/NavigationSplitView/NavigationSplitView.module.css.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={root:`_root_16ve4_3`,expanded:`_expanded_16ve4_12`,sidebar:`_sidebar_16ve4_16`,contentPane:`_contentPane_16ve4_22`,collapsed:`_collapsed_16ve4_30`,paneVisible:`_paneVisible_16ve4_46`,paneHidden:`_paneHidden_16ve4_50`,divider:`_divider_16ve4_67`};exports.default=e;
+var e={root:`_root_1v9it_3`,expanded:`_expanded_1v9it_12`,sidebar:`_sidebar_1v9it_16`,contentPane:`_contentPane_1v9it_22`,collapsed:`_collapsed_1v9it_30`,paneVisible:`_paneVisible_1v9it_46`,paneHidden:`_paneHidden_1v9it_50`,divider:`_divider_1v9it_67`};exports.default=e;
 //# sourceMappingURL=NavigationSplitView.module.css.cjs.map

package/dist/components/NavigationSplitView/NavigationSplitView.module.css.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationSplitView.module.css.cjs","names":[],"sources":["../../../src/components/NavigationSplitView/NavigationSplitView.module.css"],"sourcesContent":["/* ─── Root ───────────────────────────────────────────────────────────────────── /\n\n.root {\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n\n/ ─── Wide (both panes visible) ──────────────────────────────────────────────── /\n\n.expanded {\n flex-direction: row;\n}\n\n.expanded .sidebar {\n width: var(--sidebar-width, var(--gnome-layout-sidebar-width, clamp(180px, 25%, 280px)));\n flex-shrink: 0;\n overflow-y: auto;\n}\n\n.expanded .contentPane {\n flex: 1;\n min-width: 0;\n overflow-y: auto;\n}\n\n/ ─── Narrow (one pane at a time) ────────────────────────────────────────────── /\n\n.collapsed {\n flex-direction: column;\n position: relative;\n}\n\n.collapsed .sidebar,\n.collapsed .contentPane {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n overflow-y: auto;\n transition: transform var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease);\n}\n\n/ Sidebar slides out to the left when content is shown /\n.collapsed .sidebar.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .sidebar.paneHidden {\n transform: translateX(-100%);\n pointer-events: none;\n}\n\n/ Content slides in from the right when shown /\n.collapsed .contentPane.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .contentPane.paneHidden {\n transform: translateX(100%);\n pointer-events: none;\n}\n\n/ ─── Divider ────────────────────────────────────────────────────────────────── /\n\n.divider {\n width: 1px;\n background-color: var(--gnome-card-shade-color, ~~rgba~~(0, 0, 0, 0.1));\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .divider {\n background-color: ~~rgba~~(255, 255, 255, 0.08);\n }\n}\n\n/ ─── Reduced motion ─────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .collapsed .sidebar,\n .collapsed .contentPane {\n transition: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"NavigationSplitView.module.css.cjs","names":[],"sources":["../../../src/components/NavigationSplitView/NavigationSplitView.module.css"],"sourcesContent":["/* ─── Root ───────────────────────────────────────────────────────────────────── /\n\n.root {\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n\n/ ─── Wide (both panes visible) ──────────────────────────────────────────────── /\n\n.expanded {\n flex-direction: row;\n}\n\n.expanded .sidebar {\n width: var(--sidebar-width, var(--gnome-layout-sidebar-width, clamp(180px, 25%, 280px)));\n flex-shrink: 0;\n overflow-y: auto;\n}\n\n.expanded .contentPane {\n flex: 1;\n min-width: 0;\n overflow-y: auto;\n}\n\n/ ─── Narrow (one pane at a time) ────────────────────────────────────────────── /\n\n.collapsed {\n flex-direction: column;\n position: relative;\n}\n\n.collapsed .sidebar,\n.collapsed .contentPane {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n overflow-y: auto;\n transition: transform var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease);\n}\n\n/ Sidebar slides out to the left when content is shown /\n.collapsed .sidebar.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .sidebar.paneHidden {\n transform: translateX(-100%);\n pointer-events: none;\n}\n\n/ Content slides in from the right when shown /\n.collapsed .contentPane.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .contentPane.paneHidden {\n transform: translateX(100%);\n pointer-events: none;\n}\n\n/ ─── Divider ────────────────────────────────────────────────────────────────── /\n\n.divider {\n width: 1px;\n background-color: var(--gnome-card-shade-color, rgb(0 0 0 / 0.1));\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .divider {\n background-color: rgb(255 255 255 / 0.08);\n }\n}\n\n/ ─── Reduced motion ─────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .collapsed .sidebar,\n .collapsed .contentPane {\n transition: none;\n }\n}\n"],"mappings":""}

package/dist/components/NavigationSplitView/NavigationSplitView.module.css.js CHANGED Viewed

@@ -1,12 +1,12 @@
 var e = {
-	root: "_root_16ve4_3",
-	expanded: "_expanded_16ve4_12",
-	sidebar: "_sidebar_16ve4_16",
-	contentPane: "_contentPane_16ve4_22",
-	collapsed: "_collapsed_16ve4_30",
-	paneVisible: "_paneVisible_16ve4_46",
-	paneHidden: "_paneHidden_16ve4_50",
-	divider: "_divider_16ve4_67"
+	root: "_root_1v9it_3",
+	expanded: "_expanded_1v9it_12",
+	sidebar: "_sidebar_1v9it_16",
+	contentPane: "_contentPane_1v9it_22",
+	collapsed: "_collapsed_1v9it_30",
+	paneVisible: "_paneVisible_1v9it_46",
+	paneHidden: "_paneHidden_1v9it_50",
+	divider: "_divider_1v9it_67"
 };
 //#endregion
 export { e as default };

package/dist/components/NavigationSplitView/NavigationSplitView.module.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationSplitView.module.css.js","names":[],"sources":["../../../src/components/NavigationSplitView/NavigationSplitView.module.css"],"sourcesContent":["/* ─── Root ───────────────────────────────────────────────────────────────────── /\n\n.root {\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n\n/ ─── Wide (both panes visible) ──────────────────────────────────────────────── /\n\n.expanded {\n flex-direction: row;\n}\n\n.expanded .sidebar {\n width: var(--sidebar-width, var(--gnome-layout-sidebar-width, clamp(180px, 25%, 280px)));\n flex-shrink: 0;\n overflow-y: auto;\n}\n\n.expanded .contentPane {\n flex: 1;\n min-width: 0;\n overflow-y: auto;\n}\n\n/ ─── Narrow (one pane at a time) ────────────────────────────────────────────── /\n\n.collapsed {\n flex-direction: column;\n position: relative;\n}\n\n.collapsed .sidebar,\n.collapsed .contentPane {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n overflow-y: auto;\n transition: transform var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease);\n}\n\n/ Sidebar slides out to the left when content is shown /\n.collapsed .sidebar.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .sidebar.paneHidden {\n transform: translateX(-100%);\n pointer-events: none;\n}\n\n/ Content slides in from the right when shown /\n.collapsed .contentPane.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .contentPane.paneHidden {\n transform: translateX(100%);\n pointer-events: none;\n}\n\n/ ─── Divider ────────────────────────────────────────────────────────────────── /\n\n.divider {\n width: 1px;\n background-color: var(--gnome-card-shade-color, ~~rgba~~(0, 0, 0, 0.1));\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .divider {\n background-color: ~~rgba~~(255, 255, 255, 0.08);\n }\n}\n\n/ ─── Reduced motion ─────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .collapsed .sidebar,\n .collapsed .contentPane {\n transition: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"NavigationSplitView.module.css.js","names":[],"sources":["../../../src/components/NavigationSplitView/NavigationSplitView.module.css"],"sourcesContent":["/* ─── Root ───────────────────────────────────────────────────────────────────── /\n\n.root {\n display: flex;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n\n/ ─── Wide (both panes visible) ──────────────────────────────────────────────── /\n\n.expanded {\n flex-direction: row;\n}\n\n.expanded .sidebar {\n width: var(--sidebar-width, var(--gnome-layout-sidebar-width, clamp(180px, 25%, 280px)));\n flex-shrink: 0;\n overflow-y: auto;\n}\n\n.expanded .contentPane {\n flex: 1;\n min-width: 0;\n overflow-y: auto;\n}\n\n/ ─── Narrow (one pane at a time) ────────────────────────────────────────────── /\n\n.collapsed {\n flex-direction: column;\n position: relative;\n}\n\n.collapsed .sidebar,\n.collapsed .contentPane {\n position: absolute;\n inset: 0;\n width: 100%;\n height: 100%;\n overflow-y: auto;\n transition: transform var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease);\n}\n\n/ Sidebar slides out to the left when content is shown /\n.collapsed .sidebar.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .sidebar.paneHidden {\n transform: translateX(-100%);\n pointer-events: none;\n}\n\n/ Content slides in from the right when shown /\n.collapsed .contentPane.paneVisible {\n transform: translateX(0);\n}\n\n.collapsed .contentPane.paneHidden {\n transform: translateX(100%);\n pointer-events: none;\n}\n\n/ ─── Divider ────────────────────────────────────────────────────────────────── /\n\n.divider {\n width: 1px;\n background-color: var(--gnome-card-shade-color, rgb(0 0 0 / 0.1));\n flex-shrink: 0;\n}\n\n@media (prefers-color-scheme: dark) {\n .divider {\n background-color: rgb(255 255 255 / 0.08);\n }\n}\n\n/ ─── Reduced motion ─────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .collapsed .sidebar,\n .collapsed .contentPane {\n transition: none;\n }\n}\n"],"mappings":""}

package/dist/components/NavigationView/NavigationView.module.css.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={view:`_view_18zs8_3`,page:`_page_18zs8_12`,pageHeader:`_pageHeader_18zs8_23`,pageTitle:`_pageTitle_18zs8_34`,pageContent:`_pageContent_18zs8_43`,enterForward:`_enterForward_18zs8_52`,"slide-in-right":`_slide-in-right_18zs8_1`,enterBack:`_enterBack_18zs8_57`,"slide-in-left":`_slide-in-left_18zs8_1`};exports.default=e;
+var e={view:`_view_jscgh_3`,page:`_page_jscgh_12`,pageHeader:`_pageHeader_jscgh_23`,pageTitle:`_pageTitle_jscgh_34`,pageContent:`_pageContent_jscgh_43`,enterForward:`_enterForward_jscgh_51`,"slide-in-right":`_slide-in-right_jscgh_1`,enterBack:`_enterBack_jscgh_56`,"slide-in-left":`_slide-in-left_jscgh_1`};exports.default=e;
 //# sourceMappingURL=NavigationView.module.css.cjs.map

package/dist/components/NavigationView/NavigationView.module.css.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationView.module.css.cjs","names":[],"sources":["../../../src/components/NavigationView/NavigationView.module.css"],"sourcesContent":["/* ─── View container ────────────────────────────────────────────────────────── /\n\n.view {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n}\n\n/ ─── Page ──────────────────────────────────────────────────────────────────── /\n\n.page {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n background-color: var(--gnome-window-bg-color, #fafafa);\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n/ ─── Page header (title bar) ────────────────────────────────────────────────── /\n\n.pageHeader {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 47px;\n padding: 0 var(--gnome-space-4, 24px);\n border-bottom: 1px solid var(--gnome-headerbar-border-color, ~~rgba~~(0, 0, 0, 0.12));\n background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n flex-shrink: 0;\n}\n\n.pageTitle {\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-headerbar-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n/ ─── Page content ──────────────────────────────────────────────────────────── /\n\n.pageContent {\n flex: 1;\n overflow-y: auto;\n ~~overflow-x: hidden;\n~~ padding: var(--gnome-space-3, 16px);\n}\n\n/ ─── Enter animations ──────────────────────────────────────────────────────── /\n\n.enterForward {\n animation: slide-in-right var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n.enterBack {\n animation: slide-in-left var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n@keyframes slide-in-right {\n from {\n transform: translateX(40px);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n@keyframes slide-in-left {\n from {\n transform: translateX(-40px);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .enterForward,\n .enterBack {\n animation: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"NavigationView.module.css.cjs","names":[],"sources":["../../../src/components/NavigationView/NavigationView.module.css"],"sourcesContent":["/* ─── View container ────────────────────────────────────────────────────────── /\n\n.view {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n}\n\n/ ─── Page ──────────────────────────────────────────────────────────────────── /\n\n.page {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n background-color: var(--gnome-window-bg-color, #fafafa);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n}\n\n/ ─── Page header (title bar) ────────────────────────────────────────────────── /\n\n.pageHeader {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 47px;\n padding: 0 var(--gnome-space-4, 24px);\n border-bottom: 1px solid var(--gnome-headerbar-border-color, rgb(0 0 0 / 0.12));\n background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n flex-shrink: 0;\n}\n\n.pageTitle {\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-headerbar-fg-color, rgb(0 0 0 / 0.8));\n}\n\n/ ─── Page content ──────────────────────────────────────────────────────────── /\n\n.pageContent {\n flex: 1;\n overflow: hidden auto;\n padding: var(--gnome-space-3, 16px);\n}\n\n/ ─── Enter animations ──────────────────────────────────────────────────────── /\n\n.enterForward {\n animation: slide-in-right var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n.enterBack {\n animation: slide-in-left var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n@keyframes slide-in-right {\n from {\n transform: translateX(40px);\n opacity: 0;\n }\n\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n@keyframes slide-in-left {\n from {\n transform: translateX(-40px);\n opacity: 0;\n }\n\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .enterForward,\n .enterBack {\n animation: none;\n }\n}\n"],"mappings":""}

package/dist/components/NavigationView/NavigationView.module.css.js CHANGED Viewed

@@ -1,13 +1,13 @@
 var e = {
-	view: "_view_18zs8_3",
-	page: "_page_18zs8_12",
-	pageHeader: "_pageHeader_18zs8_23",
-	pageTitle: "_pageTitle_18zs8_34",
-	pageContent: "_pageContent_18zs8_43",
-	enterForward: "_enterForward_18zs8_52",
-	"slide-in-right": "_slide-in-right_18zs8_1",
-	enterBack: "_enterBack_18zs8_57",
-	"slide-in-left": "_slide-in-left_18zs8_1"
+	view: "_view_jscgh_3",
+	page: "_page_jscgh_12",
+	pageHeader: "_pageHeader_jscgh_23",
+	pageTitle: "_pageTitle_jscgh_34",
+	pageContent: "_pageContent_jscgh_43",
+	enterForward: "_enterForward_jscgh_51",
+	"slide-in-right": "_slide-in-right_jscgh_1",
+	enterBack: "_enterBack_jscgh_56",
+	"slide-in-left": "_slide-in-left_jscgh_1"
 };
 //#endregion
 export { e as default };

package/dist/components/NavigationView/NavigationView.module.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationView.module.css.js","names":[],"sources":["../../../src/components/NavigationView/NavigationView.module.css"],"sourcesContent":["/* ─── View container ────────────────────────────────────────────────────────── /\n\n.view {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n}\n\n/ ─── Page ──────────────────────────────────────────────────────────────────── /\n\n.page {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n background-color: var(--gnome-window-bg-color, #fafafa);\n color: var(--gnome-window-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n/ ─── Page header (title bar) ────────────────────────────────────────────────── /\n\n.pageHeader {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 47px;\n padding: 0 var(--gnome-space-4, 24px);\n border-bottom: 1px solid var(--gnome-headerbar-border-color, ~~rgba~~(0, 0, 0, 0.12));\n background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n flex-shrink: 0;\n}\n\n.pageTitle {\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-headerbar-fg-color, ~~rgba~~(0, 0, 0, 0.8));\n}\n\n/ ─── Page content ──────────────────────────────────────────────────────────── /\n\n.pageContent {\n flex: 1;\n overflow-y: auto;\n ~~overflow-x: hidden;\n~~ padding: var(--gnome-space-3, 16px);\n}\n\n/ ─── Enter animations ──────────────────────────────────────────────────────── /\n\n.enterForward {\n animation: slide-in-right var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n.enterBack {\n animation: slide-in-left var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n@keyframes slide-in-right {\n from {\n transform: translateX(40px);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n@keyframes slide-in-left {\n from {\n transform: translateX(-40px);\n opacity: 0;\n }\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .enterForward,\n .enterBack {\n animation: none;\n }\n}\n"],"mappings":""}
1	+ {"version":3,"file":"NavigationView.module.css.js","names":[],"sources":["../../../src/components/NavigationView/NavigationView.module.css"],"sourcesContent":["/* ─── View container ────────────────────────────────────────────────────────── /\n\n.view {\n position: relative;\n overflow: hidden;\n width: 100%;\n height: 100%;\n}\n\n/ ─── Page ──────────────────────────────────────────────────────────────────── /\n\n.page {\n display: flex;\n flex-direction: column;\n width: 100%;\n height: 100%;\n background-color: var(--gnome-window-bg-color, #fafafa);\n color: var(--gnome-window-fg-color, rgb(0 0 0 / 0.8));\n}\n\n/ ─── Page header (title bar) ────────────────────────────────────────────────── /\n\n.pageHeader {\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 47px;\n padding: 0 var(--gnome-space-4, 24px);\n border-bottom: 1px solid var(--gnome-headerbar-border-color, rgb(0 0 0 / 0.12));\n background-color: var(--gnome-headerbar-bg-color, #ebebeb);\n flex-shrink: 0;\n}\n\n.pageTitle {\n font-family: var(--gnome-font-family);\n font-size: var(--gnome-font-size-body, 1rem);\n font-weight: var(--gnome-font-weight-semibold, 600);\n color: var(--gnome-headerbar-fg-color, rgb(0 0 0 / 0.8));\n}\n\n/ ─── Page content ──────────────────────────────────────────────────────────── /\n\n.pageContent {\n flex: 1;\n overflow: hidden auto;\n padding: var(--gnome-space-3, 16px);\n}\n\n/ ─── Enter animations ──────────────────────────────────────────────────────── /\n\n.enterForward {\n animation: slide-in-right var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n.enterBack {\n animation: slide-in-left var(--gnome-duration-normal, 200ms) var(--gnome-easing-default, ease)\n both;\n}\n\n@keyframes slide-in-right {\n from {\n transform: translateX(40px);\n opacity: 0;\n }\n\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n@keyframes slide-in-left {\n from {\n transform: translateX(-40px);\n opacity: 0;\n }\n\n to {\n transform: translateX(0);\n opacity: 1;\n }\n}\n\n/ ─── Reduced motion ────────────────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n .enterForward,\n .enterBack {\n animation: none;\n }\n}\n"],"mappings":""}

package/dist/components/OverlaySplitView/OverlaySplitView.module.css.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={root:`_root_11ym4_3`,wide:`_wide_11ym4_13`,end:`_end_11ym4_17`,sidebar:`_sidebar_11ym4_21`,collapsed:`_collapsed_11ym4_28`,content:`_content_11ym4_32`,narrow:`_narrow_11ym4_40`,start:`_start_11ym4_60`,sidebarOpen:`_sidebarOpen_11ym4_64`,sidebarClosed:`_sidebarClosed_11ym4_67`,backdrop:`_backdrop_11ym4_85`,backdropVisible:`_backdropVisible_11ym4_96`};exports.default=e;
+var e={root:`_root_lsn7d_3`,wide:`_wide_lsn7d_13`,end:`_end_lsn7d_17`,sidebar:`_sidebar_lsn7d_21`,collapsed:`_collapsed_lsn7d_28`,content:`_content_lsn7d_32`,narrow:`_narrow_lsn7d_40`,start:`_start_lsn7d_58`,sidebarOpen:`_sidebarOpen_lsn7d_62`,sidebarClosed:`_sidebarClosed_lsn7d_66`,backdrop:`_backdrop_lsn7d_85`,backdropVisible:`_backdropVisible_lsn7d_95`};exports.default=e;
 //# sourceMappingURL=OverlaySplitView.module.css.cjs.map