@inshorts/glint-ui 0.5.4 → 0.6.0

package/dist/tabs.cjs

@@ -0,0 +1,168 @@
+"use client";
+"use strict";
+"use client";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/tabs.tsx
+var tabs_exports = {};
+__export(tabs_exports, {
+  TabPanel: () => TabPanel,
+  Tabs: () => Tabs
+});
+module.exports = __toCommonJS(tabs_exports);
+var React = __toESM(require("react"), 1);
+
+// src/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/tabs.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function TabPanel({
+  id,
+  labelledBy,
+  active,
+  children,
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      role: "tabpanel",
+      id,
+      "aria-labelledby": labelledBy,
+      hidden: !active,
+      className,
+      children: active ? children : null
+    }
+  );
+}
+function Tabs({
+  tabs,
+  value,
+  onChange,
+  ariaLabel,
+  className
+}) {
+  const refs = React.useRef(/* @__PURE__ */ new Map());
+  const reactId = React.useId();
+  const hasInlinePanels = tabs.some((tab) => tab.panel != null);
+  function tabDomId(key) {
+    return `${reactId}-tab-${key}`;
+  }
+  function panelDomId(tab) {
+    return tab.panelId ?? `${reactId}-panel-${tab.key}`;
+  }
+  function focusTab(key) {
+    onChange(key);
+    refs.current.get(key)?.focus();
+  }
+  function onKeyDown(event) {
+    const step = event.key === "ArrowRight" ? 1 : event.key === "ArrowLeft" ? -1 : 0;
+    if (step === 0) return;
+    const selectable = tabs.filter((tab) => !tab.disabled);
+    if (selectable.length < 2) return;
+    const current = selectable.findIndex((tab) => tab.key === value);
+    const next = selectable[(current + step + selectable.length) % selectable.length];
+    event.preventDefault();
+    focusTab(next.key);
+  }
+  const tablist = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      role: "tablist",
+      "aria-label": ariaLabel,
+      onKeyDown,
+      className: cn(
+        "border-border flex flex-wrap gap-1 border-b",
+        !hasInlinePanels ? className : void 0
+      ),
+      children: tabs.map((tab) => {
+        const active = tab.key === value;
+        const id = tabDomId(tab.key);
+        const controls = tab.panel != null || tab.panelId ? panelDomId(tab) : void 0;
+        return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          "button",
+          {
+            id,
+            ref: (node) => {
+              refs.current.set(tab.key, node);
+            },
+            type: "button",
+            role: "tab",
+            "aria-selected": active,
+            "aria-controls": controls,
+            disabled: tab.disabled,
+            tabIndex: active ? 0 : -1,
+            onClick: () => onChange(tab.key),
+            className: cn(
+              "cursor-pointer rounded-t-md px-3 py-1.5 text-sm font-medium transition",
+              "focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none",
+              "disabled:cursor-not-allowed disabled:opacity-50",
+              // The filled-pill active state the five hand-rolled strips
+              // already used. Adopting it keeps this a deduplication rather
+              // than a restyle of every panel that has tabs.
+              active ? "bg-primary text-primary-foreground" : "text-muted-foreground hover:bg-muted"
+            ),
+            children: [
+              tab.label,
+              tab.badge != null ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-muted-foreground ml-1.5 text-xs", children: tab.badge }) : null
+            ]
+          },
+          tab.key
+        );
+      })
+    }
+  );
+  if (!hasInlinePanels) return tablist;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: cn("space-y-3", className), children: [
+    tablist,
+    tabs.map(
+      (tab) => tab.panel != null ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        TabPanel,
+        {
+          id: panelDomId(tab),
+          labelledBy: tabDomId(tab.key),
+          active: tab.key === value,
+          children: tab.panel
+        },
+        tab.key
+      ) : null
+    )
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  TabPanel,
+  Tabs
+});
+//# sourceMappingURL=tabs.cjs.map

