@estiva-app/ui 0.6.0 → 0.7.0

package/dist/Reaction.d.ts

@@ -0,0 +1,54 @@
+import type { ButtonHTMLAttributes, ReactNode } from 'react';
+/**
+ * A reaction: an emoji, how many people chose it, and whether you are one of
+ * them.
+ *
+ * **This exists because both apps had already built it, and neither could use
+ * the components that were here.** A reaction is a pill with a count that
+ * toggles — `Chip` is a pill and rules itself out for anything clickable,
+ * `Button` is clickable and is a 6px-radius rectangle, and `IconButton` has
+ * nowhere to put the count. So Peek re-typed Chip's class list with a border
+ * added, and Ship reached for a small Button with the count as its label. The
+ * two apps' reactions do not look alike today, and neither is what was drawn.
+ *
+ * ## The one thing it does that nothing else here does
+ *
+ * **It says the reaction is yours.** That is the state a reaction has and a
+ * chip does not: `pressed` fills it with the accent's muted tint and gives it
+ * an accent edge, so a glance separates "two people, one of them me" from "two
+ * people". Ship approximated it as `outlined` versus `muted` — measured at a
+ * 1px hairline against no border at all — which is legible and is not the
+ * signal Peek's accent fill gives.
+ *
+ * It is a real `<button>` with `aria-pressed`, so the state reaches assistive
+ * tech as a toggle rather than as a colour.
+ *
+ * ## `aria-label` is required, and the reason is specific
+ *
+ * The emoji is decorative here — it is `aria-hidden`, because a glyph read
+ * aloud is noise and its spoken name differs per screen reader — and the only
+ * visible text is the count. Without a label the control is announced as
+ * **"2"**, which is what Ship shipped and its own tests caught. Pass the
+ * meaning and the count: `"Makes sense, 2"`.
+ *
+ * ## Geometry
+ *
+ * Chip's pill, at a control's height: fully rounded, 24px to match `Button`
+ * `small`, the same 8px horizontal padding, the `chip` type token for the
+ * count so it sits at 11px/500 like every other count in the system.
+ */
+export interface ReactionProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
+    /** The emoji, drawn decoratively — name the control with `aria-label`. */
+    emoji: ReactNode;
+    /** How many people reacted. Drawn as-is; `0` is not a reaction and is not drawn. */
+    count: number;
+    /** You are one of them: the accent tint and edge, and `aria-pressed`. */
+    pressed?: boolean;
+    /**
+     * Names the control. **Required** — the emoji is decorative and the count is
+     * the only visible text, so without this it is announced as a bare number.
+     */
+    'aria-label': string;
+}
+export declare function Reaction({ emoji, count, pressed, className, type, ...props }: ReactionProps): import("react").JSX.Element;
+//# sourceMappingURL=Reaction.d.ts.map

package/dist/Reaction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Reaction.d.ts","sourceRoot":"","sources":["../src/Reaction.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAG5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,UAAU,CAAC;IAC9F,0EAA0E;IAC1E,KAAK,EAAE,SAAS,CAAA;IAChB,oFAAoF;IACpF,KAAK,EAAE,MAAM,CAAA;IACb,yEAAyE;IACzE,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;OAGG;IACH,YAAY,EAAE,MAAM,CAAA;CACrB;AAED,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,OAAe,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,+BA8BnG"}

package/dist/index.d.ts

@@ -42,6 +42,7 @@ export { Sidebar, type SidebarProps } from './Sidebar';
 export { TopBar, type TopBarProps } from './TopBar';
 export { PersonTrigger, type PersonTriggerProps } from './PersonTrigger';
 export { Property, type PropertyProps } from './Property';
