asma-ui-core 3.49.0 → 3.49.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,8 @@
1
- import { resolveSx as x } from "../../../helpers/sx.js";
2
- import b from "clsx";
3
- import { createElement as y } from "react";
4
- var k = {
1
+ import { resolveSx as u } from "../../../helpers/sx.js";
2
+ import t from "./StyledTypography.module.js";
3
+ import f from "clsx";
4
+ import { createElement as g } from "react";
5
+ var x = {
5
6
  h1: "h1",
6
7
  h2: "h2",
7
8
  h3: "h3",
@@ -13,22 +14,22 @@ var k = {
13
14
  body1: "p",
14
15
  body2: "p",
15
16
  inherit: "p"
16
- }, u = {
17
- h1: "text-[6rem] font-light leading-[1.167] tracking-[-0.01562em]",
18
- h2: "text-[3.75rem] font-light leading-[1.2] tracking-[-0.00833em]",
19
- h3: "text-[3rem] font-normal leading-[1.167] tracking-normal",
20
- h4: "text-[2.125rem] font-normal leading-[1.235] tracking-[0.00735em]",
21
- h5: "text-[1.5rem] font-normal leading-[1.334] tracking-normal",
22
- h6: "text-[1.25rem] font-medium leading-[1.6] tracking-[0.0075em]",
23
- subtitle1: "text-[1rem] font-normal leading-[1.75] tracking-[0.00938em]",
24
- subtitle2: "text-[0.875rem] font-medium leading-[1.57] tracking-[0.00714em]",
25
- body1: "text-[1rem] font-normal leading-[1.5] tracking-[0.00938em]",
26
- body2: "text-[0.875rem] font-normal leading-[1.43] tracking-[0.01071em]",
27
- button: "text-[0.875rem] font-medium leading-[1.75] tracking-[0.02857em] uppercase",
28
- caption: "text-[0.75rem] font-normal leading-[1.66] tracking-[0.03333em]",
29
- overline: "text-[0.75rem] font-normal leading-[2.66] tracking-[0.08333em] uppercase",
30
- inherit: "text-inherit font-[inherit] leading-[inherit] tracking-[inherit]"
31
- }, v = {
17
+ }, A = {
18
+ h1: t["variant-h1"],
19
+ h2: t["variant-h2"],
20
+ h3: t["variant-h3"],
21
+ h4: t["variant-h4"],
22
+ h5: t["variant-h5"],
23
+ h6: t["variant-h6"],
24
+ subtitle1: t["variant-subtitle1"],
25
+ subtitle2: t["variant-subtitle2"],
26
+ body1: t["variant-body1"],
27
+ body2: t["variant-body2"],
28
+ button: t["variant-button"],
29
+ caption: t["variant-caption"],
30
+ overline: t["variant-overline"],
31
+ inherit: t["variant-inherit"]
32
+ }, S = {
32
33
  inherit: "inherit",
33
34
  initial: "initial",
34
35
  "text.primary": "rgba(0, 0, 0, 0.87)",
@@ -46,19 +47,19 @@ var k = {
46
47
  "info.main": "#0288d1",
47
48
  success: "#2e7d32",
48
49
  "success.main": "#2e7d32"
49
- }, C = (i) => {
50
- const { variant: e = "body1", variantMapping: a, align: n, noWrap: o, gutterBottom: m, color: t, component: l, className: d, sx: c, style: g, classes: A, children: s, ...h } = i, f = l ?? a?.[e] ?? k[e] ?? "span", r = t ? v[t] ?? t : void 0, p = {
51
- ...n ? { textAlign: n } : {},
52
- ...r ? { color: r } : {},
53
- ...x(c),
54
- ...g
50
+ }, I = (n) => {
51
+ const { variant: r = "body1", variantMapping: o, align: i, noWrap: s, gutterBottom: h, color: a, component: l, className: d, sx: c, style: m, classes: w, children: v, ...p } = n, b = l ?? o?.[r] ?? x[r] ?? "span", e = a ? S[a] ?? a : void 0, y = {
52
+ ...i ? { textAlign: i } : {},
53
+ ...e ? { color: e } : {},
54
+ ...u(c),
55
+ ...m
55
56
  };
56
- return y(f, {
57
- className: b("m-0 font-roboto", u[e], o && "overflow-hidden text-ellipsis whitespace-nowrap", m && "mb-[0.35em]", d),
58
- style: p,
59
- ...h
60
- }, s);
57
+ return g(b, {
58
+ className: f(t.root, A[r], s && "overflow-hidden text-ellipsis whitespace-nowrap", h && "mb-[0.35em]", d),
59
+ style: y,
60
+ ...p
61
+ }, v);
61
62
  };
62
63
  export {
63
- C as StyledTypography
64
+ I as StyledTypography
64
65
  };
@@ -0,0 +1,20 @@
1
+ var a = "_root_150zr_1", r = {
2
+ root: a,
3
+ "variant-h1": "_variant-h1_150zr_6",
4
+ "variant-h2": "_variant-h2_150zr_13",
5
+ "variant-h3": "_variant-h3_150zr_20",
6
+ "variant-h4": "_variant-h4_150zr_27",
7
+ "variant-h5": "_variant-h5_150zr_34",
8
+ "variant-h6": "_variant-h6_150zr_41",
9
+ "variant-subtitle1": "_variant-subtitle1_150zr_48",
10
+ "variant-subtitle2": "_variant-subtitle2_150zr_55",
11
+ "variant-body1": "_variant-body1_150zr_62",
12
+ "variant-body2": "_variant-body2_150zr_69",
13
+ "variant-button": "_variant-button_150zr_76",
14
+ "variant-caption": "_variant-caption_150zr_84",
15
+ "variant-overline": "_variant-overline_150zr_91",
16
+ "variant-inherit": "_variant-inherit_150zr_99"
17
+ };
18
+ export {
19
+ r as default
20
+ };
@@ -1,8 +1,34 @@
1
1
  import { cn as a } from "../../helpers/cn.js";
2
- var l = ({ focused: e, error: r, disabled: t, readOnly: o }) => a("pointer-events-none absolute inset-0 rounded border border-solid transition-colors", t ? "border-delta-300" : o ? "border-delta-200" : r ? a("border-error-500", e && "border-2") : e ? "border-2 border-gama-400" : "border-delta-500 group-hover:border-2 group-hover:border-gama-300"), i = ({ focused: e, error: r, disabled: t, readOnly: o, notched: d = !0 }) => a("pointer-events-none absolute z-0 m-0 box-border min-w-0 overflow-hidden rounded border border-solid transition-colors", d ? "inset-x-0 bottom-0 top-[-5px] px-2 py-0" : "inset-0", t ? "border-delta-300" : o ? "border-delta-200" : r ? "border-error-500" : e ? "border-2 border-gama-400" : "border-delta-500 group-hover:border-2 group-hover:border-gama-300"), b = (e) => a("invisible block h-[11px] overflow-hidden p-0 text-xs leading-[23px] transition-[max-width] duration-150", e ? "max-w-full" : "max-w-[0.01px]"), s = ({ shrink: e, focused: r, error: t, disabled: o, readOnly: d }) => a("pointer-events-none absolute left-[14px] z-10 max-w-[calc(100%-1.75rem)] truncate transition-all duration-150", o ? "text-delta-300" : d ? "text-delta-800" : t ? "text-error-500" : r ? "text-gama-500" : e ? "text-delta-800" : "text-delta-500", e ? "top-0 -translate-y-1/2 bg-white px-1 text-xs leading-[16px] tracking-[0.24px]" : "top-1/2 -translate-y-1/2 text-base leading-[23px] tracking-[0.00938em]");
2
+ var d = () => ({
3
+ boxSizing: "border-box",
4
+ height: 40,
5
+ minHeight: 40,
6
+ maxHeight: 40
7
+ }), l = ({ paddingLeft: e = 14, paddingRight: r = 14 } = {}) => ({
8
+ boxSizing: "border-box",
9
+ margin: 0,
10
+ paddingTop: 0,
11
+ paddingBottom: 0,
12
+ paddingLeft: e,
13
+ paddingRight: r,
14
+ height: 40,
15
+ minHeight: 40,
16
+ maxHeight: 40,
17
+ lineHeight: "24px",
18
+ fontSize: 16
19
+ }), b = (e) => e ? {
20
+ top: 0,
21
+ transform: "translateY(-50%)"
22
+ } : {
23
+ top: "50%",
24
+ transform: "translateY(-50%)"
25
+ }, x = ({ focused: e, error: r, disabled: t, readOnly: o }) => a("pointer-events-none absolute inset-0 rounded border border-solid transition-colors", t ? "border-delta-300" : o ? "border-delta-200" : r ? a("border-error-500", e && "border-2") : e ? "border-2 border-gama-400" : "border-delta-500 group-hover:border-2 group-hover:border-gama-300"), s = ({ focused: e, error: r, disabled: t, readOnly: o, notched: n = !0 }) => a("pointer-events-none absolute z-0 m-0 box-border min-w-0 overflow-hidden rounded border border-solid transition-colors", n ? "inset-x-0 bottom-0 top-[-5px] px-2 py-0" : "inset-0", t ? "border-delta-300" : o ? "border-delta-200" : r ? "border-error-500" : e ? "border-2 border-gama-400" : "border-delta-500 group-hover:border-2 group-hover:border-gama-300"), g = (e) => a("invisible block h-[11px] overflow-hidden p-0 text-xs leading-[23px] transition-[max-width] duration-150", e ? "max-w-full" : "max-w-[0.01px]"), p = ({ shrink: e, focused: r, error: t, disabled: o, readOnly: n }) => a("pointer-events-none absolute left-[14px] z-10 max-w-[calc(100%-1.75rem)] truncate transition-colors duration-150", o ? "text-delta-300" : n ? "text-delta-800" : t ? "text-error-500" : r ? "text-gama-500" : e ? "text-delta-800" : "text-delta-500", e ? "bg-white px-1 text-xs leading-[16px] tracking-[0.24px]" : "text-base leading-[23px] tracking-[0.00938em]");
3
26
  export {
4
- s as floatingLabelClass,
5
- b as notchedLegendClass,
6
- i as notchedOutlineClass,
7
- l as outlineClass
27
+ p as floatingLabelClass,
28
+ b as floatingLabelLayoutStyle,
29
+ g as notchedLegendClass,
30
+ s as notchedOutlineClass,
31
+ x as outlineClass,
32
+ l as singleLineInputLayoutStyle,
33
+ d as singleLineShellLayoutStyle
8
34
  };
@@ -1,195 +1,193 @@
1
1
  import { cn as l } from "../../../helpers/cn.js";
2
- import { resolveSx as M } from "../../../helpers/sx.js";
2
+ import { resolveSx as F } from "../../../helpers/sx.js";
3
3
  import { CloseIcon as $e } from "../../icons/close-icon/CloseIcon.js";
4
- import { ErrorOutlineIcon as ze } from "../../icons/error-outline-icon/ErrorOutlineIcon.js";
5
- import { floatingLabelClass as _e, notchedLegendClass as je, notchedOutlineClass as X } from "../field-styles.js";
6
- import x from "./StyledInputField.module.js";
7
- import { Children as Te, useCallback as Ke, useId as Ue, useLayoutEffect as Z, useRef as q, useState as k } from "react";
8
- import { jsx as o, jsxs as h } from "react/jsx-runtime";
9
- import { useMergeRefs as P } from "@floating-ui/react";
10
- var et = ({ dataTest: u, label: a, value: p, defaultValue: b, onChange: O, onBlur: ee, onFocus: te, error: i, helperText: v, disabled: s, readOnly: n, required: H, allowClear: ne, onClear: oe, type: ie = "text", placeholder: ae, name: le, id: se, autoComplete: re, autoFocus: de, multiline: r, rows: A, minRows: N, maxRows: C, size: ce = "medium", fullWidth: me, className: he, style: ue, sx: pe, inputRef: fe, slotProps: t, InputProps: B, onKeyDown: D, onClick: ge, variant: Ve }) => {
11
- const xe = Ue(), $ = se ?? xe, z = `${$}-helper-text`, _ = q(null), j = q(null), [T, be] = k(void 0), [I, K] = k(!1), [ve, U] = k(b != null && b !== ""), L = p !== void 0, V = L ? p !== "" && p != null : ve, Ne = !!s || !!n, w = t?.input?.startAdornment ?? B?.startAdornment, y = Te.count(w) > 0, d = y && Array.isArray(w), S = t?.input?.endAdornment ?? B?.endAdornment, W = !!(ne && V && !Ne), { ref: Ie, ...c } = t?.htmlInput ?? {}, ye = fe ?? Ie, { className: Se, style: F, ref: He } = t?.input ?? {}, Ae = P([He]), Ce = t?.input?.onMouseDown, R = I || V || y, Le = (e) => {
12
- n || (L || U(e.target.value !== ""), O?.(e));
13
- }, we = (e) => {
14
- !s && !n && K(!0), te?.(e);
15
- }, Fe = (e) => {
16
- !s && !n && K(!1), ee?.(e);
4
+ import { ErrorOutlineIcon as je } from "../../icons/error-outline-icon/ErrorOutlineIcon.js";
5
+ import { floatingLabelClass as ze, floatingLabelLayoutStyle as Ke, notchedLegendClass as Ue, notchedOutlineClass as J, singleLineInputLayoutStyle as Ve, singleLineShellLayoutStyle as We } from "../field-styles.js";
6
+ import y from "./StyledInputField.module.js";
7
+ import { Children as Ye, useCallback as Ge, useId as Je, useLayoutEffect as Q, useRef as X, useState as E } from "react";
8
+ import { jsx as i, jsxs as m } from "react/jsx-runtime";
9
+ import { useMergeRefs as Z } from "@floating-ui/react";
10
+ var bt = ({ dataTest: p, label: a, value: u, defaultValue: S, onChange: q, onBlur: O, onFocus: ee, error: o, helperText: L, disabled: s, readOnly: n, required: v, allowClear: te, onClear: ne, type: ie = "text", placeholder: oe, name: ae, id: le, autoComplete: se, autoFocus: de, multiline: d, rows: A, minRows: I, maxRows: C, size: re = "medium", fullWidth: ce, className: he, style: me, sx: pe, inputRef: ue, slotProps: t, InputProps: k, onKeyDown: D, onClick: ge, variant: Qe }) => {
11
+ const fe = Je(), T = le ?? fe, P = `${T}-helper-text`, $ = X(null), j = X(null), [xe, be] = E(void 0), [H, z] = E(!1), [ye, K] = E(S != null && S !== ""), _ = u !== void 0, U = _ ? u !== "" && u != null : ye, Se = !!s || !!n, R = t?.input?.startAdornment ?? k?.startAdornment, g = Ye.count(R) > 0, r = g && Array.isArray(R), f = t?.input?.endAdornment ?? k?.endAdornment, w = !!(te && U && !Se), { ref: Le, ...c } = t?.htmlInput ?? {}, Ie = ue ?? Le, { className: He, style: M, ref: Ne } = t?.input ?? {}, ve = Z([Ne]), Ae = t?.input?.onMouseDown, N = H || U || g, Ce = (e) => {
12
+ n || (_ || K(e.target.value !== ""), q?.(e));
13
+ }, _e = (e) => {
14
+ !s && !n && z(!0), ee?.(e);
15
+ }, Re = (e) => {
16
+ !s && !n && z(!1), O?.(e);
17
17
  };
18
- Z(() => {
19
- const e = _.current;
20
- if (!r || A != null || !e) return;
18
+ Q(() => {
19
+ const e = $.current;
20
+ if (!d || A != null || !e) return;
21
21
  e.style.height = "auto";
22
- const m = getComputedStyle(e), g = Number.parseFloat(m.lineHeight) || 24, Q = Number.parseFloat(m.paddingTop) + Number.parseFloat(m.paddingBottom), Be = N ? N * g + Q : 0, De = C ? C * g + Q : Number.POSITIVE_INFINITY;
23
- e.style.height = `${Math.min(De, Math.max(Be, e.scrollHeight))}px`;
22
+ const h = getComputedStyle(e), b = Number.parseFloat(h.lineHeight) || 24, G = Number.parseFloat(h.paddingTop) + Number.parseFloat(h.paddingBottom), Te = I ? I * b + G : 0, Pe = C ? C * b + G : Number.POSITIVE_INFINITY;
23
+ e.style.height = `${Math.min(Pe, Math.max(Te, e.scrollHeight))}px`;
24
24
  }, [
25
- b,
25
+ S,
26
26
  C,
27
- N,
28
- r,
27
+ I,
28
+ d,
29
29
  A,
30
- p
30
+ u
31
31
  ]);
32
- const Y = P([ye, Ke((e) => {
33
- _.current = e instanceof HTMLTextAreaElement ? e : null;
34
- }, [])]), { style: E, ...Re } = c, f = !r && !d, Ee = f ? {
32
+ const V = Z([Ie, Ge((e) => {
33
+ $.current = e instanceof HTMLTextAreaElement ? e : null;
34
+ }, [])]), { style: B, ...we } = c, x = !d && !r, { height: Xe, minHeight: Ze, maxHeight: qe, paddingTop: Oe, paddingBottom: et, ...Me } = M ?? {}, Be = x ? {
35
+ ...Me,
36
+ ...We()
37
+ } : r ? {
35
38
  boxSizing: "border-box",
36
- height: 40,
37
39
  minHeight: 40,
38
- maxHeight: 40,
39
- ...F
40
- } : d ? {
41
- boxSizing: "border-box",
42
- minHeight: 40,
43
- ...F
44
- } : F, Me = f ? {
45
- ...E,
46
- height: void 0,
47
- minHeight: void 0,
48
- maxHeight: void 0,
49
- ...T != null ? { paddingRight: T } : {}
50
- } : E;
51
- Z(() => {
52
- if (!f) return;
53
- const e = j.current, m = e ? Math.ceil(e.getBoundingClientRect().width) + 20 : void 0;
54
- be((g) => g === m ? g : m);
40
+ ...M
41
+ } : M, { height: tt, minHeight: nt, maxHeight: it, paddingTop: ot, paddingBottom: at, paddingLeft: lt, paddingRight: Fe, ...Ee } = B ?? {}, ke = x ? {
42
+ ...Ee,
43
+ ...Ve({
44
+ paddingLeft: g ? 40 : 14,
45
+ paddingRight: Fe ?? xe ?? (w || f ? 40 : 14)
46
+ })
47
+ } : B;
48
+ Q(() => {
49
+ if (!x) return;
50
+ const e = j.current, h = e ? Math.ceil(e.getBoundingClientRect().width) + 20 : void 0;
51
+ be((b) => b === h ? b : h);
55
52
  });
56
- const G = {
57
- ...Re,
58
- style: f ? Me : E,
59
- name: le,
60
- placeholder: R || !a ? ae : void 0,
53
+ const W = {
54
+ ...we,
55
+ style: x ? ke : B,
56
+ name: ae,
57
+ placeholder: N || !a ? oe : void 0,
61
58
  disabled: s,
62
59
  readOnly: n,
63
- required: H,
64
- autoComplete: re,
60
+ required: v,
61
+ autoComplete: se,
65
62
  autoFocus: de,
66
- value: p,
67
- defaultValue: b,
68
- "aria-invalid": i ? !0 : void 0,
63
+ value: u,
64
+ defaultValue: S,
65
+ "aria-invalid": o ? !0 : void 0,
69
66
  "aria-label": c["aria-label"] ?? (c["aria-labelledby"] ? void 0 : typeof a == "string" && a !== "" ? a : void 0),
70
- "aria-describedby": !n && (v != null || i) ? z : c["aria-describedby"],
71
- onChange: Le,
72
- onFocus: we,
73
- onBlur: Fe,
67
+ "aria-describedby": !n && (L != null || o) ? P : c["aria-describedby"],
68
+ onChange: Ce,
69
+ onFocus: _e,
70
+ onBlur: Re,
74
71
  onKeyDown: c.onKeyDown || D ? (e) => {
75
72
  D?.(e), e.defaultPrevented || c.onKeyDown?.(e);
76
73
  } : void 0
77
- }, J = l(x.Input, "peer border-0 bg-transparent text-base tracking-[0.00938em] text-delta-800 outline-none placeholder:text-delta-500", d ? "box-border h-8 min-w-[60px] flex-1 py-0 pl-0 pr-0 leading-[23px]" : r ? "w-full resize-none overflow-hidden p-0 pl-0 pr-0 leading-[23px]" : l("w-full", x["Input--singleLine"]), "disabled:text-delta-300", n && "text-delta-800", Se), ke = !r && !d ? {
78
- "data-start-adornment": y ? "true" : void 0,
79
- "data-end-adornment": W || S ? "true" : void 0
74
+ }, Y = l(y.Input, "peer border-0 bg-transparent text-base tracking-[0.00938em] text-delta-800 outline-none placeholder:text-delta-500", r ? "box-border h-8 min-w-[60px] flex-1 py-0 pl-0 pr-0 leading-[23px]" : d ? "w-full resize-none overflow-hidden p-0 pl-0 pr-0 leading-[23px]" : l("w-full", y["Input--singleLine"]), "disabled:text-delta-300", n && "text-delta-800", He), De = !d && !r ? {
75
+ "data-start-adornment": g ? "true" : void 0,
76
+ "data-end-adornment": w || f ? "true" : void 0
80
77
  } : {};
81
- return /* @__PURE__ */ h("div", {
78
+ return /* @__PURE__ */ m("div", {
82
79
  className: l("group relative inline-flex flex-col", he),
83
80
  onClick: ge,
84
81
  style: {
85
- width: me ? "100%" : 235,
82
+ width: ce ? "100%" : 235,
86
83
  fontFamily: "Roboto, Helvetica, Arial, sans-serif",
87
84
  letterSpacing: "0.00938em",
88
- ...M(pe),
89
- ...ue
85
+ ...F(pe),
86
+ ...me
90
87
  },
91
- children: [/* @__PURE__ */ h("div", {
88
+ children: [/* @__PURE__ */ m("div", {
92
89
  className: "relative overflow-visible",
93
- children: [/* @__PURE__ */ h("div", {
94
- className: l("relative flex", f && x.InputShell, r && "box-border items-center px-[14px] py-[16.5px]", d && l(x.AdornmentList, S && x["AdornmentList--endAdornment"]), n && "rounded bg-delta-50"),
95
- ref: Ae,
96
- onMouseDown: Ce,
97
- style: Ee,
98
- "data-testid": d ? `${u}-adornment-list` : `${u}-shell`,
90
+ children: [/* @__PURE__ */ m("div", {
91
+ className: l("relative flex", x && y.InputShell, d && "box-border items-center px-[14px] py-[16.5px]", r && l(y.AdornmentList, f && y["AdornmentList--endAdornment"]), n && "rounded bg-delta-50"),
92
+ ref: ve,
93
+ onMouseDown: Ae,
94
+ style: Be,
95
+ "data-testid": r ? `${p}-adornment-list` : `${p}-shell`,
99
96
  children: [
100
- y && /* @__PURE__ */ o("span", {
101
- className: l("items-center text-delta-500", d ? "contents" : "absolute left-3 flex"),
102
- children: w
97
+ g && /* @__PURE__ */ i("span", {
98
+ className: l("items-center text-delta-500", r ? "contents" : "absolute left-3 flex"),
99
+ children: R
103
100
  }),
104
- r ? /* @__PURE__ */ o("textarea", {
105
- ...G,
106
- ref: Y,
107
- "data-testid": u,
108
- rows: A ?? N ?? 2,
109
- className: J
110
- }) : /* @__PURE__ */ o("input", {
111
- ...G,
112
- ...ke,
113
- ref: Y,
114
- "data-testid": u,
101
+ d ? /* @__PURE__ */ i("textarea", {
102
+ ...W,
103
+ ref: V,
104
+ "data-testid": p,
105
+ rows: A ?? I ?? 2,
106
+ className: Y
107
+ }) : /* @__PURE__ */ i("input", {
108
+ ...W,
109
+ ...De,
110
+ ref: V,
111
+ "data-testid": p,
115
112
  type: ie,
116
- className: J
113
+ className: Y
117
114
  }),
118
- W ? /* @__PURE__ */ o("button", {
115
+ w ? /* @__PURE__ */ i("button", {
119
116
  type: "button",
120
117
  "aria-label": "Clear",
121
- "data-testid": `${u}-clear`,
118
+ "data-testid": `${p}-clear`,
122
119
  className: "absolute right-4 z-40 flex items-center justify-center rounded-full border-0 bg-transparent p-[2px] duration-300 hover:bg-gama-100",
123
120
  onClick: (e) => {
124
- e.stopPropagation(), e.preventDefault(), L || U(!1), oe?.();
121
+ e.stopPropagation(), e.preventDefault(), _ || K(!1), ne?.();
125
122
  },
126
- children: /* @__PURE__ */ o($e, {
123
+ children: /* @__PURE__ */ i($e, {
127
124
  width: 18,
128
125
  height: 18
129
126
  })
130
- }) : S && /* @__PURE__ */ o("span", {
127
+ }) : f && /* @__PURE__ */ i("span", {
131
128
  ref: j,
132
129
  className: "absolute inset-y-0 right-[14px] flex max-w-[calc(100%-28px)] items-center gap-1",
133
- children: S
130
+ children: f
134
131
  }),
135
- a ? /* @__PURE__ */ o("fieldset", {
132
+ a ? /* @__PURE__ */ i("fieldset", {
136
133
  "aria-hidden": !0,
137
- className: X({
138
- focused: I,
139
- error: i,
134
+ className: J({
135
+ focused: H,
136
+ error: o,
140
137
  disabled: s,
141
138
  readOnly: n,
142
139
  notched: !0
143
140
  }),
144
- children: /* @__PURE__ */ o("legend", {
145
- className: je(R),
146
- children: /* @__PURE__ */ h("span", {
141
+ children: /* @__PURE__ */ i("legend", {
142
+ className: Ue(N),
143
+ children: /* @__PURE__ */ m("span", {
147
144
  className: "inline-block px-[5px]",
148
- children: [a, H && " *"]
145
+ children: [a, v && " *"]
149
146
  })
150
147
  })
151
- }) : /* @__PURE__ */ o("div", {
148
+ }) : /* @__PURE__ */ i("div", {
152
149
  "aria-hidden": !0,
153
- className: X({
154
- focused: I,
155
- error: i,
150
+ className: J({
151
+ focused: H,
152
+ error: o,
156
153
  disabled: s,
157
154
  readOnly: n,
158
155
  notched: !1
159
156
  })
160
157
  })
161
158
  ]
162
- }), a && /* @__PURE__ */ h("label", {
163
- htmlFor: $,
164
- className: l(_e({
165
- shrink: R,
166
- focused: I,
167
- error: i,
159
+ }), a && /* @__PURE__ */ m("label", {
160
+ htmlFor: T,
161
+ className: l(ze({
162
+ shrink: N,
163
+ focused: H,
164
+ error: o,
168
165
  disabled: s,
169
166
  readOnly: n,
170
- size: ce
167
+ size: re
171
168
  }), t?.inputLabel?.className),
172
169
  style: {
173
- ...M(t?.inputLabel?.sx),
174
- ...t?.inputLabel?.style
170
+ ...F(t?.inputLabel?.sx),
171
+ ...t?.inputLabel?.style,
172
+ ...Ke(N)
175
173
  },
176
- children: [a, H && " *"]
174
+ children: [a, v && " *"]
177
175
  })]
178
- }), !n && (v != null || i) && /* @__PURE__ */ h("div", {
179
- id: z,
180
- className: l(!t?.formHelperText && "mr-[14px] box-border min-h-[24px] pt-1", i && !t?.formHelperText?.hideErrorIcon && "flex items-start gap-1 text-error-500", !i && "text-delta-600", t?.formHelperText?.className),
181
- style: M(t?.formHelperText?.sx),
182
- children: [i && !t?.formHelperText?.hideErrorIcon && /* @__PURE__ */ o(ze, {
176
+ }), !n && (L != null || o) && /* @__PURE__ */ m("div", {
177
+ id: P,
178
+ className: l(!t?.formHelperText && "mr-[14px] box-border min-h-[24px] pt-1", o && !t?.formHelperText?.hideErrorIcon && "flex items-start gap-1 text-error-500", !o && "text-delta-600", t?.formHelperText?.className),
179
+ style: F(t?.formHelperText?.sx),
180
+ children: [o && !t?.formHelperText?.hideErrorIcon && /* @__PURE__ */ i(je, {
183
181
  width: 20,
184
182
  height: 20,
185
183
  className: "min-w-5 shrink-0"
186
- }), /* @__PURE__ */ o("span", {
184
+ }), /* @__PURE__ */ i("span", {
187
185
  className: "text-sm leading-5 tracking-[0.03333em]",
188
- children: i ? v ?? "Required" : v
186
+ children: o ? L ?? "Required" : L
189
187
  })]
190
188
  })]
191
189
  });
192
190
  };
193
191
  export {
194
- et as StyledInputField
192
+ bt as StyledInputField
195
193
  };
@@ -1,22 +1,23 @@
1
1
  import { cn as m } from "../../helpers/cn.js";
2
- import { floatingLabelClass as u } from "../inputs/field-styles.js";
3
- import { useFormControlContext as b } from "./FormControlContext.js";
4
- import { jsxs as p } from "react/jsx-runtime";
5
- var q = ({ children: r, htmlFor: o, id: s, required: l, disabled: i, error: t, size: d, shrink: a, className: n }) => {
6
- const e = b(), f = a ?? (e ? e.focused || e.filled : !1), c = l ?? e?.required ?? !1;
7
- return /* @__PURE__ */ p("label", {
8
- htmlFor: o,
9
- id: s ?? e?.labelId,
2
+ import { floatingLabelClass as u, floatingLabelLayoutStyle as b } from "../inputs/field-styles.js";
3
+ import { useFormControlContext as p } from "./FormControlContext.js";
4
+ import { jsxs as x } from "react/jsx-runtime";
5
+ var S = ({ children: o, htmlFor: s, id: l, required: t, disabled: i, error: a, size: d, shrink: n, className: f }) => {
6
+ const e = p(), r = n ?? (e ? e.focused || e.filled : !1), c = t ?? e?.required ?? !1;
7
+ return /* @__PURE__ */ x("label", {
8
+ htmlFor: s,
9
+ id: l ?? e?.labelId,
10
10
  className: m(u({
11
- shrink: f,
11
+ shrink: r,
12
12
  focused: e?.focused,
13
- error: t ?? e?.error,
13
+ error: a ?? e?.error,
14
14
  disabled: i ?? e?.disabled,
15
15
  size: d ?? e?.size
16
- }), n),
17
- children: [r, c && " *"]
16
+ }), f),
17
+ style: b(r),
18
+ children: [o, c && " *"]
18
19
  });
19
20
  };
20
21
  export {
21
- q as StyledInputLabel
22
+ S as StyledInputLabel
22
23
  };
@@ -13,10 +13,22 @@ export interface TypographyProps extends Omit<HTMLAttributes<HTMLElement>, 'colo
13
13
  }
14
14
  /**
15
15
  * Native, MUI-free reimplementation of the previous `Typography` passthrough. Reproduces MUI v9's
16
- * default typography scale via Tailwind utilities, the variant→element mapping, and the
16
+ * default typography scale via `StyledTypography.module.scss`, the variant→element mapping, and the
17
17
  * `align`/`noWrap`/`gutterBottom`/`color` props. `sx` is honoured via `resolveSx` (DEC-007).
18
18
  * Signature unchanged: still accepts `TypographyProps` (DEC-003).
19
19
  *
20
+ * **Overriding the type scale.** The variant defaults are plain CSS-module declarations carrying no
21
+ * `!important`, so any of these wins over them — pick whichever suits the call site:
22
+ * - `sx={{ fontSize: '0.875rem', fontWeight: 600 }}` or `style={{ … }}` (inline; beats normal rules)
23
+ * - `className='text-sm! font-semibold!'` (Tailwind `!` modifier)
24
+ * - a consumer CSS-module class; add `!` to the utilities if the consumer's Tailwind sits in a
25
+ * `@layer utilities` (layered normal declarations lose to this library's unlayered ones)
26
+ * Do **not** re-express these defaults as Tailwind utilities on the element: this library builds
27
+ * Tailwind with `important: true`, which would make the defaults unoverridable again. Full reasoning
28
+ * in the header of `StyledTypography.module.scss`.
29
+ *
30
+ * `classes` remains accepted-but-ignored for signature parity — it is not an override hook.
31
+ *
20
32
  * @figmaNode none — **MUI-compatibility shim, NOT a Design-System component.** Its `variant` scale
21
33
  * (h1=6rem light, body1=1rem, MUI palette colours…) intentionally mirrors MUI v9 so pre-existing
22
34
  * `<StyledTypography variant="…">` call-sites keep rendering identically. **Do not rescale it to the
@@ -1,3 +1,16 @@
1
+ import { CSSProperties } from 'react';
2
+ /** Figma single-line outlined field height — pinned inline so duplicate app CSS cannot resize the box. */
3
+ export declare const SINGLE_LINE_FIELD_HEIGHT_PX = 40;
4
+ /** Inline layout for the 40px input shell; spread caller styles first, then this. */
5
+ export declare const singleLineShellLayoutStyle: () => CSSProperties;
6
+ export interface SingleLineInputLayoutOptions {
7
+ paddingLeft?: CSSProperties['paddingLeft'];
8
+ paddingRight?: CSSProperties['paddingRight'];
9
+ }
10
+ /** Inline layout for the single-line `<input>`; spread caller/htmlInput styles first, then this. */
11
+ export declare const singleLineInputLayoutStyle: ({ paddingLeft, paddingRight, }?: SingleLineInputLayoutOptions) => CSSProperties;
12
+ /** Label vertical anchor — inline so duplicate Tailwind `top-*` utilities cannot shift it. */
13
+ export declare const floatingLabelLayoutStyle: (shrink: boolean) => CSSProperties;
1
14
  /**
2
15
  * Shared outlined-field styling so `StyledInputField`, `StyledInputLabel` (+ `StyledFormControl`)
3
16
  * and `StyledSelect` render an identical border + floating label without MUI. TASK-401.
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "publishConfig": {
4
4
  "access": "public"
5
5
  },
6
- "version": "3.49.0",
6
+ "version": "3.49.2",
7
7
  "type": "module",
8
8
  "sideEffects": [
9
9
  "**/*.css",