@clicoh/orion-library 1.2.0-beta.2 → 1.2.0-beta.21

package/expresivo/ExpRepoAvatar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpRepoAvatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,YAAY,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAC"}

package/expresivo/ExpRepoAvatar/index.js

@@ -0,0 +1,2 @@
+export { ExpRepoAvatar } from './ExpRepoAvatar';
+//# sourceMappingURL=index.js.map

package/expresivo/ExpRepoAvatar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/expresivo/ExpRepoAvatar/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}

package/expresivo/ExpScope/ExpScope.d.ts

@@ -0,0 +1,63 @@
+import { type ReactNode } from 'react';
+export type ExpScopeTitles = 'playful' | 'plain';
+export type ExpScopeTables = 'cards' | 'plain';
+export type ExpScopeMascots = 'shown' | 'hidden';
+export type ExpScopeOptions = {
+    /** `playful` sets core headings, top menu links and table headers in the title font. */
+    titles: ExpScopeTitles;
+    /** `cards` turns core table rows into separate cards that lift on hover. */
+    tables: ExpScopeTables;
+    /** `hidden` silences every mascot, for users who prefer a quiet interface. */
+    mascots: ExpScopeMascots;
+};
+export type ExpScopeProps = {
+    children: ReactNode;
+} & Partial<ExpScopeOptions>;
+/**
+ * ExpScope turns on Orion's expressive layer for the page it renders in.
+ *
+ * Inside it, `Exp*` components render in full; outside it, they fall back to
+ * their core equivalent. While it is mounted, `assets/css/expresivo.css`
+ * reskins the core parts marked with `data-orion-part`, including the ones
+ * rendered in portals (tooltips, side filters, header menus).
+ *
+ * The options tune how loud the layer is, so a product can let its users
+ * pick a calmer look without leaving the scope.
+ *
+ * Only for consumers whose own docs declare `capa expresiva: sí`.
+ *
+ * @component
+ * @example
+ * <ExpScope>
+ *   <App />
+ * </ExpScope>
+ *
+ * @example
+ * // Core table rows and plain titles, no mascots
+ * <ExpScope titles="plain" tables="plain" mascots="hidden">
+ *   <App />
+ * </ExpScope>
+ *
+ * @param {ExpScopeProps} props
+ * @param {ReactNode} props.children - Content that gets the expressive layer.
+ * @param {'playful' | 'plain'} [props.titles='playful'] - `playful` sets core headings, top menu links and table headers in the title font.
+ * @param {'cards' | 'plain'} [props.tables='cards'] - `cards` turns core table rows into separate cards; `plain` keeps the core rows.
+ * @param {'shown' | 'hidden'} [props.mascots='shown'] - `hidden` stops every `Exp*` component from drawing a mascot.
+ * @returns {ReactNode} The children inside a wrapper that adds no box.
+ */
+export declare function ExpScope({ children, titles, tables, mascots, }: ExpScopeProps): ReactNode;
+/**
+ * Tells whether the caller renders inside an `ExpScope`. `Exp*` components
+ * use it to choose between their full look and their core fallback.
+ *
+ * @returns {boolean} `true` inside an `ExpScope`.
+ */
+export declare function useExpScope(): boolean;
+/**
+ * Options of the nearest `ExpScope`, for `Exp*` components that change with
+ * them.
+ *
+ * @returns {ExpScopeOptions | null} The options, or `null` outside an `ExpScope`.
+ */
+export declare function useExpScopeOptions(): ExpScopeOptions | null;
+//# sourceMappingURL=ExpScope.d.ts.map

package/expresivo/ExpScope/ExpScope.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpScope.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpScope/ExpScope.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAiB,KAAK,SAAS,EAAuB,MAAM,OAAO,CAAC;AAE3E,MAAM,MAAM,cAAc,GAAG,SAAS,GAAG,OAAO,CAAC;AAEjD,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,OAAO,CAAC;AAE/C,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,QAAQ,CAAC;AAEjD,MAAM,MAAM,eAAe,GAAG;IAC5B,wFAAwF;IACxF,MAAM,EAAE,cAAc,CAAC;IACvB,4EAA4E;IAC5E,MAAM,EAAE,cAAc,CAAC;IACvB,8EAA8E;IAC9E,OAAO,EAAE,eAAe,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB,GAAG,OAAO,CAAC,eAAe,CAAC,CAAC;AAM7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,wBAAgB,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAkB,EAClB,MAAgB,EAChB,OAAiB,GAClB,EAAE,aAAa,GAAG,SAAS,CAqB3B;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,IAAI,OAAO,CAErC;AAED;;;;;GAKG;AACH,wBAAgB,kBAAkB,IAAI,eAAe,GAAG,IAAI,CAE3D"}