+export { Reaction, type ReactionProps } from './Reaction';
 export { SearchInput, type SearchInputProps } from './SearchInput';
 export { SectionHeader, type SectionAction, type SectionHeaderProps } from './SectionHeader';
 export { SectionLabel } from './SectionLabel';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AACxE,OAAO,EAAE,WAAW,EAAE,KAAK,iBAAiB,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAC1F,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,MAAM,UAAU,CAAA;AACpE,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,MAAM,UAAU,CAAA;AACxF,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,KAAK,QAAQ,EAAE,MAAM,QAAQ,CAAA;AAC5D,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,KAAK,eAAe,EAAE,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAA;AAClH,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,KAAK,iBAAiB,EAAE,MAAM,cAAc,CAAA;AACvF,OAAO,EAAE,GAAG,EAAE,KAAK,QAAQ,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,KAAK,QAAQ,EAAE,KAAK,iBAAiB,EAAE,KAAK,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAC5H,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,KAAK,YAAY,EAAE,KAAK,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAC1F,OAAO,EAAE,KAAK,EAAE,iBAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,SAAS,CAAA;AACnE,OAAO,EAAE,MAAM,EAAE,KAAK,YAAY,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AACtE,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,aAAa,CAAA;AAC5D,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACxE,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAClE,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AACtD,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,gBAAgB,CAAA;AACrE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAA;AACnE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,KAAK,KAAK,EAAE,MAAM,cAAc,CAAA;AAC3E,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,cAAc,EAAE,KAAK,SAAS,EAAE,KAAK,YAAY,EAAE,MAAM,QAAQ,CAAA;AACxK,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACrD,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AACnD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAA;AAC7C,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AACnD,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACxE,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,eAAe,CAAA;AAClE,OAAO,EAAE,aAAa,EAAE,KAAK,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAC5F,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,IAAI,EAAE,KAAK,MAAM,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAA;AAC1D,OAAO,EAAE,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,YAAY,EAAE,KAAK,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,SAAS,CAAA;AAC5G,OAAO,EAAE,EAAE,EAAE,MAAM,MAAM,CAAA"}

package/dist/index.js

@@ -1592,11 +1592,37 @@ function Property({ label, layout = "row", children, className }) {
   ] });
 }
 
+// src/Reaction.tsx
+import { jsx as jsx33, jsxs as jsxs21 } from "react/jsx-runtime";
+function Reaction({ emoji, count, pressed = false, className, type, ...props }) {
+  return /* @__PURE__ */ jsxs21(
+    "button",
+    {
+      type: type ?? "button",
+      "aria-pressed": pressed,
+      className: cn(
+        // Chip's pill at a control's height, so a reaction and a status chip
+        // read as the same family — 24px matches Button `small`.
+        "inline-flex h-6 items-center justify-center gap-1.5 rounded-full px-2",
+        "border transition-colors",
+        "disabled:cursor-not-allowed disabled:opacity-50",
+        pressed ? "border-accent-primary bg-accent-muted text-accent-primary hover:border-accent-hover" : "border-border-default bg-bg-inset text-text-primary hover:border-border-strong hover:bg-bg-hover",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx33("span", { "aria-hidden": "true", className: "shrink-0 text-[16px] leading-none", children: emoji }),
+        /* @__PURE__ */ jsx33("span", { className: "text-chip signal:font-mono signal:text-[10px] signal:font-semibold signal:tabular-nums", children: count })
+      ]
+    }
+  );
+}
+
 // src/SearchInput.tsx
 import "react";