package/dist/tabs.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/tabs.tsx","../src/utils.ts"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { cn } from \"./utils\";\n\n/**\n * The tab strip five Managers were each drawing by hand, with the same\n * `rounded-t-md px-3 py-1.5 text-sm font-medium` and their own idea of what an\n * active tab looks like.\n *\n * It is a controlled component with no state of its own: every caller already\n * held the active key, usually because a URL or a query depends on it.\n *\n * Roles are the reason to use this rather than styling buttons again. A hand\n * -rolled strip is a row of buttons to a screen reader, which says nothing\n * about how many tabs there are or which is selected; `tablist` / `tab` /\n * `aria-selected` do. Arrow-key navigation comes with that expectation, so it\n * is implemented here too.\n *\n * Optional `panel` on a tab (or a sibling `TabPanel`) wires APG `aria-controls`\n * / `role=\"tabpanel\"`. Callers that already render content from `value` can\n * keep doing so and pass `panelId` for association, or switch to `panel`.\n */\nexport interface TabItem<Key extends string = string> {\n  key: Key;\n  label: React.ReactNode;\n  /** Rendered after the label — a count, usually. */\n  badge?: React.ReactNode;\n  disabled?: boolean;\n  /**\n   * Optional panel body. When any tab provides `panel`, panels render under\n   * the strip with `role=\"tabpanel\"`.\n   */\n  panel?: React.ReactNode;\n  /**\n   * External panel element id for `aria-controls` when panels live outside\n   * this component.\n   */\n  panelId?: string;\n}\n\nexport interface TabsProps<Key extends string = string> {\n  tabs: ReadonlyArray<TabItem<Key>>;\n  value: Key;\n  onChange: (key: Key) => void;\n  /** Names the strip for screen readers. */\n  ariaLabel?: string;\n  className?: string;\n}\n\nexport interface TabPanelProps {\n  /** Must match the controlling tab's generated or explicit id. */\n  id: string;\n  /** Id of the tab that labels this panel. */\n  labelledBy: string;\n  active: boolean;\n  children: React.ReactNode;\n  className?: string;\n}\n\n/** Companion panel for callers that keep content outside `Tabs`. */\nexport function TabPanel({\n  id,\n  labelledBy,\n  active,\n  children,\n  className,\n}: TabPanelProps) {\n  return (\n    <div\n      role=\"tabpanel\"\n      id={id}\n      aria-labelledby={labelledBy}\n      hidden={!active}\n      className={className}\n    >\n      {active ? children : null}\n    </div>\n  );\n}\n\nexport function Tabs<Key extends string = string>({\n  tabs,\n  value,\n  onChange,\n  ariaLabel,\n  className,\n}: TabsProps<Key>) {\n  const refs = React.useRef(new Map<Key, HTMLButtonElement | null>());\n  const reactId = React.useId();\n  const hasInlinePanels = tabs.some((tab) => tab.panel != null);\n\n  function tabDomId(key: Key) {\n    return `${reactId}-tab-${key}`;\n  }\n\n  function panelDomId(tab: TabItem<Key>) {\n    return tab.panelId ?? `${reactId}-panel-${tab.key}`;\n  }\n\n  function focusTab(key: Key) {\n    onChange(key);\n    // The newly selected tab has to take focus, or the next arrow press is\n    // still measured from the old one.\n    refs.current.get(key)?.focus();\n  }\n\n  function onKeyDown(event: React.KeyboardEvent<HTMLDivElement>) {\n    const step =\n      event.key === \"ArrowRight\" ? 1 : event.key === \"ArrowLeft\" ? -1 : 0;\n    if (step === 0) return;\n\n    const selectable = tabs.filter((tab) => !tab.disabled);\n    if (selectable.length < 2) return;\n\n    const current = selectable.findIndex((tab) => tab.key === value);\n    // Wraps, which is what a tablist is expected to do.\n    const next =\n      selectable[(current + step + selectable.length) % selectable.length];\n\n    event.preventDefault();\n    focusTab(next.key);\n  }\n\n  const tablist = (\n    <div\n      role=\"tablist\"\n      aria-label={ariaLabel}\n      onKeyDown={onKeyDown}\n      className={cn(\n        \"border-border flex flex-wrap gap-1 border-b\",\n        !hasInlinePanels ? className : undefined,\n      )}\n    >\n      {tabs.map((tab) => {\n        const active = tab.key === value;\n        const id = tabDomId(tab.key);\n        const controls =\n          tab.panel != null || tab.panelId ? panelDomId(tab) : undefined;\n        return (\n          <button\n            key={tab.key}\n            id={id}\n            ref={(node) => {\n              refs.current.set(tab.key, node);\n            }}\n            type=\"button\"\n            role=\"tab\"\n            aria-selected={active}\n            aria-controls={controls}\n            disabled={tab.disabled}\n            // Only the active tab is reachable by Tab; arrows move within the\n            // strip. Without this a keyboard user pages through every tab to\n            // get past the strip.\n            tabIndex={active ? 0 : -1}\n            onClick={() => onChange(tab.key)}\n            className={cn(\n              \"cursor-pointer rounded-t-md px-3 py-1.5 text-sm font-medium transition\",\n              \"focus-visible:ring-ring focus-visible:ring-2 focus-visible:outline-none\",\n              \"disabled:cursor-not-allowed disabled:opacity-50\",\n              // The filled-pill active state the five hand-rolled strips\n              // already used. Adopting it keeps this a deduplication rather\n              // than a restyle of every panel that has tabs.\n              active\n                ? \"bg-primary text-primary-foreground\"\n                : \"text-muted-foreground hover:bg-muted\",\n            )}\n          >\n            {tab.label}\n            {tab.badge != null ? (\n              <span className=\"text-muted-foreground ml-1.5 text-xs\">\n                {tab.badge}\n              </span>\n            ) : null}\n          </button>\n        );\n      })}\n    </div>\n  );\n\n  if (!hasInlinePanels) return tablist;\n\n  return (\n    <div className={cn(\"space-y-3\", className)}>\n      {tablist}\n      {tabs.map((tab) =>\n        tab.panel != null ? (\n          <TabPanel\n            key={tab.key}\n            id={panelDomId(tab)}\n            labelledBy={tabDomId(tab.key)}\n            active={tab.key === value}\n          >\n            {tab.panel}\n          </TabPanel>\n        ) : null,\n      )}\n    </div>\n  );\n}\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":"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","names":[]}