package/expresivo/ExpScope/ExpScope.jsx

@@ -0,0 +1,67 @@
+'use client';
+import { DynaPuff } from 'next/font/google';
+import { createContext, useContext, useMemo } from 'react';
+const titleFont = DynaPuff({ subsets: ['latin'], display: 'swap' });
+const ExpScopeContext = createContext(null);
+/**
+ * ExpScope turns on Orion's expressive layer for the page it renders in.
+ *
+ * Inside it, `Exp*` components render in full; outside it, they fall back to
+ * their core equivalent. While it is mounted, `assets/css/expresivo.css`
+ * reskins the core parts marked with `data-orion-part`, including the ones
+ * rendered in portals (tooltips, side filters, header menus).
+ *
+ * The options tune how loud the layer is, so a product can let its users
+ * pick a calmer look without leaving the scope.
+ *
+ * Only for consumers whose own docs declare `capa expresiva: sí`.
+ *
+ * @component
+ * @example
+ * <ExpScope>
+ *   <App />
+ * </ExpScope>
+ *
+ * @example
+ * // Core table rows and plain titles, no mascots
+ * <ExpScope titles="plain" tables="plain" mascots="hidden">
+ *   <App />
+ * </ExpScope>
+ *
+ * @param {ExpScopeProps} props
+ * @param {ReactNode} props.children - Content that gets the expressive layer.
+ * @param {'playful' | 'plain'} [props.titles='playful'] - `playful` sets core headings, top menu links and table headers in the title font.
+ * @param {'cards' | 'plain'} [props.tables='cards'] - `cards` turns core table rows into separate cards; `plain` keeps the core rows.
+ * @param {'shown' | 'hidden'} [props.mascots='shown'] - `hidden` stops every `Exp*` component from drawing a mascot.
+ * @returns {ReactNode} The children inside a wrapper that adds no box.
+ */
+export function ExpScope({ children, titles = 'playful', tables = 'cards', mascots = 'shown', }) {
+    const options = useMemo(() => ({ titles, tables, mascots }), [titles, tables, mascots]);
+    return (<ExpScopeContext.Provider value={options}>
+      <style href="exp-title-font" precedence="exp">
+        {`:root{--exp-title-font:${titleFont.style.fontFamily}}`}
+      </style>
+      <div className="exp-scope" data-exp-titles={titles} data-exp-tables={tables} data-exp-mascots={mascots}>
+        {children}
+      </div>
+    </ExpScopeContext.Provider>);
+}
+/**
+ * Tells whether the caller renders inside an `ExpScope`. `Exp*` components
+ * use it to choose between their full look and their core fallback.
+ *
+ * @returns {boolean} `true` inside an `ExpScope`.
+ */
+export function useExpScope() {
+    return useContext(ExpScopeContext) !== null;
+}
+/**
+ * Options of the nearest `ExpScope`, for `Exp*` components that change with
+ * them.
+ *
+ * @returns {ExpScopeOptions | null} The options, or `null` outside an `ExpScope`.
+ */
+export function useExpScopeOptions() {
+    return useContext(ExpScopeContext);
+}
+//# sourceMappingURL=ExpScope.jsx.map

package/expresivo/ExpScope/ExpScope.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpScope.jsx","sourceRoot":"","sources":["../../src/expresivo/ExpScope/ExpScope.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAkB,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAqB3E,MAAM,SAAS,GAAG,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC,OAAO,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,CAAC;AAEpE,MAAM,eAAe,GAAG,aAAa,CAAyB,IAAI,CAAC,CAAC;AAEpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+BG;AACH,MAAM,UAAU,QAAQ,CAAC,EACvB,QAAQ,EACR,MAAM,GAAG,SAAS,EAClB,MAAM,GAAG,OAAO,EAChB,OAAO,GAAG,OAAO,GACH;IACd,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,EACnC,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,CAC1B,CAAC;IAEF,OAAO,CACL,CAAC,eAAe,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,CACvC;MAAA,CAAC,KAAK,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC,KAAK,CAC3C;QAAA,CAAC,0BAA0B,SAAS,CAAC,KAAK,CAAC,UAAU,GAAG,CAC1D;MAAA,EAAE,KAAK,CACP;MAAA,CAAC,GAAG,CACF,SAAS,CAAC,WAAW,CACrB,eAAe,CAAC,CAAC,MAAM,CAAC,CACxB,eAAe,CAAC,CAAC,MAAM,CAAC,CACxB,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAE1B;QAAA,CAAC,QAAQ,CACX;MAAA,EAAE,GAAG,CACP;IAAA,EAAE,eAAe,CAAC,QAAQ,CAAC,CAC5B,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO,UAAU,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;AAC9C,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,kBAAkB;IAChC,OAAO,UAAU,CAAC,eAAe,CAAC,CAAC;AACrC,CAAC"}