-import { jsx as jsx33, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs22 } from "react/jsx-runtime";
 function SearchInput({ shortcut, className, placeholder = "Search\u2026", ...props }) {
-  return /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs22(
     "div",
     {
       className: cn(
@@ -1606,7 +1632,7 @@ function SearchInput({ shortcut, className, placeholder = "Search\u2026", ...pro
         className
       ),
       children: [
-        /* @__PURE__ */ jsx33(
+        /* @__PURE__ */ jsx34(
           "input",
           {
             className: "flex-1 min-w-0 bg-transparent text-input-value text-text-primary placeholder:text-text-muted outline-none",
@@ -1614,7 +1640,7 @@ function SearchInput({ shortcut, className, placeholder = "Search\u2026", ...pro
             ...props
           }
         ),
-        shortcut && /* @__PURE__ */ jsx33(Kbd, { children: shortcut })
+        shortcut && /* @__PURE__ */ jsx34(Kbd, { children: shortcut })
       ]
     }
   );
@@ -1623,10 +1649,10 @@ function SearchInput({ shortcut, className, placeholder = "Search\u2026", ...pro
 // src/SectionHeader.tsx
 import { useState as useState10 } from "react";
 import { IconChevronRight as IconChevronRight2 } from "@tabler/icons-react";
-import { jsx as jsx34, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs23 } from "react/jsx-runtime";
 function SectionHeader({ title, chevron = false, isExpanded = true, onToggle, actions, showActions = "hover", className }) {
   const [isHovered, setIsHovered] = useState10(false);
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs23(
     "div",
     {
       className: cn(
@@ -1639,8 +1665,8 @@ function SectionHeader({ title, chevron = false, isExpanded = true, onToggle, ac
       onMouseEnter: () => setIsHovered(true),
       onMouseLeave: () => setIsHovered(false),
       children: [
-        /* @__PURE__ */ jsxs22("div", { className: "flex shrink-0 items-center gap-1", children: [
-          chevron && /* @__PURE__ */ jsx34(
+        /* @__PURE__ */ jsxs23("div", { className: "flex shrink-0 items-center gap-1", children: [
+          chevron && /* @__PURE__ */ jsx35(
             IconChevronRight2,
             {
               size: 12,
@@ -1648,9 +1674,9 @@ function SectionHeader({ title, chevron = false, isExpanded = true, onToggle, ac
               className: cn("text-text-secondary transition-transform duration-150", isExpanded && "rotate-90")
             }
           ),
-          /* @__PURE__ */ jsx34(SectionLabel, { children: title })
+          /* @__PURE__ */ jsx35(SectionLabel, { children: title })
         ] }),
-        (showActions === "always" || isHovered) && actions && actions.length > 0 && /* @__PURE__ */ jsx34("div", { className: "flex items-center gap-1", children: actions.map((action) => /* @__PURE__ */ jsx34(
+        (showActions === "always" || isHovered) && actions && actions.length > 0 && /* @__PURE__ */ jsx35("div", { className: "flex items-center gap-1", children: actions.map((action) => /* @__PURE__ */ jsx35(
           IconButton,
           {
             tooltip: action.tooltip,
@@ -1669,9 +1695,9 @@ function SectionHeader({ title, chevron = false, isExpanded = true, onToggle, ac
 }
 
 // src/Tabs.tsx
-import { jsx as jsx35, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime";
 function Tabs({ tabs, active, onChange, size = "default", className }) {
-  return /* @__PURE__ */ jsx35("div", { role: "tablist", className: cn("flex items-center gap-2", className), children: tabs.map((tab) => /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsx36("div", { role: "tablist", className: cn("flex items-center gap-2", className), children: tabs.map((tab) => /* @__PURE__ */ jsxs24(
     "button",
     {
       type: "button",
@@ -1690,9 +1716,9 @@ function Tabs({ tabs, active, onChange, size = "default", className }) {
       ),
       children: [
         tab.icon,
-        /* @__PURE__ */ jsxs23("span", { className: "flex items-baseline", children: [
+        /* @__PURE__ */ jsxs24("span", { className: "flex items-baseline", children: [
           tab.label,
-          tab.count !== void 0 ? /* @__PURE__ */ jsx35("span", { className: "ml-2.5 font-mono text-caption tabular-nums text-text-secondary", children: tab.count }) : null
+          tab.count !== void 0 ? /* @__PURE__ */ jsx36("span", { className: "ml-2.5 font-mono text-caption tabular-nums text-text-secondary", children: tab.count }) : null
         ] })
       ]
     },
@@ -1704,7 +1730,7 @@ function Tabs({ tabs, active, onChange, size = "default", className }) {
 import { createContext as createContext3, useCallback as useCallback5, useContext as useContext3, useEffect as useEffect6, useMemo as useMemo3, useState as useState11 } from "react";
 import { createPortal as createPortal6 } from "react-dom";
 import { IconCircleCheck } from "@tabler/icons-react";
-import { jsx as jsx36, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs25 } from "react/jsx-runtime";
 var SURFACE_BY_TYPE = {
   success: "bg-success-muted signal:bg-bg-inset signal:border signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]",
   brand: "bg-accent-muted signal:bg-bg-inset signal:border signal:border-border-default signal:shadow-[shadow:var(--shadow-md)]",
@@ -1722,7 +1748,7 @@ var ACTION_BORDER_BY_TYPE = {
 };
 function Toast({ label, type = "neutral", leadingIcon = true, actionLabel, onAction, className }) {
   const hasAction = !!(actionLabel && onAction);
-  return /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsxs25(
     "div",
     {
       className: cn(
@@ -1734,11 +1760,11 @@ function Toast({ label, type = "neutral", leadingIcon = true, actionLabel, onAct
         className
       ),
       children: [
-        /* @__PURE__ */ jsxs24("div", { className: "flex items-center gap-2 shrink-0", children: [
-          leadingIcon && /* @__PURE__ */ jsx36(IconCircleCheck, { size: 16, stroke: 1.5, className: cn("text-text-primary shrink-0", ICON_BY_TYPE[type]) }),
-          /* @__PURE__ */ jsx36("span", { className: "font-normal text-[14px] leading-[1.4] text-text-primary whitespace-nowrap", children: label })
+        /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-2 shrink-0", children: [
+          leadingIcon && /* @__PURE__ */ jsx37(IconCircleCheck, { size: 16, stroke: 1.5, className: cn("text-text-primary shrink-0", ICON_BY_TYPE[type]) }),
+          /* @__PURE__ */ jsx37("span", { className: "font-normal text-[14px] leading-[1.4] text-text-primary whitespace-nowrap", children: label })
         ] }),
-        hasAction && /* @__PURE__ */ jsx36(
+        hasAction && /* @__PURE__ */ jsx37(
           "button",
           {
             type: "button",
@@ -1748,7 +1774,7 @@ function Toast({ label, type = "neutral", leadingIcon = true, actionLabel, onAct
               ACTION_BORDER_BY_TYPE[type],
               type === "neutral" ? "hover:border-border-strong" : "hover:opacity-80"
             ),
-            children: /* @__PURE__ */ jsx36("span", { className: "font-medium text-[12px] leading-[12px] text-text-primary whitespace-nowrap", children: actionLabel })
+            children: /* @__PURE__ */ jsx37("span", { className: "font-medium text-[12px] leading-[12px] text-text-primary whitespace-nowrap", children: actionLabel })
           }
         )
       ]
@@ -1775,10 +1801,10 @@ function ToastProvider({ children }) {
     return () => clearTimeout(timer);
   }, [toast]);
   const value = useMemo3(() => ({ showToast, dismissToast }), [showToast, dismissToast]);
-  return /* @__PURE__ */ jsxs24(ToastContext.Provider, { value, children: [
+  return /* @__PURE__ */ jsxs25(ToastContext.Provider, { value, children: [
     children,
     toast && createPortal6(
-      /* @__PURE__ */ jsx36("div", { className: "fixed bottom-4 left-4 z-[100] pointer-events-none", children: /* @__PURE__ */ jsx36(
+      /* @__PURE__ */ jsx37("div", { className: "fixed bottom-4 left-4 z-[100] pointer-events-none", children: /* @__PURE__ */ jsx37(
         Toast,
         {
           className: "pointer-events-auto",
@@ -1835,6 +1861,7 @@ export {
   Property,
   Rail,
   RailItem,
+  Reaction,
   SearchInput,
   SectionHeader,
   SectionLabel,