@invergent/ui-sdk 0.0.0-stage → 2.19.0

package/dist/text-link.d.ts

@@ -0,0 +1,15 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+
+declare const textLinkVariants: (props?: ({
+    variant?: "default" | "muted" | null | undefined;
+    size?: "default" | "sm" | "inline" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function TextLink({ className, variant, size, asChild, ...props }: React.ComponentProps<"a"> & VariantProps<typeof textLinkVariants> & {
+    /** Render as the single child (a router link, a button). */
+    asChild?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+export { TextLink, textLinkVariants };

package/dist/text-link.js

@@ -0,0 +1,48 @@
+import { cn } from './chunk-LZGII7SX.js';
+import { cva } from 'class-variance-authority';
+import { Slot } from 'radix-ui';
+import { jsx } from 'react/jsx-runtime';
+
+var textLinkVariants = cva(
+  "cursor-pointer font-medium transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5",
+  {
+    variants: {
+      variant: {
+        default: "text-amber-500 hover:text-amber-400",
+        muted: "text-muted-foreground hover:text-foreground"
+      },
+      size: {
+        default: "-mx-2 inline-flex min-h-11 w-fit items-center gap-1.5 rounded-lg px-2 text-[13px] pointer-fine:mx-0 pointer-fine:min-h-0 pointer-fine:px-0",
+        sm: "-mx-2 inline-flex min-h-11 w-fit items-center gap-1 rounded-lg px-2 text-[12px] pointer-fine:mx-0 pointer-fine:min-h-0 pointer-fine:px-0",
+        inline: "rounded-[2px] underline underline-offset-2"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function TextLink({
+  className,
+  variant = "default",
+  size = "default",
+  asChild = false,
+  ...props
+}) {
+  const Comp = asChild ? Slot.Root : "a";
+  return /* @__PURE__ */ jsx(
+    Comp,
+    {
+      "data-slot": "text-link",
+      "data-variant": variant,
+      "data-size": size,
+      className: cn(textLinkVariants({ variant, size }), className),
+      ...props
+    }
+  );
+}
+
+export { TextLink, textLinkVariants };
+//# sourceMappingURL=text-link.js.map
+//# sourceMappingURL=text-link.js.map

package/dist/text-link.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/text-link.tsx"],"names":[],"mappings":";;;;;AAYA,IAAM,gBAAA,GAAmB,GAAA;AAAA,EACvB,gPAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA,QACP,OAAA,EAAS,qCAAA;AAAA,QACT,KAAA,EAAO;AAAA,OACT;AAAA,MACA,IAAA,EAAM;AAAA,QACJ,OAAA,EACE,4IAAA;AAAA,QACF,EAAA,EAAI,0IAAA;AAAA,QACJ,MAAA,EAAQ;AAAA;AACV,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS,SAAA;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ;AAEA,SAAS,QAAA,CAAS;AAAA,EAChB,SAAA;AAAA,EACA,OAAA,GAAU,SAAA;AAAA,EACV,IAAA,GAAO,SAAA;AAAA,EACP,OAAA,GAAU,KAAA;AAAA,EACV,GAAG;AACL,CAAA,EAIK;AACH,EAAA,MAAM,IAAA,GAAO,OAAA,GAAU,IAAA,CAAK,IAAA,GAAO,GAAA;AAEnC,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,WAAA;AAAA,MACV,cAAA,EAAc,OAAA;AAAA,MACd,WAAA,EAAW,IAAA;AAAA,MACX,SAAA,EAAW,GAAG,gBAAA,CAAiB,EAAE,SAAS,IAAA,EAAM,GAAG,SAAS,CAAA;AAAA,MAC3D,GAAG;AAAA;AAAA,GACN;AAEJ","file":"text-link.js","sourcesContent":["import * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"./lib/utils\"\n\n// The Work console's text links. `default` is its amber link (\"Manage\n// channels\", \"View all →\"), `muted` the quiet one that brightens on hover\n// (\"Cancel\", \"Back\"). No underline when standing alone: the colour carries\n// it. A standalone link reaches 44px on touch without moving its text (the\n// negative margin eats the padding); `inline` is for a link inside a\n// sentence, underlined there so it reads as one.\nconst textLinkVariants = cva(\n  \"cursor-pointer font-medium transition-colors outline-none focus-visible:ring-2 focus-visible:ring-ring/40 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5\",\n  {\n    variants: {\n      variant: {\n        default: \"text-amber-500 hover:text-amber-400\",\n        muted: \"text-muted-foreground hover:text-foreground\",\n      },\n      size: {\n        default:\n          \"-mx-2 inline-flex min-h-11 w-fit items-center gap-1.5 rounded-lg px-2 text-[13px] pointer-fine:mx-0 pointer-fine:min-h-0 pointer-fine:px-0\",\n        sm: \"-mx-2 inline-flex min-h-11 w-fit items-center gap-1 rounded-lg px-2 text-[12px] pointer-fine:mx-0 pointer-fine:min-h-0 pointer-fine:px-0\",\n        inline: \"rounded-[2px] underline underline-offset-2\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction TextLink({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"a\"> &\n  VariantProps<typeof textLinkVariants> & {\n    /** Render as the single child (a router link, a button). */\n    asChild?: boolean\n  }) {\n  const Comp = asChild ? Slot.Root : \"a\"\n\n  return (\n    <Comp\n      data-slot=\"text-link\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(textLinkVariants({ variant, size }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { TextLink, textLinkVariants }\n"]}

package/dist/textarea.cjs

@@ -0,0 +1,13 @@
+'use strict';
+
+var chunkUOUXW63J_cjs = require('./chunk-UOUXW63J.cjs');
+require('./chunk-6YHDDRIM.cjs');
+
+
+
+Object.defineProperty(exports, "Textarea", {
+  enumerable: true,
+  get: function () { return chunkUOUXW63J_cjs.Textarea; }
+});
+//# sourceMappingURL=textarea.cjs.map
+//# sourceMappingURL=textarea.cjs.map

package/dist/textarea.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"textarea.cjs"}

package/dist/textarea.d.cts

@@ -0,0 +1,6 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+declare function Textarea({ className, ...props }: React.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
+
+export { Textarea };

package/dist/textarea.d.ts

@@ -0,0 +1,6 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+declare function Textarea({ className, ...props }: React.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
+
+export { Textarea };

package/dist/textarea.js

@@ -0,0 +1,4 @@
+export { Textarea } from './chunk-5CRE35VX.js';
+import './chunk-LZGII7SX.js';
+//# sourceMappingURL=textarea.js.map
+//# sourceMappingURL=textarea.js.map

package/dist/textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"textarea.js"}

package/dist/theme.css

@@ -0,0 +1,109 @@
+/* The Tailwind side of the theme: import it once, after `tailwindcss`,
+   in the app's stylesheet. It brings the tokens, the fonts, the type scale,
+   the colour and radius utilities, the dark variant and the base styles,
+   and points Tailwind at this package's components. */
+
+@import "./tokens.css";
+@import "@fontsource-variable/fraunces";
+@import "@fontsource-variable/inter";
+@import "@fontsource-variable/jetbrains-mono";
+
+/* The components in this package (their source, or the built files where
+   the package is installed), so their classes are generated. */
+@source "./";
+
+@custom-variant dark (&:is(.dark *));
+
+/* The apps read almost entirely at text-sm and text-xs, and 14/12px is too
+   small a default. One pixel up across the reading sizes — type only:
+   spacing stays rem-based against the unchanged root, so density holds.
+   Heading sizes (lg and up) are untouched. */
+@theme {
+  --text-xs: 0.8125rem;
+  --text-xs--line-height: 1.125rem;
+  --text-sm: 0.9375rem;
+  --text-sm--line-height: 1.375rem;
+  --text-base: 1.0625rem;
+}
+
+@theme inline {
+  --font-heading: var(--font-sans);
+  --font-sans: var(--sans);
+  --font-serif: var(--serif);
+  --font-mono: var(--mono);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --color-surface: var(--surface);
+  --color-foreground: var(--foreground);
+  --color-background: var(--background);
+  --color-line: var(--line);
+  --color-subtle: var(--subtle);
+  --color-faint: var(--faint);
+  --color-success: var(--success);
+  --radius-sm: calc(var(--radius) * 0.6);
+  --radius-md: calc(var(--radius) * 0.8);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) * 1.4);
+  --radius-2xl: calc(var(--radius) * 1.8);
+  --radius-3xl: calc(var(--radius) * 2.2);
+  --radius-4xl: calc(var(--radius) * 2.6);
+}
+
+::placeholder {
+  color: var(--faint);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+  body {
+    @apply bg-background text-foreground;
+  }
+  html {
+    @apply font-sans;
+    /* Landscape rotation on iOS otherwise inflates every font size. */
+    -webkit-text-size-adjust: 100%;
+    text-size-adjust: 100%;
+  }
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    @apply font-serif;
+    letter-spacing: -0.01em;
+  }
+}
+
+.font-heading {
+  @apply font-serif;
+}

package/dist/toggle-group.cjs

@@ -0,0 +1,155 @@
+'use strict';
+
+var chunkIVMZANP7_cjs = require('./chunk-IVMZANP7.cjs');
+var chunk6YHDDRIM_cjs = require('./chunk-6YHDDRIM.cjs');
+var React = require('react');
+var radixUi = require('radix-ui');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var ToggleGroupContext = React__namespace.createContext({
+  size: "default",
+  variant: "default",
+  spacing: 0,
+  orientation: "horizontal"
+});
+var JOINED_TRACK = {
+  default: "gap-1 rounded-full bg-foreground/[0.06] p-1",
+  outline: "gap-0 rounded-[10px] border border-foreground/10 p-0.5"
+};
+var JOINED_ITEM = {
+  default: "rounded-full border-transparent bg-transparent px-4 font-semibold text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-amber-400 data-[state=on]:text-stone-950",
+  outline: "rounded-[8px] border-transparent bg-transparent px-3 text-[12.5px] font-normal text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-foreground/[0.08] data-[state=on]:font-medium data-[state=on]:text-foreground"
+};
+function ToggleGroup({
+  className,
+  variant,
+  size,
+  spacing = 0,
+  orientation = "horizontal",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.ToggleGroup.Root,
+    {
+      "data-slot": "toggle-group",
+      "data-variant": variant,
+      "data-size": size,
+      "data-spacing": spacing,
+      "data-orientation": orientation,
+      style: { "--gap": spacing },
+      className: chunk6YHDDRIM_cjs.cn(
+        // `w-fit` sizes to content and refuses to shrink, so a segmented
+        // control wider than a phone dragged the whole page sideways rather
+        // than containing itself. Capped at its container, scrolling inside
+        // as a last resort — call sites should still shorten their labels.
+        "group/toggle-group no-scrollbar flex w-fit max-w-full flex-row items-center gap-[--spacing(var(--gap))] overflow-x-auto data-vertical:flex-col data-vertical:items-stretch",
+        spacing === 0 && JOINED_TRACK[variant ?? "default"],
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        ToggleGroupContext.Provider,
+        {
+          value: { variant, size, spacing, orientation },
+          children
+        }
+      )
+    }
+  );
+}
+function ToggleGroupItem({
+  className,
+  children,
+  variant = "default",
+  size = "default",
+  ...props
+}) {
+  const context = React__namespace.useContext(ToggleGroupContext);
+  const itemVariant = context.variant || variant;
+  const itemSize = context.size || size;
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    radixUi.ToggleGroup.Item,
+    {
+      "data-slot": "toggle-group-item",
+      "data-variant": itemVariant,
+      "data-size": itemSize,
+      "data-spacing": context.spacing,
+      className: chunk6YHDDRIM_cjs.cn(
+        "shrink-0 focus:z-10 focus-visible:z-10",
+        chunkIVMZANP7_cjs.toggleVariants({ variant: itemVariant, size: itemSize }),
+        context.spacing === 0 && JOINED_ITEM[itemVariant ?? "default"],
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+function ViewSwitch({
+  views,
+  value,
+  onChange,
+  label = "Show",
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    ToggleGroup,
+    {
+      type: "single",
+      variant: "outline",
+      "aria-label": label,
+      value,
+      onValueChange: (v) => {
+        if (v) onChange(v);
+      },
+      className,
+      children: views.map((v) => /* @__PURE__ */ jsxRuntime.jsx(ToggleGroupItem, { value: v.id, children: v.label }, v.id))
+    }
+  );
+}
+function useRememberedView(key, views) {
+  const [view, setView] = React__namespace.useState(() => {
+    try {
+      const saved = localStorage.getItem(key);
+      return views.find((v) => v === saved) ?? views[0];
+    } catch {
+      return views[0];
+    }
+  });
+  const choose = (v) => {
+    setView(v);
+    try {
+      localStorage.setItem(key, v);
+    } catch {
+    }
+  };
+  return [view, choose];
+}
+
+exports.ToggleGroup = ToggleGroup;
+exports.ToggleGroupItem = ToggleGroupItem;
+exports.ViewSwitch = ViewSwitch;
+exports.useRememberedView = useRememberedView;
+//# sourceMappingURL=toggle-group.cjs.map
+//# sourceMappingURL=toggle-group.cjs.map

package/dist/toggle-group.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toggle-group.tsx"],"names":["React","jsx","ToggleGroupPrimitive","cn","toggleVariants"],"mappings":"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","file":"toggle-group.cjs","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { type VariantProps } from \"class-variance-authority\"\nimport { ToggleGroup as ToggleGroupPrimitive } from \"radix-ui\"\n\nimport { cn } from \"./lib/utils\"\nimport { toggleVariants } from \"./toggle\"\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number\n    orientation?: \"horizontal\" | \"vertical\"\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  spacing: 0,\n  orientation: \"horizontal\",\n})\n\n// With spacing the items are separate toggles, drawn as `toggle` draws them.\n// Joined (spacing 0) they are one segmented control, as the Work console\n// draws its two: `default` is the Work / Dev switch — a round track with the\n// picked segment an amber pill — and `outline` its view switch (Steps |\n// Stats, Open | Resolved) — a 10px bordered track, the picked segment a\n// faint fill.\nconst JOINED_TRACK = {\n  default: \"gap-1 rounded-full bg-foreground/[0.06] p-1\",\n  outline: \"gap-0 rounded-[10px] border border-foreground/10 p-0.5\",\n} as const\n\nconst JOINED_ITEM = {\n  default:\n    \"rounded-full border-transparent bg-transparent px-4 font-semibold text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-amber-400 data-[state=on]:text-stone-950\",\n  outline:\n    \"rounded-[8px] border-transparent bg-transparent px-3 text-[12.5px] font-normal text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-foreground/[0.08] data-[state=on]:font-medium data-[state=on]:text-foreground\",\n} as const\n\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  spacing = 0,\n  orientation = \"horizontal\",\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number\n    orientation?: \"horizontal\" | \"vertical\"\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-spacing={spacing}\n      data-orientation={orientation}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        // `w-fit` sizes to content and refuses to shrink, so a segmented\n        // control wider than a phone dragged the whole page sideways rather\n        // than containing itself. Capped at its container, scrolling inside\n        // as a last resort — call sites should still shorten their labels.\n        \"group/toggle-group no-scrollbar flex w-fit max-w-full flex-row items-center gap-[--spacing(var(--gap))] overflow-x-auto data-vertical:flex-col data-vertical:items-stretch\",\n        spacing === 0 && JOINED_TRACK[variant ?? \"default\"],\n        className\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider\n        value={{ variant, size, spacing, orientation }}\n      >\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  )\n}\n\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &\n  VariantProps<typeof toggleVariants>) {\n  const context = React.useContext(ToggleGroupContext)\n  const itemVariant = context.variant || variant\n  const itemSize = context.size || size\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={itemVariant}\n      data-size={itemSize}\n      data-spacing={context.spacing}\n      className={cn(\n        \"shrink-0 focus:z-10 focus-visible:z-10\",\n        toggleVariants({ variant: itemVariant, size: itemSize }),\n        context.spacing === 0 && JOINED_ITEM[itemVariant ?? \"default\"],\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  )\n}\n\n/**\n * A tab's two or three views (Steps | Stats, Members | Recent alerts): the\n * Work view switch. One view is always picked — clicking the picked one\n * again does not clear it.\n */\nfunction ViewSwitch<T extends string>({\n  views,\n  value,\n  onChange,\n  label = \"Show\",\n  className,\n}: {\n  views: readonly { id: T; label: React.ReactNode }[]\n  value: T\n  onChange: (v: T) => void\n  label?: string\n  className?: string\n}) {\n  return (\n    <ToggleGroup\n      type=\"single\"\n      variant=\"outline\"\n      aria-label={label}\n      value={value}\n      onValueChange={(v) => {\n        if (v) onChange(v as T)\n      }}\n      className={className}\n    >\n      {views.map((v) => (\n        <ToggleGroupItem key={v.id} value={v.id}>\n          {v.label}\n        </ToggleGroupItem>\n      ))}\n    </ToggleGroup>\n  )\n}\n\n/** The view last chosen under `key`, else the first; storage may be off. */\nfunction useRememberedView<T extends string>(\n  key: string,\n  views: readonly T[]\n): [T, (v: T) => void] {\n  const [view, setView] = React.useState<T>(() => {\n    try {\n      const saved = localStorage.getItem(key)\n      return views.find((v) => v === saved) ?? views[0]\n    } catch {\n      return views[0]\n    }\n  })\n  const choose = (v: T) => {\n    setView(v)\n    try {\n      localStorage.setItem(key, v)\n    } catch {\n      // A private window keeps the choice for this visit only.\n    }\n  }\n  return [view, choose]\n}\n\nexport { ToggleGroup, ToggleGroupItem, ViewSwitch, useRememberedView }\n"]}

package/dist/toggle-group.d.cts

@@ -0,0 +1,31 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { ToggleGroup as ToggleGroup$1 } from 'radix-ui';
+import { toggleVariants } from './toggle.cjs';
+import 'class-variance-authority/types';
+
+declare function ToggleGroup({ className, variant, size, spacing, orientation, children, ...props }: React.ComponentProps<typeof ToggleGroup$1.Root> & VariantProps<typeof toggleVariants> & {
+    spacing?: number;
+    orientation?: "horizontal" | "vertical";
+}): react_jsx_runtime.JSX.Element;
+declare function ToggleGroupItem({ className, children, variant, size, ...props }: React.ComponentProps<typeof ToggleGroup$1.Item> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
+/**
+ * A tab's two or three views (Steps | Stats, Members | Recent alerts): the
+ * Work view switch. One view is always picked — clicking the picked one
+ * again does not clear it.
+ */
+declare function ViewSwitch<T extends string>({ views, value, onChange, label, className, }: {
+    views: readonly {
+        id: T;
+        label: React.ReactNode;
+    }[];
+    value: T;
+    onChange: (v: T) => void;
+    label?: string;
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+/** The view last chosen under `key`, else the first; storage may be off. */
+declare function useRememberedView<T extends string>(key: string, views: readonly T[]): [T, (v: T) => void];
+
+export { ToggleGroup, ToggleGroupItem, ViewSwitch, useRememberedView };

package/dist/toggle-group.d.ts

@@ -0,0 +1,31 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { ToggleGroup as ToggleGroup$1 } from 'radix-ui';
+import { toggleVariants } from './toggle.js';
+import 'class-variance-authority/types';
+
+declare function ToggleGroup({ className, variant, size, spacing, orientation, children, ...props }: React.ComponentProps<typeof ToggleGroup$1.Root> & VariantProps<typeof toggleVariants> & {
+    spacing?: number;
+    orientation?: "horizontal" | "vertical";
+}): react_jsx_runtime.JSX.Element;
+declare function ToggleGroupItem({ className, children, variant, size, ...props }: React.ComponentProps<typeof ToggleGroup$1.Item> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
+/**
+ * A tab's two or three views (Steps | Stats, Members | Recent alerts): the
+ * Work view switch. One view is always picked — clicking the picked one
+ * again does not clear it.
+ */
+declare function ViewSwitch<T extends string>({ views, value, onChange, label, className, }: {
+    views: readonly {
+        id: T;
+        label: React.ReactNode;
+    }[];
+    value: T;
+    onChange: (v: T) => void;
+    label?: string;
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+/** The view last chosen under `key`, else the first; storage may be off. */
+declare function useRememberedView<T extends string>(key: string, views: readonly T[]): [T, (v: T) => void];
+
+export { ToggleGroup, ToggleGroupItem, ViewSwitch, useRememberedView };

package/dist/toggle-group.js

@@ -0,0 +1,130 @@
+import { toggleVariants } from './chunk-CPAFEXKR.js';
+import { cn } from './chunk-LZGII7SX.js';
+import * as React from 'react';
+import { ToggleGroup as ToggleGroup$1 } from 'radix-ui';
+import { jsx } from 'react/jsx-runtime';
+
+var ToggleGroupContext = React.createContext({
+  size: "default",
+  variant: "default",
+  spacing: 0,
+  orientation: "horizontal"
+});
+var JOINED_TRACK = {
+  default: "gap-1 rounded-full bg-foreground/[0.06] p-1",
+  outline: "gap-0 rounded-[10px] border border-foreground/10 p-0.5"
+};
+var JOINED_ITEM = {
+  default: "rounded-full border-transparent bg-transparent px-4 font-semibold text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-amber-400 data-[state=on]:text-stone-950",
+  outline: "rounded-[8px] border-transparent bg-transparent px-3 text-[12.5px] font-normal text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-foreground/[0.08] data-[state=on]:font-medium data-[state=on]:text-foreground"
+};
+function ToggleGroup({
+  className,
+  variant,
+  size,
+  spacing = 0,
+  orientation = "horizontal",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    ToggleGroup$1.Root,
+    {
+      "data-slot": "toggle-group",
+      "data-variant": variant,
+      "data-size": size,
+      "data-spacing": spacing,
+      "data-orientation": orientation,
+      style: { "--gap": spacing },
+      className: cn(
+        // `w-fit` sizes to content and refuses to shrink, so a segmented
+        // control wider than a phone dragged the whole page sideways rather
+        // than containing itself. Capped at its container, scrolling inside
+        // as a last resort — call sites should still shorten their labels.
+        "group/toggle-group no-scrollbar flex w-fit max-w-full flex-row items-center gap-[--spacing(var(--gap))] overflow-x-auto data-vertical:flex-col data-vertical:items-stretch",
+        spacing === 0 && JOINED_TRACK[variant ?? "default"],
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        ToggleGroupContext.Provider,
+        {
+          value: { variant, size, spacing, orientation },
+          children
+        }
+      )
+    }
+  );
+}
+function ToggleGroupItem({
+  className,
+  children,
+  variant = "default",
+  size = "default",
+  ...props
+}) {
+  const context = React.useContext(ToggleGroupContext);
+  const itemVariant = context.variant || variant;
+  const itemSize = context.size || size;
+  return /* @__PURE__ */ jsx(
+    ToggleGroup$1.Item,
+    {
+      "data-slot": "toggle-group-item",
+      "data-variant": itemVariant,
+      "data-size": itemSize,
+      "data-spacing": context.spacing,
+      className: cn(
+        "shrink-0 focus:z-10 focus-visible:z-10",
+        toggleVariants({ variant: itemVariant, size: itemSize }),
+        context.spacing === 0 && JOINED_ITEM[itemVariant ?? "default"],
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+}
+function ViewSwitch({
+  views,
+  value,
+  onChange,
+  label = "Show",
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    ToggleGroup,
+    {
+      type: "single",
+      variant: "outline",
+      "aria-label": label,
+      value,
+      onValueChange: (v) => {
+        if (v) onChange(v);
+      },
+      className,
+      children: views.map((v) => /* @__PURE__ */ jsx(ToggleGroupItem, { value: v.id, children: v.label }, v.id))
+    }
+  );
+}
+function useRememberedView(key, views) {
+  const [view, setView] = React.useState(() => {
+    try {
+      const saved = localStorage.getItem(key);
+      return views.find((v) => v === saved) ?? views[0];
+    } catch {
+      return views[0];
+    }
+  });
+  const choose = (v) => {
+    setView(v);
+    try {
+      localStorage.setItem(key, v);
+    } catch {
+    }
+  };
+  return [view, choose];
+}
+
+export { ToggleGroup, ToggleGroupItem, ViewSwitch, useRememberedView };
+//# sourceMappingURL=toggle-group.js.map
+//# sourceMappingURL=toggle-group.js.map

package/dist/toggle-group.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/toggle-group.tsx"],"names":["ToggleGroupPrimitive"],"mappings":"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","file":"toggle-group.js","sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { type VariantProps } from \"class-variance-authority\"\nimport { ToggleGroup as ToggleGroupPrimitive } from \"radix-ui\"\n\nimport { cn } from \"./lib/utils\"\nimport { toggleVariants } from \"./toggle\"\n\nconst ToggleGroupContext = React.createContext<\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number\n    orientation?: \"horizontal\" | \"vertical\"\n  }\n>({\n  size: \"default\",\n  variant: \"default\",\n  spacing: 0,\n  orientation: \"horizontal\",\n})\n\n// With spacing the items are separate toggles, drawn as `toggle` draws them.\n// Joined (spacing 0) they are one segmented control, as the Work console\n// draws its two: `default` is the Work / Dev switch — a round track with the\n// picked segment an amber pill — and `outline` its view switch (Steps |\n// Stats, Open | Resolved) — a 10px bordered track, the picked segment a\n// faint fill.\nconst JOINED_TRACK = {\n  default: \"gap-1 rounded-full bg-foreground/[0.06] p-1\",\n  outline: \"gap-0 rounded-[10px] border border-foreground/10 p-0.5\",\n} as const\n\nconst JOINED_ITEM = {\n  default:\n    \"rounded-full border-transparent bg-transparent px-4 font-semibold text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-amber-400 data-[state=on]:text-stone-950\",\n  outline:\n    \"rounded-[8px] border-transparent bg-transparent px-3 text-[12.5px] font-normal text-muted-foreground hover:text-foreground data-[state=on]:border-transparent data-[state=on]:bg-foreground/[0.08] data-[state=on]:font-medium data-[state=on]:text-foreground\",\n} as const\n\nfunction ToggleGroup({\n  className,\n  variant,\n  size,\n  spacing = 0,\n  orientation = \"horizontal\",\n  children,\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Root> &\n  VariantProps<typeof toggleVariants> & {\n    spacing?: number\n    orientation?: \"horizontal\" | \"vertical\"\n  }) {\n  return (\n    <ToggleGroupPrimitive.Root\n      data-slot=\"toggle-group\"\n      data-variant={variant}\n      data-size={size}\n      data-spacing={spacing}\n      data-orientation={orientation}\n      style={{ \"--gap\": spacing } as React.CSSProperties}\n      className={cn(\n        // `w-fit` sizes to content and refuses to shrink, so a segmented\n        // control wider than a phone dragged the whole page sideways rather\n        // than containing itself. Capped at its container, scrolling inside\n        // as a last resort — call sites should still shorten their labels.\n        \"group/toggle-group no-scrollbar flex w-fit max-w-full flex-row items-center gap-[--spacing(var(--gap))] overflow-x-auto data-vertical:flex-col data-vertical:items-stretch\",\n        spacing === 0 && JOINED_TRACK[variant ?? \"default\"],\n        className\n      )}\n      {...props}\n    >\n      <ToggleGroupContext.Provider\n        value={{ variant, size, spacing, orientation }}\n      >\n        {children}\n      </ToggleGroupContext.Provider>\n    </ToggleGroupPrimitive.Root>\n  )\n}\n\nfunction ToggleGroupItem({\n  className,\n  children,\n  variant = \"default\",\n  size = \"default\",\n  ...props\n}: React.ComponentProps<typeof ToggleGroupPrimitive.Item> &\n  VariantProps<typeof toggleVariants>) {\n  const context = React.useContext(ToggleGroupContext)\n  const itemVariant = context.variant || variant\n  const itemSize = context.size || size\n\n  return (\n    <ToggleGroupPrimitive.Item\n      data-slot=\"toggle-group-item\"\n      data-variant={itemVariant}\n      data-size={itemSize}\n      data-spacing={context.spacing}\n      className={cn(\n        \"shrink-0 focus:z-10 focus-visible:z-10\",\n        toggleVariants({ variant: itemVariant, size: itemSize }),\n        context.spacing === 0 && JOINED_ITEM[itemVariant ?? \"default\"],\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </ToggleGroupPrimitive.Item>\n  )\n}\n\n/**\n * A tab's two or three views (Steps | Stats, Members | Recent alerts): the\n * Work view switch. One view is always picked — clicking the picked one\n * again does not clear it.\n */\nfunction ViewSwitch<T extends string>({\n  views,\n  value,\n  onChange,\n  label = \"Show\",\n  className,\n}: {\n  views: readonly { id: T; label: React.ReactNode }[]\n  value: T\n  onChange: (v: T) => void\n  label?: string\n  className?: string\n}) {\n  return (\n    <ToggleGroup\n      type=\"single\"\n      variant=\"outline\"\n      aria-label={label}\n      value={value}\n      onValueChange={(v) => {\n        if (v) onChange(v as T)\n      }}\n      className={className}\n    >\n      {views.map((v) => (\n        <ToggleGroupItem key={v.id} value={v.id}>\n          {v.label}\n        </ToggleGroupItem>\n      ))}\n    </ToggleGroup>\n  )\n}\n\n/** The view last chosen under `key`, else the first; storage may be off. */\nfunction useRememberedView<T extends string>(\n  key: string,\n  views: readonly T[]\n): [T, (v: T) => void] {\n  const [view, setView] = React.useState<T>(() => {\n    try {\n      const saved = localStorage.getItem(key)\n      return views.find((v) => v === saved) ?? views[0]\n    } catch {\n      return views[0]\n    }\n  })\n  const choose = (v: T) => {\n    setView(v)\n    try {\n      localStorage.setItem(key, v)\n    } catch {\n      // A private window keeps the choice for this visit only.\n    }\n  }\n  return [view, choose]\n}\n\nexport { ToggleGroup, ToggleGroupItem, ViewSwitch, useRememberedView }\n"]}

package/dist/toggle.cjs

@@ -0,0 +1,21 @@
+'use strict';
+
+var chunkIVMZANP7_cjs = require('./chunk-IVMZANP7.cjs');
+require('./chunk-6YHDDRIM.cjs');
+
+
+
+Object.defineProperty(exports, "FilterPill", {
+  enumerable: true,
+  get: function () { return chunkIVMZANP7_cjs.FilterPill; }
+});
+Object.defineProperty(exports, "Toggle", {
+  enumerable: true,
+  get: function () { return chunkIVMZANP7_cjs.Toggle; }
+});
+Object.defineProperty(exports, "toggleVariants", {
+  enumerable: true,
+  get: function () { return chunkIVMZANP7_cjs.toggleVariants; }
+});
+//# sourceMappingURL=toggle.cjs.map
+//# sourceMappingURL=toggle.cjs.map

package/dist/toggle.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"toggle.cjs"}

package/dist/toggle.d.cts

@@ -0,0 +1,23 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
+import { Toggle as Toggle$1 } from 'radix-ui';
+
+declare const toggleVariants: (props?: ({
+    variant?: "default" | "outline" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Toggle({ className, variant, size, ...props }: React.ComponentProps<typeof Toggle$1.Root> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
+/**
+ * The Work filter pill (a row of them filters a list: "All channels",
+ * "Slack 3"…). An empty filter stays clickable, just quieter.
+ */
+declare function FilterPill({ on, onClick, dim, className, ...props }: Omit<React.ComponentProps<typeof Toggle$1.Root>, "pressed" | "onPressedChange" | "onClick"> & {
+    on: boolean;
+    onClick: () => void;
+    /** Nothing behind it yet: still clickable, just quieter. */
+    dim?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
+export { FilterPill, Toggle, toggleVariants };