package/dist/tabs.d.cts

@@ -0,0 +1,59 @@
+import * as React from 'react';
+
+/**
+ * The tab strip five Managers were each drawing by hand, with the same
+ * `rounded-t-md px-3 py-1.5 text-sm font-medium` and their own idea of what an
+ * active tab looks like.
+ *
+ * It is a controlled component with no state of its own: every caller already
+ * held the active key, usually because a URL or a query depends on it.
+ *
+ * Roles are the reason to use this rather than styling buttons again. A hand
+ * -rolled strip is a row of buttons to a screen reader, which says nothing
+ * about how many tabs there are or which is selected; `tablist` / `tab` /
+ * `aria-selected` do. Arrow-key navigation comes with that expectation, so it
+ * is implemented here too.
+ *
+ * Optional `panel` on a tab (or a sibling `TabPanel`) wires APG `aria-controls`
+ * / `role="tabpanel"`. Callers that already render content from `value` can
+ * keep doing so and pass `panelId` for association, or switch to `panel`.
+ */
+interface TabItem<Key extends string = string> {
+    key: Key;
+    label: React.ReactNode;
+    /** Rendered after the label — a count, usually. */
+    badge?: React.ReactNode;
+    disabled?: boolean;
+    /**
+     * Optional panel body. When any tab provides `panel`, panels render under
+     * the strip with `role="tabpanel"`.
+     */
+    panel?: React.ReactNode;
+    /**
+     * External panel element id for `aria-controls` when panels live outside
+     * this component.
+     */
+    panelId?: string;
+}
+interface TabsProps<Key extends string = string> {
+    tabs: ReadonlyArray<TabItem<Key>>;
+    value: Key;
+    onChange: (key: Key) => void;
+    /** Names the strip for screen readers. */
+    ariaLabel?: string;
+    className?: string;
+}
+interface TabPanelProps {
+    /** Must match the controlling tab's generated or explicit id. */
+    id: string;
+    /** Id of the tab that labels this panel. */
+    labelledBy: string;
+    active: boolean;
+    children: React.ReactNode;
+    className?: string;
+}
+/** Companion panel for callers that keep content outside `Tabs`. */
+declare function TabPanel({ id, labelledBy, active, children, className, }: TabPanelProps): React.JSX.Element;
+declare function Tabs<Key extends string = string>({ tabs, value, onChange, ariaLabel, className, }: TabsProps<Key>): React.JSX.Element;
+
+export { type TabItem, TabPanel, type TabPanelProps, Tabs, type TabsProps };

