@mieweb/ui 0.10.0-dev.1 → 0.10.0-dev.10

package/dist/components/Sheet/index.cjs

@@ -1,49 +1,49 @@
 'use strict';
 
-var chunkC3DUS2VE_cjs = require('../../chunk-C3DUS2VE.cjs');
-require('../../chunk-S5RVSXDV.cjs');
+var chunkRS5VA6QU_cjs = require('../../chunk-RS5VA6QU.cjs');
 require('../../chunk-NNEFAUHV.cjs');
 require('../../chunk-FHY3K6PL.cjs');
 require('../../chunk-SCV7C55E.cjs');
+require('../../chunk-S5RVSXDV.cjs');
 require('../../chunk-EUAMEVVI.cjs');
 
 
 
 Object.defineProperty(exports, "Sheet", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.Sheet; }
+  get: function () { return chunkRS5VA6QU_cjs.Sheet; }
 });
 Object.defineProperty(exports, "SheetBody", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.SheetBody; }
+  get: function () { return chunkRS5VA6QU_cjs.SheetBody; }
 });
 Object.defineProperty(exports, "SheetClose", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.SheetClose; }
+  get: function () { return chunkRS5VA6QU_cjs.SheetClose; }
 });
 Object.defineProperty(exports, "SheetDescription", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.SheetDescription; }
+  get: function () { return chunkRS5VA6QU_cjs.SheetDescription; }
 });
 Object.defineProperty(exports, "SheetFooter", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.SheetFooter; }
+  get: function () { return chunkRS5VA6QU_cjs.SheetFooter; }
 });
 Object.defineProperty(exports, "SheetHeader", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.SheetHeader; }
+  get: function () { return chunkRS5VA6QU_cjs.SheetHeader; }
 });
 Object.defineProperty(exports, "SheetTitle", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.SheetTitle; }
+  get: function () { return chunkRS5VA6QU_cjs.SheetTitle; }
 });
 Object.defineProperty(exports, "sheetContentVariants", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.sheetContentVariants; }
+  get: function () { return chunkRS5VA6QU_cjs.sheetContentVariants; }
 });
 Object.defineProperty(exports, "sheetOverlayVariants", {
   enumerable: true,
-  get: function () { return chunkC3DUS2VE_cjs.sheetOverlayVariants; }
+  get: function () { return chunkRS5VA6QU_cjs.sheetOverlayVariants; }
 });
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/components/Sheet/index.js

@@ -1,8 +1,8 @@
-export { Sheet, SheetBody, SheetClose, SheetDescription, SheetFooter, SheetHeader, SheetTitle, sheetContentVariants, sheetOverlayVariants } from '../../chunk-ON4JULCA.js';
-import '../../chunk-TQONQSJO.js';
+export { Sheet, SheetBody, SheetClose, SheetDescription, SheetFooter, SheetHeader, SheetTitle, sheetContentVariants, sheetOverlayVariants } from '../../chunk-LMBXJZLG.js';
 import '../../chunk-4SMSH4OY.js';
 import '../../chunk-T4ME7QCT.js';
 import '../../chunk-VSQF22GL.js';
+import '../../chunk-TQONQSJO.js';
 import '../../chunk-PX6F3LHL.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/components/SliderCalculator/index.cjs

@@ -0,0 +1,20 @@
+'use strict';
+
+var chunkMWVW4APN_cjs = require('../../chunk-MWVW4APN.cjs');
+require('../../chunk-MYAU2ZUC.cjs');
+require('../../chunk-6HFFWEM3.cjs');
+require('../../chunk-S5RVSXDV.cjs');
+require('../../chunk-EUAMEVVI.cjs');
+
+
+
+Object.defineProperty(exports, "AnimatedNumber", {
+  enumerable: true,
+  get: function () { return chunkMWVW4APN_cjs.AnimatedNumber; }
+});
+Object.defineProperty(exports, "SliderCalculator", {
+  enumerable: true,
+  get: function () { return chunkMWVW4APN_cjs.SliderCalculator; }
+});
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/components/SliderCalculator/index.cjs.map

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

package/dist/components/SliderCalculator/index.d.cts

