@code-sherpas/pharos-react 0.18.0 → 0.20.0

package/dist/components/IconButton.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton.module.js","names":[],"sources":["../../src/components/IconButton.module.css"],"sourcesContent":["/* IconButton.module.css\n *\n * Per-component CSS Modules definition (Decision D9). The build emits hashed\n * class names (`IconButton_button__xxxx`) into `dist/styles.css`; the runtime\n * JS references them through the `styles` object imported by IconButton.tsx.\n *\n * Square dimensions across every size — the wrapper width matches the\n * height, so the rounded-full radius produces a perfect circle (matches\n * Material 3 / MUI / Mantine ActionIcon transparent variant). Icon child\n * SVGs are sized via the `> svg` direct-child selector so a Lucide icon\n * does not need explicit `size` props on the consumer side.\n */\n\n.button {\n  /* Strip native button rendering. Same rationale as Button.module.css —\n   * platform-specific drawing only adds variance without value. */\n  appearance: none;\n  -webkit-appearance: none;\n\n  /* === Box model ===\n   * `padding: 0` plus equal width / height gives the square that the\n   * `border-radius: var(--pharos-radius-full)` turns into a circle. Hard\n   * `flex-shrink: 0` so the IconButton keeps its dimensions inside a flex\n   * row (toolbar, header) where surrounding labels could otherwise force\n   * it to compress. */\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  border: 0 solid transparent;\n  border-radius: var(--pharos-radius-full);\n  flex-shrink: 0;\n\n  /* === Layout === */\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n\n  /* === Interactivity === */\n  user-select: none;\n  cursor: pointer;\n  background-color: transparent;\n  color: inherit;\n  font-family: var(--pharos-font-family-sans);\n\n  /* === Transitions === */\n  transition-property: color, background-color, border-color, box-shadow;\n  transition-duration: var(--pharos-duration-normal);\n  transition-timing-function: var(--pharos-easing-out);\n}\n\n.button:focus-visible {\n  outline: none;\n  /* Two-stop box-shadow mirrors the Button focus ring so a row of mixed\n   * Buttons + IconButtons share a single focus look. */\n  box-shadow:\n    0 0 0 2px var(--pharos-color-base-white),\n    0 0 0 4px var(--icon-button-focus-ring, var(--pharos-color-primary-600));\n}\n\n.button:disabled {\n  pointer-events: none;\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/* === Intents ===\n *\n * Same palette as Button (D-cardinal: state-of-the-art coherence first,\n * Alexandria adapts). `ghost` is the most common icon-button case\n * (toolbars, close buttons, action icons), but the four intents stay\n * available for the rare deliberate emphasis (primary \"send\" icon,\n * destructive \"delete\" icon, secondary bordered circle navigation). */\n\n.primary {\n  background-color: var(--pharos-color-neutral-900);\n  color: var(--pharos-color-base-white);\n  --icon-button-focus-ring: var(--pharos-color-primary-600);\n}\n\n.primary:hover {\n  background-color: var(--pharos-color-neutral-700);\n}\n\n.primary:active {\n  background-color: var(--pharos-color-neutral-950);\n}\n\n.secondary {\n  background-color: var(--pharos-color-base-white);\n  color: var(--pharos-color-neutral-900);\n  /* `neutral-500` clears WCAG 1.4.11 (Non-text Contrast, 3:1 vs surface).\n   * Same border tone Button secondary / Input / Badge outline use — the\n   * three-tier border hierarchy (D10) treats every interactive control\n   * the same way. */\n  border: 1px solid var(--pharos-color-neutral-500);\n  --icon-button-focus-ring: var(--pharos-color-primary-600);\n}\n\n.secondary:hover {\n  background-color: var(--pharos-color-neutral-50);\n}\n\n.secondary:active {\n  background-color: var(--pharos-color-neutral-100);\n}\n\n.ghost {\n  background-color: transparent;\n  color: var(--pharos-color-neutral-900);\n  --icon-button-focus-ring: var(--pharos-color-primary-600);\n}\n\n.ghost:hover {\n  background-color: var(--pharos-color-neutral-100);\n}\n\n.ghost:active {\n  background-color: var(--pharos-color-neutral-200);\n}\n\n.destructive {\n  background-color: var(--pharos-color-semantic-error-fg);\n  color: var(--pharos-color-semantic-error-on);\n  --icon-button-focus-ring: var(--pharos-color-semantic-error-fg);\n}\n\n.destructive:hover {\n  background-color: var(--pharos-color-semantic-error-fg-hover);\n}\n\n.destructive:active {\n  background-color: var(--pharos-color-semantic-error-fg-active);\n}\n\n/* === Sizes ===\n *\n * Square dimensions match the Button height grid so an IconButton + Button\n * pair on the same row sit flush (32 / 40 / 48 px). Direct-child `> svg`\n * sizing forces a passed Lucide icon (which renders with hardcoded\n * width/height=\"24\") to fill the icon slot proportionally — 16 / 20 / 24\n * matching the Spinner sizes so `<IconButton isLoading>` looks identical\n * in size to the resting icon state.\n *\n * `> svg` (direct child) is deliberate: Spinner renders a `<span>` wrapper\n * around its own SVG and sizes itself via `size={resolvedSize}`, so the\n * rule does not need to (and should not) double-size the spinner SVG.\n * Consumers wrapping an icon in a custom component remain responsible for\n * sizing — same contract shadcn / Mantine document. */\n\n.sizeSm {\n  width: var(--pharos-spacing-8); /* 32 px */\n  height: var(--pharos-spacing-8);\n}\n\n.sizeSm > svg {\n  width: var(--pharos-spacing-4); /* 16 px */\n  height: var(--pharos-spacing-4);\n}\n\n.sizeMd {\n  width: var(--pharos-spacing-10); /* 40 px */\n  height: var(--pharos-spacing-10);\n}\n\n.sizeMd > svg {\n  width: var(--pharos-spacing-5); /* 20 px */\n  height: var(--pharos-spacing-5);\n}\n\n.sizeLg {\n  width: var(--pharos-spacing-12); /* 48 px */\n  height: var(--pharos-spacing-12);\n}\n\n.sizeLg > svg {\n  width: var(--pharos-spacing-6); /* 24 px */\n  height: var(--pharos-spacing-6);\n}\n"],"mappings":""}

package/dist/components/Input.js

@@ -0,0 +1,28 @@
+import { cn as e } from "../lib/cn.js";
+import t from "./Input.module.js";
+import { cva as n } from "class-variance-authority";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/components/Input.tsx
+var i = n(t.input, {
+	variants: { size: {
+		sm: t.sizeSm,
+		md: t.sizeMd,
+		lg: t.sizeLg
+	} },
+	defaultVariants: { size: "md" }
+});
+function a({ size: t, className: n, type: a = "text", ref: o, ...s }) {
+	let c = t ?? "md";
+	return /* @__PURE__ */ r("input", {
+		ref: o,
+		type: a,
+		"data-pharos-size": c,
+		className: e(i({ size: c }), n),
+		...s
+	});
+}
+a.displayName = "Input";
+//#endregion
+export { a as Input, i as inputVariants };
+
+//# sourceMappingURL=Input.js.map

package/dist/components/Input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.js","names":[],"sources":["../../src/components/Input.tsx"],"sourcesContent":["import type { ComponentProps } from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../lib/cn';\nimport styles from './Input.module.css';\n\n/**\n * Maps the `size` axis to per-class names inside `Input.module.css`. Input\n * has no `variant` axis on purpose — shadcn's primitive contract is a single\n * styled `<input>` and the design-system best practice for form controls is\n * one chrome with explicit error / disabled / readonly states. Composition\n * around the input (label, helper, error message) belongs to a future\n * `<Field>` molecule, not to this atom (Escuela 1 from the field-pattern\n * decision, 2026-04-27).\n */\nconst inputVariants = cva(styles.input, {\n  variants: {\n    size: {\n      sm: styles.sizeSm,\n      md: styles.sizeMd,\n      lg: styles.sizeLg,\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\ntype InputVariantProps = VariantProps<typeof inputVariants>;\n\n/**\n * Props accepted by `<Input>`. Extends every native `<input>` attribute\n * except `size` — the native `size` attribute is a number (visible width\n * in characters) that is rarely used in modern apps where width comes from\n * CSS, so the slot is reused for the typed Pharos size axis. Consumers that\n * truly need the HTML attribute can set it through `style.width` or via a\n * dedicated `htmlSize` prop if we expose one later.\n *\n * Error state is conveyed through the standard `aria-invalid` attribute,\n * not a custom `error` prop. The CSS reacts to `[aria-invalid=\"true\"]`,\n * matching shadcn / Base UI / Mantine. The actual error message is rendered\n * by the consumer next to the input (or by the future `<Field>` molecule).\n */\nexport interface InputProps extends Omit<ComponentProps<'input'>, 'size'>, InputVariantProps {}\n\nexport function Input({ size, className, type = 'text', ref, ...rest }: InputProps) {\n  const resolvedSize = size ?? 'md';\n  return (\n    <input\n      ref={ref}\n      type={type}\n      data-pharos-size={resolvedSize}\n      className={cn(inputVariants({ size: resolvedSize }), className)}\n      {...rest}\n    />\n  );\n}\n\nInput.displayName = 'Input';\n\nexport { inputVariants };\n"],"mappings":";;;;;AAcA,IAAM,IAAgB,EAAI,EAAO,OAAO;CACtC,UAAU,EACR,MAAM;EACJ,IAAI,EAAO;EACX,IAAI,EAAO;EACX,IAAI,EAAO;CACb,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC;AAmBD,SAAgB,EAAM,EAAE,SAAM,cAAW,UAAO,QAAQ,QAAK,GAAG,KAAoB;CAClF,IAAM,IAAe,KAAQ;CAC7B,OACE,kBAAC,SAAD;EACO;EACC;EACN,oBAAkB;EAClB,WAAW,EAAG,EAAc,EAAE,MAAM,EAAa,CAAC,GAAG,CAAS;EAC9D,GAAI;CACL,CAAA;AAEL;AAEA,EAAM,cAAc"}

package/dist/components/Input.module.js

@@ -0,0 +1,10 @@
+var e = {
+	input: "_input_11emo_14",
+	sizeSm: "_sizeSm_11emo_97",
+	sizeMd: "_sizeMd_11emo_103",
+	sizeLg: "_sizeLg_11emo_109"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=Input.module.js.map

package/dist/components/Input.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.module.js","names":[],"sources":["../../src/components/Input.module.css"],"sourcesContent":["/* Input.module.css\n *\n * Per-component CSS Modules definition (Decision D9). The build emits hashed\n * class names (`Input_input__xxxx`) into `dist/styles.css`; the runtime JS\n * references them through the `styles` object imported by Input.tsx.\n *\n * Every visual value comes from a `--pharos-*` token. No hex, no Tailwind,\n * no preflight. Hover / focus-visible / invalid / disabled states are\n * authored with native CSS pseudo-classes and the `[aria-invalid=\"true\"]`\n * attribute selector — the component does not own any \"error mode\" state\n * itself; it reflects what the consumer puts on the DOM.\n */\n\n.input {\n  /* Strip the user-agent input chrome (gradient backgrounds, internal\n   * padding, rounded corners on macOS, the right-edge spinner on number).\n   * With preflight gone from the consumer, this is the only line that\n   * normalizes the rendering across browsers. */\n  appearance: none;\n  -webkit-appearance: none;\n\n  /* === Box model === */\n  box-sizing: border-box;\n  width: 100%;\n  margin: 0;\n  /* `neutral-500` lands the resting border at ~5.4:1 contrast against a\n   * white surface, clearing WCAG 1.4.11 (Non-text Contrast, 3:1 for UI\n   * component boundaries). The shadcn / Radix Themes / Mantine default\n   * sits around oklch 92% (~1.3:1) and fails the requirement; Pharos\n   * deliberately diverges to comply. Carbon `border-strong-01` (#8d8d8d)\n   * and Adobe Spectrum's outline tone are at the same intensity. */\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  /* === Typography ===\n   * `font-family` and weight are explicit so the input does not inherit a\n   * system-ui fallback when it lives inside surfaces that haven't set the\n   * Pharos sans stack (e.g. inside a `<dialog>` rendered to the top layer).\n   * The size variants below override `font-size` and the `padding-inline`. */\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  /* === Transitions === */\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.input::placeholder {\n  color: var(--pharos-color-neutral-500);\n  /* Some Linux/Chromium builds dim placeholders to ~54% by default; the\n   * explicit `opacity: 1` keeps the rendered tone equal to the token. */\n  opacity: 1;\n}\n\n.input:focus-visible {\n  outline: none;\n  border-color: var(--pharos-color-primary-600);\n  /* Two-stop box-shadow mirrors the Button focus ring: an inner halo in the\n   * surface color separates the ring from the input fill, and the outer\n   * stop is the brand accent. Same tokens as Button so the system has a\n   * single focus look. */\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.input:disabled {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n.input[aria-invalid='true'] {\n  border-color: var(--pharos-color-semantic-error-fg);\n}\n\n.input[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 *\n * Heights match the Button grid exactly — the system has one vertical\n * rhythm across pressable controls and form fields, so an `<Input size>`\n * sits flush next to a `<Button size>` on the same row. Horizontal padding\n * follows the same scale Button uses; font-size hops to `base` (16px) at\n * `lg` because larger controls usually pair with prominent layouts where\n * the body 14px starts to feel undersized. */\n\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"],"mappings":""}

package/dist/components/Popover.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/components/Popover.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAIhE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;AAEnE,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,+BAE1C;yBAFe,OAAO;;;AAMvB;;;;;GAKG;AACH,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,CAAC;AAE7E,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,+BAExD;yBAFe,cAAc;;;AAM9B;;;;;;;;;GASG;AACH,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC;IACnF;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC;IAC7D;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC;IAC/D;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC;IACzE;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,aAAa,CAAC,CAAC;CAC5E;AAED,wBAAgB,cAAc,CAAC,EAC7B,IAAe,EACf,KAAgB,EAChB,UAAc,EACd,WAAe,EACf,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,mBAAmB,+BAoBrB;yBA5Be,cAAc;;;AAgC9B;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC;AAEzE,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,+BAQrE;yBARe,YAAY;;;AAY5B;;;;GAIG;AACH,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,WAAW,CAAC,CAAC;AAErF,wBAAgB,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,uBAAuB,+BAQjF;yBARe,kBAAkB;;;AAYlC;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC;AAEzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAEpD;yBAFe,YAAY"}
+{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/components/Popover.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAIhE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;AAEnE,wBAAgB,OAAO,CAAC,KAAK,EAAE,YAAY,+BAE1C;yBAFe,OAAO;;;AAMvB;;;;;GAKG;AACH,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,CAAC;AAE7E,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,+BAExD;yBAFe,cAAc;;;AAM9B;;;;;;;;;GASG;AACH,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC;IACnF;;;OAGG;IACH,IAAI,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,CAAC;IAC7D;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC;IAC/D;;;OAGG;IACH,UAAU,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC,CAAC;IACzE;;;OAGG;IACH,WAAW,CAAC,EAAE,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC,aAAa,CAAC,CAAC;CAC5E;AAED,wBAAgB,cAAc,CAAC,EAC7B,IAAe,EACf,KAAgB,EAChB,UAAc,EACd,WAAe,EACf,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,mBAAmB,+BAoBrB;yBA5Be,cAAc;;;AAgC9B;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC;AAEzE,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,+BAQrE;yBARe,YAAY;;;AAY5B;;;;GAIG;AACH,MAAM,MAAM,uBAAuB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,WAAW,CAAC,CAAC;AAErF,wBAAgB,kBAAkB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,uBAAuB,+BAQjF;yBARe,kBAAkB;;;AAYlC;;;;;GAKG;AACH,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC;AAEzE,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAEpD;yBAFe,YAAY"}

package/dist/components/Popover.js

@@ -0,0 +1,57 @@
+"use client";
+import { cn as e } from "../lib/cn.js";
+import t from "./Popover.module.js";
+import { jsx as n } from "react/jsx-runtime";
+import { Popover as r } from "@base-ui/react/popover";
+//#region src/components/Popover.tsx
+function i(e) {
+	return /* @__PURE__ */ n(r.Root, { ...e });
+}
+i.displayName = "Popover";
+function a(e) {
+	return /* @__PURE__ */ n(r.Trigger, { ...e });
+}
+a.displayName = "PopoverTrigger";
+function o({ side: i = "bottom", align: a = "center", sideOffset: o = 8, alignOffset: s = 0, className: c, children: l, ...u }) {
+	return /* @__PURE__ */ n(r.Portal, { children: /* @__PURE__ */ n(r.Positioner, {
+		className: t.positioner,
+		side: i,
+		align: a,
+		sideOffset: o,
+		alignOffset: s,
+		children: /* @__PURE__ */ n(r.Popup, {
+			"data-pharos-slot": "popover-content",
+			className: e(t.content, c),
+			...u,
+			children: l
+		})
+	}) });
+}
+o.displayName = "PopoverContent";
+function s({ className: i, ...a }) {
+	return /* @__PURE__ */ n(r.Title, {
+		"data-pharos-slot": "popover-title",
+		className: e(t.title, i),
+		...a
+	});
+}
+s.displayName = "PopoverTitle";
+function c({ className: i, ...a }) {
+	return /* @__PURE__ */ n(r.Description, {
+		"data-pharos-slot": "popover-description",
+		className: e(t.description, i),
+		...a
+	});
+}
+c.displayName = "PopoverDescription";
+function l(e) {
+	return /* @__PURE__ */ n(r.Close, {
+		"data-pharos-slot": "popover-close",
+		...e
+	});
+}
+l.displayName = "PopoverClose";
+//#endregion
+export { i as Popover, l as PopoverClose, o as PopoverContent, c as PopoverDescription, s as PopoverTitle, a as PopoverTrigger };
+
+//# sourceMappingURL=Popover.js.map

package/dist/components/Popover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.js","names":[],"sources":["../../src/components/Popover.tsx"],"sourcesContent":["'use client';\n\nimport type { ComponentProps } from 'react';\nimport { Popover as BasePopover } from '@base-ui/react/popover';\nimport { cn } from '../lib/cn';\nimport styles from './Popover.module.css';\n\n/**\n * Free-form content anchored to a trigger (Decision D16). Wraps Base UI's\n * `Popover.*` parts, which implement the ARIA **dialog** pattern in a\n * **non-modal** disclosure: `role=\"dialog\"` on the popup, focus moves into\n * it on open and returns to the trigger on close, Escape and outside-click\n * dismiss it — but focus is NOT trapped and the rest of the page stays\n * interactive.\n *\n * This is deliberately distinct from the `DropdownMenu` atom (D15). A\n * DropdownMenu is for **commands** (the menu-button contract: `role=\"menu\"`\n * / `menuitem`, roving focus, typeahead); a Popover holds **arbitrary\n * content** — forms, navigation, descriptive panels. 7 of 8 surveyed design\n * systems separate the two for exactly this reason: wrapping `role=\"menu\"`\n * around free-form content breaks screen-reader expectations. The two atoms\n * wrap different Base UI primitives (`Menu` vs `Popover`) — they do not\n * share machinery. See `NAMING-decisions.md` § Popover.\n *\n * Naming follows shadcn (`Popover*`). The compound surface collapses Base\n * UI's `Portal` + `Positioner` + `Popup` into a single `PopoverContent`\n * with `side` / `align` / `sideOffset` / `alignOffset` props — the same\n * ergonomics shadcn exposes over Radix, mirroring the Pharos DropdownMenu.\n *\n * v1 ships the parts the known consumers need (the MobileHeader user panel,\n * the \"add users\" / \"add skills\" panels): Trigger, Content, Close, Title,\n * Description. `Arrow`, an `Anchor` (anchoring to an element other than the\n * trigger — the future Combobox will want it) and a modal `Backdrop` are\n * deliberately deferred; the compound API makes them additive without a\n * breaking change.\n *\n * @example\n * <Popover>\n *   <PopoverTrigger render={<IconButton aria-label=\"Account\"><Avatar … /></IconButton>} />\n *   <PopoverContent>\n *     <PopoverTitle>Signed in as Ada</PopoverTitle>\n *     <PopoverDescription>ada@example.com</PopoverDescription>\n *     <button onClick={onSignOut}>Sign out</button>\n *   </PopoverContent>\n * </Popover>\n */\nexport type PopoverProps = ComponentProps<typeof BasePopover.Root>;\n\nexport function Popover(props: PopoverProps) {\n  return <BasePopover.Root {...props} />;\n}\n\nPopover.displayName = 'Popover';\n\n/**\n * The element that opens the popover. Renders a native `<button>` by\n * default; pass `render` to compose any control while keeping the popover\n * wiring — e.g. the MobileHeader avatar:\n * `<PopoverTrigger render={<IconButton aria-label=\"Account\">…</IconButton>} />`.\n */\nexport type PopoverTriggerProps = ComponentProps<typeof BasePopover.Trigger>;\n\nexport function PopoverTrigger(props: PopoverTriggerProps) {\n  return <BasePopover.Trigger {...props} />;\n}\n\nPopoverTrigger.displayName = 'PopoverTrigger';\n\n/**\n * The floating surface. Collapses Base UI's `Portal` + `Positioner` +\n * `Popup` so the consumer positions the popover with the four props that\n * actually matter at the call site. Defaults match the common popover:\n * opens below the trigger, centred on it, 8px away.\n *\n * `align` defaults to `center` (not `start` like DropdownMenu): a menu opens\n * flush to the trigger's start edge, but a popover carries arbitrary content\n * and reads better centred — the shadcn / Radix / Base UI default.\n */\nexport interface PopoverContentProps extends ComponentProps<typeof BasePopover.Popup> {\n  /**\n   * Which side of the trigger the popover opens on.\n   * @default 'bottom'\n   */\n  side?: ComponentProps<typeof BasePopover.Positioner>['side'];\n  /**\n   * Alignment of the popover relative to the trigger along the chosen side.\n   * @default 'center'\n   */\n  align?: ComponentProps<typeof BasePopover.Positioner>['align'];\n  /**\n   * Gap in pixels between the trigger and the popover.\n   * @default 8\n   */\n  sideOffset?: ComponentProps<typeof BasePopover.Positioner>['sideOffset'];\n  /**\n   * Offset in pixels along the alignment axis.\n   * @default 0\n   */\n  alignOffset?: ComponentProps<typeof BasePopover.Positioner>['alignOffset'];\n}\n\nexport function PopoverContent({\n  side = 'bottom',\n  align = 'center',\n  sideOffset = 8,\n  alignOffset = 0,\n  className,\n  children,\n  ...rest\n}: PopoverContentProps) {\n  return (\n    <BasePopover.Portal>\n      <BasePopover.Positioner\n        className={styles.positioner}\n        side={side}\n        align={align}\n        sideOffset={sideOffset}\n        alignOffset={alignOffset}\n      >\n        <BasePopover.Popup\n          data-pharos-slot=\"popover-content\"\n          className={cn(styles.content, className)}\n          {...rest}\n        >\n          {children}\n        </BasePopover.Popup>\n      </BasePopover.Positioner>\n    </BasePopover.Portal>\n  );\n}\n\nPopoverContent.displayName = 'PopoverContent';\n\n/**\n * An accessible name for the popover. Renders Base UI's `Popover.Title`,\n * which wires `aria-labelledby` on the popup — the dialog labelling that\n * distinguishes a Popover from a Menu. Renders as a `<h2>` by default; pass\n * `render` to change the element.\n */\nexport type PopoverTitleProps = ComponentProps<typeof BasePopover.Title>;\n\nexport function PopoverTitle({ className, ...rest }: PopoverTitleProps) {\n  return (\n    <BasePopover.Title\n      data-pharos-slot=\"popover-title\"\n      className={cn(styles.title, className)}\n      {...rest}\n    />\n  );\n}\n\nPopoverTitle.displayName = 'PopoverTitle';\n\n/**\n * A supporting description for the popover. Renders Base UI's\n * `Popover.Description`, which wires `aria-describedby` on the popup.\n * Renders as a `<p>` by default.\n */\nexport type PopoverDescriptionProps = ComponentProps<typeof BasePopover.Description>;\n\nexport function PopoverDescription({ className, ...rest }: PopoverDescriptionProps) {\n  return (\n    <BasePopover.Description\n      data-pharos-slot=\"popover-description\"\n      className={cn(styles.description, className)}\n      {...rest}\n    />\n  );\n}\n\nPopoverDescription.displayName = 'PopoverDescription';\n\n/**\n * A button that closes the popover. Renders Base UI's `Popover.Close` (a\n * native `<button>`); compose any control via `render`. Unlike a menu — whose\n * items close it on selection — a popover holds content that stays open until\n * explicitly dismissed, so an in-popup close affordance is the common case.\n */\nexport type PopoverCloseProps = ComponentProps<typeof BasePopover.Close>;\n\nexport function PopoverClose(props: PopoverCloseProps) {\n  return <BasePopover.Close data-pharos-slot=\"popover-close\" {...props} />;\n}\n\nPopoverClose.displayName = 'PopoverClose';\n"],"mappings":";;;;;;AAgDA,SAAgB,EAAQ,GAAqB;CAC3C,OAAO,kBAAC,EAAY,MAAb,EAAkB,GAAI,EAAQ,CAAA;AACvC;AAEA,EAAQ,cAAc;AAUtB,SAAgB,EAAe,GAA4B;CACzD,OAAO,kBAAC,EAAY,SAAb,EAAqB,GAAI,EAAQ,CAAA;AAC1C;AAEA,EAAe,cAAc;AAmC7B,SAAgB,EAAe,EAC7B,UAAO,UACP,WAAQ,UACR,gBAAa,GACb,iBAAc,GACd,cACA,aACA,GAAG,KACmB;CACtB,OACE,kBAAC,EAAY,QAAb,EAAA,UACE,kBAAC,EAAY,YAAb;EACE,WAAW,EAAO;EACZ;EACC;EACK;EACC;YAEb,kBAAC,EAAY,OAAb;GACE,oBAAiB;GACjB,WAAW,EAAG,EAAO,SAAS,CAAS;GACvC,GAAI;GAEH;EACgB,CAAA;CACG,CAAA,EACN,CAAA;AAExB;AAEA,EAAe,cAAc;AAU7B,SAAgB,EAAa,EAAE,cAAW,GAAG,KAA2B;CACtE,OACE,kBAAC,EAAY,OAAb;EACE,oBAAiB;EACjB,WAAW,EAAG,EAAO,OAAO,CAAS;EACrC,GAAI;CACL,CAAA;AAEL;AAEA,EAAa,cAAc;AAS3B,SAAgB,EAAmB,EAAE,cAAW,GAAG,KAAiC;CAClF,OACE,kBAAC,EAAY,aAAb;EACE,oBAAiB;EACjB,WAAW,EAAG,EAAO,aAAa,CAAS;EAC3C,GAAI;CACL,CAAA;AAEL;AAEA,EAAmB,cAAc;AAUjC,SAAgB,EAAa,GAA0B;CACrD,OAAO,kBAAC,EAAY,OAAb;EAAmB,oBAAiB;EAAgB,GAAI;CAAQ,CAAA;AACzE;AAEA,EAAa,cAAc"}

package/dist/components/Popover.module.js

@@ -0,0 +1,10 @@
+var e = {
+	positioner: "_positioner_ga28p_15",
+	content: "_content_ga28p_4",
+	title: "_title_ga28p_5",
+	description: "_description_ga28p_5"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=Popover.module.js.map

package/dist/components/Popover.module.js.map

@@ -0,0 +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). The fallback suits apps with no high z-index scale; an app whose\n * own overlays sit higher (drawers, modals) raises every Pharos popup at once\n * by overriding `--pharos-z-index-popover` in `:root`. */\n.positioner {\n  z-index: var(--pharos-z-index-popover, 1000);\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":""}

package/dist/components/RadioGroup.d.ts

@@ -0,0 +1,49 @@
+import { ComponentProps } from 'react';
+import { RadioGroup as BaseRadioGroup } from '@base-ui/react/radio-group';
+import { Radio as BaseRadio } from '@base-ui/react/radio';
+/**
+ * A set of mutually exclusive options (the shadcn **RadioGroup** contract).
+ * Wraps Base UI's `RadioGroup`, which renders a `role="radiogroup"` container
+ * carrying the shared value, roving-tabindex arrow-key navigation and the
+ * hidden form input.
+ *
+ * Third of the boolean/choice form-control family (Checkbox → Switch →
+ * **Radio**). Unlike Checkbox / Switch — single self-contained atoms — Radio is
+ * **compound** (`RadioGroup` + `RadioGroupItem`), because the selection
+ * semantics (single choice, arrow navigation, the submitted value) live on the
+ * group, not the individual control. This matches shadcn and ARIA APG.
+ *
+ * Like the other form atoms (Escuela 1, D11) it owns no labels: pair the group
+ * with a `<label>` / `aria-labelledby`, and each item with a `<label htmlFor>`.
+ * Error state is conveyed via `aria-invalid` on the group, not a custom prop.
+ *
+ * @example
+ * <RadioGroup defaultValue="card" aria-labelledby="pay-label">
+ *   <span id="pay-label">Payment method</span>
+ *   <label htmlFor="pay-card">
+ *     <RadioGroupItem id="pay-card" value="card" /> Card
+ *   </label>
+ *   <label htmlFor="pay-cash">
+ *     <RadioGroupItem id="pay-cash" value="cash" /> Cash
+ *   </label>
+ * </RadioGroup>
+ */
+export interface RadioGroupProps extends ComponentProps<typeof BaseRadioGroup> {
+}
+export declare function RadioGroup({ className, ...rest }: RadioGroupProps): import("react").JSX.Element;
+export declare namespace RadioGroup {
+    var displayName: string;
+}
+/**
+ * A single radio button within a `RadioGroup`. Wraps Base UI's `Radio` — a
+ * `role="radio"` button plus a hidden form input — and requires a unique
+ * `value` identifying it within the group. The selected dot is a `<span>`
+ * styled with CSS (no icon dependency).
+ */
+export interface RadioGroupItemProps extends ComponentProps<typeof BaseRadio.Root> {
+}
+export declare function RadioGroupItem({ className, ...rest }: RadioGroupItemProps): import("react").JSX.Element;
+export declare namespace RadioGroupItem {
+    var displayName: string;
+}
+//# sourceMappingURL=RadioGroup.d.ts.map

package/dist/components/RadioGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.d.ts","sourceRoot":"","sources":["../../src/components/RadioGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,UAAU,IAAI,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC1E,OAAO,EAAE,KAAK,IAAI,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAI1D;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,MAAM,WAAW,eAAgB,SAAQ,cAAc,CAAC,OAAO,cAAc,CAAC;CAAG;AAEjF,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,+BAQjE;yBARe,UAAU;;;AAY1B;;;;;GAKG;AACH,MAAM,WAAW,mBAAoB,SAAQ,cAAc,CAAC,OAAO,SAAS,CAAC,IAAI,CAAC;CAAG;AAErF,wBAAgB,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,mBAAmB,+BAUzE;yBAVe,cAAc"}

package/dist/components/RadioGroup.js

@@ -0,0 +1,28 @@
+"use client";
+import { cn as e } from "../lib/cn.js";
+import t from "./RadioGroup.module.js";
+import { jsx as n } from "react/jsx-runtime";
+import { RadioGroup as r } from "@base-ui/react/radio-group";
+import { Radio as i } from "@base-ui/react/radio";
+//#region src/components/RadioGroup.tsx
+function a({ className: i, ...a }) {
+	return /* @__PURE__ */ n(r, {
+		"data-pharos-slot": "radio-group",
+		className: e(t.group, i),
+		...a
+	});
+}
+a.displayName = "RadioGroup";
+function o({ className: r, ...a }) {
+	return /* @__PURE__ */ n(i.Root, {
+		"data-pharos-slot": "radio-group-item",
+		className: e(t.item, r),
+		...a,
+		children: /* @__PURE__ */ n(i.Indicator, { className: t.indicator })
+	});
+}
+o.displayName = "RadioGroupItem";
+//#endregion
+export { a as RadioGroup, o as RadioGroupItem };
+
+//# sourceMappingURL=RadioGroup.js.map

package/dist/components/RadioGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.js","names":[],"sources":["../../src/components/RadioGroup.tsx"],"sourcesContent":["'use client';\n\nimport type { ComponentProps } from 'react';\nimport { RadioGroup as BaseRadioGroup } from '@base-ui/react/radio-group';\nimport { Radio as BaseRadio } from '@base-ui/react/radio';\nimport { cn } from '../lib/cn';\nimport styles from './RadioGroup.module.css';\n\n/**\n * A set of mutually exclusive options (the shadcn **RadioGroup** contract).\n * Wraps Base UI's `RadioGroup`, which renders a `role=\"radiogroup\"` container\n * carrying the shared value, roving-tabindex arrow-key navigation and the\n * hidden form input.\n *\n * Third of the boolean/choice form-control family (Checkbox → Switch →\n * **Radio**). Unlike Checkbox / Switch — single self-contained atoms — Radio is\n * **compound** (`RadioGroup` + `RadioGroupItem`), because the selection\n * semantics (single choice, arrow navigation, the submitted value) live on the\n * group, not the individual control. This matches shadcn and ARIA APG.\n *\n * Like the other form atoms (Escuela 1, D11) it owns no labels: pair the group\n * with a `<label>` / `aria-labelledby`, and each item with a `<label htmlFor>`.\n * Error state is conveyed via `aria-invalid` on the group, not a custom prop.\n *\n * @example\n * <RadioGroup defaultValue=\"card\" aria-labelledby=\"pay-label\">\n *   <span id=\"pay-label\">Payment method</span>\n *   <label htmlFor=\"pay-card\">\n *     <RadioGroupItem id=\"pay-card\" value=\"card\" /> Card\n *   </label>\n *   <label htmlFor=\"pay-cash\">\n *     <RadioGroupItem id=\"pay-cash\" value=\"cash\" /> Cash\n *   </label>\n * </RadioGroup>\n */\nexport interface RadioGroupProps extends ComponentProps<typeof BaseRadioGroup> {}\n\nexport function RadioGroup({ className, ...rest }: RadioGroupProps) {\n  return (\n    <BaseRadioGroup\n      data-pharos-slot=\"radio-group\"\n      className={cn(styles.group, className)}\n      {...rest}\n    />\n  );\n}\n\nRadioGroup.displayName = 'RadioGroup';\n\n/**\n * A single radio button within a `RadioGroup`. Wraps Base UI's `Radio` — a\n * `role=\"radio\"` button plus a hidden form input — and requires a unique\n * `value` identifying it within the group. The selected dot is a `<span>`\n * styled with CSS (no icon dependency).\n */\nexport interface RadioGroupItemProps extends ComponentProps<typeof BaseRadio.Root> {}\n\nexport function RadioGroupItem({ className, ...rest }: RadioGroupItemProps) {\n  return (\n    <BaseRadio.Root\n      data-pharos-slot=\"radio-group-item\"\n      className={cn(styles.item, className)}\n      {...rest}\n    >\n      <BaseRadio.Indicator className={styles.indicator} />\n    </BaseRadio.Root>\n  );\n}\n\nRadioGroupItem.displayName = 'RadioGroupItem';\n"],"mappings":";;;;;;;AAqCA,SAAgB,EAAW,EAAE,cAAW,GAAG,KAAyB;CAClE,OACE,kBAAC,GAAD;EACE,oBAAiB;EACjB,WAAW,EAAG,EAAO,OAAO,CAAS;EACrC,GAAI;CACL,CAAA;AAEL;AAEA,EAAW,cAAc;AAUzB,SAAgB,EAAe,EAAE,cAAW,GAAG,KAA6B;CAC1E,OACE,kBAAC,EAAU,MAAX;EACE,oBAAiB;EACjB,WAAW,EAAG,EAAO,MAAM,CAAS;EACpC,GAAI;YAEJ,kBAAC,EAAU,WAAX,EAAqB,WAAW,EAAO,UAAY,CAAA;CACrC,CAAA;AAEpB;AAEA,EAAe,cAAc"}

package/dist/components/RadioGroup.module.js

@@ -0,0 +1,9 @@
+var e = {
+	group: "_group_rsllu_18",
+	item: "_item_rsllu_24",
+	indicator: "_indicator_rsllu_75"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=RadioGroup.module.js.map

package/dist/components/RadioGroup.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioGroup.module.js","names":[],"sources":["../../src/components/RadioGroup.module.css"],"sourcesContent":["/* RadioGroup.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css`. Styles the shadcn \"RadioGroup\" contract over Base UI's\n * `RadioGroup` + `Radio`. Item state is driven by Base UI's `data-checked` /\n * `data-disabled` attributes.\n *\n * The atom owns no labels (Escuela 1, D11): the consumer pairs the group with a\n * `<label>` / `aria-labelledby` and each item with a `<label htmlFor>`. Error\n * state is conveyed with `aria-invalid` on the group. The selected dot is a\n * plain `<span>` — no icon dependency (Base UI mounts it only when checked).\n *\n * The item mirrors Checkbox's 20px (spacing-5) control on the token grid, but\n * circular: a ring that stays visible with an inner dot on selection, the\n * state-of-the-art radio look (distinct from Checkbox's filled square).\n */\n\n.group {\n  display: flex;\n  flex-direction: column;\n  gap: var(--pharos-spacing-2);\n}\n\n.item {\n  box-sizing: border-box;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  width: var(--pharos-spacing-5);\n  height: var(--pharos-spacing-5);\n  padding: 0;\n\n  border: 1px solid var(--pharos-color-neutral-500);\n  border-radius: var(--pharos-radius-full);\n  background-color: var(--pharos-color-base-white);\n\n  cursor: pointer;\n  transition-property: background-color, border-color, box-shadow;\n  transition-duration: var(--pharos-duration-fast);\n  transition-timing-function: var(--pharos-easing-out);\n}\n\n.item:hover:not([data-disabled]):not([data-checked]) {\n  border-color: var(--pharos-color-neutral-700);\n}\n\n/* Selected — the ring darkens to match the Checkbox / Switch \"active\" color and\n * the inner dot appears. */\n.item[data-checked] {\n  border-color: var(--pharos-color-neutral-900);\n}\n\n/* Error state via aria-invalid on the group (radio error is a group concern,\n * D11) — every item shows the error ring. */\n.group[aria-invalid='true'] .item {\n  border-color: var(--pharos-color-semantic-error-fg);\n}\n\n.item:focus-visible {\n  outline: none;\n  /* Same two-stop ring as Button / Input / Checkbox / Switch so the system has\n   * one focus look. */\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.item[data-disabled] {\n  cursor: not-allowed;\n  opacity: 0.5;\n}\n\n/* The inner dot — Base UI mounts the Indicator only while selected. */\n.indicator {\n  display: inline-flex;\n  width: var(--pharos-spacing-2);\n  height: var(--pharos-spacing-2);\n  border-radius: var(--pharos-radius-full);\n  background-color: var(--pharos-color-neutral-900);\n}\n"],"mappings":""}

package/dist/components/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../src/components/Select.tsx"],"names":[],"mappings":"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"}

package/dist/components/Select.js

@@ -0,0 +1,130 @@
+"use client";
+import { cn as e } from "../lib/cn.js";
+import t from "./Select.module.js";
+import { cva as n } from "class-variance-authority";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+import { Select as a } from "@base-ui/react/select";
+//#region src/components/Select.tsx
+function o(e) {
+	return /* @__PURE__ */ r(a.Root, { ...e });
+}
+o.displayName = "Select";
+function s() {
+	return /* @__PURE__ */ r("svg", {
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ r("path", {
+			d: "m6 9 6 6 6-6",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+function c() {
+	return /* @__PURE__ */ r("svg", {
+		viewBox: "0 0 24 24",
+		fill: "none",
+		stroke: "currentColor",
+		strokeWidth: "2",
+		"aria-hidden": "true",
+		children: /* @__PURE__ */ r("path", {
+			d: "M20 6 9 17l-5-5",
+			strokeLinecap: "round",
+			strokeLinejoin: "round"
+		})
+	});
+}
+var l = n(t.trigger, {
+	variants: { size: {
+		sm: t.sizeSm,
+		md: t.sizeMd,
+		lg: t.sizeLg
+	} },
+	defaultVariants: { size: "md" }
+});
+function u({ size: n, className: o, children: c, ...u }) {
+	let d = n ?? "md";
+	return /* @__PURE__ */ i(a.Trigger, {
+		"data-pharos-slot": "select-trigger",
+		"data-pharos-size": d,
+		className: e(l({ size: d }), o),
+		...u,
+		children: [c, /* @__PURE__ */ r(a.Icon, {
+			className: t.icon,
+			children: /* @__PURE__ */ r(s, {})
+		})]
+	});
+}
+u.displayName = "SelectTrigger";
+function d({ className: n, ...i }) {
+	return /* @__PURE__ */ r(a.Value, {
+		"data-pharos-slot": "select-value",
+		className: e(t.value, n),
+		...i
+	});
+}
+d.displayName = "SelectValue";
+function f({ side: n = "bottom", align: i = "start", sideOffset: o = 8, alignOffset: s = 0, className: c, children: l, ...u }) {
+	return /* @__PURE__ */ r(a.Portal, { children: /* @__PURE__ */ r(a.Positioner, {
+		className: t.positioner,
+		alignItemWithTrigger: !1,
+		side: n,
+		align: i,
+		sideOffset: o,
+		alignOffset: s,
+		children: /* @__PURE__ */ r(a.Popup, {
+			"data-pharos-slot": "select-content",
+			className: e(t.content, c),
+			...u,
+			children: /* @__PURE__ */ r(a.List, { children: l })
+		})
+	}) });
+}
+f.displayName = "SelectContent";
+function p({ className: n, children: o, ...s }) {
+	return /* @__PURE__ */ i(a.Item, {
+		"data-pharos-slot": "select-item",
+		className: e(t.item, n),
+		...s,
+		children: [/* @__PURE__ */ r(a.ItemText, {
+			className: t.itemText,
+			children: o
+		}), /* @__PURE__ */ r(a.ItemIndicator, {
+			className: t.itemIndicator,
+			children: /* @__PURE__ */ r(c, {})
+		})]
+	});
+}
+p.displayName = "SelectItem";
+function m(e) {
+	return /* @__PURE__ */ r(a.Group, {
+		"data-pharos-slot": "select-group",
+		...e
+	});
+}
+m.displayName = "SelectGroup";
+function h({ className: n, ...i }) {
+	return /* @__PURE__ */ r(a.GroupLabel, {
+		"data-pharos-slot": "select-label",
+		className: e(t.label, n),
+		...i
+	});
+}
+h.displayName = "SelectLabel";
+function g({ className: n, ...i }) {
+	return /* @__PURE__ */ r(a.Separator, {
+		"data-pharos-slot": "select-separator",
+		role: "none",
+		"aria-hidden": !0,
+		className: e(t.separator, n),
+		...i
+	});
+}
+g.displayName = "SelectSeparator";
+//#endregion
+export { o as Select, f as SelectContent, m as SelectGroup, p as SelectItem, h as SelectLabel, g as SelectSeparator, u as SelectTrigger, d as SelectValue };
+
+//# sourceMappingURL=Select.js.map

package/dist/components/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","names":[],"sources":["../../src/components/Select.tsx"],"sourcesContent":["'use client';\n\nimport type { ComponentProps } from 'react';\nimport { Select as BaseSelect } from '@base-ui/react/select';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../lib/cn';\nimport styles from './Select.module.css';\n\n/**\n * Single- or multi-select from a **known set of options** (Decision D17).\n * Wraps Base UI's `Select.*` parts, which implement the ARIA **listbox**\n * pattern: a trigger button opens a popup with `role=\"listbox\"` whose rows\n * are `role=\"option\"`, with roving focus, typeahead and Escape-to-close.\n *\n * This is deliberately distinct from the `Combobox` atom (also D17). A\n * Select has **no text input** — the user picks from a closed list. When the\n * option set is large enough to need filtering, or the value can be typed,\n * that is a Combobox (the APG combobox pattern). shadcn, Base UI and ARIA APG\n * all separate the two under exactly these names, which is why Pharos ships\n * two atoms rather than one component with a `searchable` axis. See\n * `NAMING-decisions.md` § Select.\n *\n * Multi-select is the `multiple` axis on the root (not a separate atom),\n * matching Base UI / shadcn / React Aria: pass `multiple` and `value`\n * becomes an array. Single-select closes on pick; multi-select keeps the\n * popup open so selections accumulate — Base UI derives this from `multiple`\n * and Pharos does not override it.\n *\n * Naming follows shadcn (`Select*`). `SelectTrigger` folds Base UI's\n * `Trigger` + the chevron `Icon`; `SelectContent` collapses `Portal` +\n * `Positioner` + `Popup` + `List` with `side` / `align` / `sideOffset`\n * props; `SelectItem` folds `Item` + `ItemText` + the selected-state\n * `ItemIndicator` — the same ergonomics shadcn exposes over Radix. The popup\n * takes `width: var(--anchor-width)` so it matches the trigger width exactly\n * (long options truncate; override `width` via `className` for a wider panel).\n *\n * Following the form-control composition rule (Escuela 1, D11), the atom owns\n * no label / helper / error message — the consumer composes those, and the\n * error state is conveyed through the standard `aria-invalid` attribute on\n * the trigger (the CSS reacts to `[aria-invalid=\"true\"]`).\n *\n * **Always pass `items` (a value→label map) when the value differs from its\n * label.** Base UI's `SelectValue` resolves the trigger label from the root's\n * `items` prop, NOT from the `SelectItem` children — those are the listbox\n * label + typeahead text. This holds for interactive selection too: without\n * `items` the trigger shows the serialized raw value (the enum\n * `\"organization\"`, not `\"Organization\"`). The idiomatic, drift-free pattern\n * is a single options source that feeds both `items` and the rendered items.\n *\n * @example\n * const VISIBILITY = { private: 'Private', organization: 'Organization', public: 'Public' };\n *\n * <Select value={value} onValueChange={setValue} items={VISIBILITY}>\n *   <SelectTrigger aria-label=\"Visibility\">\n *     <SelectValue placeholder=\"Select visibility\" />\n *   </SelectTrigger>\n *   <SelectContent>\n *     {Object.entries(VISIBILITY).map(([v, label]) => (\n *       <SelectItem key={v} value={v}>\n *         {label}\n *       </SelectItem>\n *     ))}\n *   </SelectContent>\n * </Select>\n */\nexport type SelectProps<\n  Value,\n  Multiple extends boolean | undefined = false,\n> = BaseSelect.Root.Props<Value, Multiple>;\n\nexport function Select<Value, Multiple extends boolean | undefined = false>(\n  props: SelectProps<Value, Multiple>,\n) {\n  return <BaseSelect.Root {...props} />;\n}\n\nSelect.displayName = 'Select';\n\n/**\n * A downward chevron, inlined as an SVG so the published bundle pulls no icon\n * dependency (Pharos does not bundle `lucide-react`; D4 keeps Lucide as the\n * canonical source for the path data). Rotates 180° when the popup opens via\n * the `[data-popup-open]` selector on the wrapping `SelectIcon`.\n */\nfunction ChevronDownIcon() {\n  return (\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" aria-hidden=\"true\">\n      <path d=\"m6 9 6 6 6-6\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  );\n}\n\n/** A check mark for the selected option, inlined for the same reason. */\nfunction CheckIcon() {\n  return (\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" aria-hidden=\"true\">\n      <path d=\"M20 6 9 17l-5-5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" />\n    </svg>\n  );\n}\n\nconst triggerVariants = cva(styles.trigger, {\n  variants: {\n    size: {\n      sm: styles.sizeSm,\n      md: styles.sizeMd,\n      lg: styles.sizeLg,\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\ntype TriggerVariantProps = VariantProps<typeof triggerVariants>;\n\n/**\n * The button that opens the listbox. Shares the Input chrome (border tone,\n * focus ring, size grid) so a Select sits flush next to an Input on a form\n * row. Folds the trailing chevron, and lays children out before it — the\n * common case is a single `<SelectValue />`. The `size` axis (sm / md / lg)\n * matches the Input and Button heights.\n *\n * Give it an accessible name with `aria-label` (or wire a `<label>` /\n * `aria-labelledby`) — the trigger only shows the chosen value, not a label.\n */\nexport interface SelectTriggerProps\n  extends ComponentProps<typeof BaseSelect.Trigger>, TriggerVariantProps {}\n\nexport function SelectTrigger({ size, className, children, ...rest }: SelectTriggerProps) {\n  const resolvedSize = size ?? 'md';\n  return (\n    <BaseSelect.Trigger\n      data-pharos-slot=\"select-trigger\"\n      data-pharos-size={resolvedSize}\n      className={cn(triggerVariants({ size: resolvedSize }), className)}\n      {...rest}\n    >\n      {children}\n      <BaseSelect.Icon className={styles.icon}>\n        <ChevronDownIcon />\n      </BaseSelect.Icon>\n    </BaseSelect.Trigger>\n  );\n}\n\nSelectTrigger.displayName = 'SelectTrigger';\n\n/**\n * Renders the selected option's label inside the trigger, or the\n * `placeholder` when nothing is selected. Wraps Base UI's `Select.Value`;\n * pass a render function as `children` to format the value yourself.\n */\nexport type SelectValueProps = ComponentProps<typeof BaseSelect.Value>;\n\nexport function SelectValue({ className, ...rest }: SelectValueProps) {\n  return (\n    <BaseSelect.Value\n      data-pharos-slot=\"select-value\"\n      className={cn(styles.value, className)}\n      {...rest}\n    />\n  );\n}\n\nSelectValue.displayName = 'SelectValue';\n\n/**\n * The floating listbox. Collapses Base UI's `Portal` + `Positioner` +\n * `Popup` + `List` so the consumer positions it with the props that matter\n * at the call site. Defaults match the common select: opens below the\n * trigger, aligned to its start edge, 8px away, and matches the trigger width\n * (`width: var(--anchor-width)`).\n *\n * `alignItemWithTrigger` is forced to `false`. Base UI's `Select.Positioner`\n * defaults it to `true` — the native-`<select>` / macOS behaviour that floats\n * the popup *over* the trigger to put the selected item under the pointer,\n * and which silently overrides `side` / `align` / `sideOffset`\n * (`renderedSide` becomes `'none'`). Pharos anchors the listbox **below the\n * trigger** instead (D17 refinement): it is the dominant web convention\n * (shadcn `position=\"popper\"`, Ant, Mantine), it keeps the trigger box\n * visible, and — decisively — it makes `Select` consistent with `Combobox`,\n * whose Base UI primitive has no item-alignment mode and always anchors\n * adjacent. With it off, the `side` / `align` / `sideOffset` props below\n * actually take effect.\n */\nexport interface SelectContentProps extends ComponentProps<typeof BaseSelect.Popup> {\n  /**\n   * Which side of the trigger the listbox opens on.\n   * @default 'bottom'\n   */\n  side?: ComponentProps<typeof BaseSelect.Positioner>['side'];\n  /**\n   * Alignment of the listbox relative to the trigger along the chosen side.\n   * @default 'start'\n   */\n  align?: ComponentProps<typeof BaseSelect.Positioner>['align'];\n  /**\n   * Gap in pixels between the trigger and the listbox.\n   * @default 8\n   */\n  sideOffset?: ComponentProps<typeof BaseSelect.Positioner>['sideOffset'];\n  /**\n   * Offset in pixels along the alignment axis.\n   * @default 0\n   */\n  alignOffset?: ComponentProps<typeof BaseSelect.Positioner>['alignOffset'];\n}\n\nexport function SelectContent({\n  side = 'bottom',\n  align = 'start',\n  sideOffset = 8,\n  alignOffset = 0,\n  className,\n  children,\n  ...rest\n}: SelectContentProps) {\n  return (\n    <BaseSelect.Portal>\n      <BaseSelect.Positioner\n        className={styles.positioner}\n        alignItemWithTrigger={false}\n        side={side}\n        align={align}\n        sideOffset={sideOffset}\n        alignOffset={alignOffset}\n      >\n        <BaseSelect.Popup\n          data-pharos-slot=\"select-content\"\n          className={cn(styles.content, className)}\n          {...rest}\n        >\n          <BaseSelect.List>{children}</BaseSelect.List>\n        </BaseSelect.Popup>\n      </BaseSelect.Positioner>\n    </BaseSelect.Portal>\n  );\n}\n\nSelectContent.displayName = 'SelectContent';\n\n/**\n * A single option. Folds Base UI's `Item` + `ItemText` (the label, also used\n * as the value shown in the trigger) + `ItemIndicator` (the check shown when\n * the option is selected). The `value` prop is required by Base UI and is\n * what `onValueChange` reports.\n */\nexport interface SelectItemProps extends ComponentProps<typeof BaseSelect.Item> {}\n\nexport function SelectItem({ className, children, ...rest }: SelectItemProps) {\n  return (\n    <BaseSelect.Item\n      data-pharos-slot=\"select-item\"\n      className={cn(styles.item, className)}\n      {...rest}\n    >\n      <BaseSelect.ItemText className={styles.itemText}>{children}</BaseSelect.ItemText>\n      <BaseSelect.ItemIndicator className={styles.itemIndicator}>\n        <CheckIcon />\n      </BaseSelect.ItemIndicator>\n    </BaseSelect.Item>\n  );\n}\n\nSelectItem.displayName = 'SelectItem';\n\n/**\n * Groups related options under an optional `SelectLabel` for accessible\n * sectioning (`role=\"group\"`).\n */\nexport type SelectGroupProps = ComponentProps<typeof BaseSelect.Group>;\n\nexport function SelectGroup(props: SelectGroupProps) {\n  return <BaseSelect.Group data-pharos-slot=\"select-group\" {...props} />;\n}\n\nSelectGroup.displayName = 'SelectGroup';\n\n/**\n * A non-interactive heading for a `SelectGroup`. Renders Base UI's\n * `Select.GroupLabel`, which wires `aria-labelledby` on the surrounding\n * group — use the two together when a section needs an accessible name.\n */\nexport type SelectLabelProps = ComponentProps<typeof BaseSelect.GroupLabel>;\n\nexport function SelectLabel({ className, ...rest }: SelectLabelProps) {\n  return (\n    <BaseSelect.GroupLabel\n      data-pharos-slot=\"select-label\"\n      className={cn(styles.label, className)}\n      {...rest}\n    />\n  );\n}\n\nSelectLabel.displayName = 'SelectLabel';\n\n/**\n * A thin **decorative** divider between groups of options.\n *\n * Rendered `aria-hidden` with `role=\"none\"`. Base UI's `Select.Separator`\n * re-exports the generic `Separator`, which emits `role=\"separator\"`. A\n * `separator` is **not** a permitted child of the `listbox` role (its content\n * model allows only `option` and `group`), so leaving it in the accessibility\n * tree fails axe's `aria-required-children` (critical) on a grouped Select.\n * The grouping is already conveyed semantically by `SelectGroup` (`role=\n * \"group\"`) + `SelectLabel` (`aria-labelledby`), so the divider is purely\n * visual — hiding it from the tree is the correct, drift-free fix (same as\n * Radix / shadcn, whose select separators are `aria-hidden`).\n */\nexport type SelectSeparatorProps = ComponentProps<typeof BaseSelect.Separator>;\n\nexport function SelectSeparator({ className, ...rest }: SelectSeparatorProps) {\n  return (\n    <BaseSelect.Separator\n      data-pharos-slot=\"select-separator\"\n      role=\"none\"\n      aria-hidden\n      className={cn(styles.separator, className)}\n      {...rest}\n    />\n  );\n}\n\nSelectSeparator.displayName = 'SelectSeparator';\n"],"mappings":"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"}

package/dist/components/Select.module.js

@@ -0,0 +1,19 @@
+var e = {
+	trigger: "_trigger_1w6j6_35",
+	sizeSm: "_sizeSm_1w6j6_92",
+	sizeMd: "_sizeMd_1w6j6_98",
+	sizeLg: "_sizeLg_1w6j6_104",
+	value: "_value_1w6j6_113",
+	icon: "_icon_1w6j6_127",
+	positioner: "_positioner_1w6j6_24",
+	content: "_content_1w6j6_146",
+	item: "_item_1w6j6_17",
+	itemText: "_itemText_1w6j6_17",
+	itemIndicator: "_itemIndicator_1w6j6_228",
+	label: "_label_1w6j6_242",
+	separator: "_separator_1w6j6_250"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=Select.module.js.map

package/dist/components/Select.module.js.map

@@ -0,0 +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). The fallback suits apps with no high z-index scale; an app whose\n * own overlays sit higher (drawers, modals) raises every Pharos popup at once\n * by overriding `--pharos-z-index-popover` in `:root`. */\n.positioner {\n  z-index: var(--pharos-z-index-popover, 1000);\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: center;\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.itemText {\n  flex: 1 1 auto;\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.itemIndicator {\n  display: inline-flex;\n  flex: none;\n  align-items: center;\n  justify-content: center;\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":""}

package/dist/components/Separator.js

@@ -0,0 +1,18 @@
+import { cn as e } from "../lib/cn.js";
+import t from "./Separator.module.js";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/Separator.tsx
+function r({ orientation: r = "horizontal", decorative: i = !0, className: a, ...o }) {
+	return /* @__PURE__ */ n("div", {
+		role: i ? "none" : "separator",
+		"aria-orientation": !i && r === "vertical" ? "vertical" : void 0,
+		"data-pharos-orientation": r,
+		className: e(t.separator, t[r], a),
+		...o
+	});
+}
+r.displayName = "Separator";
+//#endregion
+export { r as Separator };
+
+//# sourceMappingURL=Separator.js.map

package/dist/components/Separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Separator.js","names":[],"sources":["../../src/components/Separator.tsx"],"sourcesContent":["import type { ComponentPropsWithoutRef } from 'react';\nimport { cn } from '../lib/cn';\nimport styles from './Separator.module.css';\n\n/**\n * Visual or semantic divider between two regions. Renders a thin line in\n * either orientation. Two contracts coexist behind the same component:\n *\n * - **Decorative** (default, `decorative={true}`) — the line is purely\n *   visual chrome. Marked `role=\"none\"` so assistive tech ignores it,\n *   the same way shadcn / Radix Separator do.\n * - **Semantic** (`decorative={false}`) — the line announces a logical\n *   partition (e.g. between groups in a menu). Marked `role=\"separator\"`\n *   and, for vertical separators, `aria-orientation=\"vertical\"` per the\n *   ARIA APG (the spec defaults `aria-orientation` to \"horizontal\" for\n *   role=separator, so we emit the attribute only when it differs).\n *\n * The resting border tone is `--pharos-color-neutral-200` (Decision D12:\n * subtle borders for non-interactive surfaces). WCAG 1.4.11 does not\n * apply to decorative separators or to the boundaries of non-interactive\n * containers; the system reserves the stronger `neutral-500` tone for\n * interactive controls (Input, Button secondary, Badge outline — D10).\n */\nexport interface SeparatorProps extends ComponentPropsWithoutRef<'div'> {\n  orientation?: 'horizontal' | 'vertical';\n  decorative?: boolean;\n}\n\nexport function Separator({\n  orientation = 'horizontal',\n  decorative = true,\n  className,\n  ...rest\n}: SeparatorProps) {\n  return (\n    <div\n      role={decorative ? 'none' : 'separator'}\n      aria-orientation={!decorative && orientation === 'vertical' ? 'vertical' : undefined}\n      data-pharos-orientation={orientation}\n      className={cn(styles.separator, styles[orientation], className)}\n      {...rest}\n    />\n  );\n}\n\nSeparator.displayName = 'Separator';\n"],"mappings":";;;;AA4BA,SAAgB,EAAU,EACxB,iBAAc,cACd,gBAAa,IACb,cACA,GAAG,KACc;CACjB,OACE,kBAAC,OAAD;EACE,MAAM,IAAa,SAAS;EAC5B,oBAAkB,CAAC,KAAc,MAAgB,aAAa,aAAa,KAAA;EAC3E,2BAAyB;EACzB,WAAW,EAAG,EAAO,WAAW,EAAO,IAAc,CAAS;EAC9D,GAAI;CACL,CAAA;AAEL;AAEA,EAAU,cAAc"}

package/dist/components/Separator.module.js

@@ -0,0 +1,9 @@
+var e = {
+	separator: "_separator_da90p_13",
+	horizontal: "_horizontal_da90p_29",
+	vertical: "_vertical_da90p_34"
+};
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=Separator.module.js.map

package/dist/components/Separator.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Separator.module.js","names":[],"sources":["../../src/components/Separator.module.css"],"sourcesContent":["/* Separator.module.css\n *\n * Per-component CSS Modules definition (Decision D9). Hashed into\n * `dist/styles.css` like the rest of pharos-react. The token of the\n * border colour comes from D12 (subtle borders for non-interactive\n * surfaces): a Separator is decorative or semantic but never an\n * interactive control, so WCAG 1.4.11 (3:1) does not apply and the\n * resting tone stays at `neutral-200` — same intensity Carbon\n * `border-subtle`, Adobe Spectrum gray-200 and Polaris use for\n * dividers.\n */\n\n.separator {\n  /* `flex-shrink: 0` keeps a vertical Separator at 1px wide inside flex\n   * rows that would otherwise compress it to zero. shadcn does the same\n   * via the Tailwind `shrink-0` utility; we hard-code it because every\n   * Separator wants this behaviour and there is no axis where dropping\n   * it would be useful. */\n  flex-shrink: 0;\n  background-color: var(--pharos-color-neutral-200);\n  /* Reset any user-agent margin (notably the default `<hr>` margin) when\n   * the Separator is rendered as a `<div>`. A consumer that wants\n   * spacing controls it from the outside via flex / margin / padding,\n   * not via implicit user-agent rules. */\n  margin: 0;\n  border: 0;\n}\n\n.horizontal {\n  width: 100%;\n  height: 1px;\n}\n\n.vertical {\n  height: 100%;\n  width: 1px;\n}\n"],"mappings":""}

package/dist/components/Sheet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Sheet.d.ts","sourceRoot":"","sources":["../../src/components/Sheet.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC;AAE5D,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,+BAEtC;yBAFe,KAAK;;;AAMrB;;;;GAIG;AACH,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,OAAO,CAAC,CAAC;AAEtE,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAEpD;yBAFe,YAAY;;;AAM5B,QAAA,MAAM,aAAa;;8EAYjB,CAAC;AAEH,KAAK,iBAAiB,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,EAAE,iBAAiB;CAAG;AAEpG,wBAAgB,YAAY,CAAC,EAAE,IAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,+BAc/F;yBAde,YAAY;;;AAkB5B,8DAA8D;AAC9D,MAAM,WAAW,gBAAiB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;CAAG;AAE5E,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,gBAAgB,+BAEnE;yBAFe,WAAW;;;AAM3B;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;AAElE,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,+BAQjE;yBARe,UAAU;;;AAY1B;;;GAGG;AACH,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,WAAW,CAAC,CAAC;AAE9E,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,qBAAqB,+BAQ7E;yBARe,gBAAgB;;;AAYhC,oDAAoD;AACpD,MAAM,WAAW,gBAAiB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;CAAG;AAE5E,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,gBAAgB,+BAEnE;yBAFe,WAAW;;;AAM3B;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;AAElE,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,+BAEhD;yBAFe,UAAU;;;AAM1B,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"Sheet.d.ts","sourceRoot":"","sources":["../../src/components/Sheet.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,uBAAuB,CAAC;AAC/C,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC;AAE5D,wBAAgB,KAAK,CAAC,KAAK,EAAE,UAAU,+BAEtC;yBAFe,KAAK;;;AAMrB;;;;GAIG;AACH,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,OAAO,CAAC,CAAC;AAEtE,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAEpD;yBAFe,YAAY;;;AAM5B,QAAA,MAAM,aAAa;;8EAYjB,CAAC;AAEH,KAAK,iBAAiB,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC;AAE5D;;;;;;GAMG;AACH,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,EAAE,iBAAiB;CAAG;AAEpG,wBAAgB,YAAY,CAAC,EAAE,IAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,iBAAiB,+BAc/F;yBAde,YAAY;;;AAkB5B,8DAA8D;AAC9D,MAAM,WAAW,gBAAiB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;CAAG;AAE5E,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,gBAAgB,+BAEnE;yBAFe,WAAW;;;AAM3B;;;;GAIG;AACH,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;AAElE,wBAAgB,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,+BAQjE;yBARe,UAAU;;;AAY1B;;;GAGG;AACH,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,WAAW,CAAC,CAAC;AAE9E,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,qBAAqB,+BAQ7E;yBARe,gBAAgB;;;AAYhC,oDAAoD;AACpD,MAAM,WAAW,gBAAiB,SAAQ,wBAAwB,CAAC,KAAK,CAAC;CAAG;AAE5E,wBAAgB,WAAW,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,gBAAgB,+BAEnE;yBAFe,WAAW;;;AAM3B;;;GAGG;AACH,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,KAAK,CAAC,CAAC;AAElE,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,+BAEhD;yBAFe,UAAU;;;AAM1B,OAAO,EAAE,aAAa,EAAE,CAAC"}