package/expresivo/ExpScope/index.d.ts

@@ -0,0 +1,3 @@
+export { ExpScope, useExpScope } from './ExpScope';
+export type { ExpScopeMascots, ExpScopeOptions, ExpScopeProps, ExpScopeTables, ExpScopeTitles, } from './ExpScope';
+//# sourceMappingURL=index.d.ts.map

package/expresivo/ExpScope/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpScope/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACnD,YAAY,EACV,eAAe,EACf,eAAe,EACf,aAAa,EACb,cAAc,EACd,cAAc,GACf,MAAM,YAAY,CAAC"}

package/expresivo/ExpScope/index.js

@@ -0,0 +1,2 @@
+export { ExpScope, useExpScope } from './ExpScope';
+//# sourceMappingURL=index.js.map

package/expresivo/ExpScope/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/expresivo/ExpScope/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC"}

package/expresivo/ExpScoreRing/ExpScoreRing.d.ts

@@ -0,0 +1,35 @@
+import { type HTMLAttributes, type ReactNode } from 'react';
+export type ExpScoreRingProps = {
+    /** Score between 0 and 100. */
+    value: number;
+    /** Target score between 0 and 100, marked with a tick on the ring. */
+    goal?: number;
+    /** Width and height in pixels. */
+    size?: number;
+    /** Content centered inside the ring, such as the score and its caption. */
+    children?: ReactNode;
+} & Omit<HTMLAttributes<HTMLDivElement>, 'children'>;
+/**
+ * Score ring with an optional goal tick. The arc grows in the clicOH
+ * gradient when it mounts. The ring is decorative: put the score as text in
+ * `children`, centered inside it.
+ *
+ * Outside an `ExpScope` it falls back to the core `RadialProgressBar`, with
+ * `children` still centered on top.
+ *
+ * @component
+ * @example
+ * <ExpScoreRing value={57} goal={70}>
+ *   <Heading level="h4">57</Heading>
+ * </ExpScoreRing>
+ *
+ * @param {Object} props - The properties of the ExpScoreRing component.
+ * @param {number} props.value - Score between 0 and 100.
+ * @param {number} [props.goal] - Target score, marked with a tick.
+ * @param {number} [props.size=120] - Width and height in pixels.
+ * @param {ReactNode} [props.children] - Content centered inside the ring.
+ *
+ * @returns {ReactNode} The ring, or a core `RadialProgressBar` outside an `ExpScope`.
+ */
+export declare function ExpScoreRing({ value, goal, size, children, ...restProps }: ExpScoreRingProps): ReactNode;
+//# sourceMappingURL=ExpScoreRing.d.ts.map

package/expresivo/ExpScoreRing/ExpScoreRing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpScoreRing.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpScoreRing/ExpScoreRing.tsx"],"names":[],"mappings":"AAGA,OAAO,EACL,KAAK,cAAc,EACnB,KAAK,SAAS,EAIf,MAAM,OAAO,CAAC;AAIf,MAAM,MAAM,iBAAiB,GAAG;IAC9B,+BAA+B;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,sEAAsE;IACtE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,kCAAkC;IAClC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,GAAG,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC;AAOrD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,IAAI,EACJ,IAAU,EACV,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,iBAAiB,GAAG,SAAS,CAoF/B"}

package/expresivo/ExpScoreRing/ExpScoreRing.jsx