package/dist/tabs.d.ts

@@ -0,0 +1,59 @@
+import * as React from 'react';
+
+/**
+ * The tab strip five Managers were each drawing by hand, with the same
+ * `rounded-t-md px-3 py-1.5 text-sm font-medium` and their own idea of what an
+ * active tab looks like.
+ *
+ * It is a controlled component with no state of its own: every caller already
+ * held the active key, usually because a URL or a query depends on it.
+ *
+ * Roles are the reason to use this rather than styling buttons again. A hand
+ * -rolled strip is a row of buttons to a screen reader, which says nothing
+ * about how many tabs there are or which is selected; `tablist` / `tab` /
+ * `aria-selected` do. Arrow-key navigation comes with that expectation, so it
+ * is implemented here too.
+ *
+ * Optional `panel` on a tab (or a sibling `TabPanel`) wires APG `aria-controls`
+ * / `role="tabpanel"`. Callers that already render content from `value` can
+ * keep doing so and pass `panelId` for association, or switch to `panel`.
+ */
+interface TabItem<Key extends string = string> {
+    key: Key;
+    label: React.ReactNode;
+    /** Rendered after the label — a count, usually. */
+    badge?: React.ReactNode;
+    disabled?: boolean;
+    /**
+     * Optional panel body. When any tab provides `panel`, panels render under
+     * the strip with `role="tabpanel"`.
+     */
+    panel?: React.ReactNode;
+    /**
+     * External panel element id for `aria-controls` when panels live outside
+     * this component.
+     */
+    panelId?: string;
+}
+interface TabsProps<Key extends string = string> {
+    tabs: ReadonlyArray<TabItem<Key>>;
+    value: Key;
+    onChange: (key: Key) => void;
+    /** Names the strip for screen readers. */
+    ariaLabel?: string;
+    className?: string;
+}
+interface TabPanelProps {
+    /** Must match the controlling tab's generated or explicit id. */
+    id: string;
+    /** Id of the tab that labels this panel. */
+    labelledBy: string;
+    active: boolean;
+    children: React.ReactNode;
+    className?: string;
+}
+/** Companion panel for callers that keep content outside `Tabs`. */
+declare function TabPanel({ id, labelledBy, active, children, className, }: TabPanelProps): React.JSX.Element;
+declare function Tabs<Key extends string = string>({ tabs, value, onChange, ariaLabel, className, }: TabsProps<Key>): React.JSX.Element;
+
+export { type TabItem, TabPanel, type TabPanelProps, Tabs, type TabsProps };

package/dist/tabs.js

@@ -0,0 +1,11 @@
+"use client";
+import {
+  TabPanel,
+  Tabs
+} from "./chunk-ZFSQVMLJ.js";
+import "./chunk-HCA5ODCD.js";
+export {
+  TabPanel,
+  Tabs
+};
+//# sourceMappingURL=tabs.js.map

package/dist/tabs.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/textarea.cjs

@@ -0,0 +1,66 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/textarea.tsx
+var textarea_exports = {};
+__export(textarea_exports, {
+  Textarea: () => Textarea,
+  textareaClass: () => textareaClass
+});
+module.exports = __toCommonJS(textarea_exports);
+var React = __toESM(require("react"), 1);
+
+// src/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/textarea.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var textareaClass = "border-border bg-background focus-visible:ring-ring w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50";
+var Textarea = React.forwardRef(
+  ({ className, rows = 3, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "textarea",
+    {
+      ref,
+      rows,
+      className: cn(textareaClass, className),
+      ...props
+    }
+  )
+);
+Textarea.displayName = "Textarea";
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Textarea,
+  textareaClass
+});
+//# sourceMappingURL=textarea.cjs.map

