@code-sherpas/pharos-react 0.21.0 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Combobox.module.js +19 -19
- package/dist/components/Combobox.module.js.map +1 -1
- package/dist/components/Dialog.module.js +6 -6
- package/dist/components/Dialog.module.js.map +1 -1
- package/dist/components/DropdownMenu.module.js +6 -6
- package/dist/components/DropdownMenu.module.js.map +1 -1
- package/dist/components/Popover.module.js +4 -4
- package/dist/components/Popover.module.js.map +1 -1
- package/dist/components/Select.module.js +13 -13
- package/dist/components/Select.module.js.map +1 -1
- package/dist/components/Sheet.module.js +10 -10
- package/dist/components/Sheet.module.js.map +1 -1
- package/dist/components/Toast.module.js +10 -10
- package/dist/components/Toast.module.js.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +12 -11
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
var e = {
|
|
2
|
-
control: "
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
inputSizeSm: "
|
|
6
|
-
inputSizeMd: "
|
|
7
|
-
inputSizeLg: "
|
|
8
|
-
chipsInput: "
|
|
9
|
-
trigger: "
|
|
10
|
-
clear: "
|
|
11
|
-
chip: "
|
|
12
|
-
chipRemove: "
|
|
13
|
-
positioner: "
|
|
14
|
-
content: "
|
|
15
|
-
item: "
|
|
16
|
-
itemText: "
|
|
17
|
-
itemIndicator: "
|
|
18
|
-
empty: "
|
|
19
|
-
label: "
|
|
20
|
-
separator: "
|
|
2
|
+
control: "_control_12m6b_5",
|
|
3
|
+
input: "_input_12m6b_66",
|
|
4
|
+
chips: "_chips_12m6b_72",
|
|
5
|
+
inputSizeSm: "_inputSizeSm_12m6b_110",
|
|
6
|
+
inputSizeMd: "_inputSizeMd_12m6b_115",
|
|
7
|
+
inputSizeLg: "_inputSizeLg_12m6b_120",
|
|
8
|
+
chipsInput: "_chipsInput_12m6b_128",
|
|
9
|
+
trigger: "_trigger_12m6b_135",
|
|
10
|
+
clear: "_clear_12m6b_136",
|
|
11
|
+
chip: "_chip_12m6b_72",
|
|
12
|
+
chipRemove: "_chipRemove_12m6b_180",
|
|
13
|
+
positioner: "_positioner_12m6b_227",
|
|
14
|
+
content: "_content_12m6b_217",
|
|
15
|
+
item: "_item_12m6b_14",
|
|
16
|
+
itemText: "_itemText_12m6b_14",
|
|
17
|
+
itemIndicator: "_itemIndicator_12m6b_298",
|
|
18
|
+
empty: "_empty_12m6b_322",
|
|
19
|
+
label: "_label_12m6b_332",
|
|
20
|
+
separator: "_separator_12m6b_339"
|
|
21
21
|
};
|
|
22
22
|
//#endregion
|
|
23
23
|
export { e as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Combobox.module.js","names":[],"sources":["../../src/components/Combobox.module.css"],"sourcesContent":["/* Combobox.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the bordered control (single-select input group\n * and multi-select chips container share the `.control` chrome), the chips,\n * the floating listbox surface, and the option rows.\n *\n * The control border tone is `neutral-500` for the same WCAG 1.4.11 reason\n * Input and Select use it (D10). The popup surface chrome and the option /\n * group / separator styling mirror Select exactly — Select and Combobox are\n * the two halves of the selection family and read as one system.\n *\n * Anchor-width: the popup takes `width: var(--anchor-width)` so the listbox\n * matches the control exactly — long options truncate (see `.itemText`)\n * rather than ballooning wider than the field (the Ant / Mantine / MUI /\n * shadcn-combobox default). `max-height: var(--available-height)` clamps it\n * to the viewport. Both vars come from Base UI's Positioner. Consumers\n * needing a wider panel override `width` via `className`. */\n\n/* === Control (Combobox.InputGroup, single) and chips box (Combobox.Chips,\n * multiple) — same bordered chrome === */\n.control {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--pharos-spacing-2);\n width: 100%;\n\n border: 1px solid var(--pharos-color-neutral-500);\n border-radius: var(--pharos-radius-md);\n background-color: var(--pharos-color-base-white);\n\n /* Set the Pharos sans stack on the box so everything inside it — chips,\n * the input — shares one typography. Without this the chips fall back to\n * the user-agent serif/system font (the bundle ships no global font), so\n * they read in a different typeface than the input. Same reason Input sets\n * font-family explicitly. */\n font-family: var(--pharos-font-family-sans);\n\n transition-property: border-color, box-shadow;\n transition-duration: var(--pharos-duration-normal);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n/* Lift the focus ring to the control when the inner input is focused, so the\n * whole bordered box reads as the focused control (the input itself carries\n * no border). */\n.control:focus-within {\n border-color: var(--pharos-color-primary-600);\n box-shadow:\n 0 0 0 2px var(--pharos-color-base-white),\n 0 0 0 4px var(--pharos-color-primary-600);\n}\n\n.control[aria-invalid='true'],\n.control:has([aria-invalid='true']) {\n border-color: var(--pharos-color-semantic-error-fg);\n}\n\n/* The multi-select chips box wraps its chips and grows vertically. */\n.chips {\n flex-wrap: wrap;\n gap: var(--pharos-spacing-1);\n padding: var(--pharos-spacing-1) var(--pharos-spacing-2);\n}\n\n/* === Bare input (Combobox.Input) ===\n * Carries no border of its own — the surrounding `.control` / `.chips` box\n * owns the chrome. Grows to fill the row. */\n.input {\n appearance: none;\n -webkit-appearance: none;\n\n flex: 1 1 auto;\n min-width: 0;\n margin: 0;\n border: none;\n outline: none;\n background: transparent;\n color: var(--pharos-color-neutral-900);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n font-weight: var(--pharos-font-weight-regular);\n line-height: 1.25;\n}\n\n.input::placeholder {\n color: var(--pharos-color-neutral-500);\n opacity: 1;\n}\n\n.input:disabled {\n cursor: not-allowed;\n}\n\n/* Standalone single-select input gets the same padding/height grid as Input\n * so it sits flush with other fields. */\n.inputSizeSm {\n height: var(--pharos-spacing-8);\n padding: 0 var(--pharos-spacing-3);\n}\n\n.inputSizeMd {\n height: var(--pharos-spacing-10);\n padding: 0 var(--pharos-spacing-4);\n}\n\n.inputSizeLg {\n height: var(--pharos-spacing-12);\n padding: 0 var(--pharos-spacing-6);\n font-size: var(--pharos-font-size-base);\n}\n\n/* Inside the chips box the input is a flexible filler — no fixed height, it\n * shares the row with the chips. */\n.chipsInput {\n height: var(--pharos-spacing-7);\n padding: 0 var(--pharos-spacing-1);\n flex: 1 1 4rem;\n}\n\n/* === Trigger (chevron) and clear button === */\n.trigger,\n.clear {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n width: var(--pharos-spacing-6);\n height: var(--pharos-spacing-6);\n margin-inline-end: var(--pharos-spacing-1);\n padding: 0;\n border: none;\n background: transparent;\n color: var(--pharos-color-neutral-500);\n cursor: default;\n}\n\n.trigger svg,\n.clear svg {\n width: 1rem;\n height: 1rem;\n}\n\n.trigger[data-popup-open] svg {\n transform: rotate(180deg);\n transition: transform var(--pharos-duration-fast) var(--pharos-easing-out);\n}\n\n/* === Chip (Combobox.Chip) === */\n.chip {\n display: inline-flex;\n align-items: center;\n gap: var(--pharos-spacing-1);\n padding: 0 var(--pharos-spacing-1) 0 var(--pharos-spacing-2);\n height: var(--pharos-spacing-6);\n\n border-radius: var(--pharos-radius-sm);\n background-color: var(--pharos-color-neutral-100);\n color: var(--pharos-color-neutral-900);\n font-size: var(--pharos-font-size-xs);\n}\n\n.chip[data-highlighted] {\n background-color: var(--pharos-color-neutral-200);\n}\n\n.chipRemove {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--pharos-spacing-4);\n height: var(--pharos-spacing-4);\n padding: 0;\n border: none;\n border-radius: var(--pharos-radius-sm);\n background: transparent;\n color: var(--pharos-color-neutral-500);\n cursor: default;\n}\n\n.chipRemove:hover {\n color: var(--pharos-color-neutral-900);\n}\n\n.chipRemove svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n/* === Positioner (Combobox.Positioner) ===\n * z-index lives here, not on `.content` (the Popup). Base UI's Positioner\n * anchors with `transform`, which creates a stacking context — so a z-index\n * on the inner Popup is trapped inside it and cannot rise above a host-app\n * overlay (e.g. a drawer with its own z-index). The z-index must sit on the\n * Positioner itself.\n *\n * Sourced from `--pharos-z-index-popover` (no hardcoded value — NON-NEGOTIABLE\n * rule 1). The fallback is D29's popover layer (1500, above modal 1400), for\n * an app whose pharos-tokens predates it; an app whose own overlays sit higher\n * (drawers, modals) raises every Pharos popup at once by overriding\n * `--pharos-z-index-popover` in `:root`. */\n.positioner {\n z-index: var(--pharos-z-index-popover, 1500);\n}\n\n/* === Floating surface (Combobox.Popup) — mirrors Select === */\n.content {\n box-sizing: border-box;\n width: var(--anchor-width);\n max-height: var(--available-height);\n overflow-y: auto;\n padding: var(--pharos-spacing-1);\n\n background-color: var(--pharos-color-base-white);\n border: 1px solid var(--pharos-color-neutral-200);\n border-radius: var(--pharos-radius-md);\n box-shadow: var(--pharos-shadow-lg);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n color: var(--pharos-color-neutral-900);\n\n outline: none;\n\n transform-origin: var(--transform-origin);\n transition-property: opacity, transform;\n transition-duration: var(--pharos-duration-fast);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.content[data-starting-style],\n.content[data-ending-style] {\n opacity: 0;\n transform: scale(0.96);\n}\n\n/* === Option (Combobox.Item) === */\n.item {\n position: relative;\n display: flex;\n align-items: flex-start;\n gap: var(--pharos-spacing-2);\n\n padding: var(--pharos-spacing-2) var(--pharos-spacing-3);\n border-radius: var(--pharos-radius-sm);\n\n color: var(--pharos-color-neutral-900);\n cursor: default;\n user-select: none;\n outline: none;\n scroll-margin: var(--pharos-spacing-1);\n}\n\n.item[data-highlighted] {\n background-color: var(--pharos-color-neutral-100);\n}\n\n.item[data-disabled] {\n color: var(--pharos-color-neutral-400);\n pointer-events: none;\n}\n\n/* Long options wrap onto as many lines as they need. Cutting them with an\n * ellipsis hides exactly the end that tells similar options apart (a list of\n * timezones: «(GMT-06:00) America/Mexico_City — Central Standard…»). */\n.itemText {\n flex: 1 1 auto;\n min-width: 0;\n overflow-wrap: anywhere;\n white-space: normal;\n}\n\n.itemIndicator {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n /* One line tall, so the check sits on the first line of a wrapped option. */\n block-size: 1lh;\n color: var(--pharos-color-primary-600);\n}\n\n.itemIndicator svg {\n width: 1rem;\n height: 1rem;\n}\n\n/* === Empty state (Combobox.Empty) ===\n * Base UI keeps this element mounted even when there ARE results (it is a\n * `role=\"status\"` live region and must not be removed / `display:none`-d, or\n * screen readers miss the \"no results\" announcement) — it only nulls its\n * children. So when results exist the element is present but childless;\n * `:not(:empty)` applies the padding only when a message is actually shown,\n * collapsing the box to zero height otherwise. Without this the empty live\n * region adds a block of padding above the list and the popup looks\n * top-heavy / asymmetric against its bottom edge. */\n.empty {\n color: var(--pharos-color-neutral-500);\n text-align: center;\n}\n\n.empty:not(:empty) {\n padding: var(--pharos-spacing-3);\n}\n\n/* === Group + label + separator (mirror Select) === */\n.label {\n padding: var(--pharos-spacing-2) var(--pharos-spacing-3) var(--pharos-spacing-1);\n font-size: var(--pharos-font-size-xs);\n font-weight: var(--pharos-font-weight-semibold);\n color: var(--pharos-color-neutral-600);\n}\n\n.separator {\n height: 1px;\n margin: var(--pharos-spacing-1) 0;\n background-color: var(--pharos-color-neutral-200);\n}\n\n/* === Touch screens ===\n * iOS Safari zooms the whole page into any text field whose font is smaller\n * than 16px the moment it is focused, and apps used to stop it by forbidding\n * zoom altogether (`maximum-scale=1`), which breaks WCAG 1.4.4. On a coarse\n * pointer every size types at `base` (16px), so the page can stay zoomable. */\n@media (pointer: coarse) {\n .input {\n font-size: var(--pharos-font-size-base);\n }\n}\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"Combobox.module.js","names":[],"sources":["../../src/components/Combobox.module.css"],"sourcesContent":["/* Combobox.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the bordered control (single-select input group\n * and multi-select chips container share the `.control` chrome), the chips,\n * the floating listbox surface, and the option rows.\n *\n * The control border tone is `neutral-500` for the same WCAG 1.4.11 reason\n * Input and Select use it (D10). The popup surface chrome and the option /\n * group / separator styling mirror Select exactly — Select and Combobox are\n * the two halves of the selection family and read as one system.\n *\n * Anchor-width: the popup takes `width: var(--anchor-width)` so the listbox\n * matches the control exactly — long options truncate (see `.itemText`)\n * rather than ballooning wider than the field (the Ant / Mantine / MUI /\n * shadcn-combobox default). `max-height: var(--available-height)` clamps it\n * to the viewport. Both vars come from Base UI's Positioner. Consumers\n * needing a wider panel override `width` via `className`. */\n\n/* === Control (Combobox.InputGroup, single) and chips box (Combobox.Chips,\n * multiple) — same bordered chrome === */\n.control {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--pharos-spacing-2);\n width: 100%;\n\n border: 1px solid var(--pharos-color-neutral-500);\n border-radius: var(--pharos-radius-md);\n background-color: var(--pharos-color-base-white);\n\n /* Set the Pharos sans stack on the box so everything inside it — chips,\n * the input — shares one typography. Without this the chips fall back to\n * the user-agent serif/system font (the bundle ships no global font), so\n * they read in a different typeface than the input. Same reason Input sets\n * font-family explicitly. */\n font-family: var(--pharos-font-family-sans);\n\n transition-property: border-color, box-shadow;\n transition-duration: var(--pharos-duration-normal);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n/* Lift the focus ring to the control when the inner input is focused, so the\n * whole bordered box reads as the focused control (the input itself carries\n * no border). */\n.control:focus-within {\n border-color: var(--pharos-color-primary-600);\n box-shadow:\n 0 0 0 2px var(--pharos-color-base-white),\n 0 0 0 4px var(--pharos-color-primary-600);\n}\n\n.control[aria-invalid='true'],\n.control:has([aria-invalid='true']) {\n border-color: var(--pharos-color-semantic-error-fg);\n}\n\n/* Disabled: the whole box reads as unavailable, at the opacity Input and the\n * Select trigger use, so a disabled Combobox matches the fields beside it.\n * Base UI marks the single-select box (`InputGroup`) with `data-disabled`;\n * the multi-select chips box gets no attribute of its own, so it is matched\n * by the disabled input it holds. */\n.control[data-disabled],\n.control:has(.input:disabled) {\n opacity: 0.5;\n cursor: not-allowed;\n}\n\n/* The multi-select chips box wraps its chips and grows vertically. */\n.chips {\n flex-wrap: wrap;\n gap: var(--pharos-spacing-1);\n padding: var(--pharos-spacing-1) var(--pharos-spacing-2);\n}\n\n/* === Bare input (Combobox.Input) ===\n * Carries no border of its own — the surrounding `.control` / `.chips` box\n * owns the chrome. Grows to fill the row. */\n.input {\n appearance: none;\n -webkit-appearance: none;\n\n flex: 1 1 auto;\n min-width: 0;\n margin: 0;\n border: none;\n outline: none;\n background: transparent;\n color: var(--pharos-color-neutral-900);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n font-weight: var(--pharos-font-weight-regular);\n line-height: 1.25;\n}\n\n.input::placeholder {\n color: var(--pharos-color-neutral-500);\n opacity: 1;\n}\n\n.input:disabled {\n cursor: not-allowed;\n}\n\n/* Standalone single-select input gets the same padding/height grid as Input\n * so it sits flush with other fields. */\n.inputSizeSm {\n height: var(--pharos-spacing-8);\n padding: 0 var(--pharos-spacing-3);\n}\n\n.inputSizeMd {\n height: var(--pharos-spacing-10);\n padding: 0 var(--pharos-spacing-4);\n}\n\n.inputSizeLg {\n height: var(--pharos-spacing-12);\n padding: 0 var(--pharos-spacing-6);\n font-size: var(--pharos-font-size-base);\n}\n\n/* Inside the chips box the input is a flexible filler — no fixed height, it\n * shares the row with the chips. */\n.chipsInput {\n height: var(--pharos-spacing-7);\n padding: 0 var(--pharos-spacing-1);\n flex: 1 1 4rem;\n}\n\n/* === Trigger (chevron) and clear button === */\n.trigger,\n.clear {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n width: var(--pharos-spacing-6);\n height: var(--pharos-spacing-6);\n margin-inline-end: var(--pharos-spacing-1);\n padding: 0;\n border: none;\n background: transparent;\n color: var(--pharos-color-neutral-500);\n cursor: default;\n}\n\n.trigger svg,\n.clear svg {\n width: 1rem;\n height: 1rem;\n}\n\n.trigger[data-popup-open] svg {\n transform: rotate(180deg);\n transition: transform var(--pharos-duration-fast) var(--pharos-easing-out);\n}\n\n/* === Chip (Combobox.Chip) === */\n.chip {\n display: inline-flex;\n align-items: center;\n gap: var(--pharos-spacing-1);\n padding: 0 var(--pharos-spacing-1) 0 var(--pharos-spacing-2);\n height: var(--pharos-spacing-6);\n\n border-radius: var(--pharos-radius-sm);\n background-color: var(--pharos-color-neutral-100);\n color: var(--pharos-color-neutral-900);\n font-size: var(--pharos-font-size-xs);\n}\n\n.chip[data-highlighted] {\n background-color: var(--pharos-color-neutral-200);\n}\n\n.chipRemove {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n width: var(--pharos-spacing-4);\n height: var(--pharos-spacing-4);\n padding: 0;\n border: none;\n border-radius: var(--pharos-radius-sm);\n background: transparent;\n color: var(--pharos-color-neutral-500);\n cursor: default;\n}\n\n.chipRemove:hover {\n color: var(--pharos-color-neutral-900);\n}\n\n/* Nothing inside a disabled Combobox answers the pointer: the chevron, the\n * clear button and a chip's remove button all show `not-allowed`, and the\n * remove button stops darkening on hover. */\n.trigger[data-disabled],\n.clear[data-disabled],\n.chipRemove[data-disabled] {\n cursor: not-allowed;\n}\n\n.chipRemove[data-disabled]:hover {\n color: var(--pharos-color-neutral-500);\n}\n\n.chipRemove svg {\n width: 0.875rem;\n height: 0.875rem;\n}\n\n/* === Positioner (Combobox.Positioner) ===\n * z-index lives here, not on `.content` (the Popup). Base UI's Positioner\n * anchors with `transform`, which creates a stacking context — so a z-index\n * on the inner Popup is trapped inside it and cannot rise above a host-app\n * overlay (e.g. a drawer with its own z-index). The z-index must sit on the\n * Positioner itself.\n *\n * Sourced from `--pharos-z-index-popover` (no hardcoded value — NON-NEGOTIABLE\n * rule 1): D29's popover layer, 1500, above modal 1400. An app whose own\n * overlays sit higher (drawers, modals) raises every Pharos popup at once by\n * overriding `--pharos-z-index-popover` in `:root`. */\n.positioner {\n z-index: var(--pharos-z-index-popover);\n}\n\n/* === Floating surface (Combobox.Popup) — mirrors Select === */\n.content {\n box-sizing: border-box;\n width: var(--anchor-width);\n max-height: var(--available-height);\n overflow-y: auto;\n padding: var(--pharos-spacing-1);\n\n background-color: var(--pharos-color-base-white);\n border: 1px solid var(--pharos-color-neutral-200);\n border-radius: var(--pharos-radius-md);\n box-shadow: var(--pharos-shadow-lg);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n color: var(--pharos-color-neutral-900);\n\n outline: none;\n\n transform-origin: var(--transform-origin);\n transition-property: opacity, transform;\n transition-duration: var(--pharos-duration-fast);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.content[data-starting-style],\n.content[data-ending-style] {\n opacity: 0;\n transform: scale(0.96);\n}\n\n/* === Option (Combobox.Item) === */\n.item {\n position: relative;\n display: flex;\n align-items: flex-start;\n gap: var(--pharos-spacing-2);\n\n padding: var(--pharos-spacing-2) var(--pharos-spacing-3);\n border-radius: var(--pharos-radius-sm);\n\n color: var(--pharos-color-neutral-900);\n cursor: default;\n user-select: none;\n outline: none;\n scroll-margin: var(--pharos-spacing-1);\n}\n\n.item[data-highlighted] {\n background-color: var(--pharos-color-neutral-100);\n}\n\n.item[data-disabled] {\n color: var(--pharos-color-neutral-400);\n pointer-events: none;\n}\n\n/* Long options wrap onto as many lines as they need. Cutting them with an\n * ellipsis hides exactly the end that tells similar options apart (a list of\n * timezones: «(GMT-06:00) America/Mexico_City — Central Standard…»). */\n.itemText {\n flex: 1 1 auto;\n min-width: 0;\n overflow-wrap: anywhere;\n white-space: normal;\n}\n\n.itemIndicator {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n /* One line tall, so the check sits on the first line of a wrapped option. */\n block-size: 1lh;\n color: var(--pharos-color-primary-600);\n}\n\n.itemIndicator svg {\n width: 1rem;\n height: 1rem;\n}\n\n/* === Empty state (Combobox.Empty) ===\n * Base UI keeps this element mounted even when there ARE results (it is a\n * `role=\"status\"` live region and must not be removed / `display:none`-d, or\n * screen readers miss the \"no results\" announcement) — it only nulls its\n * children. So when results exist the element is present but childless;\n * `:not(:empty)` applies the padding only when a message is actually shown,\n * collapsing the box to zero height otherwise. Without this the empty live\n * region adds a block of padding above the list and the popup looks\n * top-heavy / asymmetric against its bottom edge. */\n.empty {\n color: var(--pharos-color-neutral-500);\n text-align: center;\n}\n\n.empty:not(:empty) {\n padding: var(--pharos-spacing-3);\n}\n\n/* === Group + label + separator (mirror Select) === */\n.label {\n padding: var(--pharos-spacing-2) var(--pharos-spacing-3) var(--pharos-spacing-1);\n font-size: var(--pharos-font-size-xs);\n font-weight: var(--pharos-font-weight-semibold);\n color: var(--pharos-color-neutral-600);\n}\n\n.separator {\n height: 1px;\n margin: var(--pharos-spacing-1) 0;\n background-color: var(--pharos-color-neutral-200);\n}\n\n/* === Touch screens ===\n * iOS Safari zooms the whole page into any text field whose font is smaller\n * than 16px the moment it is focused, and apps used to stop it by forbidding\n * zoom altogether (`maximum-scale=1`), which breaks WCAG 1.4.4. On a coarse\n * pointer every size types at `base` (16px), so the page can stay zoomable. */\n@media (pointer: coarse) {\n .input {\n font-size: var(--pharos-font-size-base);\n }\n}\n"],"mappings":""}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
var e = {
|
|
2
|
-
backdrop: "
|
|
3
|
-
content: "
|
|
4
|
-
header: "
|
|
5
|
-
title: "
|
|
6
|
-
description: "
|
|
7
|
-
footer: "
|
|
2
|
+
backdrop: "_backdrop_1d4e6_19",
|
|
3
|
+
content: "_content_1d4e6_33",
|
|
4
|
+
header: "_header_1d4e6_76",
|
|
5
|
+
title: "_title_1d4e6_82",
|
|
6
|
+
description: "_description_1d4e6_90",
|
|
7
|
+
footer: "_footer_1d4e6_97"
|
|
8
8
|
};
|
|
9
9
|
//#endregion
|
|
10
10
|
export { e as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.module.js","names":[],"sources":["../../src/components/Dialog.module.css"],"sourcesContent":["/* Dialog.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles a centered modal panel — the shadcn \"Dialog\"\n * contract over Base UI's `Dialog` (modal: focus trap, scroll lock, backdrop).\n * Sibling of Sheet (D18): same Base UI primitive, but centered with a\n * fade-and-scale transition instead of an edge slide. Motion is driven by Base\n * UI's `data-starting-style` / `data-ending-style` state attributes.\n *\n * z-index: backdrop and panel share `--pharos-z-index-modal` (decision D29,\n * modal 1400). Sharing one layer is what makes a modal opened over another\n * work: the one opened later is later in the DOM and paints above, backdrop\n * included. A backdrop on a lower layer (overlay 1300) would sit under the\n * first modal's panel and leave it undimmed. A Select, Popover or menu opened\n * from inside the dialog sits on the popover layer (1500), above it.\n
|
|
1
|
+
{"version":3,"file":"Dialog.module.js","names":[],"sources":["../../src/components/Dialog.module.css"],"sourcesContent":["/* Dialog.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles a centered modal panel — the shadcn \"Dialog\"\n * contract over Base UI's `Dialog` (modal: focus trap, scroll lock, backdrop).\n * Sibling of Sheet (D18): same Base UI primitive, but centered with a\n * fade-and-scale transition instead of an edge slide. Motion is driven by Base\n * UI's `data-starting-style` / `data-ending-style` state attributes.\n *\n * z-index: backdrop and panel share `--pharos-z-index-modal` (decision D29,\n * modal 1400). Sharing one layer is what makes a modal opened over another\n * work: the one opened later is later in the DOM and paints above, backdrop\n * included. A backdrop on a lower layer (overlay 1300) would sit under the\n * first modal's panel and leave it undimmed. A Select, Popover or menu opened\n * from inside the dialog sits on the popover layer (1500), above it.\n */\n\n/* === Backdrop (Dialog.Backdrop) === */\n.backdrop {\n position: fixed;\n inset: 0;\n z-index: var(--pharos-z-index-modal);\n background-color: color-mix(in srgb, var(--pharos-color-base-black) 50%, transparent);\n transition: opacity var(--pharos-duration-normal) var(--pharos-easing-out);\n}\n\n.backdrop[data-starting-style],\n.backdrop[data-ending-style] {\n opacity: 0;\n}\n\n/* === Panel (Dialog.Popup) === */\n.content {\n position: fixed;\n top: 50%;\n left: 50%;\n /* Centering lives in the transform; the scale for the open/close motion is\n * composed on top of the same translate (see starting/ending styles). */\n transform: translate(-50%, -50%);\n transform-origin: center;\n z-index: var(--pharos-z-index-modal);\n\n box-sizing: border-box;\n width: calc(100% - 2 * var(--pharos-spacing-4));\n max-width: 32rem;\n max-height: calc(100dvh - 2 * var(--pharos-spacing-6));\n overflow-y: auto;\n\n display: flex;\n flex-direction: column;\n gap: var(--pharos-spacing-4);\n padding: var(--pharos-spacing-6);\n\n background-color: var(--pharos-color-base-white);\n border-radius: var(--pharos-radius-lg);\n box-shadow: var(--pharos-shadow-xl);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n color: var(--pharos-color-neutral-900);\n\n outline: none;\n\n transition-property: opacity, transform;\n transition-duration: var(--pharos-duration-fast);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.content[data-starting-style],\n.content[data-ending-style] {\n opacity: 0;\n transform: translate(-50%, -50%) scale(0.96);\n}\n\n/* === Slots === */\n.header {\n display: flex;\n flex-direction: column;\n gap: var(--pharos-spacing-1);\n}\n\n.title {\n margin: 0;\n font-size: var(--pharos-font-size-lg);\n font-weight: var(--pharos-font-weight-semibold);\n line-height: 1.4;\n color: var(--pharos-color-neutral-900);\n}\n\n.description {\n margin: 0;\n font-size: var(--pharos-font-size-sm);\n line-height: 1.5;\n color: var(--pharos-color-neutral-600);\n}\n\n.footer {\n display: flex;\n gap: var(--pharos-spacing-2);\n justify-content: flex-end;\n margin-top: auto;\n}\n"],"mappings":""}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
var e = {
|
|
2
|
-
positioner: "
|
|
3
|
-
content: "
|
|
4
|
-
item: "
|
|
5
|
-
itemDestructive: "
|
|
6
|
-
separator: "
|
|
7
|
-
label: "
|
|
2
|
+
positioner: "_positioner_e7uyk_9",
|
|
3
|
+
content: "_content_e7uyk_4",
|
|
4
|
+
item: "_item_e7uyk_5",
|
|
5
|
+
itemDestructive: "_itemDestructive_e7uyk_113",
|
|
6
|
+
separator: "_separator_e7uyk_6",
|
|
7
|
+
label: "_label_e7uyk_6"
|
|
8
8
|
};
|
|
9
9
|
//#endregion
|
|
10
10
|
export { e as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenu.module.js","names":[],"sources":["../../src/components/DropdownMenu.module.css"],"sourcesContent":["/* DropdownMenu.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the floating surface (`.content`), the\n * action rows (`.item`, with a `destructive` tone), the structural\n * parts (`.separator`, `.label`, `.group`), and the open/close\n * transition driven by Base UI's `data-*` state attributes.\n *\n * z-index lives on `.positioner` (see below). Base UI portals the menu to the\n * end of `<body>`; that floats it above in-flow content, but not above a\n * host-app overlay (drawer/modal) with its own z-index — and a z-index on the\n * Popup is trapped by the Positioner's transform stacking context. The\n * Positioner therefore carries `z-index: var(--pharos-z-index-popover
|
|
1
|
+
{"version":3,"file":"DropdownMenu.module.js","names":[],"sources":["../../src/components/DropdownMenu.module.css"],"sourcesContent":["/* DropdownMenu.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the floating surface (`.content`), the\n * action rows (`.item`, with a `destructive` tone), the structural\n * parts (`.separator`, `.label`, `.group`), and the open/close\n * transition driven by Base UI's `data-*` state attributes.\n *\n * z-index lives on `.positioner` (see below). Base UI portals the menu to the\n * end of `<body>`; that floats it above in-flow content, but not above a\n * host-app overlay (drawer/modal) with its own z-index — and a z-index on the\n * Popup is trapped by the Positioner's transform stacking context. The\n * Positioner therefore carries `z-index: var(--pharos-z-index-popover)`,\n * the shared scale Combobox / Select / Popover all use now. */\n\n/* === Positioner (Menu.Positioner) ===\n * z-index lives here, not on `.content` (the Popup). Base UI's Positioner\n * anchors with `transform`, which creates a stacking context — so a z-index\n * on the inner Popup is trapped inside it and cannot rise above a host-app\n * overlay (e.g. a drawer with its own z-index). The z-index must sit on the\n * Positioner itself.\n *\n * Sourced from `--pharos-z-index-popover` (no hardcoded value — NON-NEGOTIABLE\n * rule 1): D29's popover layer, 1500, above modal 1400. An app whose own\n * overlays sit higher (drawers, modals) raises every Pharos popup at once by\n * overriding `--pharos-z-index-popover` in `:root`. */\n.positioner {\n z-index: var(--pharos-z-index-popover);\n}\n\n/* === Floating surface (Menu.Popup) === */\n.content {\n box-sizing: border-box;\n min-width: 12rem;\n padding: var(--pharos-spacing-1);\n\n background-color: var(--pharos-color-base-white);\n border: 1px solid var(--pharos-color-neutral-200);\n border-radius: var(--pharos-radius-md);\n box-shadow: var(--pharos-shadow-lg);\n\n font-family: var(--pharos-font-family-sans);\n color: var(--pharos-color-neutral-900);\n\n /* Open/close transition keyed off Base UI's `data-starting-style` /\n * `data-ending-style`. The popup fades and lifts a few pixels from\n * the anchored side — the same motion shadcn / Radix ship. */\n transform-origin: var(--transform-origin);\n transition-property: opacity, transform;\n transition-duration: var(--pharos-duration-fast);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.content[data-starting-style],\n.content[data-ending-style] {\n opacity: 0;\n transform: scale(0.96);\n}\n\n/* === Action row (Menu.Item) === */\n.item {\n box-sizing: border-box;\n display: flex;\n align-items: center;\n gap: var(--pharos-spacing-2);\n width: 100%;\n padding: var(--pharos-spacing-1-5) var(--pharos-spacing-2);\n\n border-radius: var(--pharos-radius-sm);\n font-size: var(--pharos-font-size-sm);\n font-weight: var(--pharos-font-weight-medium);\n line-height: 1.25;\n color: var(--pharos-color-neutral-700);\n\n cursor: default;\n user-select: none;\n outline: none;\n scroll-margin: var(--pharos-spacing-1);\n\n transition-property: background-color, color;\n transition-duration: var(--pharos-duration-fast);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n/* Base UI marks the active row (keyboard navigation or pointer, when\n * `highlightItemOnHover` is on) with `data-highlighted`. A single\n * highlight state covers both pointer hover and arrow-key focus, so\n * the menu reads identically whichever input drives it. */\n.item[data-highlighted] {\n background-color: var(--pharos-color-neutral-100);\n color: var(--pharos-color-neutral-900);\n}\n\n.item[data-disabled] {\n color: var(--pharos-color-neutral-500);\n opacity: 0.6;\n pointer-events: none;\n}\n\n/* Icons composed inside the row inherit the row colour and size to the\n * text cap height, matching the IconButton `> svg` convention. */\n.item > svg {\n width: 1rem;\n height: 1rem;\n flex-shrink: 0;\n}\n\n/* === Destructive tone ===\n * shadcn ships a `destructive` variant on DropdownMenuItem; Alexandria\n * has several delete / remove actions (career-ladder delete, lesson\n * delete, RemoveBox) that map onto it. The error foreground darkens on\n * highlight the same way the destructive Button does. */\n.itemDestructive {\n color: var(--pharos-color-semantic-error-fg);\n}\n\n.itemDestructive[data-highlighted] {\n background-color: var(--pharos-color-semantic-error-bg);\n color: var(--pharos-color-semantic-error-fg-hover);\n}\n\n/* === Separator (Menu.Separator) === */\n.separator {\n height: 1px;\n margin: var(--pharos-spacing-1) calc(var(--pharos-spacing-1) * -1);\n background-color: var(--pharos-color-neutral-200);\n}\n\n/* === Group label (Menu.GroupLabel) === */\n.label {\n padding: var(--pharos-spacing-1-5) var(--pharos-spacing-2);\n font-size: var(--pharos-font-size-sm);\n font-weight: var(--pharos-font-weight-semibold);\n color: var(--pharos-color-neutral-500);\n}\n"],"mappings":""}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
var e = {
|
|
2
|
-
positioner: "
|
|
3
|
-
content: "
|
|
4
|
-
title: "
|
|
5
|
-
description: "
|
|
2
|
+
positioner: "_positioner_l8xbr_15",
|
|
3
|
+
content: "_content_l8xbr_4",
|
|
4
|
+
title: "_title_l8xbr_5",
|
|
5
|
+
description: "_description_l8xbr_5"
|
|
6
6
|
};
|
|
7
7
|
//#endregion
|
|
8
8
|
export { e as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.module.js","names":[],"sources":["../../src/components/Popover.module.css"],"sourcesContent":["/* Popover.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the floating surface (`.content`), the dialog\n * labelling parts (`.title`, `.description`), and the open/close transition\n * driven by Base UI's `data-*` state attributes.\n *\n * Unlike DropdownMenu, a Popover carries arbitrary content rather than a\n * list of rows, so the surface uses a more generous block padding and a\n * `max-width` to keep prose readable. The `.content` chrome (white surface,\n * subtle border, large shadow, fade-and-scale motion) is intentionally\n * identical to DropdownMenu — both are anchored overlays and should read as\n * the same surface family.\n *\n * z-index lives on `.positioner` (see below). Base UI portals the popover to\n * the end of `<body>`; that floats it above in-flow content, but not above a\n * host-app overlay (drawer/modal) with its own z-index — and a z-index on the\n * Popup is trapped by the Positioner's transform stacking context. The\n * Positioner therefore carries `z-index: var(--pharos-z-index-popover
|
|
1
|
+
{"version":3,"file":"Popover.module.js","names":[],"sources":["../../src/components/Popover.module.css"],"sourcesContent":["/* Popover.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the floating surface (`.content`), the dialog\n * labelling parts (`.title`, `.description`), and the open/close transition\n * driven by Base UI's `data-*` state attributes.\n *\n * Unlike DropdownMenu, a Popover carries arbitrary content rather than a\n * list of rows, so the surface uses a more generous block padding and a\n * `max-width` to keep prose readable. The `.content` chrome (white surface,\n * subtle border, large shadow, fade-and-scale motion) is intentionally\n * identical to DropdownMenu — both are anchored overlays and should read as\n * the same surface family.\n *\n * z-index lives on `.positioner` (see below). Base UI portals the popover to\n * the end of `<body>`; that floats it above in-flow content, but not above a\n * host-app overlay (drawer/modal) with its own z-index — and a z-index on the\n * Popup is trapped by the Positioner's transform stacking context. The\n * Positioner therefore carries `z-index: var(--pharos-z-index-popover)`,\n * the shared scale Combobox / Select / DropdownMenu all use now. */\n\n/* === Positioner (Popover.Positioner) ===\n * z-index lives here, not on `.content` (the Popup). Base UI's Positioner\n * anchors with `transform`, which creates a stacking context — so a z-index\n * on the inner Popup is trapped inside it and cannot rise above a host-app\n * overlay (e.g. a drawer with its own z-index). The z-index must sit on the\n * Positioner itself.\n *\n * Sourced from `--pharos-z-index-popover` (no hardcoded value — NON-NEGOTIABLE\n * rule 1): D29's popover layer, 1500, above modal 1400. An app whose own\n * overlays sit higher (drawers, modals) raises every Pharos popup at once by\n * overriding `--pharos-z-index-popover` in `:root`. */\n.positioner {\n z-index: var(--pharos-z-index-popover);\n}\n\n/* === Floating surface (Popover.Popup) === */\n.content {\n box-sizing: border-box;\n max-width: 20rem;\n padding: var(--pharos-spacing-4);\n\n background-color: var(--pharos-color-base-white);\n border: 1px solid var(--pharos-color-neutral-200);\n border-radius: var(--pharos-radius-md);\n box-shadow: var(--pharos-shadow-lg);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n color: var(--pharos-color-neutral-900);\n\n outline: none;\n\n /* Open/close transition keyed off Base UI's `data-starting-style` /\n * `data-ending-style`. The popup fades and lifts a few pixels from the\n * anchored side — the same motion DropdownMenu / shadcn / Radix ship. */\n transform-origin: var(--transform-origin);\n transition-property: opacity, transform;\n transition-duration: var(--pharos-duration-fast);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.content[data-starting-style],\n.content[data-ending-style] {\n opacity: 0;\n transform: scale(0.96);\n}\n\n/* === Title (Popover.Title) ===\n * The accessible name. Renders as <h2> but is sized as body-strong, not as\n * a document heading — a popover title is a label, not page structure. */\n.title {\n margin: 0;\n font-size: var(--pharos-font-size-base);\n font-weight: var(--pharos-font-weight-semibold);\n line-height: 1.4;\n color: var(--pharos-color-neutral-900);\n}\n\n/* === Description (Popover.Description) ===\n * Supporting copy under the title. Sits a hair below the title with the\n * muted foreground used for secondary text across the system. */\n.description {\n margin: var(--pharos-spacing-1) 0 0;\n font-size: var(--pharos-font-size-sm);\n line-height: 1.5;\n color: var(--pharos-color-neutral-600);\n}\n"],"mappings":""}
|
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
var e = {
|
|
2
|
-
trigger: "
|
|
3
|
-
sizeSm: "
|
|
4
|
-
sizeMd: "
|
|
5
|
-
sizeLg: "
|
|
6
|
-
value: "
|
|
7
|
-
icon: "
|
|
8
|
-
positioner: "
|
|
9
|
-
content: "
|
|
10
|
-
item: "
|
|
11
|
-
itemText: "
|
|
12
|
-
itemIndicator: "
|
|
13
|
-
label: "
|
|
14
|
-
separator: "
|
|
2
|
+
trigger: "_trigger_g5qz6_35",
|
|
3
|
+
sizeSm: "_sizeSm_g5qz6_92",
|
|
4
|
+
sizeMd: "_sizeMd_g5qz6_98",
|
|
5
|
+
sizeLg: "_sizeLg_g5qz6_104",
|
|
6
|
+
value: "_value_g5qz6_113",
|
|
7
|
+
icon: "_icon_g5qz6_127",
|
|
8
|
+
positioner: "_positioner_g5qz6_24",
|
|
9
|
+
content: "_content_g5qz6_146",
|
|
10
|
+
item: "_item_g5qz6_17",
|
|
11
|
+
itemText: "_itemText_g5qz6_17",
|
|
12
|
+
itemIndicator: "_itemIndicator_g5qz6_230",
|
|
13
|
+
label: "_label_g5qz6_246",
|
|
14
|
+
separator: "_separator_g5qz6_254"
|
|
15
15
|
};
|
|
16
16
|
//#endregion
|
|
17
17
|
export { e as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.module.js","names":[],"sources":["../../src/components/Select.module.css"],"sourcesContent":["/* Select.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the trigger (which shares the Input chrome so a\n * Select sits flush next to an Input on the same form row), the floating\n * listbox surface, and the option rows.\n *\n * The trigger border tone is `neutral-500` for the same WCAG 1.4.11 reason\n * Input uses it (D10): a Select trigger is an interactive control boundary,\n * so it must clear the 3:1 non-text contrast bar. The popup surface chrome\n * (white, subtle `neutral-200` border, large shadow, fade-and-scale motion)\n * is deliberately identical to DropdownMenu and Popover — every anchored\n * overlay reads as the same surface family.\n *\n * Anchor-width: the popup takes `width: var(--anchor-width)` so the listbox\n * matches the trigger that opened it exactly — long options truncate (see\n * `.itemText`) rather than ballooning the panel wider than the field, the\n * Ant / Mantine / MUI / shadcn-combobox default. Base UI sets `--anchor-width`\n * on the Positioner; it cascades to the Popup. This is the affordance that\n * was missing from Popover v1 and forced the picker call-sites to be deferred\n * to this atom. Consumers needing a wider panel override `width` via\n * `className` per call-site.\n *\n * z-index lives on `.positioner` (see below). Base UI portals the popup to\n * the end of `<body>`; that floats it above in-flow content, but not above a\n * host-app overlay (drawer/modal) with its own z-index — and a z-index on the\n * Popup is trapped by the Positioner's transform stacking context. The\n * Positioner therefore carries `z-index: var(--pharos-z-index-popover
|
|
1
|
+
{"version":3,"file":"Select.module.js","names":[],"sources":["../../src/components/Select.module.css"],"sourcesContent":["/* Select.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the trigger (which shares the Input chrome so a\n * Select sits flush next to an Input on the same form row), the floating\n * listbox surface, and the option rows.\n *\n * The trigger border tone is `neutral-500` for the same WCAG 1.4.11 reason\n * Input uses it (D10): a Select trigger is an interactive control boundary,\n * so it must clear the 3:1 non-text contrast bar. The popup surface chrome\n * (white, subtle `neutral-200` border, large shadow, fade-and-scale motion)\n * is deliberately identical to DropdownMenu and Popover — every anchored\n * overlay reads as the same surface family.\n *\n * Anchor-width: the popup takes `width: var(--anchor-width)` so the listbox\n * matches the trigger that opened it exactly — long options truncate (see\n * `.itemText`) rather than ballooning the panel wider than the field, the\n * Ant / Mantine / MUI / shadcn-combobox default. Base UI sets `--anchor-width`\n * on the Positioner; it cascades to the Popup. This is the affordance that\n * was missing from Popover v1 and forced the picker call-sites to be deferred\n * to this atom. Consumers needing a wider panel override `width` via\n * `className` per call-site.\n *\n * z-index lives on `.positioner` (see below). Base UI portals the popup to\n * the end of `<body>`; that floats it above in-flow content, but not above a\n * host-app overlay (drawer/modal) with its own z-index — and a z-index on the\n * Popup is trapped by the Positioner's transform stacking context. The\n * Positioner therefore carries `z-index: var(--pharos-z-index-popover)`,\n * the shared scale Combobox / DropdownMenu / Popover all use now. */\n\n/* === Trigger (Select.Trigger) ===\n * Same chrome as Input: white fill, `neutral-500` resting border, brand\n * focus ring. Laid out as a row so the value grows and the chevron pins to\n * the trailing edge. */\n.trigger {\n appearance: none;\n -webkit-appearance: none;\n\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--pharos-spacing-2);\n width: 100%;\n margin: 0;\n\n border: 1px solid var(--pharos-color-neutral-500);\n border-radius: var(--pharos-radius-md);\n background-color: var(--pharos-color-base-white);\n color: var(--pharos-color-neutral-900);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n font-weight: var(--pharos-font-weight-regular);\n line-height: 1.25;\n text-align: start;\n cursor: default;\n\n transition-property: border-color, box-shadow;\n transition-duration: var(--pharos-duration-normal);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.trigger:focus-visible {\n outline: none;\n border-color: var(--pharos-color-primary-600);\n box-shadow:\n 0 0 0 2px var(--pharos-color-base-white),\n 0 0 0 4px var(--pharos-color-primary-600);\n}\n\n.trigger:disabled,\n.trigger[data-disabled] {\n cursor: not-allowed;\n opacity: 0.5;\n}\n\n.trigger[aria-invalid='true'] {\n border-color: var(--pharos-color-semantic-error-fg);\n}\n\n.trigger[aria-invalid='true']:focus-visible {\n border-color: var(--pharos-color-semantic-error-fg);\n box-shadow:\n 0 0 0 2px var(--pharos-color-base-white),\n 0 0 0 4px var(--pharos-color-semantic-error-fg);\n}\n\n/* === Sizes ===\n * Heights match the Input/Button grid exactly so a Select aligns with the\n * other controls on a row. */\n.sizeSm {\n height: var(--pharos-spacing-8);\n padding: 0 var(--pharos-spacing-3);\n font-size: var(--pharos-font-size-sm);\n}\n\n.sizeMd {\n height: var(--pharos-spacing-10);\n padding: 0 var(--pharos-spacing-4);\n font-size: var(--pharos-font-size-sm);\n}\n\n.sizeLg {\n height: var(--pharos-spacing-12);\n padding: 0 var(--pharos-spacing-6);\n font-size: var(--pharos-font-size-base);\n}\n\n/* === Value (Select.Value) ===\n * Grows to fill the trigger and truncates rather than wrapping. The\n * placeholder state is tinted with the same muted tone as Input's. */\n.value {\n flex: 1 1 auto;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.value[data-placeholder] {\n color: var(--pharos-color-neutral-500);\n}\n\n/* === Chevron (Select.Icon) ===\n * Inline SVG sized to the control. Rotates when the popup is open. */\n.icon {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n color: var(--pharos-color-neutral-500);\n transition: transform var(--pharos-duration-fast) var(--pharos-easing-out);\n}\n\n.icon svg {\n width: 1rem;\n height: 1rem;\n}\n\n.icon[data-popup-open] {\n transform: rotate(180deg);\n}\n\n/* === Positioner (Select.Positioner) ===\n * z-index lives here, not on `.content` (the Popup). Base UI's Positioner\n * anchors with `transform`, which creates a stacking context — so a z-index\n * on the inner Popup is trapped inside it and cannot rise above a host-app\n * overlay (e.g. a drawer with its own z-index). The z-index must sit on the\n * Positioner itself.\n *\n * Sourced from `--pharos-z-index-popover` (no hardcoded value — NON-NEGOTIABLE\n * rule 1): D29's popover layer, 1500, above modal 1400. An app whose own\n * overlays sit higher (drawers, modals) raises every Pharos popup at once by\n * overriding `--pharos-z-index-popover` in `:root`. */\n.positioner {\n z-index: var(--pharos-z-index-popover);\n}\n\n/* === Floating surface (Select.Popup) === */\n.content {\n box-sizing: border-box;\n width: var(--anchor-width);\n max-height: var(--available-height);\n overflow-y: auto;\n padding: var(--pharos-spacing-1);\n\n background-color: var(--pharos-color-base-white);\n border: 1px solid var(--pharos-color-neutral-200);\n border-radius: var(--pharos-radius-md);\n box-shadow: var(--pharos-shadow-lg);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n color: var(--pharos-color-neutral-900);\n\n outline: none;\n\n transform-origin: var(--transform-origin);\n transition-property: opacity, transform;\n transition-duration: var(--pharos-duration-fast);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.content[data-starting-style],\n.content[data-ending-style] {\n opacity: 0;\n transform: scale(0.96);\n}\n\n/* === Option (Select.Item) ===\n * Row layout with the label growing and the selected-state check pinned to\n * the trailing edge. Highlight tracks Base UI's `data-highlighted` (keyboard\n * / pointer) the same way DropdownMenu items do. */\n.item {\n position: relative;\n display: flex;\n align-items: flex-start;\n gap: var(--pharos-spacing-2);\n\n padding: var(--pharos-spacing-2) var(--pharos-spacing-3);\n border-radius: var(--pharos-radius-sm);\n\n color: var(--pharos-color-neutral-900);\n cursor: default;\n user-select: none;\n outline: none;\n scroll-margin: var(--pharos-spacing-1);\n}\n\n.item[data-highlighted] {\n background-color: var(--pharos-color-neutral-100);\n}\n\n.item[data-disabled] {\n color: var(--pharos-color-neutral-400);\n pointer-events: none;\n}\n\n/* Long options wrap onto as many lines as they need. Cutting them with an\n * ellipsis hides exactly the end that tells similar options apart (a list of\n * timezones: «(GMT-06:00) America/Mexico_City — Central Standard…»). */\n.itemText {\n flex: 1 1 auto;\n min-width: 0;\n overflow-wrap: anywhere;\n white-space: normal;\n}\n\n.itemIndicator {\n display: inline-flex;\n flex: none;\n align-items: center;\n justify-content: center;\n /* One line tall, so the check sits on the first line of a wrapped option. */\n block-size: 1lh;\n color: var(--pharos-color-primary-600);\n}\n\n.itemIndicator svg {\n width: 1rem;\n height: 1rem;\n}\n\n/* === Group + label (Select.Group / Select.GroupLabel) === */\n.label {\n padding: var(--pharos-spacing-2) var(--pharos-spacing-3) var(--pharos-spacing-1);\n font-size: var(--pharos-font-size-xs);\n font-weight: var(--pharos-font-weight-semibold);\n color: var(--pharos-color-neutral-600);\n}\n\n/* === Separator (Select.Separator) === */\n.separator {\n height: 1px;\n margin: var(--pharos-spacing-1) 0;\n background-color: var(--pharos-color-neutral-200);\n}\n"],"mappings":""}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
var e = {
|
|
2
|
-
backdrop: "
|
|
3
|
-
content: "
|
|
4
|
-
sideRight: "
|
|
5
|
-
sideLeft: "
|
|
6
|
-
sideTop: "
|
|
7
|
-
sideBottom: "
|
|
8
|
-
header: "
|
|
9
|
-
title: "
|
|
10
|
-
description: "
|
|
11
|
-
footer: "
|
|
2
|
+
backdrop: "_backdrop_1jbnh_17",
|
|
3
|
+
content: "_content_1jbnh_33",
|
|
4
|
+
sideRight: "_sideRight_1jbnh_56",
|
|
5
|
+
sideLeft: "_sideLeft_1jbnh_69",
|
|
6
|
+
sideTop: "_sideTop_1jbnh_82",
|
|
7
|
+
sideBottom: "_sideBottom_1jbnh_95",
|
|
8
|
+
header: "_header_1jbnh_109",
|
|
9
|
+
title: "_title_1jbnh_115",
|
|
10
|
+
description: "_description_1jbnh_123",
|
|
11
|
+
footer: "_footer_1jbnh_130"
|
|
12
12
|
};
|
|
13
13
|
//#endregion
|
|
14
14
|
export { e as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Sheet.module.js","names":[],"sources":["../../src/components/Sheet.module.css"],"sourcesContent":["/* Sheet.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles a modal panel that docks to a viewport edge and\n * slides in — the shadcn \"Sheet\" contract over Base UI's `Dialog` (modal:\n * focus trap, scroll lock, backdrop). Motion is driven by Base UI's\n * `data-starting-style` / `data-ending-style` state attributes.\n *\n * z-index: the backdrop and the panel share `--pharos-z-index-modal`\n * (decision D29, modal 1400), like Dialog: one layer for both, so a modal\n * opened over the Sheet paints above it by DOM order, backdrop included. A\n * Select or Popover opened from inside the Sheet (a LanguageSelector in a\n * mobile drawer) sits on the popover layer (1500), above it
|
|
1
|
+
{"version":3,"file":"Sheet.module.js","names":[],"sources":["../../src/components/Sheet.module.css"],"sourcesContent":["/* Sheet.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles a modal panel that docks to a viewport edge and\n * slides in — the shadcn \"Sheet\" contract over Base UI's `Dialog` (modal:\n * focus trap, scroll lock, backdrop). Motion is driven by Base UI's\n * `data-starting-style` / `data-ending-style` state attributes.\n *\n * z-index: the backdrop and the panel share `--pharos-z-index-modal`\n * (decision D29, modal 1400), like Dialog: one layer for both, so a modal\n * opened over the Sheet paints above it by DOM order, backdrop included. A\n * Select or Popover opened from inside the Sheet (a LanguageSelector in a\n * mobile drawer) sits on the popover layer (1500), above it.\n */\n\n/* === Backdrop (Dialog.Backdrop) === */\n.backdrop {\n position: fixed;\n inset: 0;\n z-index: var(--pharos-z-index-modal);\n /* Scrim from the base-black token at 50% via color-mix — no hardcoded\n * rgba (NON-NEGOTIABLE rule 1). */\n background-color: color-mix(in srgb, var(--pharos-color-base-black) 50%, transparent);\n transition: opacity var(--pharos-duration-normal) var(--pharos-easing-out);\n}\n\n.backdrop[data-starting-style],\n.backdrop[data-ending-style] {\n opacity: 0;\n}\n\n/* === Panel (Dialog.Popup) === */\n.content {\n position: fixed;\n z-index: var(--pharos-z-index-modal);\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n gap: var(--pharos-spacing-4);\n padding: var(--pharos-spacing-6);\n\n background-color: var(--pharos-color-base-white);\n box-shadow: var(--pharos-shadow-xl);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n color: var(--pharos-color-neutral-900);\n\n outline: none;\n overflow-y: auto;\n\n transition: transform var(--pharos-duration-normal) var(--pharos-easing-out);\n}\n\n/* === Sides === */\n.sideRight {\n top: 0;\n bottom: 0;\n right: 0;\n height: 100dvh;\n width: min(24rem, 100vw);\n border-left: 1px solid var(--pharos-color-neutral-200);\n}\n.sideRight[data-starting-style],\n.sideRight[data-ending-style] {\n transform: translateX(100%);\n}\n\n.sideLeft {\n top: 0;\n bottom: 0;\n left: 0;\n height: 100dvh;\n width: min(24rem, 100vw);\n border-right: 1px solid var(--pharos-color-neutral-200);\n}\n.sideLeft[data-starting-style],\n.sideLeft[data-ending-style] {\n transform: translateX(-100%);\n}\n\n.sideTop {\n top: 0;\n left: 0;\n right: 0;\n width: 100vw;\n max-height: 100dvh;\n border-bottom: 1px solid var(--pharos-color-neutral-200);\n}\n.sideTop[data-starting-style],\n.sideTop[data-ending-style] {\n transform: translateY(-100%);\n}\n\n.sideBottom {\n bottom: 0;\n left: 0;\n right: 0;\n width: 100vw;\n max-height: 100dvh;\n border-top: 1px solid var(--pharos-color-neutral-200);\n}\n.sideBottom[data-starting-style],\n.sideBottom[data-ending-style] {\n transform: translateY(100%);\n}\n\n/* === Slots === */\n.header {\n display: flex;\n flex-direction: column;\n gap: var(--pharos-spacing-1);\n}\n\n.title {\n margin: 0;\n font-size: var(--pharos-font-size-lg);\n font-weight: var(--pharos-font-weight-semibold);\n line-height: 1.4;\n color: var(--pharos-color-neutral-900);\n}\n\n.description {\n margin: 0;\n font-size: var(--pharos-font-size-sm);\n line-height: 1.5;\n color: var(--pharos-color-neutral-600);\n}\n\n.footer {\n display: flex;\n gap: var(--pharos-spacing-2);\n justify-content: flex-end;\n margin-top: auto;\n}\n"],"mappings":""}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
var e = {
|
|
2
|
-
viewport: "
|
|
3
|
-
toast: "
|
|
4
|
-
content: "
|
|
5
|
-
icon: "
|
|
6
|
-
text: "
|
|
7
|
-
warningFill: "
|
|
8
|
-
title: "
|
|
9
|
-
description: "
|
|
10
|
-
action: "
|
|
11
|
-
close: "
|
|
2
|
+
viewport: "_viewport_1l5b5_17",
|
|
3
|
+
toast: "_toast_1l5b5_60",
|
|
4
|
+
content: "_content_1l5b5_127",
|
|
5
|
+
icon: "_icon_1l5b5_136",
|
|
6
|
+
text: "_text_1l5b5_142",
|
|
7
|
+
warningFill: "_warningFill_1l5b5_169",
|
|
8
|
+
title: "_title_1l5b5_176",
|
|
9
|
+
description: "_description_1l5b5_183",
|
|
10
|
+
action: "_action_1l5b5_190",
|
|
11
|
+
close: "_close_1l5b5_197"
|
|
12
12
|
};
|
|
13
13
|
//#endregion
|
|
14
14
|
export { e as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Toast.module.js","names":[],"sources":["../../src/components/Toast.module.css"],"sourcesContent":["/* Toast.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the toasts over Base UI's `Toast`: a fixed region\n * in one corner (or centred on one edge), holding a column of cards.\n *\n * z-index: the region sits on the toast layer (decision D29, 1700): above\n * modals and popovers, so a toast raised from inside a dialog is not hidden by\n * it, and below tooltips
|
|
1
|
+
{"version":3,"file":"Toast.module.js","names":[],"sources":["../../src/components/Toast.module.css"],"sourcesContent":["/* Toast.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the toasts over Base UI's `Toast`: a fixed region\n * in one corner (or centred on one edge), holding a column of cards.\n *\n * z-index: the region sits on the toast layer (decision D29, 1700): above\n * modals and popovers, so a toast raised from inside a dialog is not hidden by\n * it, and below tooltips.\n *\n * Layout uses logical properties only, so `start`/`end` follow the writing\n * direction. Motion comes from Base UI's `data-starting-style` /\n * `data-ending-style`, and collapses to a fade under reduced motion.\n */\n\n/* === Region (Toast.Viewport) === */\n.viewport {\n /* The inline gap, and the block one unless `offset` sets\n * `--pharos-toast-offset`. */\n --pharos-toast-edge-gap: var(--pharos-spacing-4);\n\n position: fixed;\n z-index: var(--pharos-z-index-toast);\n box-sizing: border-box;\n inline-size: min(22.5rem, calc(100% - 2 * var(--pharos-toast-edge-gap)));\n\n display: flex;\n flex-direction: column;\n gap: var(--pharos-spacing-2);\n\n /* The region itself never blocks the page under its empty area. */\n pointer-events: none;\n outline: none;\n}\n\n/* Newest first (Base UI's order), so the newest is nearest the edge. */\n.viewport[data-pharos-position^='top'] {\n inset-block-start: var(--pharos-toast-offset, var(--pharos-toast-edge-gap));\n}\n\n.viewport[data-pharos-position^='bottom'] {\n inset-block-end: var(--pharos-toast-offset, var(--pharos-toast-edge-gap));\n flex-direction: column-reverse;\n}\n\n.viewport[data-pharos-position$='start'] {\n inset-inline-start: var(--pharos-toast-edge-gap);\n}\n\n.viewport[data-pharos-position$='end'] {\n inset-inline-end: var(--pharos-toast-edge-gap);\n}\n\n.viewport[data-pharos-position$='center'] {\n inset-inline: 0;\n margin-inline: auto;\n}\n\n/* === Toast (Toast.Root) === */\n.toast {\n --pharos-toast-enter-shift: calc(-1 * var(--pharos-spacing-4));\n\n box-sizing: border-box;\n pointer-events: auto;\n\n background-color: var(--pharos-color-surface-card);\n border: 1px solid var(--pharos-color-border-subtle);\n border-radius: var(--pharos-radius-lg);\n box-shadow: var(--pharos-shadow-lg);\n\n font-family: var(--pharos-font-family-sans);\n font-size: var(--pharos-font-size-sm);\n line-height: 1.43; /* 14 / 20, D3 */\n color: var(--pharos-color-neutral-900);\n\n /* Swiping moves it with the finger. */\n transform: translate(var(--toast-swipe-movement-x, 0), var(--toast-swipe-movement-y, 0));\n transition-property: opacity, transform;\n transition-duration: var(--pharos-duration-normal);\n transition-timing-function: var(--pharos-easing-out);\n}\n\n.viewport[data-pharos-position^='bottom'] .toast {\n --pharos-toast-enter-shift: var(--pharos-spacing-4);\n}\n\n/* Arrives from, and leaves towards, the edge it sits on. */\n.toast[data-starting-style],\n.toast[data-ending-style] {\n opacity: 0;\n transform: translateY(var(--pharos-toast-enter-shift));\n}\n\n/* Swiped away: keeps going the way the finger went. */\n.toast[data-ending-style][data-swipe-direction='left'] {\n transform: translateX(calc(var(--toast-swipe-movement-x, 0) - 100%));\n}\n\n.toast[data-ending-style][data-swipe-direction='right'] {\n transform: translateX(calc(var(--toast-swipe-movement-x, 0) + 100%));\n}\n\n.toast[data-limited] {\n opacity: 0;\n}\n\n/* The system's focus ring (as Button): a white halo, then the accent. Kept as\n * box-shadow plus the card's own shadow, so the ring is not lost under it. */\n.toast:focus-visible {\n outline: none;\n box-shadow:\n 0 0 0 2px var(--pharos-color-base-white),\n 0 0 0 4px var(--pharos-color-primary-600),\n var(--pharos-shadow-lg);\n}\n\n@media (prefers-reduced-motion: reduce) {\n .toast,\n .toast[data-starting-style],\n .toast[data-ending-style] {\n transform: none;\n transition-property: opacity;\n }\n}\n\n/* === Content (Toast.Content) === */\n.content {\n display: flex;\n align-items: flex-start;\n gap: var(--pharos-spacing-3);\n padding-block: var(--pharos-spacing-3);\n padding-inline: var(--pharos-spacing-4) var(--pharos-spacing-2);\n}\n\n/* 20 px, the height of the title's first line, so the two line up. */\n.icon {\n flex-shrink: 0;\n inline-size: var(--pharos-spacing-5);\n block-size: var(--pharos-spacing-5);\n}\n\n.text {\n display: flex;\n flex: 1;\n flex-direction: column;\n gap: var(--pharos-spacing-0-5);\n min-inline-size: 0;\n overflow-wrap: anywhere;\n}\n\n.toast[data-pharos-variant='success'] .icon {\n color: var(--pharos-color-semantic-success-fg);\n}\n\n.toast[data-pharos-variant='info'] .icon {\n color: var(--pharos-color-semantic-info-fg);\n}\n\n.toast[data-pharos-variant='destructive'] .icon {\n color: var(--pharos-color-semantic-error-fg);\n}\n\n/* Amber does not reach 3:1 on white as a stroke, so warning is a filled\n * triangle with the glyph in its on-colour, the way a warning sign reads. */\n.toast[data-pharos-variant='warning'] .icon {\n color: var(--pharos-color-semantic-warning-on);\n}\n\n.warningFill {\n fill: var(--pharos-color-semantic-warning-fg);\n stroke: var(--pharos-color-semantic-warning-fg);\n}\n\n/* Base UI renders the title as an `<h2>`: its size and line come from here,\n * not from the browser's or the page's heading styles. */\n.title {\n margin: 0;\n font-size: var(--pharos-font-size-sm);\n line-height: inherit;\n font-weight: var(--pharos-font-weight-semibold);\n}\n\n.description {\n margin: 0;\n font-size: var(--pharos-font-size-sm);\n line-height: inherit;\n color: var(--pharos-color-neutral-600);\n}\n\n.action {\n align-self: flex-start;\n margin-block-start: var(--pharos-spacing-2);\n}\n\n/* The 32 px button is centred on the title's first 20 px line: it rises 6 px\n * into the padding instead of pushing the card taller. */\n.close {\n flex-shrink: 0;\n margin-block: calc(-1 * var(--pharos-spacing-1-5)) calc(-1 * var(--pharos-spacing-1-5));\n}\n"],"mappings":""}
|
package/dist/styles.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
._root_1xx27_21{box-sizing:border-box;background-color:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-700);font-family:var(--pharos-font-family-sans);-webkit-user-select:none;user-select:none;--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -1);flex-shrink:0;justify-content:center;align-items:center;font-weight:500;line-height:1;display:inline-flex;position:relative;overflow:hidden}._shapeCircle_1xx27_63{border-radius:var(--pharos-radius-full)}._shapeSquare_1xx27_67{border-radius:var(--pharos-radius-md)}._sizeSm_1xx27_86{width:var(--pharos-spacing-8);height:var(--pharos-spacing-8);--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -.75);font-size:.75rem}._sizeMd_1xx27_93{width:var(--pharos-spacing-10);height:var(--pharos-spacing-10);--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -1);font-size:.875rem}._sizeLg_1xx27_100{width:var(--pharos-spacing-12);height:var(--pharos-spacing-12);--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -1.25);font-size:1rem}._image_1xx27_118{object-fit:cover;border-radius:inherit;width:100%;height:100%;display:block;position:absolute;inset:0}._fallback_1xx27_134{text-align:center;width:100%;height:100%;font:inherit;color:inherit;justify-content:center;align-items:center;display:inline-flex}._sizeSm_1xx27_86 ._fallback_1xx27_134>svg{width:var(--pharos-spacing-5);height:var(--pharos-spacing-5)}._sizeMd_1xx27_93 ._fallback_1xx27_134>svg{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6)}._sizeLg_1xx27_100 ._fallback_1xx27_134>svg{width:var(--pharos-spacing-7);height:var(--pharos-spacing-7)}._group_1xx27_175{align-items:center;display:inline-flex}._group_1xx27_175>._root_1xx27_21{box-shadow:0 0 0 2px var(--pharos-avatar-group-ring,var(--pharos-color-base-white));position:relative}._group_1xx27_175>._root_1xx27_21+._root_1xx27_21{margin-left:var(--pharos-avatar-overlap)}._badge_zrawy_5{align-items:center;gap:var(--pharos-spacing-1);padding:0 var(--pharos-spacing-2);height:var(--pharos-spacing-5);border-radius:var(--pharos-radius-full);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-xs);font-weight:var(--pharos-font-weight-medium);white-space:nowrap;text-box-trim:trim-both;text-box-edge:cap alphabetic;border:1px solid #0000;width:fit-content;line-height:1;display:inline-flex}._badge_zrawy_5>svg{pointer-events:none;flex:none;width:.75em;height:.75em}._default_zrawy_30{background:var(--pharos-color-neutral-900);color:var(--pharos-color-base-white)}._secondary_zrawy_35{background:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-900)}._destructive_zrawy_40{background:var(--pharos-color-semantic-error-fg);color:var(--pharos-color-semantic-error-on)}._outline_zrawy_45{color:var(--pharos-color-neutral-900);border-color:var(--pharos-color-neutral-500);background:0 0}._success_zrawy_55{background:var(--pharos-color-semantic-success-fg);color:var(--pharos-color-semantic-success-on)}._warning_zrawy_60{background:var(--pharos-color-semantic-warning-fg);color:var(--pharos-color-semantic-warning-on)}._info_zrawy_65{background:var(--pharos-color-semantic-info-fg);color:var(--pharos-color-semantic-info-on)}._button_iu0wg_18{appearance:none;box-sizing:border-box;border-radius:var(--pharos-radius-full);white-space:nowrap;text-box-trim:trim-both;text-box-edge:cap alphabetic;font-family:var(--pharos-font-family-sans);font-style:normal;font-weight:var(--pharos-font-weight-medium);font-variant:normal;font-kerning:auto;font-optical-sizing:auto;font-size-adjust:none;font-feature-settings:normal;font-variation-settings:normal;letter-spacing:normal;text-transform:none;font-stretch:100%;font-size:var(--pharos-font-size-sm);-webkit-user-select:none;user-select:none;cursor:pointer;color:inherit;transition-property:color,background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);background-color:#0000;border:0 solid #0000;justify-content:center;align-items:center;margin:0;padding-top:0;padding-bottom:0;line-height:1.5;text-decoration:none;display:inline-flex}._button_iu0wg_18:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--button-focus-ring,var(--pharos-color-primary-600));outline:none}._button_iu0wg_18:disabled{pointer-events:none;cursor:not-allowed;opacity:.5}._primary_iu0wg_127{background-color:var(--pharos-color-neutral-900);color:var(--pharos-color-base-white);--button-focus-ring:var(--pharos-color-primary-600)}._primary_iu0wg_127:hover{background-color:var(--pharos-color-neutral-700)}._primary_iu0wg_127:active{background-color:var(--pharos-color-neutral-950)}._secondary_iu0wg_141{background-color:var(--pharos-color-base-white);color:var(--pharos-color-neutral-900);border:1px solid var(--pharos-color-neutral-500);--button-focus-ring:var(--pharos-color-primary-600)}._secondary_iu0wg_141:hover{background-color:var(--pharos-color-neutral-50)}._secondary_iu0wg_141:active{background-color:var(--pharos-color-neutral-100)}._ghost_iu0wg_161{color:var(--pharos-color-neutral-900);--button-focus-ring:var(--pharos-color-primary-600);background-color:#0000}._ghost_iu0wg_161:hover{background-color:var(--pharos-color-neutral-100)}._ghost_iu0wg_161:active{background-color:var(--pharos-color-neutral-200)}._destructive_iu0wg_175{background-color:var(--pharos-color-semantic-error-fg);color:var(--pharos-color-semantic-error-on);--button-focus-ring:var(--pharos-color-semantic-error-fg)}._destructive_iu0wg_175:hover{background-color:var(--pharos-color-semantic-error-fg-hover)}._destructive_iu0wg_175:active{background-color:var(--pharos-color-semantic-error-fg-active)}._sizeSm_iu0wg_197{height:var(--pharos-spacing-8);gap:var(--pharos-spacing-1-5);padding:0 var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm);line-height:1.42857}._sizeMd_iu0wg_205{height:var(--pharos-spacing-10);gap:var(--pharos-spacing-2);padding:0 var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm);line-height:1.42857}._sizeLg_iu0wg_213{height:var(--pharos-spacing-12);gap:var(--pharos-spacing-2);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base);line-height:1.5}._card_yxgwa_10{background-color:var(--pharos-color-base-white);border-radius:var(--pharos-radius-2xl);gap:var(--pharos-spacing-6);font-family:var(--pharos-font-family-sans);color:var(--pharos-color-neutral-900);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);border:0 solid #0000;flex-direction:column;display:flex}._default_yxgwa_42{border:1px solid var(--pharos-color-neutral-200)}._elevated_yxgwa_46{box-shadow:var(--pharos-shadow-md);border:0 solid #0000}._outlined_yxgwa_51{border:1px solid var(--pharos-color-neutral-300)}._header_yxgwa_62{gap:var(--pharos-spacing-1-5);padding:var(--pharos-spacing-6) var(--pharos-spacing-6) 0;flex-direction:column;display:flex}._title_yxgwa_69{font-size:var(--pharos-font-size-base);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.25}._description_yxgwa_77{font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);color:var(--pharos-color-neutral-500);margin:0;line-height:1.5}._content_yxgwa_85{padding:0 var(--pharos-spacing-6)}._footer_yxgwa_95{align-items:center;gap:var(--pharos-spacing-3);padding:0 var(--pharos-spacing-6) var(--pharos-spacing-6);display:flex}._root_1v9tz_14{box-sizing:border-box;width:var(--pharos-spacing-5);height:var(--pharos-spacing-5);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-sm);background-color:var(--pharos-color-base-white);color:var(--pharos-color-base-white);cursor:pointer;transition-property:background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}._root_1v9tz_14:hover:not([data-disabled]):not([data-checked]):not([data-indeterminate]){border-color:var(--pharos-color-neutral-700)}._root_1v9tz_14[data-checked],._root_1v9tz_14[data-indeterminate]{background-color:var(--pharos-color-neutral-900);border-color:var(--pharos-color-neutral-900)}._root_1v9tz_14[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._root_1v9tz_14:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._root_1v9tz_14[data-disabled]{cursor:not-allowed;opacity:.5}._indicator_1v9tz_65{color:var(--pharos-color-base-white);justify-content:center;align-items:center;display:inline-flex}._icon_1v9tz_72{width:var(--pharos-spacing-3);height:var(--pharos-spacing-3)}._iconIndeterminate_1v9tz_79,._indicator_1v9tz_65[data-indeterminate] ._iconCheck_1v9tz_83{display:none}._indicator_1v9tz_65[data-indeterminate] ._iconIndeterminate_1v9tz_79{display:block}._control_1owey_5{box-sizing:border-box;align-items:center;gap:var(--pharos-spacing-2);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;font-family:var(--pharos-font-family-sans);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);display:flex}._control_1owey_5:focus-within{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600)}._control_1owey_5[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._control_1owey_5:has([aria-invalid=true]){border-color:var(--pharos-color-semantic-error-fg)}._chips_1owey_61{gap:var(--pharos-spacing-1);padding:var(--pharos-spacing-1) var(--pharos-spacing-2);flex-wrap:wrap}._input_1owey_70{appearance:none;min-width:0;color:var(--pharos-color-neutral-900);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);background:0 0;border:none;outline:none;flex:auto;margin:0;line-height:1.25}._input_1owey_70::placeholder{color:var(--pharos-color-neutral-500);opacity:1}._input_1owey_70:disabled{cursor:not-allowed}._inputSizeSm_1owey_99{height:var(--pharos-spacing-8);padding:0 var(--pharos-spacing-3)}._inputSizeMd_1owey_104{height:var(--pharos-spacing-10);padding:0 var(--pharos-spacing-4)}._inputSizeLg_1owey_109{height:var(--pharos-spacing-12);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}._chipsInput_1owey_117{height:var(--pharos-spacing-7);padding:0 var(--pharos-spacing-1);flex:4rem}._trigger_1owey_124,._clear_1owey_125{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6);color:var(--pharos-color-neutral-500);cursor:default;background:0 0;border:none;flex:none;justify-content:center;align-items:center;margin-inline-end:var(--pharos-spacing-1);padding:0;display:inline-flex}._trigger_1owey_124 svg,._clear_1owey_125 svg{width:1rem;height:1rem}._trigger_1owey_124[data-popup-open] svg{transition:transform var(--pharos-duration-fast) var(--pharos-easing-out);transform:rotate(180deg)}._chip_1owey_61{align-items:center;gap:var(--pharos-spacing-1);padding:0 var(--pharos-spacing-1) 0 var(--pharos-spacing-2);height:var(--pharos-spacing-6);border-radius:var(--pharos-radius-sm);background-color:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-900);font-size:var(--pharos-font-size-xs);display:inline-flex}._chip_1owey_61[data-highlighted]{background-color:var(--pharos-color-neutral-200)}._chipRemove_1owey_169{width:var(--pharos-spacing-4);height:var(--pharos-spacing-4);border-radius:var(--pharos-radius-sm);color:var(--pharos-color-neutral-500);cursor:default;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:inline-flex}._chipRemove_1owey_169:hover{color:var(--pharos-color-neutral-900)}._chipRemove_1owey_169 svg{width:.875rem;height:.875rem}._positioner_1owey_204{z-index:var(--pharos-z-index-popover,1500)}._content_1owey_193{box-sizing:border-box;width:var(--anchor-width);max-height:var(--available-height);padding:var(--pharos-spacing-1);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;overflow-y:auto}._content_1owey_193[data-starting-style],._content_1owey_193[data-ending-style]{opacity:0;transform:scale(.96)}._item_1owey_14{align-items:flex-start;gap:var(--pharos-spacing-2);padding:var(--pharos-spacing-2) var(--pharos-spacing-3);border-radius:var(--pharos-radius-sm);color:var(--pharos-color-neutral-900);cursor:default;-webkit-user-select:none;user-select:none;scroll-margin:var(--pharos-spacing-1);outline:none;display:flex;position:relative}._item_1owey_14[data-highlighted]{background-color:var(--pharos-color-neutral-100)}._item_1owey_14[data-disabled]{color:var(--pharos-color-neutral-400);pointer-events:none}._itemText_1owey_14{overflow-wrap:anywhere;white-space:normal;flex:auto;min-width:0}._itemIndicator_1owey_275{block-size:1lh;color:var(--pharos-color-primary-600);flex:none;justify-content:center;align-items:center;display:inline-flex}._itemIndicator_1owey_275 svg{width:1rem;height:1rem}._empty_1owey_299{color:var(--pharos-color-neutral-500);text-align:center}._empty_1owey_299:not(:empty){padding:var(--pharos-spacing-3)}._label_1owey_309{padding:var(--pharos-spacing-2) var(--pharos-spacing-3) var(--pharos-spacing-1);font-size:var(--pharos-font-size-xs);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-600)}._separator_1owey_316{height:1px;margin:var(--pharos-spacing-1) 0;background-color:var(--pharos-color-neutral-200)}@media (pointer:coarse){._input_1owey_70{font-size:var(--pharos-font-size-base)}}._backdrop_1gqfj_20{z-index:var(--pharos-z-index-modal,1400);background-color:color-mix(in srgb, var(--pharos-color-base-black) 50%, transparent);transition:opacity var(--pharos-duration-normal) var(--pharos-easing-out);position:fixed;inset:0}._backdrop_1gqfj_20[data-starting-style],._backdrop_1gqfj_20[data-ending-style]{opacity:0}._content_1gqfj_34{transform-origin:50%;z-index:var(--pharos-z-index-modal,1400);box-sizing:border-box;width:calc(100% - 2 * var(--pharos-spacing-4));max-width:32rem;max-height:calc(100dvh - 2 * var(--pharos-spacing-6));gap:var(--pharos-spacing-4);padding:var(--pharos-spacing-6);background-color:var(--pharos-color-base-white);border-radius:var(--pharos-radius-lg);box-shadow:var(--pharos-shadow-xl);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;flex-direction:column;display:flex;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}._content_1gqfj_34[data-starting-style],._content_1gqfj_34[data-ending-style]{opacity:0;transform:translate(-50%,-50%)scale(.96)}._header_1gqfj_77{gap:var(--pharos-spacing-1);flex-direction:column;display:flex}._title_1gqfj_83{font-size:var(--pharos-font-size-lg);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.4}._description_1gqfj_91{font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-600);margin:0;line-height:1.5}._footer_1gqfj_98{gap:var(--pharos-spacing-2);justify-content:flex-end;margin-top:auto;display:flex}._positioner_yfokk_9{z-index:var(--pharos-z-index-popover,1500)}._content_yfokk_4{box-sizing:border-box;min-width:12rem;padding:var(--pharos-spacing-1);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out)}._content_yfokk_4[data-starting-style],._content_yfokk_4[data-ending-style]{opacity:0;transform:scale(.96)}._item_yfokk_5{box-sizing:border-box;align-items:center;gap:var(--pharos-spacing-2);width:100%;padding:var(--pharos-spacing-1-5) var(--pharos-spacing-2);border-radius:var(--pharos-radius-sm);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-medium);color:var(--pharos-color-neutral-700);cursor:default;-webkit-user-select:none;user-select:none;scroll-margin:var(--pharos-spacing-1);transition-property:background-color,color;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;line-height:1.25;display:flex}._item_yfokk_5[data-highlighted]{background-color:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-900)}._item_yfokk_5[data-disabled]{color:var(--pharos-color-neutral-500);opacity:.6;pointer-events:none}._item_yfokk_5>svg{flex-shrink:0;width:1rem;height:1rem}._itemDestructive_yfokk_114{color:var(--pharos-color-semantic-error-fg)}._itemDestructive_yfokk_114[data-highlighted]{background-color:var(--pharos-color-semantic-error-bg);color:var(--pharos-color-semantic-error-fg-hover)}._separator_yfokk_6{height:1px;margin:var(--pharos-spacing-1) calc(var(--pharos-spacing-1) * -1);background-color:var(--pharos-color-neutral-200)}._label_yfokk_6{padding:var(--pharos-spacing-1-5) var(--pharos-spacing-2);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-500)}._button_ltuh2_14{appearance:none;box-sizing:border-box;border-radius:var(--pharos-radius-full);-webkit-user-select:none;user-select:none;cursor:pointer;color:inherit;font-family:var(--pharos-font-family-sans);transition-property:color,background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);background-color:#0000;border:0 solid #0000;flex-shrink:0;justify-content:center;align-items:center;margin:0;padding:0;display:inline-flex}._button_ltuh2_14:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--icon-button-focus-ring,var(--pharos-color-primary-600));outline:none}._button_ltuh2_14:disabled{pointer-events:none;cursor:not-allowed;opacity:.5}._primary_ltuh2_74{background-color:var(--pharos-color-neutral-900);color:var(--pharos-color-base-white);--icon-button-focus-ring:var(--pharos-color-primary-600)}._primary_ltuh2_74:hover{background-color:var(--pharos-color-neutral-700)}._primary_ltuh2_74:active{background-color:var(--pharos-color-neutral-950)}._secondary_ltuh2_88{background-color:var(--pharos-color-base-white);color:var(--pharos-color-neutral-900);border:1px solid var(--pharos-color-neutral-500);--icon-button-focus-ring:var(--pharos-color-primary-600)}._secondary_ltuh2_88:hover{background-color:var(--pharos-color-neutral-50)}._secondary_ltuh2_88:active{background-color:var(--pharos-color-neutral-100)}._ghost_ltuh2_107{color:var(--pharos-color-neutral-900);--icon-button-focus-ring:var(--pharos-color-primary-600);background-color:#0000}._ghost_ltuh2_107:hover{background-color:var(--pharos-color-neutral-100)}._ghost_ltuh2_107:active{background-color:var(--pharos-color-neutral-200)}._destructive_ltuh2_121{background-color:var(--pharos-color-semantic-error-fg);color:var(--pharos-color-semantic-error-on);--icon-button-focus-ring:var(--pharos-color-semantic-error-fg)}._destructive_ltuh2_121:hover{background-color:var(--pharos-color-semantic-error-fg-hover)}._destructive_ltuh2_121:active{background-color:var(--pharos-color-semantic-error-fg-active)}._sizeSm_ltuh2_150{width:var(--pharos-spacing-8);height:var(--pharos-spacing-8)}._sizeSm_ltuh2_150>svg{width:var(--pharos-spacing-4);height:var(--pharos-spacing-4)}._sizeMd_ltuh2_160{width:var(--pharos-spacing-10);height:var(--pharos-spacing-10)}._sizeMd_ltuh2_160>svg{width:var(--pharos-spacing-5);height:var(--pharos-spacing-5)}._sizeLg_ltuh2_170{width:var(--pharos-spacing-12);height:var(--pharos-spacing-12)}._sizeLg_ltuh2_170>svg{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6)}@keyframes _pharos-spinner-spin_gg970_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._spinner_gg970_28{color:currentColor;vertical-align:middle;justify-content:center;align-items:center;display:inline-flex}._icon_gg970_46{width:100%;height:100%;animation:_pharos-spinner-spin_gg970_1 var(--pharos-duration-slow,1s) linear infinite}@media (prefers-reduced-motion:reduce){._icon_gg970_46{animation-duration:4s}}._sizeSm_gg970_69{width:var(--pharos-spacing-4);height:var(--pharos-spacing-4)}._sizeMd_gg970_74{width:var(--pharos-spacing-5);height:var(--pharos-spacing-5)}._sizeLg_gg970_79{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6)}._srOnly_gg970_87{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._input_1ueoc_14{appearance:none;box-sizing:border-box;border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;color:var(--pharos-color-neutral-900);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);margin:0;line-height:1.25}._input_1ueoc_14::placeholder{color:var(--pharos-color-neutral-500);opacity:1}._input_1ueoc_14:focus-visible{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._input_1ueoc_14:disabled{cursor:not-allowed;opacity:.5}._input_1ueoc_14[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._input_1ueoc_14[aria-invalid=true]:focus-visible{border-color:var(--pharos-color-semantic-error-fg);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-semantic-error-fg)}._sizeSm_1ueoc_97{height:var(--pharos-spacing-8);padding:0 var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm)}._sizeMd_1ueoc_103{height:var(--pharos-spacing-10);padding:0 var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm)}._sizeLg_1ueoc_109{height:var(--pharos-spacing-12);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}@media (pointer:coarse){._input_1ueoc_14,._sizeSm_1ueoc_97,._sizeMd_1ueoc_103{font-size:var(--pharos-font-size-base)}}._positioner_1mqln_15{z-index:var(--pharos-z-index-popover,1500)}._content_1mqln_4{box-sizing:border-box;max-width:20rem;padding:var(--pharos-spacing-4);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none}._content_1mqln_4[data-starting-style],._content_1mqln_4[data-ending-style]{opacity:0;transform:scale(.96)}._title_1mqln_5{font-size:var(--pharos-font-size-base);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.4}._description_1mqln_5{margin:var(--pharos-spacing-1) 0 0;font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-600);line-height:1.5}._group_rsllu_18{gap:var(--pharos-spacing-2);flex-direction:column;display:flex}._item_rsllu_24{box-sizing:border-box;width:var(--pharos-spacing-5);height:var(--pharos-spacing-5);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-base-white);cursor:pointer;transition-property:background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}._item_rsllu_24:hover:not([data-disabled]):not([data-checked]){border-color:var(--pharos-color-neutral-700)}._item_rsllu_24[data-checked]{border-color:var(--pharos-color-neutral-900)}._group_rsllu_18[aria-invalid=true] ._item_rsllu_24{border-color:var(--pharos-color-semantic-error-fg)}._item_rsllu_24:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._item_rsllu_24[data-disabled]{cursor:not-allowed;opacity:.5}._indicator_rsllu_75{width:var(--pharos-spacing-2);height:var(--pharos-spacing-2);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-neutral-900);display:inline-flex}._trigger_1qe34_35{appearance:none;box-sizing:border-box;justify-content:space-between;align-items:center;gap:var(--pharos-spacing-2);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;color:var(--pharos-color-neutral-900);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);text-align:start;cursor:default;transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);margin:0;line-height:1.25;display:inline-flex}._trigger_1qe34_35:focus-visible{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._trigger_1qe34_35:disabled,._trigger_1qe34_35[data-disabled]{cursor:not-allowed;opacity:.5}._trigger_1qe34_35[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._trigger_1qe34_35[aria-invalid=true]:focus-visible{border-color:var(--pharos-color-semantic-error-fg);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-semantic-error-fg)}._sizeSm_1qe34_92{height:var(--pharos-spacing-8);padding:0 var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm)}._sizeMd_1qe34_98{height:var(--pharos-spacing-10);padding:0 var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm)}._sizeLg_1qe34_104{height:var(--pharos-spacing-12);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}._value_1qe34_113{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}._value_1qe34_113[data-placeholder]{color:var(--pharos-color-neutral-500)}._icon_1qe34_127{color:var(--pharos-color-neutral-500);transition:transform var(--pharos-duration-fast) var(--pharos-easing-out);flex:none;justify-content:center;align-items:center;display:inline-flex}._icon_1qe34_127 svg{width:1rem;height:1rem}._icon_1qe34_127[data-popup-open]{transform:rotate(180deg)}._positioner_1qe34_24{z-index:var(--pharos-z-index-popover,1500)}._content_1qe34_146{box-sizing:border-box;width:var(--anchor-width);max-height:var(--available-height);padding:var(--pharos-spacing-1);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;overflow-y:auto}._content_1qe34_146[data-starting-style],._content_1qe34_146[data-ending-style]{opacity:0;transform:scale(.96)}._item_1qe34_17{align-items:flex-start;gap:var(--pharos-spacing-2);padding:var(--pharos-spacing-2) var(--pharos-spacing-3);border-radius:var(--pharos-radius-sm);color:var(--pharos-color-neutral-900);cursor:default;-webkit-user-select:none;user-select:none;scroll-margin:var(--pharos-spacing-1);outline:none;display:flex;position:relative}._item_1qe34_17[data-highlighted]{background-color:var(--pharos-color-neutral-100)}._item_1qe34_17[data-disabled]{color:var(--pharos-color-neutral-400);pointer-events:none}._itemText_1qe34_17{overflow-wrap:anywhere;white-space:normal;flex:auto;min-width:0}._itemIndicator_1qe34_231{block-size:1lh;color:var(--pharos-color-primary-600);flex:none;justify-content:center;align-items:center;display:inline-flex}._itemIndicator_1qe34_231 svg{width:1rem;height:1rem}._label_1qe34_247{padding:var(--pharos-spacing-2) var(--pharos-spacing-3) var(--pharos-spacing-1);font-size:var(--pharos-font-size-xs);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-600)}._separator_1qe34_255{height:1px;margin:var(--pharos-spacing-1) 0;background-color:var(--pharos-color-neutral-200)}._separator_da90p_13{background-color:var(--pharos-color-neutral-200);border:0;flex-shrink:0;margin:0}._horizontal_da90p_29{width:100%;height:1px}._vertical_da90p_34{width:1px;height:100%}._backdrop_titsa_18{z-index:var(--pharos-z-index-modal,1400);background-color:color-mix(in srgb, var(--pharos-color-base-black) 50%, transparent);transition:opacity var(--pharos-duration-normal) var(--pharos-easing-out);position:fixed;inset:0}._backdrop_titsa_18[data-starting-style],._backdrop_titsa_18[data-ending-style]{opacity:0}._content_titsa_34{z-index:var(--pharos-z-index-modal,1400);box-sizing:border-box;gap:var(--pharos-spacing-4);padding:var(--pharos-spacing-6);background-color:var(--pharos-color-base-white);box-shadow:var(--pharos-shadow-xl);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transition:transform var(--pharos-duration-normal) var(--pharos-easing-out);outline:none;flex-direction:column;display:flex;position:fixed;overflow-y:auto}._sideRight_titsa_57{border-left:1px solid var(--pharos-color-neutral-200);width:min(24rem,100vw);height:100dvh;top:0;bottom:0;right:0}._sideRight_titsa_57[data-starting-style],._sideRight_titsa_57[data-ending-style]{transform:translate(100%)}._sideLeft_titsa_70{border-right:1px solid var(--pharos-color-neutral-200);width:min(24rem,100vw);height:100dvh;top:0;bottom:0;left:0}._sideLeft_titsa_70[data-starting-style],._sideLeft_titsa_70[data-ending-style]{transform:translate(-100%)}._sideTop_titsa_83{border-bottom:1px solid var(--pharos-color-neutral-200);width:100vw;max-height:100dvh;top:0;left:0;right:0}._sideTop_titsa_83[data-starting-style],._sideTop_titsa_83[data-ending-style]{transform:translateY(-100%)}._sideBottom_titsa_96{border-top:1px solid var(--pharos-color-neutral-200);width:100vw;max-height:100dvh;bottom:0;left:0;right:0}._sideBottom_titsa_96[data-starting-style],._sideBottom_titsa_96[data-ending-style]{transform:translateY(100%)}._header_titsa_110{gap:var(--pharos-spacing-1);flex-direction:column;display:flex}._title_titsa_116{font-size:var(--pharos-font-size-lg);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.4}._description_titsa_124{font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-600);margin:0;line-height:1.5}._footer_titsa_131{gap:var(--pharos-spacing-2);justify-content:flex-end;margin-top:auto;display:flex}._root_5v2er_17{box-sizing:border-box;width:var(--pharos-spacing-10);height:var(--pharos-spacing-6);padding:var(--pharos-spacing-1);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-neutral-300);cursor:pointer;transition-property:background-color,box-shadow;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);border:none;flex-shrink:0;align-items:center;display:inline-flex}._root_5v2er_17:hover:not([data-disabled]):not([data-checked]){background-color:var(--pharos-color-neutral-400)}._root_5v2er_17[data-checked]{background-color:var(--pharos-color-neutral-900)}._root_5v2er_17[data-checked]:hover:not([data-disabled]){background-color:var(--pharos-color-neutral-700)}._root_5v2er_17[aria-invalid=true]{box-shadow:inset 0 0 0 1px var(--pharos-color-semantic-error-fg)}._root_5v2er_17:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._root_5v2er_17[data-disabled]{cursor:not-allowed;opacity:.5}._thumb_5v2er_72{box-sizing:border-box;width:var(--pharos-spacing-4);height:var(--pharos-spacing-4);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-base-white);transition-property:transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out)}._root_5v2er_17[data-checked] ._thumb_5v2er_72{transform:translateX(var(--pharos-spacing-4))}._textarea_145hb_21{appearance:none;box-sizing:border-box;border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;color:var(--pharos-color-neutral-900);resize:vertical;font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);margin:0;line-height:1.5}._textarea_145hb_21::placeholder{color:var(--pharos-color-neutral-500);opacity:1}._textarea_145hb_21:focus-visible{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._textarea_145hb_21:disabled{cursor:not-allowed;opacity:.5;resize:none}._textarea_145hb_21[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._textarea_145hb_21[aria-invalid=true]:focus-visible{border-color:var(--pharos-color-semantic-error-fg);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-semantic-error-fg)}._sizeSm_145hb_113{min-height:var(--pharos-spacing-16);padding:var(--pharos-spacing-2) var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm)}._sizeMd_145hb_119{min-height:var(--pharos-spacing-20);padding:var(--pharos-spacing-2-5) var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm)}._sizeLg_145hb_125{min-height:var(--pharos-spacing-24);padding:var(--pharos-spacing-3) var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}@media (pointer:coarse){._textarea_145hb_21,._sizeSm_145hb_113,._sizeMd_145hb_119{font-size:var(--pharos-font-size-base)}}._viewport_b05po_18{--pharos-toast-edge-gap:var(--pharos-spacing-4);z-index:var(--pharos-z-index-toast,1700);box-sizing:border-box;inline-size:min(22.5rem, calc(100% - 2 * var(--pharos-toast-edge-gap)));gap:var(--pharos-spacing-2);pointer-events:none;outline:none;flex-direction:column;display:flex;position:fixed}._viewport_b05po_18[data-pharos-position^=top]{inset-block-start:var(--pharos-toast-offset,var(--pharos-toast-edge-gap))}._viewport_b05po_18[data-pharos-position^=bottom]{flex-direction:column-reverse;inset-block-end:var(--pharos-toast-offset,var(--pharos-toast-edge-gap))}._viewport_b05po_18[data-pharos-position$=start]{inset-inline-start:var(--pharos-toast-edge-gap)}._viewport_b05po_18[data-pharos-position$=end]{inset-inline-end:var(--pharos-toast-edge-gap)}._viewport_b05po_18[data-pharos-position$=center]{margin-inline:auto;inset-inline:0}._toast_b05po_61{--pharos-toast-enter-shift:calc(-1 * var(--pharos-spacing-4));box-sizing:border-box;pointer-events:auto;background-color:var(--pharos-color-surface-card,var(--pharos-color-base-white));border:1px solid var(--pharos-color-border-subtle,var(--pharos-color-neutral-200));border-radius:var(--pharos-radius-lg);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform:translate(var(--toast-swipe-movement-x,0), var(--toast-swipe-movement-y,0));transition-property:opacity,transform;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);line-height:1.43}._viewport_b05po_18[data-pharos-position^=bottom] ._toast_b05po_61{--pharos-toast-enter-shift:var(--pharos-spacing-4)}._toast_b05po_61[data-starting-style],._toast_b05po_61[data-ending-style]{opacity:0;transform:translateY(var(--pharos-toast-enter-shift))}._toast_b05po_61[data-ending-style][data-swipe-direction=left]{transform:translateX(calc(var(--toast-swipe-movement-x,0) - 100%))}._toast_b05po_61[data-ending-style][data-swipe-direction=right]{transform:translateX(calc(var(--toast-swipe-movement-x,0) + 100%))}._toast_b05po_61[data-limited]{opacity:0}._toast_b05po_61:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600), var(--pharos-shadow-lg);outline:none}@media (prefers-reduced-motion:reduce){._toast_b05po_61,._toast_b05po_61[data-starting-style],._toast_b05po_61[data-ending-style]{transition-property:opacity;transform:none}}._content_b05po_128{align-items:flex-start;gap:var(--pharos-spacing-3);padding-block:var(--pharos-spacing-3);padding-inline:var(--pharos-spacing-4) var(--pharos-spacing-2);display:flex}._icon_b05po_137{inline-size:var(--pharos-spacing-5);block-size:var(--pharos-spacing-5);flex-shrink:0}._text_b05po_143{gap:var(--pharos-spacing-0-5);overflow-wrap:anywhere;flex-direction:column;flex:1;min-inline-size:0;display:flex}._toast_b05po_61[data-pharos-variant=success] ._icon_b05po_137{color:var(--pharos-color-semantic-success-fg)}._toast_b05po_61[data-pharos-variant=info] ._icon_b05po_137{color:var(--pharos-color-semantic-info-fg)}._toast_b05po_61[data-pharos-variant=destructive] ._icon_b05po_137{color:var(--pharos-color-semantic-error-fg)}._toast_b05po_61[data-pharos-variant=warning] ._icon_b05po_137{color:var(--pharos-color-semantic-warning-on)}._warningFill_b05po_170{fill:var(--pharos-color-semantic-warning-fg);stroke:var(--pharos-color-semantic-warning-fg)}._title_b05po_177{font-size:var(--pharos-font-size-sm);line-height:inherit;font-weight:var(--pharos-font-weight-semibold);margin:0}._description_b05po_184{font-size:var(--pharos-font-size-sm);line-height:inherit;color:var(--pharos-color-neutral-600);margin:0}._action_b05po_191{align-self:flex-start;margin-block-start:var(--pharos-spacing-2)}._close_b05po_198{margin-block:calc(-1 * var(--pharos-spacing-1-5)) calc(-1 * var(--pharos-spacing-1-5));flex-shrink:0}
|
|
1
|
+
._root_1xx27_21{box-sizing:border-box;background-color:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-700);font-family:var(--pharos-font-family-sans);-webkit-user-select:none;user-select:none;--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -1);flex-shrink:0;justify-content:center;align-items:center;font-weight:500;line-height:1;display:inline-flex;position:relative;overflow:hidden}._shapeCircle_1xx27_63{border-radius:var(--pharos-radius-full)}._shapeSquare_1xx27_67{border-radius:var(--pharos-radius-md)}._sizeSm_1xx27_86{width:var(--pharos-spacing-8);height:var(--pharos-spacing-8);--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -.75);font-size:.75rem}._sizeMd_1xx27_93{width:var(--pharos-spacing-10);height:var(--pharos-spacing-10);--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -1);font-size:.875rem}._sizeLg_1xx27_100{width:var(--pharos-spacing-12);height:var(--pharos-spacing-12);--pharos-avatar-overlap:calc(var(--pharos-spacing-2) * -1.25);font-size:1rem}._image_1xx27_118{object-fit:cover;border-radius:inherit;width:100%;height:100%;display:block;position:absolute;inset:0}._fallback_1xx27_134{text-align:center;width:100%;height:100%;font:inherit;color:inherit;justify-content:center;align-items:center;display:inline-flex}._sizeSm_1xx27_86 ._fallback_1xx27_134>svg{width:var(--pharos-spacing-5);height:var(--pharos-spacing-5)}._sizeMd_1xx27_93 ._fallback_1xx27_134>svg{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6)}._sizeLg_1xx27_100 ._fallback_1xx27_134>svg{width:var(--pharos-spacing-7);height:var(--pharos-spacing-7)}._group_1xx27_175{align-items:center;display:inline-flex}._group_1xx27_175>._root_1xx27_21{box-shadow:0 0 0 2px var(--pharos-avatar-group-ring,var(--pharos-color-base-white));position:relative}._group_1xx27_175>._root_1xx27_21+._root_1xx27_21{margin-left:var(--pharos-avatar-overlap)}._badge_zrawy_5{align-items:center;gap:var(--pharos-spacing-1);padding:0 var(--pharos-spacing-2);height:var(--pharos-spacing-5);border-radius:var(--pharos-radius-full);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-xs);font-weight:var(--pharos-font-weight-medium);white-space:nowrap;text-box-trim:trim-both;text-box-edge:cap alphabetic;border:1px solid #0000;width:fit-content;line-height:1;display:inline-flex}._badge_zrawy_5>svg{pointer-events:none;flex:none;width:.75em;height:.75em}._default_zrawy_30{background:var(--pharos-color-neutral-900);color:var(--pharos-color-base-white)}._secondary_zrawy_35{background:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-900)}._destructive_zrawy_40{background:var(--pharos-color-semantic-error-fg);color:var(--pharos-color-semantic-error-on)}._outline_zrawy_45{color:var(--pharos-color-neutral-900);border-color:var(--pharos-color-neutral-500);background:0 0}._success_zrawy_55{background:var(--pharos-color-semantic-success-fg);color:var(--pharos-color-semantic-success-on)}._warning_zrawy_60{background:var(--pharos-color-semantic-warning-fg);color:var(--pharos-color-semantic-warning-on)}._info_zrawy_65{background:var(--pharos-color-semantic-info-fg);color:var(--pharos-color-semantic-info-on)}._button_iu0wg_18{appearance:none;box-sizing:border-box;border-radius:var(--pharos-radius-full);white-space:nowrap;text-box-trim:trim-both;text-box-edge:cap alphabetic;font-family:var(--pharos-font-family-sans);font-style:normal;font-weight:var(--pharos-font-weight-medium);font-variant:normal;font-kerning:auto;font-optical-sizing:auto;font-size-adjust:none;font-feature-settings:normal;font-variation-settings:normal;letter-spacing:normal;text-transform:none;font-stretch:100%;font-size:var(--pharos-font-size-sm);-webkit-user-select:none;user-select:none;cursor:pointer;color:inherit;transition-property:color,background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);background-color:#0000;border:0 solid #0000;justify-content:center;align-items:center;margin:0;padding-top:0;padding-bottom:0;line-height:1.5;text-decoration:none;display:inline-flex}._button_iu0wg_18:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--button-focus-ring,var(--pharos-color-primary-600));outline:none}._button_iu0wg_18:disabled{pointer-events:none;cursor:not-allowed;opacity:.5}._primary_iu0wg_127{background-color:var(--pharos-color-neutral-900);color:var(--pharos-color-base-white);--button-focus-ring:var(--pharos-color-primary-600)}._primary_iu0wg_127:hover{background-color:var(--pharos-color-neutral-700)}._primary_iu0wg_127:active{background-color:var(--pharos-color-neutral-950)}._secondary_iu0wg_141{background-color:var(--pharos-color-base-white);color:var(--pharos-color-neutral-900);border:1px solid var(--pharos-color-neutral-500);--button-focus-ring:var(--pharos-color-primary-600)}._secondary_iu0wg_141:hover{background-color:var(--pharos-color-neutral-50)}._secondary_iu0wg_141:active{background-color:var(--pharos-color-neutral-100)}._ghost_iu0wg_161{color:var(--pharos-color-neutral-900);--button-focus-ring:var(--pharos-color-primary-600);background-color:#0000}._ghost_iu0wg_161:hover{background-color:var(--pharos-color-neutral-100)}._ghost_iu0wg_161:active{background-color:var(--pharos-color-neutral-200)}._destructive_iu0wg_175{background-color:var(--pharos-color-semantic-error-fg);color:var(--pharos-color-semantic-error-on);--button-focus-ring:var(--pharos-color-semantic-error-fg)}._destructive_iu0wg_175:hover{background-color:var(--pharos-color-semantic-error-fg-hover)}._destructive_iu0wg_175:active{background-color:var(--pharos-color-semantic-error-fg-active)}._sizeSm_iu0wg_197{height:var(--pharos-spacing-8);gap:var(--pharos-spacing-1-5);padding:0 var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm);line-height:1.42857}._sizeMd_iu0wg_205{height:var(--pharos-spacing-10);gap:var(--pharos-spacing-2);padding:0 var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm);line-height:1.42857}._sizeLg_iu0wg_213{height:var(--pharos-spacing-12);gap:var(--pharos-spacing-2);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base);line-height:1.5}._card_yxgwa_10{background-color:var(--pharos-color-base-white);border-radius:var(--pharos-radius-2xl);gap:var(--pharos-spacing-6);font-family:var(--pharos-font-family-sans);color:var(--pharos-color-neutral-900);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);border:0 solid #0000;flex-direction:column;display:flex}._default_yxgwa_42{border:1px solid var(--pharos-color-neutral-200)}._elevated_yxgwa_46{box-shadow:var(--pharos-shadow-md);border:0 solid #0000}._outlined_yxgwa_51{border:1px solid var(--pharos-color-neutral-300)}._header_yxgwa_62{gap:var(--pharos-spacing-1-5);padding:var(--pharos-spacing-6) var(--pharos-spacing-6) 0;flex-direction:column;display:flex}._title_yxgwa_69{font-size:var(--pharos-font-size-base);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.25}._description_yxgwa_77{font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);color:var(--pharos-color-neutral-500);margin:0;line-height:1.5}._content_yxgwa_85{padding:0 var(--pharos-spacing-6)}._footer_yxgwa_95{align-items:center;gap:var(--pharos-spacing-3);padding:0 var(--pharos-spacing-6) var(--pharos-spacing-6);display:flex}._root_1v9tz_14{box-sizing:border-box;width:var(--pharos-spacing-5);height:var(--pharos-spacing-5);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-sm);background-color:var(--pharos-color-base-white);color:var(--pharos-color-base-white);cursor:pointer;transition-property:background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}._root_1v9tz_14:hover:not([data-disabled]):not([data-checked]):not([data-indeterminate]){border-color:var(--pharos-color-neutral-700)}._root_1v9tz_14[data-checked],._root_1v9tz_14[data-indeterminate]{background-color:var(--pharos-color-neutral-900);border-color:var(--pharos-color-neutral-900)}._root_1v9tz_14[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._root_1v9tz_14:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._root_1v9tz_14[data-disabled]{cursor:not-allowed;opacity:.5}._indicator_1v9tz_65{color:var(--pharos-color-base-white);justify-content:center;align-items:center;display:inline-flex}._icon_1v9tz_72{width:var(--pharos-spacing-3);height:var(--pharos-spacing-3)}._iconIndeterminate_1v9tz_79,._indicator_1v9tz_65[data-indeterminate] ._iconCheck_1v9tz_83{display:none}._indicator_1v9tz_65[data-indeterminate] ._iconIndeterminate_1v9tz_79{display:block}._control_12m6b_5{box-sizing:border-box;align-items:center;gap:var(--pharos-spacing-2);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;font-family:var(--pharos-font-family-sans);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);display:flex}._control_12m6b_5:focus-within{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600)}._control_12m6b_5[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._control_12m6b_5:has([aria-invalid=true]){border-color:var(--pharos-color-semantic-error-fg)}._control_12m6b_5[data-disabled]{opacity:.5;cursor:not-allowed}._control_12m6b_5:has(._input_12m6b_66:disabled){opacity:.5;cursor:not-allowed}._chips_12m6b_72{gap:var(--pharos-spacing-1);padding:var(--pharos-spacing-1) var(--pharos-spacing-2);flex-wrap:wrap}._input_12m6b_66{appearance:none;min-width:0;color:var(--pharos-color-neutral-900);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);background:0 0;border:none;outline:none;flex:auto;margin:0;line-height:1.25}._input_12m6b_66::placeholder{color:var(--pharos-color-neutral-500);opacity:1}._input_12m6b_66:disabled{cursor:not-allowed}._inputSizeSm_12m6b_110{height:var(--pharos-spacing-8);padding:0 var(--pharos-spacing-3)}._inputSizeMd_12m6b_115{height:var(--pharos-spacing-10);padding:0 var(--pharos-spacing-4)}._inputSizeLg_12m6b_120{height:var(--pharos-spacing-12);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}._chipsInput_12m6b_128{height:var(--pharos-spacing-7);padding:0 var(--pharos-spacing-1);flex:4rem}._trigger_12m6b_135,._clear_12m6b_136{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6);color:var(--pharos-color-neutral-500);cursor:default;background:0 0;border:none;flex:none;justify-content:center;align-items:center;margin-inline-end:var(--pharos-spacing-1);padding:0;display:inline-flex}._trigger_12m6b_135 svg,._clear_12m6b_136 svg{width:1rem;height:1rem}._trigger_12m6b_135[data-popup-open] svg{transition:transform var(--pharos-duration-fast) var(--pharos-easing-out);transform:rotate(180deg)}._chip_12m6b_72{align-items:center;gap:var(--pharos-spacing-1);padding:0 var(--pharos-spacing-1) 0 var(--pharos-spacing-2);height:var(--pharos-spacing-6);border-radius:var(--pharos-radius-sm);background-color:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-900);font-size:var(--pharos-font-size-xs);display:inline-flex}._chip_12m6b_72[data-highlighted]{background-color:var(--pharos-color-neutral-200)}._chipRemove_12m6b_180{width:var(--pharos-spacing-4);height:var(--pharos-spacing-4);border-radius:var(--pharos-radius-sm);color:var(--pharos-color-neutral-500);cursor:default;background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:inline-flex}._chipRemove_12m6b_180:hover{color:var(--pharos-color-neutral-900)}._trigger_12m6b_135[data-disabled],._clear_12m6b_136[data-disabled],._chipRemove_12m6b_180[data-disabled]{cursor:not-allowed}._chipRemove_12m6b_180[data-disabled]:hover{color:var(--pharos-color-neutral-500)}._chipRemove_12m6b_180 svg{width:.875rem;height:.875rem}._positioner_12m6b_227{z-index:var(--pharos-z-index-popover)}._content_12m6b_217{box-sizing:border-box;width:var(--anchor-width);max-height:var(--available-height);padding:var(--pharos-spacing-1);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;overflow-y:auto}._content_12m6b_217[data-starting-style],._content_12m6b_217[data-ending-style]{opacity:0;transform:scale(.96)}._item_12m6b_14{align-items:flex-start;gap:var(--pharos-spacing-2);padding:var(--pharos-spacing-2) var(--pharos-spacing-3);border-radius:var(--pharos-radius-sm);color:var(--pharos-color-neutral-900);cursor:default;-webkit-user-select:none;user-select:none;scroll-margin:var(--pharos-spacing-1);outline:none;display:flex;position:relative}._item_12m6b_14[data-highlighted]{background-color:var(--pharos-color-neutral-100)}._item_12m6b_14[data-disabled]{color:var(--pharos-color-neutral-400);pointer-events:none}._itemText_12m6b_14{overflow-wrap:anywhere;white-space:normal;flex:auto;min-width:0}._itemIndicator_12m6b_298{block-size:1lh;color:var(--pharos-color-primary-600);flex:none;justify-content:center;align-items:center;display:inline-flex}._itemIndicator_12m6b_298 svg{width:1rem;height:1rem}._empty_12m6b_322{color:var(--pharos-color-neutral-500);text-align:center}._empty_12m6b_322:not(:empty){padding:var(--pharos-spacing-3)}._label_12m6b_332{padding:var(--pharos-spacing-2) var(--pharos-spacing-3) var(--pharos-spacing-1);font-size:var(--pharos-font-size-xs);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-600)}._separator_12m6b_339{height:1px;margin:var(--pharos-spacing-1) 0;background-color:var(--pharos-color-neutral-200)}@media (pointer:coarse){._input_12m6b_66{font-size:var(--pharos-font-size-base)}}._backdrop_1d4e6_19{z-index:var(--pharos-z-index-modal);background-color:color-mix(in srgb, var(--pharos-color-base-black) 50%, transparent);transition:opacity var(--pharos-duration-normal) var(--pharos-easing-out);position:fixed;inset:0}._backdrop_1d4e6_19[data-starting-style],._backdrop_1d4e6_19[data-ending-style]{opacity:0}._content_1d4e6_33{transform-origin:50%;z-index:var(--pharos-z-index-modal);box-sizing:border-box;width:calc(100% - 2 * var(--pharos-spacing-4));max-width:32rem;max-height:calc(100dvh - 2 * var(--pharos-spacing-6));gap:var(--pharos-spacing-4);padding:var(--pharos-spacing-6);background-color:var(--pharos-color-base-white);border-radius:var(--pharos-radius-lg);box-shadow:var(--pharos-shadow-xl);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;flex-direction:column;display:flex;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}._content_1d4e6_33[data-starting-style],._content_1d4e6_33[data-ending-style]{opacity:0;transform:translate(-50%,-50%)scale(.96)}._header_1d4e6_76{gap:var(--pharos-spacing-1);flex-direction:column;display:flex}._title_1d4e6_82{font-size:var(--pharos-font-size-lg);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.4}._description_1d4e6_90{font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-600);margin:0;line-height:1.5}._footer_1d4e6_97{gap:var(--pharos-spacing-2);justify-content:flex-end;margin-top:auto;display:flex}._positioner_e7uyk_9{z-index:var(--pharos-z-index-popover)}._content_e7uyk_4{box-sizing:border-box;min-width:12rem;padding:var(--pharos-spacing-1);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out)}._content_e7uyk_4[data-starting-style],._content_e7uyk_4[data-ending-style]{opacity:0;transform:scale(.96)}._item_e7uyk_5{box-sizing:border-box;align-items:center;gap:var(--pharos-spacing-2);width:100%;padding:var(--pharos-spacing-1-5) var(--pharos-spacing-2);border-radius:var(--pharos-radius-sm);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-medium);color:var(--pharos-color-neutral-700);cursor:default;-webkit-user-select:none;user-select:none;scroll-margin:var(--pharos-spacing-1);transition-property:background-color,color;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;line-height:1.25;display:flex}._item_e7uyk_5[data-highlighted]{background-color:var(--pharos-color-neutral-100);color:var(--pharos-color-neutral-900)}._item_e7uyk_5[data-disabled]{color:var(--pharos-color-neutral-500);opacity:.6;pointer-events:none}._item_e7uyk_5>svg{flex-shrink:0;width:1rem;height:1rem}._itemDestructive_e7uyk_113{color:var(--pharos-color-semantic-error-fg)}._itemDestructive_e7uyk_113[data-highlighted]{background-color:var(--pharos-color-semantic-error-bg);color:var(--pharos-color-semantic-error-fg-hover)}._separator_e7uyk_6{height:1px;margin:var(--pharos-spacing-1) calc(var(--pharos-spacing-1) * -1);background-color:var(--pharos-color-neutral-200)}._label_e7uyk_6{padding:var(--pharos-spacing-1-5) var(--pharos-spacing-2);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-500)}._button_ltuh2_14{appearance:none;box-sizing:border-box;border-radius:var(--pharos-radius-full);-webkit-user-select:none;user-select:none;cursor:pointer;color:inherit;font-family:var(--pharos-font-family-sans);transition-property:color,background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);background-color:#0000;border:0 solid #0000;flex-shrink:0;justify-content:center;align-items:center;margin:0;padding:0;display:inline-flex}._button_ltuh2_14:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--icon-button-focus-ring,var(--pharos-color-primary-600));outline:none}._button_ltuh2_14:disabled{pointer-events:none;cursor:not-allowed;opacity:.5}._primary_ltuh2_74{background-color:var(--pharos-color-neutral-900);color:var(--pharos-color-base-white);--icon-button-focus-ring:var(--pharos-color-primary-600)}._primary_ltuh2_74:hover{background-color:var(--pharos-color-neutral-700)}._primary_ltuh2_74:active{background-color:var(--pharos-color-neutral-950)}._secondary_ltuh2_88{background-color:var(--pharos-color-base-white);color:var(--pharos-color-neutral-900);border:1px solid var(--pharos-color-neutral-500);--icon-button-focus-ring:var(--pharos-color-primary-600)}._secondary_ltuh2_88:hover{background-color:var(--pharos-color-neutral-50)}._secondary_ltuh2_88:active{background-color:var(--pharos-color-neutral-100)}._ghost_ltuh2_107{color:var(--pharos-color-neutral-900);--icon-button-focus-ring:var(--pharos-color-primary-600);background-color:#0000}._ghost_ltuh2_107:hover{background-color:var(--pharos-color-neutral-100)}._ghost_ltuh2_107:active{background-color:var(--pharos-color-neutral-200)}._destructive_ltuh2_121{background-color:var(--pharos-color-semantic-error-fg);color:var(--pharos-color-semantic-error-on);--icon-button-focus-ring:var(--pharos-color-semantic-error-fg)}._destructive_ltuh2_121:hover{background-color:var(--pharos-color-semantic-error-fg-hover)}._destructive_ltuh2_121:active{background-color:var(--pharos-color-semantic-error-fg-active)}._sizeSm_ltuh2_150{width:var(--pharos-spacing-8);height:var(--pharos-spacing-8)}._sizeSm_ltuh2_150>svg{width:var(--pharos-spacing-4);height:var(--pharos-spacing-4)}._sizeMd_ltuh2_160{width:var(--pharos-spacing-10);height:var(--pharos-spacing-10)}._sizeMd_ltuh2_160>svg{width:var(--pharos-spacing-5);height:var(--pharos-spacing-5)}._sizeLg_ltuh2_170{width:var(--pharos-spacing-12);height:var(--pharos-spacing-12)}._sizeLg_ltuh2_170>svg{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6)}@keyframes _pharos-spinner-spin_gg970_1{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._spinner_gg970_28{color:currentColor;vertical-align:middle;justify-content:center;align-items:center;display:inline-flex}._icon_gg970_46{width:100%;height:100%;animation:_pharos-spinner-spin_gg970_1 var(--pharos-duration-slow,1s) linear infinite}@media (prefers-reduced-motion:reduce){._icon_gg970_46{animation-duration:4s}}._sizeSm_gg970_69{width:var(--pharos-spacing-4);height:var(--pharos-spacing-4)}._sizeMd_gg970_74{width:var(--pharos-spacing-5);height:var(--pharos-spacing-5)}._sizeLg_gg970_79{width:var(--pharos-spacing-6);height:var(--pharos-spacing-6)}._srOnly_gg970_87{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._input_1ueoc_14{appearance:none;box-sizing:border-box;border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;color:var(--pharos-color-neutral-900);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);margin:0;line-height:1.25}._input_1ueoc_14::placeholder{color:var(--pharos-color-neutral-500);opacity:1}._input_1ueoc_14:focus-visible{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._input_1ueoc_14:disabled{cursor:not-allowed;opacity:.5}._input_1ueoc_14[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._input_1ueoc_14[aria-invalid=true]:focus-visible{border-color:var(--pharos-color-semantic-error-fg);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-semantic-error-fg)}._sizeSm_1ueoc_97{height:var(--pharos-spacing-8);padding:0 var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm)}._sizeMd_1ueoc_103{height:var(--pharos-spacing-10);padding:0 var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm)}._sizeLg_1ueoc_109{height:var(--pharos-spacing-12);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}@media (pointer:coarse){._input_1ueoc_14,._sizeSm_1ueoc_97,._sizeMd_1ueoc_103{font-size:var(--pharos-font-size-base)}}._positioner_l8xbr_15{z-index:var(--pharos-z-index-popover)}._content_l8xbr_4{box-sizing:border-box;max-width:20rem;padding:var(--pharos-spacing-4);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none}._content_l8xbr_4[data-starting-style],._content_l8xbr_4[data-ending-style]{opacity:0;transform:scale(.96)}._title_l8xbr_5{font-size:var(--pharos-font-size-base);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.4}._description_l8xbr_5{margin:var(--pharos-spacing-1) 0 0;font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-600);line-height:1.5}._group_rsllu_18{gap:var(--pharos-spacing-2);flex-direction:column;display:flex}._item_rsllu_24{box-sizing:border-box;width:var(--pharos-spacing-5);height:var(--pharos-spacing-5);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-base-white);cursor:pointer;transition-property:background-color,border-color,box-shadow;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);flex-shrink:0;justify-content:center;align-items:center;padding:0;display:inline-flex}._item_rsllu_24:hover:not([data-disabled]):not([data-checked]){border-color:var(--pharos-color-neutral-700)}._item_rsllu_24[data-checked]{border-color:var(--pharos-color-neutral-900)}._group_rsllu_18[aria-invalid=true] ._item_rsllu_24{border-color:var(--pharos-color-semantic-error-fg)}._item_rsllu_24:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._item_rsllu_24[data-disabled]{cursor:not-allowed;opacity:.5}._indicator_rsllu_75{width:var(--pharos-spacing-2);height:var(--pharos-spacing-2);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-neutral-900);display:inline-flex}._trigger_g5qz6_35{appearance:none;box-sizing:border-box;justify-content:space-between;align-items:center;gap:var(--pharos-spacing-2);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;color:var(--pharos-color-neutral-900);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);text-align:start;cursor:default;transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);margin:0;line-height:1.25;display:inline-flex}._trigger_g5qz6_35:focus-visible{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._trigger_g5qz6_35:disabled,._trigger_g5qz6_35[data-disabled]{cursor:not-allowed;opacity:.5}._trigger_g5qz6_35[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._trigger_g5qz6_35[aria-invalid=true]:focus-visible{border-color:var(--pharos-color-semantic-error-fg);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-semantic-error-fg)}._sizeSm_g5qz6_92{height:var(--pharos-spacing-8);padding:0 var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm)}._sizeMd_g5qz6_98{height:var(--pharos-spacing-10);padding:0 var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm)}._sizeLg_g5qz6_104{height:var(--pharos-spacing-12);padding:0 var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}._value_g5qz6_113{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}._value_g5qz6_113[data-placeholder]{color:var(--pharos-color-neutral-500)}._icon_g5qz6_127{color:var(--pharos-color-neutral-500);transition:transform var(--pharos-duration-fast) var(--pharos-easing-out);flex:none;justify-content:center;align-items:center;display:inline-flex}._icon_g5qz6_127 svg{width:1rem;height:1rem}._icon_g5qz6_127[data-popup-open]{transform:rotate(180deg)}._positioner_g5qz6_24{z-index:var(--pharos-z-index-popover)}._content_g5qz6_146{box-sizing:border-box;width:var(--anchor-width);max-height:var(--available-height);padding:var(--pharos-spacing-1);background-color:var(--pharos-color-base-white);border:1px solid var(--pharos-color-neutral-200);border-radius:var(--pharos-radius-md);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform-origin:var(--transform-origin);transition-property:opacity,transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);outline:none;overflow-y:auto}._content_g5qz6_146[data-starting-style],._content_g5qz6_146[data-ending-style]{opacity:0;transform:scale(.96)}._item_g5qz6_17{align-items:flex-start;gap:var(--pharos-spacing-2);padding:var(--pharos-spacing-2) var(--pharos-spacing-3);border-radius:var(--pharos-radius-sm);color:var(--pharos-color-neutral-900);cursor:default;-webkit-user-select:none;user-select:none;scroll-margin:var(--pharos-spacing-1);outline:none;display:flex;position:relative}._item_g5qz6_17[data-highlighted]{background-color:var(--pharos-color-neutral-100)}._item_g5qz6_17[data-disabled]{color:var(--pharos-color-neutral-400);pointer-events:none}._itemText_g5qz6_17{overflow-wrap:anywhere;white-space:normal;flex:auto;min-width:0}._itemIndicator_g5qz6_230{block-size:1lh;color:var(--pharos-color-primary-600);flex:none;justify-content:center;align-items:center;display:inline-flex}._itemIndicator_g5qz6_230 svg{width:1rem;height:1rem}._label_g5qz6_246{padding:var(--pharos-spacing-2) var(--pharos-spacing-3) var(--pharos-spacing-1);font-size:var(--pharos-font-size-xs);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-600)}._separator_g5qz6_254{height:1px;margin:var(--pharos-spacing-1) 0;background-color:var(--pharos-color-neutral-200)}._separator_da90p_13{background-color:var(--pharos-color-neutral-200);border:0;flex-shrink:0;margin:0}._horizontal_da90p_29{width:100%;height:1px}._vertical_da90p_34{width:1px;height:100%}._backdrop_1jbnh_17{z-index:var(--pharos-z-index-modal);background-color:color-mix(in srgb, var(--pharos-color-base-black) 50%, transparent);transition:opacity var(--pharos-duration-normal) var(--pharos-easing-out);position:fixed;inset:0}._backdrop_1jbnh_17[data-starting-style],._backdrop_1jbnh_17[data-ending-style]{opacity:0}._content_1jbnh_33{z-index:var(--pharos-z-index-modal);box-sizing:border-box;gap:var(--pharos-spacing-4);padding:var(--pharos-spacing-6);background-color:var(--pharos-color-base-white);box-shadow:var(--pharos-shadow-xl);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transition:transform var(--pharos-duration-normal) var(--pharos-easing-out);outline:none;flex-direction:column;display:flex;position:fixed;overflow-y:auto}._sideRight_1jbnh_56{border-left:1px solid var(--pharos-color-neutral-200);width:min(24rem,100vw);height:100dvh;top:0;bottom:0;right:0}._sideRight_1jbnh_56[data-starting-style],._sideRight_1jbnh_56[data-ending-style]{transform:translate(100%)}._sideLeft_1jbnh_69{border-right:1px solid var(--pharos-color-neutral-200);width:min(24rem,100vw);height:100dvh;top:0;bottom:0;left:0}._sideLeft_1jbnh_69[data-starting-style],._sideLeft_1jbnh_69[data-ending-style]{transform:translate(-100%)}._sideTop_1jbnh_82{border-bottom:1px solid var(--pharos-color-neutral-200);width:100vw;max-height:100dvh;top:0;left:0;right:0}._sideTop_1jbnh_82[data-starting-style],._sideTop_1jbnh_82[data-ending-style]{transform:translateY(-100%)}._sideBottom_1jbnh_95{border-top:1px solid var(--pharos-color-neutral-200);width:100vw;max-height:100dvh;bottom:0;left:0;right:0}._sideBottom_1jbnh_95[data-starting-style],._sideBottom_1jbnh_95[data-ending-style]{transform:translateY(100%)}._header_1jbnh_109{gap:var(--pharos-spacing-1);flex-direction:column;display:flex}._title_1jbnh_115{font-size:var(--pharos-font-size-lg);font-weight:var(--pharos-font-weight-semibold);color:var(--pharos-color-neutral-900);margin:0;line-height:1.4}._description_1jbnh_123{font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-600);margin:0;line-height:1.5}._footer_1jbnh_130{gap:var(--pharos-spacing-2);justify-content:flex-end;margin-top:auto;display:flex}._root_5v2er_17{box-sizing:border-box;width:var(--pharos-spacing-10);height:var(--pharos-spacing-6);padding:var(--pharos-spacing-1);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-neutral-300);cursor:pointer;transition-property:background-color,box-shadow;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out);border:none;flex-shrink:0;align-items:center;display:inline-flex}._root_5v2er_17:hover:not([data-disabled]):not([data-checked]){background-color:var(--pharos-color-neutral-400)}._root_5v2er_17[data-checked]{background-color:var(--pharos-color-neutral-900)}._root_5v2er_17[data-checked]:hover:not([data-disabled]){background-color:var(--pharos-color-neutral-700)}._root_5v2er_17[aria-invalid=true]{box-shadow:inset 0 0 0 1px var(--pharos-color-semantic-error-fg)}._root_5v2er_17:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._root_5v2er_17[data-disabled]{cursor:not-allowed;opacity:.5}._thumb_5v2er_72{box-sizing:border-box;width:var(--pharos-spacing-4);height:var(--pharos-spacing-4);border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-full);background-color:var(--pharos-color-base-white);transition-property:transform;transition-duration:var(--pharos-duration-fast);transition-timing-function:var(--pharos-easing-out)}._root_5v2er_17[data-checked] ._thumb_5v2er_72{transform:translateX(var(--pharos-spacing-4))}._textarea_145hb_21{appearance:none;box-sizing:border-box;border:1px solid var(--pharos-color-neutral-500);border-radius:var(--pharos-radius-md);background-color:var(--pharos-color-base-white);width:100%;color:var(--pharos-color-neutral-900);resize:vertical;font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);font-weight:var(--pharos-font-weight-regular);transition-property:border-color,box-shadow;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);margin:0;line-height:1.5}._textarea_145hb_21::placeholder{color:var(--pharos-color-neutral-500);opacity:1}._textarea_145hb_21:focus-visible{border-color:var(--pharos-color-primary-600);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600);outline:none}._textarea_145hb_21:disabled{cursor:not-allowed;opacity:.5;resize:none}._textarea_145hb_21[aria-invalid=true]{border-color:var(--pharos-color-semantic-error-fg)}._textarea_145hb_21[aria-invalid=true]:focus-visible{border-color:var(--pharos-color-semantic-error-fg);box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-semantic-error-fg)}._sizeSm_145hb_113{min-height:var(--pharos-spacing-16);padding:var(--pharos-spacing-2) var(--pharos-spacing-3);font-size:var(--pharos-font-size-sm)}._sizeMd_145hb_119{min-height:var(--pharos-spacing-20);padding:var(--pharos-spacing-2-5) var(--pharos-spacing-4);font-size:var(--pharos-font-size-sm)}._sizeLg_145hb_125{min-height:var(--pharos-spacing-24);padding:var(--pharos-spacing-3) var(--pharos-spacing-6);font-size:var(--pharos-font-size-base)}@media (pointer:coarse){._textarea_145hb_21,._sizeSm_145hb_113,._sizeMd_145hb_119{font-size:var(--pharos-font-size-base)}}._viewport_1l5b5_17{--pharos-toast-edge-gap:var(--pharos-spacing-4);z-index:var(--pharos-z-index-toast);box-sizing:border-box;inline-size:min(22.5rem, calc(100% - 2 * var(--pharos-toast-edge-gap)));gap:var(--pharos-spacing-2);pointer-events:none;outline:none;flex-direction:column;display:flex;position:fixed}._viewport_1l5b5_17[data-pharos-position^=top]{inset-block-start:var(--pharos-toast-offset,var(--pharos-toast-edge-gap))}._viewport_1l5b5_17[data-pharos-position^=bottom]{flex-direction:column-reverse;inset-block-end:var(--pharos-toast-offset,var(--pharos-toast-edge-gap))}._viewport_1l5b5_17[data-pharos-position$=start]{inset-inline-start:var(--pharos-toast-edge-gap)}._viewport_1l5b5_17[data-pharos-position$=end]{inset-inline-end:var(--pharos-toast-edge-gap)}._viewport_1l5b5_17[data-pharos-position$=center]{margin-inline:auto;inset-inline:0}._toast_1l5b5_60{--pharos-toast-enter-shift:calc(-1 * var(--pharos-spacing-4));box-sizing:border-box;pointer-events:auto;background-color:var(--pharos-color-surface-card);border:1px solid var(--pharos-color-border-subtle);border-radius:var(--pharos-radius-lg);box-shadow:var(--pharos-shadow-lg);font-family:var(--pharos-font-family-sans);font-size:var(--pharos-font-size-sm);color:var(--pharos-color-neutral-900);transform:translate(var(--toast-swipe-movement-x,0), var(--toast-swipe-movement-y,0));transition-property:opacity,transform;transition-duration:var(--pharos-duration-normal);transition-timing-function:var(--pharos-easing-out);line-height:1.43}._viewport_1l5b5_17[data-pharos-position^=bottom] ._toast_1l5b5_60{--pharos-toast-enter-shift:var(--pharos-spacing-4)}._toast_1l5b5_60[data-starting-style],._toast_1l5b5_60[data-ending-style]{opacity:0;transform:translateY(var(--pharos-toast-enter-shift))}._toast_1l5b5_60[data-ending-style][data-swipe-direction=left]{transform:translateX(calc(var(--toast-swipe-movement-x,0) - 100%))}._toast_1l5b5_60[data-ending-style][data-swipe-direction=right]{transform:translateX(calc(var(--toast-swipe-movement-x,0) + 100%))}._toast_1l5b5_60[data-limited]{opacity:0}._toast_1l5b5_60:focus-visible{box-shadow:0 0 0 2px var(--pharos-color-base-white), 0 0 0 4px var(--pharos-color-primary-600), var(--pharos-shadow-lg);outline:none}@media (prefers-reduced-motion:reduce){._toast_1l5b5_60,._toast_1l5b5_60[data-starting-style],._toast_1l5b5_60[data-ending-style]{transition-property:opacity;transform:none}}._content_1l5b5_127{align-items:flex-start;gap:var(--pharos-spacing-3);padding-block:var(--pharos-spacing-3);padding-inline:var(--pharos-spacing-4) var(--pharos-spacing-2);display:flex}._icon_1l5b5_136{inline-size:var(--pharos-spacing-5);block-size:var(--pharos-spacing-5);flex-shrink:0}._text_1l5b5_142{gap:var(--pharos-spacing-0-5);overflow-wrap:anywhere;flex-direction:column;flex:1;min-inline-size:0;display:flex}._toast_1l5b5_60[data-pharos-variant=success] ._icon_1l5b5_136{color:var(--pharos-color-semantic-success-fg)}._toast_1l5b5_60[data-pharos-variant=info] ._icon_1l5b5_136{color:var(--pharos-color-semantic-info-fg)}._toast_1l5b5_60[data-pharos-variant=destructive] ._icon_1l5b5_136{color:var(--pharos-color-semantic-error-fg)}._toast_1l5b5_60[data-pharos-variant=warning] ._icon_1l5b5_136{color:var(--pharos-color-semantic-warning-on)}._warningFill_1l5b5_169{fill:var(--pharos-color-semantic-warning-fg);stroke:var(--pharos-color-semantic-warning-fg)}._title_1l5b5_176{font-size:var(--pharos-font-size-sm);line-height:inherit;font-weight:var(--pharos-font-weight-semibold);margin:0}._description_1l5b5_183{font-size:var(--pharos-font-size-sm);line-height:inherit;color:var(--pharos-color-neutral-600);margin:0}._action_1l5b5_190{align-self:flex-start;margin-block-start:var(--pharos-spacing-2)}._close_1l5b5_197{margin-block:calc(-1 * var(--pharos-spacing-1-5)) calc(-1 * var(--pharos-spacing-1-5));flex-shrink:0}
|
|
2
2
|
/*$vite$:1*/
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@code-sherpas/pharos-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"description": "React component library for Code Sherpas. Consumes @code-sherpas/pharos-tokens. Vite library mode + CSS Modules — no Tailwind, no CSS framework required at the consumer.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -107,14 +107,15 @@
|
|
|
107
107
|
"**/*.css"
|
|
108
108
|
],
|
|
109
109
|
"engines": {
|
|
110
|
-
"node": ">=22"
|
|
110
|
+
"node": ">=22",
|
|
111
|
+
"pnpm": "10.33.0"
|
|
111
112
|
},
|
|
112
113
|
"lint-staged": {
|
|
113
114
|
"*.{ts,tsx,js,mjs,cjs,json,md,mdx,css,yml,yaml}": "prettier --write"
|
|
114
115
|
},
|
|
115
116
|
"peerDependencies": {
|
|
116
117
|
"@base-ui/react": "^1.4.1",
|
|
117
|
-
"@code-sherpas/pharos-tokens": "^0.
|
|
118
|
+
"@code-sherpas/pharos-tokens": "^0.8.0",
|
|
118
119
|
"react": ">=18",
|
|
119
120
|
"react-dom": ">=18"
|
|
120
121
|
},
|
|
@@ -125,13 +126,13 @@
|
|
|
125
126
|
"devDependencies": {
|
|
126
127
|
"@base-ui/react": "^1.4.1",
|
|
127
128
|
"@changesets/cli": "^2.27.10",
|
|
128
|
-
"@code-sherpas/pharos-tokens": "^0.
|
|
129
|
+
"@code-sherpas/pharos-tokens": "^0.8.0",
|
|
129
130
|
"@fontsource/inter": "^5.2.8",
|
|
130
131
|
"@fontsource/outfit": "^5.2.8",
|
|
131
|
-
"@storybook/addon-a11y": "^10.
|
|
132
|
-
"@storybook/addon-docs": "^10.
|
|
133
|
-
"@storybook/addon-vitest": "10.
|
|
134
|
-
"@storybook/react-vite": "^10.
|
|
132
|
+
"@storybook/addon-a11y": "^10.6.2",
|
|
133
|
+
"@storybook/addon-docs": "^10.6.2",
|
|
134
|
+
"@storybook/addon-vitest": "10.6.2",
|
|
135
|
+
"@storybook/react-vite": "^10.6.2",
|
|
135
136
|
"@testing-library/jest-dom": "^6.6.3",
|
|
136
137
|
"@testing-library/react": "^16.1.0",
|
|
137
138
|
"@testing-library/user-event": "^14.6.1",
|
|
@@ -155,7 +156,7 @@
|
|
|
155
156
|
"prettier": "^3.4.2",
|
|
156
157
|
"react": "^19.2.7",
|
|
157
158
|
"react-dom": "^19.2.7",
|
|
158
|
-
"storybook": "^10.
|
|
159
|
+
"storybook": "^10.6.2",
|
|
159
160
|
"typescript": "^6.0.3",
|
|
160
161
|
"vite": "^8.0.9",
|
|
161
162
|
"vite-plugin-dts": "^5.0.0",
|
|
@@ -163,13 +164,13 @@
|
|
|
163
164
|
},
|
|
164
165
|
"scripts": {
|
|
165
166
|
"build": "vite build && pnpm verify:dist-types && pnpm verify:dist-rsc",
|
|
166
|
-
"storybook": "storybook dev -p 6006",
|
|
167
|
+
"storybook": "bash scripts/check-node-version.sh && storybook dev -p 6006",
|
|
167
168
|
"build-storybook": "storybook build",
|
|
168
169
|
"test": "vitest run --project unit",
|
|
169
170
|
"test:watch": "vitest --project unit",
|
|
170
171
|
"test:storybook": "vitest run --project storybook",
|
|
171
172
|
"test:e2e": "pnpm --filter @examples/saas-demo test:e2e",
|
|
172
|
-
"dev:demo": "pnpm --filter @examples/saas-demo dev",
|
|
173
|
+
"dev:demo": "bash scripts/check-node-version.sh && pnpm --filter @examples/saas-demo dev",
|
|
173
174
|
"typecheck": "tsc --noEmit",
|
|
174
175
|
"verify:dist-types": "tsc --noEmit -p tsconfig.dist-smoke.json",
|
|
175
176
|
"verify:dist-rsc": "node scripts/verify-dist-rsc.mjs",
|