@@ -0,0 +1,67 @@
+'use client';
+import clsx from 'clsx';
+import { useEffect, useId, useState, } from 'react';
+import { RadialProgressBar, Show } from '@clicoh/orion-library';
+import { useExpScope } from '../ExpScope/ExpScope';
+const RADIUS = 50;
+const CIRCUMFERENCE = 2 * Math.PI * RADIUS;
+const clamp = (value) => Math.min(100, Math.max(0, value));
+/**
+ * Score ring with an optional goal tick. The arc grows in the clicOH
+ * gradient when it mounts. The ring is decorative: put the score as text in
+ * `children`, centered inside it.
+ *
+ * Outside an `ExpScope` it falls back to the core `RadialProgressBar`, with
+ * `children` still centered on top.
+ *
+ * @component
+ * @example
+ * <ExpScoreRing value={57} goal={70}>
+ *   <Heading level="h4">57</Heading>
+ * </ExpScoreRing>
+ *
+ * @param {Object} props - The properties of the ExpScoreRing component.
+ * @param {number} props.value - Score between 0 and 100.
+ * @param {number} [props.goal] - Target score, marked with a tick.
+ * @param {number} [props.size=120] - Width and height in pixels.
+ * @param {ReactNode} [props.children] - Content centered inside the ring.
+ *
+ * @returns {ReactNode} The ring, or a core `RadialProgressBar` outside an `ExpScope`.
+ */
+export function ExpScoreRing({ value, goal, size = 120, children, ...restProps }) {
+    const inScope = useExpScope();
+    const gradientId = useId();
+    const [shown, setShown] = useState(0);
+    const percent = clamp(value);
+    useEffect(() => {
+        const timer = setTimeout(() => setShown(percent), 60);
+        return () => clearTimeout(timer);
+    }, [percent]);
+    const goalAngle = typeof goal === 'number'
+        ? ((clamp(goal) / 100) * 360 - 90) * (Math.PI / 180)
+        : null;
+    return (<div {...restProps} style={{ width: size, height: size, ...restProps.style }} className={clsx('relative inline-flex shrink-0', restProps.className)}>
+      <Show>
+        <Show.When isTrue={inScope}>
+          <svg aria-hidden="true" width={size} height={size} viewBox="0 0 120 120">
+            <defs>
+              <linearGradient id={gradientId} x1={0} y1={0} x2={1} y2={1}>
+                <stop offset={0} className="[stop-color:var(--color-lavender)]"/>
+                <stop offset={1} className="[stop-color:var(--color-violet)]"/>
+              </linearGradient>
+            </defs>
+            <circle cx={60} cy={60} r={RADIUS} fill="none" strokeWidth={10} className="stroke-gray-5 dark:stroke-gray-dark-1"/>
+            <circle cx={60} cy={60} r={RADIUS} fill="none" stroke={`url(#${gradientId})`} strokeWidth={10} strokeLinecap="round" strokeDasharray={CIRCUMFERENCE} strokeDashoffset={CIRCUMFERENCE * (1 - shown / 100)} transform="rotate(-90 60 60)" className="transition-[stroke-dashoffset] duration-900 ease-[cubic-bezier(.22,1,.36,1)] motion-reduce:transition-none"/>
+            {goalAngle !== null && (<line x1={60 + Math.cos(goalAngle) * 42} y1={60 + Math.sin(goalAngle) * 42} x2={60 + Math.cos(goalAngle) * 58} y2={60 + Math.sin(goalAngle) * 58} strokeWidth={2.5} strokeLinecap="round" className="stroke-black dark:stroke-white"/>)}
+          </svg>
+        </Show.When>
+        <Show.Else>
+          <RadialProgressBar value={percent} className="h-full w-full"/>
+        </Show.Else>
+      </Show>
+      {!!children && (<div className="absolute inset-0 flex flex-col items-center justify-center text-center">
+          {children}
+        </div>)}
+    </div>);
+}
+//# sourceMappingURL=ExpScoreRing.jsx.map

package/expresivo/ExpScoreRing/ExpScoreRing.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpScoreRing.jsx","sourceRoot":"","sources":["../../src/expresivo/ExpScoreRing/ExpScoreRing.tsx"],"names":[],"mappings":"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"}

package/expresivo/ExpScoreRing/index.d.ts

@@ -0,0 +1,3 @@
+export { ExpScoreRing } from './ExpScoreRing';
+export type { ExpScoreRingProps } from './ExpScoreRing';
+//# sourceMappingURL=index.d.ts.map

package/expresivo/ExpScoreRing/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpScoreRing/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC"}

package/expresivo/ExpScoreRing/index.js

@@ -0,0 +1,2 @@
+export { ExpScoreRing } from './ExpScoreRing';
+//# sourceMappingURL=index.js.map

package/expresivo/ExpScoreRing/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/expresivo/ExpScoreRing/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}

package/expresivo/ExpSearchField/ExpSearchField.d.ts