@@ -0,0 +1,100 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+type CalculatorFormat = 'number' | 'currency' | 'compactCurrency' | 'percent' | 'hours' | ((value: number) => string);
+interface CalculatorInput {
+    /** Key in the values object passed to `compute`. */
+    id: string;
+    label: string;
+    min: number;
+    max: number;
+    step?: number;
+    /** Starting value. */
+    defaultValue: number;
+    /** How the current value renders next to the label. Default `number`. */
+    format?: CalculatorFormat;
+    description?: string;
+}
+interface CalculatorBreakdown {
+    label: string;
+    value: number;
+}
+interface CalculatorMathRow {
+    label: string;
+    value: string;
+}
+interface CalculatorResult {
+    /** The headline number. */
+    total: number;
+    /** One-line context under the headline, e.g. "42% of today's spend · 1,200 hours returned". */
+    summary?: string;
+    /** Horizontal bars showing what makes up `total`. */
+    breakdown?: CalculatorBreakdown[];
+    /** Rows revealed by "Show the math". */
+    math?: CalculatorMathRow[];
+    /** Free-text assumptions listed under the math. */
+    assumptions?: string[];
+}
+interface SliderCalculatorProps {
+    inputs: CalculatorInput[];
+    /** Pure function from current values to a result. Runs on every change. */
+    compute: (values: Record<string, number>) => CalculatorResult;
+    /** Copy for the controls column. */
+    eyebrow?: string;
+    heading?: string;
+    description?: string;
+    headingLevel?: 'h2' | 'h3';
+    /** Label above the headline number. Default "Estimated annual value". */
+    resultLabel?: string;
+    /** Format for the headline. Default `compactCurrency`. */
+    resultFormat?: CalculatorFormat;
+    /** Format for breakdown values. Default `currency`. */
+    breakdownFormat?: CalculatorFormat;
+    /** Actions under the result (Buttons, links). */
+    actions?: React.ReactNode;
+    /** Small print under the actions. */
+    footnote?: string;
+    /** Labels for the math toggle. */
+    mathLabels?: {
+        show?: string;
+        hide?: string;
+    };
+    /** Currency for the built-in formatters. Default `USD`. */
+    currency?: string;
+    locale?: string;
+    /** Fires with the latest values and result on every change. */
+    onChange?: (values: Record<string, number>, result: CalculatorResult) => void;
+    className?: string;
+}
+interface AnimatedNumberProps {
+    value: number;
+    format?: (v: number) => string;
+    /** Tween length in ms. Default 480. */
+    duration?: number;
+    className?: string;
+}
+/** Tweens between numeric values with an ease-out; snaps under reduced motion. */
+declare function AnimatedNumber({ value, format, duration, className, }: AnimatedNumberProps): react_jsx_runtime.JSX.Element;
+/**
+ * A two-column interactive calculator: labelled sliders on the left, a live
+ * result panel on the right with an animated headline number, a one-line
+ * summary, proportional breakdown bars, a "Show the math" disclosure and an
+ * actions slot. Bring your own `compute` — the component owns only the
+ * interaction. Ported from the Enterprise Health ROI calculator.
+ *
+ * @example
+ * ```tsx
+ * <SliderCalculator
+ *   heading="What is consolidation worth?"
+ *   inputs={[
+ *     { id: 'people', label: 'People covered', min: 500, max: 60000, step: 500, defaultValue: 8000 },
+ *     { id: 'cost', label: 'Cost per exam', min: 20, max: 400, step: 5, defaultValue: 120, format: 'currency' },
+ *   ]}
+ *   compute={({ people, cost }) => ({ total: people * cost * 0.18 })}
+ *   actions={<Button effect="sheen">Request a demo</Button>}
+ * />
+ * ```
+ */
+declare function SliderCalculator({ inputs, compute, eyebrow, heading, description, headingLevel: Heading, resultLabel, resultFormat, breakdownFormat, actions, footnote, mathLabels, currency, locale, onChange, className, }: SliderCalculatorProps): react_jsx_runtime.JSX.Element;
+
+export { AnimatedNumber, type AnimatedNumberProps, type CalculatorBreakdown, type CalculatorFormat, type CalculatorInput, type CalculatorMathRow, type CalculatorResult, SliderCalculator, type SliderCalculatorProps };

package/dist/components/SliderCalculator/index.d.ts