package/dist/textarea.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/textarea.tsx","../src/utils.ts"],"sourcesContent":["import * as React from \"react\";\n\nimport { cn } from \"./utils\";\n\n/**\n * The multi-line counterpart to `Input`.\n *\n * There was no shared textarea, so sixteen of them were styled individually\n * and no two agreed — different borders, different focus rings, some with no\n * focus ring at all, which is a keyboard user losing their place.\n *\n * Deliberately not `inputClass`: that fixes `h-9`, which is a one-line\n * control. Everything else is shared so a textarea and an input sitting in the\n * same form look related.\n */\nexport const textareaClass =\n  \"border-border bg-background focus-visible:ring-ring w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50\";\n\nexport type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nexport const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n  ({ className, rows = 3, ...props }, ref) => (\n    <textarea\n      ref={ref}\n      rows={rows}\n      className={cn(textareaClass, className)}\n      {...props}\n    />\n  ),\n);\n\nTextarea.displayName = \"Textarea\";\n","import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAAuB;;;ACAvB,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADiBI;AAPG,IAAM,gBACX;AAIK,IAAM,WAAiB;AAAA,EAC5B,CAAC,EAAE,WAAW,OAAO,GAAG,GAAG,MAAM,GAAG,QAClC;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,WAAW,GAAG,eAAe,SAAS;AAAA,MACrC,GAAG;AAAA;AAAA,EACN;AAEJ;AAEA,SAAS,cAAc;","names":[]}

package/dist/textarea.d.cts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+
+/**
+ * The multi-line counterpart to `Input`.
+ *
+ * There was no shared textarea, so sixteen of them were styled individually
+ * and no two agreed — different borders, different focus rings, some with no
+ * focus ring at all, which is a keyboard user losing their place.
+ *
+ * Deliberately not `inputClass`: that fixes `h-9`, which is a one-line
+ * control. Everything else is shared so a textarea and an input sitting in the
+ * same form look related.
+ */
+declare const textareaClass = "border-border bg-background focus-visible:ring-ring w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50";
+type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
+declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+
+export { Textarea, type TextareaProps, textareaClass };

package/dist/textarea.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+
+/**
+ * The multi-line counterpart to `Input`.
+ *
+ * There was no shared textarea, so sixteen of them were styled individually
+ * and no two agreed — different borders, different focus rings, some with no
+ * focus ring at all, which is a keyboard user losing their place.
+ *
+ * Deliberately not `inputClass`: that fixes `h-9`, which is a one-line
+ * control. Everything else is shared so a textarea and an input sitting in the
+ * same form look related.
+ */
+declare const textareaClass = "border-border bg-background focus-visible:ring-ring w-full rounded-md border px-3 py-2 text-sm focus-visible:ring-2 focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50";
+type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
+declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
+
+export { Textarea, type TextareaProps, textareaClass };

package/dist/textarea.js

@@ -0,0 +1,10 @@
+import {
+  Textarea,
+  textareaClass
+} from "./chunk-IRCTGJQB.js";
+import "./chunk-HCA5ODCD.js";
+export {
+  Textarea,
+  textareaClass
+};
+//# sourceMappingURL=textarea.js.map

package/dist/textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/utils.cjs

@@ -0,0 +1,35 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/utils.ts
+var utils_exports = {};
+__export(utils_exports, {
+  cn: () => cn
+});
+module.exports = __toCommonJS(utils_exports);
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  cn
+});
+//# sourceMappingURL=utils.cjs.map

package/dist/utils.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils.ts"],"sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;","names":[]}

package/dist/utils.d.cts

@@ -0,0 +1,5 @@
+import { ClassValue } from 'clsx';
+
+declare function cn(...inputs: ClassValue[]): string;
+
+export { cn };

package/dist/utils.d.ts

@@ -0,0 +1,5 @@
+import { ClassValue } from 'clsx';
+
+declare function cn(...inputs: ClassValue[]): string;
+
+export { cn };

package/dist/utils.js

@@ -0,0 +1,7 @@
+import {
+  cn
+} from "./chunk-HCA5ODCD.js";
+export {
+  cn
+};
+//# sourceMappingURL=utils.js.map

package/dist/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}