@@ -0,0 +1,49 @@
+import { type InputHTMLAttributes, type ReactNode } from 'react';
+export type ExpSearchFieldAction = {
+    label: string;
+    onClick: () => void;
+    /** Blocks the action and animates its lens while the search runs. */
+    busy?: boolean;
+    /** Label shown while `busy`. */
+    busyLabel?: string;
+    disabled?: boolean;
+};
+export type ExpSearchFieldProps = {
+    /** Accessible name of the field. Not shown: a heading next to it names it. */
+    label: string;
+    input: Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'placeholder'>;
+    placeholder?: string;
+    helperText?: string;
+    error?: string;
+    /** The action inside the field, on the right. Enter runs it too. */
+    action: ExpSearchFieldAction;
+};
+/**
+ * Search field drawn as a white pill with a soft relief, a lens on the left
+ * and its action inside, on the right. On hover it lifts with a lavender
+ * halo; on focus the ring turns lavender. Enter runs the action.
+ *
+ * Outside an `ExpScope` it falls back to the core `Input`, with a search
+ * icon, and a `Button` `second` next to it.
+ *
+ * @component
+ * @example
+ * <ExpSearchField
+ *   label="Ticket number"
+ *   placeholder="Search in Flow"
+ *   input={{ value, onChange: (event) => setValue(event.target.value) }}
+ *   action={{ label: 'Search', onClick: search, busy: isSearching }}
+ * />
+ *
+ * @param {ExpSearchFieldProps} props - The properties of the ExpSearchField component.
+ * @param {string} props.label - Accessible name of the field.
+ * @param {Object} props.input - Properties of the input element, except `type` and `placeholder`.
+ * @param {string} [props.placeholder] - Placeholder shown inside the field.
+ * @param {string} [props.helperText] - Text under the field.
+ * @param {string} [props.error] - Error under the field; marks the field invalid.
+ * @param {ExpSearchFieldAction} props.action - The action inside the field: `label`, `onClick`, `busy`, `busyLabel`, `disabled`.
+ *
+ * @returns {ReactNode} The search field, or a core `Input` and `Button` outside an `ExpScope`.
+ */
+export declare function ExpSearchField({ label, input, placeholder, helperText, error, action, }: ExpSearchFieldProps): ReactNode;
+//# sourceMappingURL=ExpSearchField.d.ts.map

package/expresivo/ExpSearchField/ExpSearchField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpSearchField.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpSearchField/ExpSearchField.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,KAAK,mBAAmB,EAExB,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAKf,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,qEAAqE;IACrE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,gCAAgC;IAChC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAChC,8EAA8E;IAC9E,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,IAAI,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC,CAAC;IAC3E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oEAAoE;IACpE,MAAM,EAAE,oBAAoB,CAAC;CAC9B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,KAAK,EACL,WAAW,EACX,UAAU,EACV,KAAK,EACL,MAAM,GACP,EAAE,mBAAmB,GAAG,SAAS,CA0GjC"}

package/expresivo/ExpSearchField/ExpSearchField.jsx