@@ -0,0 +1,100 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+type CalculatorFormat = 'number' | 'currency' | 'compactCurrency' | 'percent' | 'hours' | ((value: number) => string);
+interface CalculatorInput {
+    /** Key in the values object passed to `compute`. */
+    id: string;
+    label: string;
+    min: number;
+    max: number;
+    step?: number;
+    /** Starting value. */
+    defaultValue: number;
+    /** How the current value renders next to the label. Default `number`. */
+    format?: CalculatorFormat;
+    description?: string;
+}
+interface CalculatorBreakdown {
+    label: string;
+    value: number;
+}
+interface CalculatorMathRow {
+    label: string;
+    value: string;
+}
+interface CalculatorResult {
+    /** The headline number. */
+    total: number;
+    /** One-line context under the headline, e.g. "42% of today's spend · 1,200 hours returned". */
+    summary?: string;
+    /** Horizontal bars showing what makes up `total`. */
+    breakdown?: CalculatorBreakdown[];
+    /** Rows revealed by "Show the math". */
+    math?: CalculatorMathRow[];
+    /** Free-text assumptions listed under the math. */
+    assumptions?: string[];
+}
+interface SliderCalculatorProps {
+    inputs: CalculatorInput[];
+    /** Pure function from current values to a result. Runs on every change. */
+    compute: (values: Record<string, number>) => CalculatorResult;
+    /** Copy for the controls column. */
+    eyebrow?: string;
+    heading?: string;
+    description?: string;
+    headingLevel?: 'h2' | 'h3';
+    /** Label above the headline number. Default "Estimated annual value". */
+    resultLabel?: string;
+    /** Format for the headline. Default `compactCurrency`. */
+    resultFormat?: CalculatorFormat;
+    /** Format for breakdown values. Default `currency`. */
+    breakdownFormat?: CalculatorFormat;
+    /** Actions under the result (Buttons, links). */
+    actions?: React.ReactNode;
+    /** Small print under the actions. */
+    footnote?: string;
+    /** Labels for the math toggle. */
+    mathLabels?: {
+        show?: string;
+        hide?: string;
+    };
+    /** Currency for the built-in formatters. Default `USD`. */
+    currency?: string;
+    locale?: string;
+    /** Fires with the latest values and result on every change. */
+    onChange?: (values: Record<string, number>, result: CalculatorResult) => void;
+    className?: string;
+}
+interface AnimatedNumberProps {
+    value: number;
+    format?: (v: number) => string;
+    /** Tween length in ms. Default 480. */
+    duration?: number;
+    className?: string;
+}
+/** Tweens between numeric values with an ease-out; snaps under reduced motion. */
+declare function AnimatedNumber({ value, format, duration, className, }: AnimatedNumberProps): react_jsx_runtime.JSX.Element;
+/**
+ * A two-column interactive calculator: labelled sliders on the left, a live
+ * result panel on the right with an animated headline number, a one-line
+ * summary, proportional breakdown bars, a "Show the math" disclosure and an
+ * actions slot. Bring your own `compute` — the component owns only the
+ * interaction. Ported from the Enterprise Health ROI calculator.
+ *
+ * @example
+ * ```tsx
+ * <SliderCalculator
+ *   heading="What is consolidation worth?"
+ *   inputs={[
+ *     { id: 'people', label: 'People covered', min: 500, max: 60000, step: 500, defaultValue: 8000 },
+ *     { id: 'cost', label: 'Cost per exam', min: 20, max: 400, step: 5, defaultValue: 120, format: 'currency' },
+ *   ]}
+ *   compute={({ people, cost }) => ({ total: people * cost * 0.18 })}
+ *   actions={<Button effect="sheen">Request a demo</Button>}
+ * />
+ * ```
+ */
+declare function SliderCalculator({ inputs, compute, eyebrow, heading, description, headingLevel: Heading, resultLabel, resultFormat, breakdownFormat, actions, footnote, mathLabels, currency, locale, onChange, className, }: SliderCalculatorProps): react_jsx_runtime.JSX.Element;
+
+export { AnimatedNumber, type AnimatedNumberProps, type CalculatorBreakdown, type CalculatorFormat, type CalculatorInput, type CalculatorMathRow, type CalculatorResult, SliderCalculator, type SliderCalculatorProps };

package/dist/components/SliderCalculator/index.js

@@ -0,0 +1,7 @@
+export { AnimatedNumber, SliderCalculator } from '../../chunk-PYJDVWXM.js';
+import '../../chunk-2BPIVWAK.js';
+import '../../chunk-HB7C7NB5.js';
+import '../../chunk-TQONQSJO.js';
+import '../../chunk-PX6F3LHL.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/SliderCalculator/index.js.map

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

package/dist/components/SourceTip/index.cjs

@@ -1,16 +1,16 @@
 'use strict';
 
-var chunkXTHMC76F_cjs = require('../../chunk-XTHMC76F.cjs');
-require('../../chunk-S5RVSXDV.cjs');
-require('../../chunk-FHY3K6PL.cjs');
+var chunk2G75X6TS_cjs = require('../../chunk-2G75X6TS.cjs');
 require('../../chunk-AOHJILLU.cjs');
+require('../../chunk-FHY3K6PL.cjs');
+require('../../chunk-S5RVSXDV.cjs');
 require('../../chunk-EUAMEVVI.cjs');
 
 
 
 Object.defineProperty(exports, "SourceTip", {
   enumerable: true,
-  get: function () { return chunkXTHMC76F_cjs.SourceTip; }
+  get: function () { return chunk2G75X6TS_cjs.SourceTip; }
 });
 //# sourceMappingURL=index.cjs.map
 //# sourceMappingURL=index.cjs.map

package/dist/components/SourceTip/index.js

@@ -1,7 +1,7 @@
-export { SourceTip } from '../../chunk-PHK4XBO5.js';
-import '../../chunk-TQONQSJO.js';
-import '../../chunk-T4ME7QCT.js';
+export { SourceTip } from '../../chunk-Z5V7SAZ4.js';
 import '../../chunk-WSNMQQ4P.js';
+import '../../chunk-T4ME7QCT.js';
+import '../../chunk-TQONQSJO.js';
 import '../../chunk-PX6F3LHL.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map