@@ -0,0 +1,81 @@
+'use client';
+import { Input, Paragraph } from '@clicoh/orion-library';
+import clsx from 'clsx';
+import { useId, } from 'react';
+import { FiSearch } from 'react-icons/fi';
+import { useExpScope } from '../ExpScope/ExpScope';
+import { ExpPillButton } from '../ExpPillButton/ExpPillButton';
+/**
+ * Search field drawn as a white pill with a soft relief, a lens on the left
+ * and its action inside, on the right. On hover it lifts with a lavender
+ * halo; on focus the ring turns lavender. Enter runs the action.
+ *
+ * Outside an `ExpScope` it falls back to the core `Input`, with a search
+ * icon, and a `Button` `second` next to it.
+ *
+ * @component
+ * @example
+ * <ExpSearchField
+ *   label="Ticket number"
+ *   placeholder="Search in Flow"
+ *   input={{ value, onChange: (event) => setValue(event.target.value) }}
+ *   action={{ label: 'Search', onClick: search, busy: isSearching }}
+ * />
+ *
+ * @param {ExpSearchFieldProps} props - The properties of the ExpSearchField component.
+ * @param {string} props.label - Accessible name of the field.
+ * @param {Object} props.input - Properties of the input element, except `type` and `placeholder`.
+ * @param {string} [props.placeholder] - Placeholder shown inside the field.
+ * @param {string} [props.helperText] - Text under the field.
+ * @param {string} [props.error] - Error under the field; marks the field invalid.
+ * @param {ExpSearchFieldAction} props.action - The action inside the field: `label`, `onClick`, `busy`, `busyLabel`, `disabled`.
+ *
+ * @returns {ReactNode} The search field, or a core `Input` and `Button` outside an `ExpScope`.
+ */
+export function ExpSearchField({ label, input, placeholder, helperText, error, action, }) {
+    const inScope = useExpScope();
+    const generatedId = useId();
+    const id = input.id ?? generatedId;
+    const descriptionId = error || helperText ? `${id}-description` : undefined;
+    const actionOff = !!action.disabled || !!action.busy;
+    const handleKeyDown = (event) => {
+        input.onKeyDown?.(event);
+        if (event.defaultPrevented || event.key !== 'Enter')
+            return;
+        event.preventDefault();
+        if (!actionOff)
+            action.onClick();
+    };
+    const button = (<ExpPillButton type="button" tone="soft" flush={inScope} busy={action.busy} busyLabel={action.busyLabel} disabled={action.disabled} onClick={action.onClick}>
+      {action.label}
+    </ExpPillButton>);
+    if (!inScope) {
+        return (<div className="flex items-start gap-3">
+        <div className="min-w-0 flex-1">
+          <Input label={label} hideLabel placeholder={placeholder} helperText={helperText} error={error} iconL={<FiSearch />} input={{ ...input, id, type: 'text', onKeyDown: handleKeyDown }}/>
+        </div>
+        {button}
+      </div>);
+    }
+    return (<div className="w-full max-w-[520px]">
+      <div data-state={input.disabled ? 'disabled' : 'idle'} data-invalid={error ? '' : undefined} className="exp-search flex h-11 overflow-hidden rounded-full">
+        <label className="flex min-w-0 flex-1 cursor-text items-center gap-3 pl-5">
+          <span className="sr-only">{label}</span>
+          <svg aria-hidden="true" width={22} height={22} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth={2.4} strokeLinecap="round" className="exp-search-lens shrink-0">
+            <circle cx={10.5} cy={10.5} r={6.5}/>
+            <path d="M15.5 15.5 21 21"/>
+          </svg>
+          <input {...input} id={id} type="text" placeholder={placeholder} aria-invalid={error ? true : input['aria-invalid']} aria-describedby={[input['aria-describedby'], descriptionId]
+            .filter(Boolean)
+            .join(' ') || undefined} onKeyDown={handleKeyDown} className={clsx('exp-search-input placeholder:text-gray-2 min-w-0 flex-1 bg-transparent text-base leading-6 outline-0 disabled:cursor-not-allowed', input.className)}/>
+        </label>
+        <span className="flex shrink-0">{button}</span>
+      </div>
+      {!!descriptionId && (<Paragraph id={descriptionId} size="body-2" className={clsx('pt-1.5 pl-5', error
+                ? 'text-error dark:text-error-dark'
+                : 'text-gray-1 dark:text-gray-2')}>
+          {error ?? helperText}
+        </Paragraph>)}
+    </div>);
+}
+//# sourceMappingURL=ExpSearchField.jsx.map

package/expresivo/ExpSearchField/ExpSearchField.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpSearchField.jsx","sourceRoot":"","sources":["../../src/expresivo/ExpSearchField/ExpSearchField.tsx"],"names":[],"mappings":"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"}

package/expresivo/ExpSearchField/index.d.ts

@@ -0,0 +1,3 @@
+export { ExpSearchField } from './ExpSearchField';
+export type { ExpSearchFieldAction, ExpSearchFieldProps, } from './ExpSearchField';
+//# sourceMappingURL=index.d.ts.map

package/expresivo/ExpSearchField/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpSearchField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,YAAY,EACV,oBAAoB,EACpB,mBAAmB,GACpB,MAAM,kBAAkB,CAAC"}

package/expresivo/ExpSearchField/index.js

@@ -0,0 +1,2 @@
+export { ExpSearchField } from './ExpSearchField';
+//# sourceMappingURL=index.js.map

package/expresivo/ExpSearchField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/expresivo/ExpSearchField/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC"}

package/expresivo/ExpStatIcon/ExpStatIcon.d.ts

@@ -0,0 +1,25 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+import { type ExpStatIconName } from './catalog';
+export type ExpStatIconProps = {
+    name: ExpStatIconName;
+    /** Width and height on screen, in pixels. */
+    size?: number;
+} & Omit<HTMLAttributes<HTMLSpanElement>, 'children'>;
+/**
+ * Colored line icon for the `icon` slot of the core `Stat`. Decorative:
+ * always `aria-hidden`, so the label of the stat carries the meaning.
+ *
+ * Outside an `ExpScope` it renders nothing, and the `Stat` goes without icon.
+ *
+ * @component
+ * @example
+ * <Stat label="Failures" value="1" tone="error" icon={<ExpStatIcon name="error" />} />
+ *
+ * @param {ExpStatIconProps} props - The properties of the ExpStatIcon component.
+ * @param {ExpStatIconName} props.name - Icon from the catalog.
+ * @param {number} [props.size=28] - Width and height on screen, in pixels.
+ *
+ * @returns {ReactNode} The icon, or nothing outside an `ExpScope`.
+ */
+export declare function ExpStatIcon({ name, size, ...restProps }: ExpStatIconProps): ReactNode;
+//# sourceMappingURL=ExpStatIcon.d.ts.map

package/expresivo/ExpStatIcon/ExpStatIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpStatIcon.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpStatIcon/ExpStatIcon.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,EAAE,KAAK,eAAe,EAAmB,MAAM,WAAW,CAAC;AAElE,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,eAAe,CAAC;IACtB,6CAA6C;IAC7C,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,GAAG,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC,CAAC;AAEtD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,IAAS,EACT,GAAG,SAAS,EACb,EAAE,gBAAgB,GAAG,SAAS,CAqB9B"}

package/expresivo/ExpStatIcon/ExpStatIcon.jsx

@@ -0,0 +1,29 @@
+'use client';
+import clsx from 'clsx';
+import { useExpScope } from '../ExpScope/ExpScope';
+import { statIconCatalog } from './catalog';
+/**
+ * Colored line icon for the `icon` slot of the core `Stat`. Decorative:
+ * always `aria-hidden`, so the label of the stat carries the meaning.
+ *
+ * Outside an `ExpScope` it renders nothing, and the `Stat` goes without icon.
+ *
+ * @component
+ * @example
+ * <Stat label="Failures" value="1" tone="error" icon={<ExpStatIcon name="error" />} />
+ *
+ * @param {ExpStatIconProps} props - The properties of the ExpStatIcon component.
+ * @param {ExpStatIconName} props.name - Icon from the catalog.
+ * @param {number} [props.size=28] - Width and height on screen, in pixels.
+ *
+ * @returns {ReactNode} The icon, or nothing outside an `ExpScope`.
+ */
+export function ExpStatIcon({ name, size = 28, ...restProps }) {
+    const inScope = useExpScope();
+    if (!inScope)
+        return null;
+    return (<span {...restProps} aria-hidden="true" className={clsx('inline-flex shrink-0', restProps.className)}>
+      <img src={statIconCatalog[name].src} alt="" width={size} height={size} draggable={false} className="block object-contain"/>
+    </span>);
+}
+//# sourceMappingURL=ExpStatIcon.jsx.map

package/expresivo/ExpStatIcon/ExpStatIcon.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpStatIcon.jsx","sourceRoot":"","sources":["../../src/expresivo/ExpStatIcon/ExpStatIcon.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EAAwB,eAAe,EAAE,MAAM,WAAW,CAAC;AAQlE;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,WAAW,CAAC,EAC1B,IAAI,EACJ,IAAI,GAAG,EAAE,EACT,GAAG,SAAS,EACK;IACjB,MAAM,OAAO,GAAG,WAAW,EAAE,CAAC;IAE9B,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAC;IAE1B,OAAO,CACL,CAAC,IAAI,CACH,IAAI,SAAS,CAAC,CACd,WAAW,CAAC,MAAM,CAClB,SAAS,CAAC,CAAC,IAAI,CAAC,sBAAsB,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,CAE7D;MAAA,CAAC,GAAG,CACF,GAAG,CAAC,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAC/B,GAAG,CAAC,EAAE,CACN,KAAK,CAAC,CAAC,IAAI,CAAC,CACZ,MAAM,CAAC,CAAC,IAAI,CAAC,CACb,SAAS,CAAC,CAAC,KAAK,CAAC,CACjB,SAAS,CAAC,sBAAsB,EAEpC;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC"}

package/expresivo/ExpStatIcon/catalog.d.ts

@@ -0,0 +1,6 @@
+import type { StaticImageData } from 'next/image';
+/** Stat icons, named after the drawing like their files. Which figure gets which one is the consumer's call. */
+export type ExpStatIconName = 'duda' | 'visto' | 'alerta' | 'error' | 'reloj' | 'monedas';
+/** PNGs 39px wide: sharp up to about 20px on high-density screens, and soft but legible at 28px. */
+export declare const statIconCatalog: Record<ExpStatIconName, StaticImageData>;
+//# sourceMappingURL=catalog.d.ts.map

package/expresivo/ExpStatIcon/catalog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpStatIcon/catalog.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAQlD,gHAAgH;AAChH,MAAM,MAAM,eAAe,GACvB,MAAM,GACN,OAAO,GACP,QAAQ,GACR,OAAO,GACP,OAAO,GACP,SAAS,CAAC;AAEd,oGAAoG;AACpG,eAAO,MAAM,eAAe,EAAE,MAAM,CAAC,eAAe,EAAE,eAAe,CAOpE,CAAC"}

package/expresivo/ExpStatIcon/catalog.js

@@ -0,0 +1,16 @@
+import alerta from '@clicoh/orion-library/assets/cifras/alerta.png';
+import duda from '@clicoh/orion-library/assets/cifras/duda.png';
+import error from '@clicoh/orion-library/assets/cifras/error.png';
+import monedas from '@clicoh/orion-library/assets/cifras/monedas.png';
+import reloj from '@clicoh/orion-library/assets/cifras/reloj.png';
+import visto from '@clicoh/orion-library/assets/cifras/visto.png';
+/** PNGs 39px wide: sharp up to about 20px on high-density screens, and soft but legible at 28px. */
+export const statIconCatalog = {
+    duda,
+    visto,
+    alerta,
+    error,
+    reloj,
+    monedas,
+};
+//# sourceMappingURL=catalog.js.map

package/expresivo/ExpStatIcon/catalog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"catalog.js","sourceRoot":"","sources":["../../src/expresivo/ExpStatIcon/catalog.ts"],"names":[],"mappings":"AACA,OAAO,MAAM,MAAM,gDAAgD,CAAC;AACpE,OAAO,IAAI,MAAM,8CAA8C,CAAC;AAChE,OAAO,KAAK,MAAM,+CAA+C,CAAC;AAClE,OAAO,OAAO,MAAM,iDAAiD,CAAC;AACtE,OAAO,KAAK,MAAM,+CAA+C,CAAC;AAClE,OAAO,KAAK,MAAM,+CAA+C,CAAC;AAWlE,oGAAoG;AACpG,MAAM,CAAC,MAAM,eAAe,GAA6C;IACvE,IAAI;IACJ,KAAK;IACL,MAAM;IACN,KAAK;IACL,KAAK;IACL,OAAO;CACR,CAAC"}

package/expresivo/ExpStatIcon/index.d.ts

@@ -0,0 +1,4 @@
+export { ExpStatIcon } from './ExpStatIcon';
+export type { ExpStatIconProps } from './ExpStatIcon';
+export type { ExpStatIconName } from './catalog';
+//# sourceMappingURL=index.d.ts.map

package/expresivo/ExpStatIcon/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpStatIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AACtD,YAAY,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC"}

package/expresivo/ExpStatIcon/index.js

@@ -0,0 +1,2 @@
+export { ExpStatIcon } from './ExpStatIcon';
+//# sourceMappingURL=index.js.map

package/expresivo/ExpStatIcon/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/expresivo/ExpStatIcon/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/expresivo/ExpStepBadge/ExpStepBadge.d.ts

@@ -0,0 +1,25 @@
+import type { HTMLAttributes, ReactNode } from 'react';
+export type ExpStepBadgeProps = {
+    /** Number of the step, usually 1 to 9. */
+    step: number;
+} & Omit<HTMLAttributes<HTMLSpanElement>, 'children'>;
+/**
+ * Tilted square with a step number, to put before the title of a numbered
+ * section. It is decorative: the title next to it carries the meaning.
+ *
+ * Outside an `ExpScope` it renders nothing, and the title stands alone.
+ *
+ * @component
+ * @example
+ * <div className="flex items-center gap-3">
+ *   <ExpStepBadge step={1} />
+ *   <Heading level="h6">Tell us what happened</Heading>
+ * </div>
+ *
+ * @param {ExpStepBadgeProps} props - The properties of the ExpStepBadge component.
+ * @param {number} props.step - Number of the step.
+ *
+ * @returns {ReactNode} The badge, or nothing outside an `ExpScope`.
+ */
+export declare function ExpStepBadge({ step, ...restProps }: ExpStepBadgeProps): ReactNode;
+//# sourceMappingURL=ExpStepBadge.d.ts.map

package/expresivo/ExpStepBadge/ExpStepBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExpStepBadge.d.ts","sourceRoot":"","sources":["../../src/expresivo/ExpStepBadge/ExpStepBadge.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,0CAA0C;IAC1C,IAAI,EAAE,MAAM,CAAC;CACd,GAAG,IAAI,CAAC,cAAc,CAAC,eAAe,CAAC,EAAE,UAAU,CAAC,CAAC;AAEtD;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,IAAI,EACJ,GAAG,SAAS,EACb,EAAE,iBAAiB,GAAG,SAAS,CAkB/B"}