@tedi-design-system/react 19.1.2-rc.1 → 19.1.2-rc.3
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.
- package/bundle-stats.html +1 -1
- package/index.css +1 -1
- package/package.json +1 -1
- package/src/tedi/components/content/table-card/table-card.cjs.js +1 -1
- package/src/tedi/components/content/table-card/table-card.d.ts +8 -0
- package/src/tedi/components/content/table-card/table-card.es.js +151 -146
- package/src/tedi/components/content/table-card/table-card.module.scss.cjs.js +1 -1
- package/src/tedi/components/content/table-card/table-card.module.scss.es.js +1 -3
- package/src/tedi/components/form/choice-group/components/choice-group-item/choice-group-item.cjs.js +1 -1
- package/src/tedi/components/form/choice-group/components/choice-group-item/choice-group-item.es.js +88 -94
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tedi-design-system/react",
|
|
3
|
-
"version": "19.1.2-rc.
|
|
3
|
+
"version": "19.1.2-rc.3",
|
|
4
4
|
"description": "TEDI Design System React component library — accessible, reusable UI components. Docs & live examples: https://storybook.tedi.ee/react/rc/",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),u=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),o=require("../../base/typography/text/text.cjs.js"),Te=require("../../buttons/collapse-button/collapse-button.cjs.js"),Ne=require("../../form/checkbox/checkbox.cjs.js"),m=require("../card/card.cjs.js"),qe=require("../label/label.cjs.js"),M=require("../text-group/text-group-list/text-group-list.cjs.js"),t=require("./table-card.module.scss.cjs.js"),ke=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),Be=require("../../../providers/label-provider/use-labels.cjs.js"),Re={horizontal:{labelAlign:"right",valueAlign:"right",labelWidth:"var(--text-group-label-width-sm)",rowGap:"0"},vertical:{labelAlign:"left",valueAlign:"left",labelWidth:"auto",rowGap:"var(--layout-grid-gutters-16)"}},we=s=>s.bold?e.jsx(o.Text,{element:"span",modifiers:"bold",children:s.value}):s.value,U=(s,y)=>typeof s=="string"?e.jsx(qe.Label,{isSmall:y,children:s}):s,V=s=>{const{getCurrentBreakpointProps:y}=ke.useBreakpointProps(s.defaultServerBreakpoint),{getLabel:Y}=Be.useLabels(),{rows:J,title:a,subtitle:i,endSlot:b,titleElement:j="h3",titleModifiers:d,collapsible:n=!1,defaultOpen:K=!0,open:q,onOpenChange:C,arrowType:Q="default",actions:k,summary:g,selectable:x=!1,selected:B,defaultSelected:X=!1,onSelectedChange:S,labelSize:R="default",selectionLabel:Z=Y("table-card.select-row"),ariaLabel:A,id:ee,children:w,layout:G="horizontal",columns:te=1,labelWidth:le,labelAlign:ae,valueAlign:se,rowAlign:ne="start",padding:re=1,rowGap:L,className:ie}=y(s),oe=G==="horizontal",_=Re[G],z=ae??_.labelAlign,de=se??_.valueAlign,T=le??_.labelWidth,ce=typeof L=="number"?`${L}rem`:L??_.rowGap,ue=r.useId(),h=ee??ue,O=`${h}-body`,[be,he]=r.useState(K),W=q!==void 0,c=n?W?q:be:!0,N=l=>{W||he(l),C==null||C(l)},H=`${h}-title`,E=r.useRef(null),I=r.useRef(c),P=r.useRef(N);r.useLayoutEffect(()=>{I.current=c,P.current=N}),r.useEffect(()=>{const l=E.current;if(!n||!l)return;const v=Le=>{Le.target.closest("a, button, input, select, textarea, label")||P.current(!I.current)};return l.addEventListener("click",v),()=>l.removeEventListener("click",v)},[n]);const[pe,fe]=r.useState(X),$=B!==void 0,me=$?B:pe,ge=l=>{$||fe(l),S==null||S(l)},xe=j;n&&!a&&!A&&console.warn("TableCard: a `collapsible` card needs a `title` or `ariaLabel` so its toggle has an accessible name.");const _e=!!(x||a||i||b||n),p=!!k,ve=!!g,ye=!!w,D=n?c||p:x,je=c&&!D,Ce=ve||p||ye,Se=p,f=x&&!n&&!!a&&!i,Ae=J.map(l=>({label:U(l.label,R==="small"),value:we(l),...l.colSpan?{colSpan:l.colSpan}:{}})),F=x?e.jsx(Ne.Checkbox,{id:`${h}-select`,name:`${h}-select`,value:"selected",label:f?e.jsx(o.Text,{element:"span",color:"primary",modifiers:d,className:u.default(t.default["tedi-table-card__title"],{[t.default["tedi-table-card__title--body"]]:!d}),children:a}):Z,hideLabel:!f,checked:me,onChange:(l,v)=>ge(v)}):null;return e.jsxs(m.Card,{padding:0,className:u.default(t.default["tedi-table-card"],ie),"aria-label":A,id:h,children:[_e&&e.jsxs(m.Card.Content,{padding:je?{top:1,right:1,bottom:0,left:1}:1,hasSeparator:D,className:u.default(t.default["tedi-table-card__header"],{[t.default["tedi-table-card__header--select-title"]]:f}),children:[f?e.jsx(xe,{className:t.default["tedi-table-card__heading"],children:F}):F,n?e.jsxs("div",{ref:E,className:t.default["tedi-table-card__collapse-row"],children:[e.jsxs("span",{className:t.default["tedi-table-card__title-group"],children:[a&&e.jsx(o.Text,{id:H,element:j,modifiers:d,className:u.default(t.default["tedi-table-card__title"],{[t.default["tedi-table-card__title--body"]]:!d}),children:a}),i&&e.jsx(o.Text,{element:"span",color:"secondary",modifiers:"small",children:i})]}),b&&e.jsx("span",{className:t.default["tedi-table-card__end-slot"],children:b}),e.jsx(Te.CollapseButton,{hideText:!0,arrowType:Q,open:c,onOpenChange:N,"aria-controls":O,"aria-labelledby":a?H:void 0,"aria-label":a?void 0:A})]}):e.jsxs(e.Fragment,{children:[(a||i)&&!f&&e.jsxs("span",{className:t.default["tedi-table-card__title-group"],children:[a&&e.jsx(o.Text,{element:j,modifiers:d,className:u.default(t.default["tedi-table-card__title"],{[t.default["tedi-table-card__title--body"]]:!d}),children:a}),i&&e.jsx(o.Text,{element:"span",color:"secondary",modifiers:"small",children:i})]}),b&&e.jsx("div",{className:t.default["tedi-table-card__end-slot"],children:b})]})]}),e.jsxs("div",{id:O,hidden:n&&!c,className:u.default({[t.default["tedi-table-card__body--has-footer"]]:p}),children:[e.jsx(m.Card.Content,{padding:re,hasSeparator:Ce,children:e.jsx(M.TextGroupList,{columns:te,items:Ae,rowGap:ce,...oe?{type:"horizontal",labelAlign:z,valueAlign:de,labelWidth:T,rowAlign:ne}:{type:"vertical",labelAlign:"left",labelWidth:T}})}),w,g&&e.jsx(m.Card.Content,{padding:1,background:"tertiary",hasSeparator:Se,children:e.jsx(M.TextGroupList,{type:"horizontal",labelAlign:z,valueAlign:"right",labelWidth:T,items:[{label:U(g.label,R==="small"),value:e.jsx(o.Text,{element:"span",modifiers:"bold",children:g.value})}]})})]}),p&&e.jsx(m.Card.Content,{padding:{vertical:.5,horizontal:1},className:t.default["tedi-table-card__actions"],children:k})]})};V.displayName="TableCard";exports.TableCard=V;
|
|
@@ -89,6 +89,14 @@ export interface TableCardProps extends BreakpointSupport<TableCardBreakpointPro
|
|
|
89
89
|
open?: boolean;
|
|
90
90
|
/** Called with the next open state when the header toggles. */
|
|
91
91
|
onOpenChange?: (open: boolean) => void;
|
|
92
|
+
/**
|
|
93
|
+
* Style of the collapse indicator (only applies when `collapsible`), mirroring `CollapseButton`'s
|
|
94
|
+
* `arrowType`:
|
|
95
|
+
* - `default` — a plain chevron.
|
|
96
|
+
* - `secondary` — a circular, outlined arrow.
|
|
97
|
+
* @default default
|
|
98
|
+
*/
|
|
99
|
+
arrowType?: 'default' | 'secondary';
|
|
92
100
|
/** Footer content (e.g. `Button`s), divided from the body. */
|
|
93
101
|
actions?: React.ReactNode;
|
|
94
102
|
/** Emphasised summary / total row after the body, on a muted background. */
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import { Checkbox as
|
|
7
|
-
import { Card as
|
|
8
|
-
import { Label as
|
|
9
|
-
import { TextGroupList as
|
|
10
|
-
import
|
|
11
|
-
import { useBreakpointProps as
|
|
12
|
-
import { useLabels as
|
|
13
|
-
const
|
|
1
|
+
import { jsx as e, jsxs as s, Fragment as Re } from "react/jsx-runtime";
|
|
2
|
+
import b from "../../../../../external/classnames/index.es.js";
|
|
3
|
+
import n from "react";
|
|
4
|
+
import { Text as d } from "../../base/typography/text/text.es.js";
|
|
5
|
+
import { CollapseButton as Te } from "../../buttons/collapse-button/collapse-button.es.js";
|
|
6
|
+
import { Checkbox as ke } from "../../form/checkbox/checkbox.es.js";
|
|
7
|
+
import { Card as g } from "../card/card.es.js";
|
|
8
|
+
import { Label as xe } from "../label/label.es.js";
|
|
9
|
+
import { TextGroupList as M } from "../text-group/text-group-list/text-group-list.es.js";
|
|
10
|
+
import t from "./table-card.module.scss.es.js";
|
|
11
|
+
import { useBreakpointProps as Be } from "../../../helpers/hooks/use-breakpoint-props.es.js";
|
|
12
|
+
import { useLabels as ze } from "../../../providers/label-provider/use-labels.es.js";
|
|
13
|
+
const We = {
|
|
14
14
|
horizontal: {
|
|
15
15
|
labelAlign: "right",
|
|
16
16
|
valueAlign: "right",
|
|
@@ -18,178 +18,183 @@ const xe = {
|
|
|
18
18
|
rowGap: "0"
|
|
19
19
|
},
|
|
20
20
|
vertical: { labelAlign: "left", valueAlign: "left", labelWidth: "auto", rowGap: "var(--layout-grid-gutters-16)" }
|
|
21
|
-
},
|
|
22
|
-
const { getCurrentBreakpointProps:
|
|
23
|
-
rows:
|
|
24
|
-
title:
|
|
21
|
+
}, Ge = (o) => o.bold ? /* @__PURE__ */ e(d, { element: "span", modifiers: "bold", children: o.value }) : o.value, Y = (o, A) => typeof o == "string" ? /* @__PURE__ */ e(xe, { isSmall: A, children: o }) : o, He = (o) => {
|
|
22
|
+
const { getCurrentBreakpointProps: A } = Be(o.defaultServerBreakpoint), { getLabel: q } = ze(), {
|
|
23
|
+
rows: J,
|
|
24
|
+
title: a,
|
|
25
25
|
subtitle: i,
|
|
26
26
|
endSlot: p,
|
|
27
|
-
titleElement:
|
|
28
|
-
titleModifiers:
|
|
29
|
-
collapsible:
|
|
30
|
-
defaultOpen:
|
|
31
|
-
open:
|
|
32
|
-
onOpenChange:
|
|
27
|
+
titleElement: C = "h3",
|
|
28
|
+
titleModifiers: c,
|
|
29
|
+
collapsible: r = !1,
|
|
30
|
+
defaultOpen: K = !0,
|
|
31
|
+
open: x,
|
|
32
|
+
onOpenChange: L,
|
|
33
|
+
arrowType: Q = "default",
|
|
33
34
|
actions: B,
|
|
34
|
-
summary:
|
|
35
|
-
selectable:
|
|
36
|
-
selected:
|
|
37
|
-
defaultSelected:
|
|
38
|
-
onSelectedChange:
|
|
39
|
-
labelSize:
|
|
40
|
-
selectionLabel:
|
|
41
|
-
ariaLabel:
|
|
42
|
-
id:
|
|
43
|
-
children:
|
|
44
|
-
layout:
|
|
45
|
-
columns:
|
|
46
|
-
labelWidth:
|
|
47
|
-
labelAlign:
|
|
48
|
-
valueAlign:
|
|
49
|
-
rowAlign:
|
|
50
|
-
padding:
|
|
51
|
-
rowGap:
|
|
52
|
-
className:
|
|
53
|
-
} =
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
},
|
|
59
|
-
|
|
35
|
+
summary: _,
|
|
36
|
+
selectable: v = !1,
|
|
37
|
+
selected: z,
|
|
38
|
+
defaultSelected: X = !1,
|
|
39
|
+
onSelectedChange: N,
|
|
40
|
+
labelSize: W = "default",
|
|
41
|
+
selectionLabel: Z = q("table-card.select-row"),
|
|
42
|
+
ariaLabel: w,
|
|
43
|
+
id: ee,
|
|
44
|
+
children: G,
|
|
45
|
+
layout: H = "horizontal",
|
|
46
|
+
columns: te = 1,
|
|
47
|
+
labelWidth: le,
|
|
48
|
+
labelAlign: ae,
|
|
49
|
+
valueAlign: oe,
|
|
50
|
+
rowAlign: re = "start",
|
|
51
|
+
padding: ne = 1,
|
|
52
|
+
rowGap: R,
|
|
53
|
+
className: ie
|
|
54
|
+
} = A(o), se = H === "horizontal", y = We[H], O = ae ?? y.labelAlign, de = oe ?? y.valueAlign, T = le ?? y.labelWidth, ce = typeof R == "number" ? `${R}rem` : R ?? y.rowGap, me = n.useId(), h = ee ?? me, E = `${h}-body`, [be, pe] = n.useState(K), I = x !== void 0, m = r ? I ? x : be : !0, k = (l) => {
|
|
55
|
+
I || pe(l), L == null || L(l);
|
|
56
|
+
}, $ = `${h}-title`, P = n.useRef(null), j = n.useRef(m), D = n.useRef(k);
|
|
57
|
+
n.useLayoutEffect(() => {
|
|
58
|
+
j.current = m, D.current = k;
|
|
59
|
+
}), n.useEffect(() => {
|
|
60
|
+
const l = P.current;
|
|
61
|
+
if (!r || !l) return;
|
|
62
|
+
const S = (we) => {
|
|
63
|
+
we.target.closest("a, button, input, select, textarea, label") || D.current(!j.current);
|
|
64
|
+
};
|
|
65
|
+
return l.addEventListener("click", S), () => l.removeEventListener("click", S);
|
|
66
|
+
}, [r]);
|
|
67
|
+
const [he, ue] = n.useState(X), F = z !== void 0, fe = F ? z : he, ge = (l) => {
|
|
68
|
+
F || ue(l), N == null || N(l);
|
|
69
|
+
}, _e = C;
|
|
70
|
+
r && !a && !w && console.warn(
|
|
60
71
|
"TableCard: a `collapsible` card needs a `title` or `ariaLabel` so its toggle has an accessible name."
|
|
61
72
|
);
|
|
62
|
-
const
|
|
63
|
-
label:
|
|
64
|
-
value:
|
|
65
|
-
...
|
|
66
|
-
})),
|
|
67
|
-
|
|
73
|
+
const ve = !!(v || a || i || p || r), u = !!B, ye = !!_, Se = !!G, U = r ? m || u : v, Ae = m && !U, Ce = ye || u || Se, Le = u, f = v && !r && !!a && !i, Ne = J.map((l) => ({
|
|
74
|
+
label: Y(l.label, W === "small"),
|
|
75
|
+
value: Ge(l),
|
|
76
|
+
...l.colSpan ? { colSpan: l.colSpan } : {}
|
|
77
|
+
})), V = v ? /* @__PURE__ */ e(
|
|
78
|
+
ke,
|
|
68
79
|
{
|
|
69
|
-
id: `${
|
|
70
|
-
name: `${
|
|
80
|
+
id: `${h}-select`,
|
|
81
|
+
name: `${h}-select`,
|
|
71
82
|
value: "selected",
|
|
72
|
-
label:
|
|
73
|
-
|
|
83
|
+
label: f ? /* @__PURE__ */ e(
|
|
84
|
+
d,
|
|
74
85
|
{
|
|
75
86
|
element: "span",
|
|
76
87
|
color: "primary",
|
|
77
|
-
modifiers:
|
|
78
|
-
className:
|
|
79
|
-
[
|
|
88
|
+
modifiers: c,
|
|
89
|
+
className: b(t["tedi-table-card__title"], {
|
|
90
|
+
[t["tedi-table-card__title--body"]]: !c
|
|
80
91
|
}),
|
|
81
|
-
children:
|
|
92
|
+
children: a
|
|
82
93
|
}
|
|
83
|
-
) :
|
|
84
|
-
hideLabel: !
|
|
85
|
-
checked:
|
|
86
|
-
onChange: (
|
|
94
|
+
) : Z,
|
|
95
|
+
hideLabel: !f,
|
|
96
|
+
checked: fe,
|
|
97
|
+
onChange: (l, S) => ge(S)
|
|
87
98
|
}
|
|
88
99
|
) : null;
|
|
89
|
-
return /* @__PURE__ */
|
|
90
|
-
|
|
91
|
-
|
|
100
|
+
return /* @__PURE__ */ s(g, { padding: 0, className: b(t["tedi-table-card"], ie), "aria-label": w, id: h, children: [
|
|
101
|
+
ve && /* @__PURE__ */ s(
|
|
102
|
+
g.Content,
|
|
92
103
|
{
|
|
93
|
-
padding:
|
|
94
|
-
hasSeparator:
|
|
95
|
-
className:
|
|
96
|
-
[
|
|
104
|
+
padding: Ae ? { top: 1, right: 1, bottom: 0, left: 1 } : 1,
|
|
105
|
+
hasSeparator: U,
|
|
106
|
+
className: b(t["tedi-table-card__header"], {
|
|
107
|
+
[t["tedi-table-card__header--select-title"]]: f
|
|
97
108
|
}),
|
|
98
109
|
children: [
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
"
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
)
|
|
134
|
-
]
|
|
135
|
-
}
|
|
136
|
-
) }) : /* @__PURE__ */ d(Se, { children: [
|
|
137
|
-
(o || i) && !g && /* @__PURE__ */ d("span", { className: e["tedi-table-card__title-group"], children: [
|
|
138
|
-
o && /* @__PURE__ */ l(
|
|
139
|
-
b,
|
|
110
|
+
f ? /* @__PURE__ */ e(_e, { className: t["tedi-table-card__heading"], children: V }) : V,
|
|
111
|
+
r ? /* @__PURE__ */ s("div", { ref: P, className: t["tedi-table-card__collapse-row"], children: [
|
|
112
|
+
/* @__PURE__ */ s("span", { className: t["tedi-table-card__title-group"], children: [
|
|
113
|
+
a && /* @__PURE__ */ e(
|
|
114
|
+
d,
|
|
115
|
+
{
|
|
116
|
+
id: $,
|
|
117
|
+
element: C,
|
|
118
|
+
modifiers: c,
|
|
119
|
+
className: b(t["tedi-table-card__title"], {
|
|
120
|
+
[t["tedi-table-card__title--body"]]: !c
|
|
121
|
+
}),
|
|
122
|
+
children: a
|
|
123
|
+
}
|
|
124
|
+
),
|
|
125
|
+
i && /* @__PURE__ */ e(d, { element: "span", color: "secondary", modifiers: "small", children: i })
|
|
126
|
+
] }),
|
|
127
|
+
p && /* @__PURE__ */ e("span", { className: t["tedi-table-card__end-slot"], children: p }),
|
|
128
|
+
/* @__PURE__ */ e(
|
|
129
|
+
Te,
|
|
130
|
+
{
|
|
131
|
+
hideText: !0,
|
|
132
|
+
arrowType: Q,
|
|
133
|
+
open: m,
|
|
134
|
+
onOpenChange: k,
|
|
135
|
+
"aria-controls": E,
|
|
136
|
+
"aria-labelledby": a ? $ : void 0,
|
|
137
|
+
"aria-label": a ? void 0 : w
|
|
138
|
+
}
|
|
139
|
+
)
|
|
140
|
+
] }) : /* @__PURE__ */ s(Re, { children: [
|
|
141
|
+
(a || i) && !f && /* @__PURE__ */ s("span", { className: t["tedi-table-card__title-group"], children: [
|
|
142
|
+
a && /* @__PURE__ */ e(
|
|
143
|
+
d,
|
|
140
144
|
{
|
|
141
|
-
element:
|
|
142
|
-
modifiers:
|
|
143
|
-
className:
|
|
144
|
-
[
|
|
145
|
+
element: C,
|
|
146
|
+
modifiers: c,
|
|
147
|
+
className: b(t["tedi-table-card__title"], {
|
|
148
|
+
[t["tedi-table-card__title--body"]]: !c
|
|
145
149
|
}),
|
|
146
|
-
children:
|
|
150
|
+
children: a
|
|
147
151
|
}
|
|
148
152
|
),
|
|
149
|
-
i && /* @__PURE__ */
|
|
153
|
+
i && /* @__PURE__ */ e(d, { element: "span", color: "secondary", modifiers: "small", children: i })
|
|
150
154
|
] }),
|
|
151
|
-
p && /* @__PURE__ */
|
|
155
|
+
p && /* @__PURE__ */ e("div", { className: t["tedi-table-card__end-slot"], children: p })
|
|
152
156
|
] })
|
|
153
157
|
]
|
|
154
158
|
}
|
|
155
159
|
),
|
|
156
|
-
/* @__PURE__ */
|
|
160
|
+
/* @__PURE__ */ s(
|
|
157
161
|
"div",
|
|
158
162
|
{
|
|
159
|
-
id:
|
|
160
|
-
hidden:
|
|
161
|
-
className:
|
|
163
|
+
id: E,
|
|
164
|
+
hidden: r && !m,
|
|
165
|
+
className: b({ [t["tedi-table-card__body--has-footer"]]: u }),
|
|
162
166
|
children: [
|
|
163
|
-
/* @__PURE__ */
|
|
164
|
-
|
|
167
|
+
/* @__PURE__ */ e(g.Content, { padding: ne, hasSeparator: Ce, children: /* @__PURE__ */ e(
|
|
168
|
+
M,
|
|
165
169
|
{
|
|
166
|
-
columns:
|
|
167
|
-
items:
|
|
168
|
-
rowGap:
|
|
169
|
-
...
|
|
170
|
+
columns: te,
|
|
171
|
+
items: Ne,
|
|
172
|
+
rowGap: ce,
|
|
173
|
+
...se ? {
|
|
170
174
|
type: "horizontal",
|
|
171
|
-
labelAlign:
|
|
172
|
-
valueAlign:
|
|
173
|
-
labelWidth:
|
|
174
|
-
rowAlign:
|
|
175
|
+
labelAlign: O,
|
|
176
|
+
valueAlign: de,
|
|
177
|
+
labelWidth: T,
|
|
178
|
+
rowAlign: re
|
|
175
179
|
} : {
|
|
176
180
|
type: "vertical",
|
|
177
181
|
labelAlign: "left",
|
|
178
|
-
labelWidth:
|
|
182
|
+
labelWidth: T
|
|
179
183
|
}
|
|
180
184
|
}
|
|
181
185
|
) }),
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
186
|
+
G,
|
|
187
|
+
_ && /* @__PURE__ */ e(g.Content, { padding: 1, background: "tertiary", hasSeparator: Le, children: /* @__PURE__ */ e(
|
|
188
|
+
M,
|
|
185
189
|
{
|
|
186
190
|
type: "horizontal",
|
|
187
|
-
labelAlign:
|
|
191
|
+
labelAlign: O,
|
|
188
192
|
valueAlign: "right",
|
|
193
|
+
labelWidth: T,
|
|
189
194
|
items: [
|
|
190
195
|
{
|
|
191
|
-
label:
|
|
192
|
-
value: /* @__PURE__ */
|
|
196
|
+
label: Y(_.label, W === "small"),
|
|
197
|
+
value: /* @__PURE__ */ e(d, { element: "span", modifiers: "bold", children: _.value })
|
|
193
198
|
}
|
|
194
199
|
]
|
|
195
200
|
}
|
|
@@ -197,10 +202,10 @@ const xe = {
|
|
|
197
202
|
]
|
|
198
203
|
}
|
|
199
204
|
),
|
|
200
|
-
|
|
205
|
+
u && /* @__PURE__ */ e(g.Content, { padding: { vertical: 0.5, horizontal: 1 }, className: t["tedi-table-card__actions"], children: B })
|
|
201
206
|
] });
|
|
202
207
|
};
|
|
203
|
-
|
|
208
|
+
He.displayName = "TableCard";
|
|
204
209
|
export {
|
|
205
|
-
|
|
210
|
+
He as TableCard
|
|
206
211
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-table-card":"tedi-table-card-891665aa","tedi-table-card__body--has-footer":"tedi-table-card__body--has-footer-fdfe85e8","tedi-table-card__header":"tedi-table-card__header-5b99672d","tedi-table-card__header--select-title":"tedi-table-card__header--select-title-4c3092eb","tedi-table-card__heading":"tedi-table-card__heading-19e529e5","tedi-table-
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-table-card":"tedi-table-card-891665aa","tedi-table-card__body--has-footer":"tedi-table-card__body--has-footer-fdfe85e8","tedi-table-card__header":"tedi-table-card__header-5b99672d","tedi-table-card__header--select-title":"tedi-table-card__header--select-title-4c3092eb","tedi-table-card__heading":"tedi-table-card__heading-19e529e5","tedi-table-card__collapse-row":"tedi-table-card__collapse-row-0357173e","tedi-table-card__title-group":"tedi-table-card__title-group-5dba284a","tedi-table-card__title":"tedi-table-card__title-cdc97d8a","tedi-table-card__title--body":"tedi-table-card__title--body-d1a03544","tedi-table-card__end-slot":"tedi-table-card__end-slot-1c4a8fc1","tedi-table-card__actions":"tedi-table-card__actions-66d83aef"};exports.default=e;
|
|
@@ -4,12 +4,10 @@ const e = {
|
|
|
4
4
|
"tedi-table-card__header": "tedi-table-card__header-5b99672d",
|
|
5
5
|
"tedi-table-card__header--select-title": "tedi-table-card__header--select-title-4c3092eb",
|
|
6
6
|
"tedi-table-card__heading": "tedi-table-card__heading-19e529e5",
|
|
7
|
-
"tedi-table-
|
|
8
|
-
"tedi-table-card__chevron": "tedi-table-card__chevron-2771a16f",
|
|
7
|
+
"tedi-table-card__collapse-row": "tedi-table-card__collapse-row-0357173e",
|
|
9
8
|
"tedi-table-card__title-group": "tedi-table-card__title-group-5dba284a",
|
|
10
9
|
"tedi-table-card__title": "tedi-table-card__title-cdc97d8a",
|
|
11
10
|
"tedi-table-card__title--body": "tedi-table-card__title--body-d1a03544",
|
|
12
|
-
"tedi-table-card__chevron--open": "tedi-table-card__chevron--open-5ed89ee0",
|
|
13
11
|
"tedi-table-card__end-slot": "tedi-table-card__end-slot-1c4a8fc1",
|
|
14
12
|
"tedi-table-card__actions": "tedi-table-card__actions-66d83aef"
|
|
15
13
|
};
|
package/src/tedi/components/form/choice-group/components/choice-group-item/choice-group-item.cjs.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),n=require("../../../../../../../external/classnames/index.cjs.js"),R=require("react"),S=require("../../../checkbox/checkbox.cjs.js"),A=require("../../../feedback-text/feedback-text.cjs.js"),H=require("../../../radio/radio.cjs.js"),L=require("../../choice-group-context.cjs.js"),e=require("./choice-group-item.module.scss.cjs.js"),O=require("../../../../../helpers/hooks/use-breakpoint-props.cjs.js"),V=require("../../../../layout/grid/col.cjs.js"),v=u=>{const{getCurrentBreakpointProps:_}=O.useBreakpointProps(u.defaultServerBreakpoint),{id:c,label:C,value:a,className:q,direction:h,disabled:d,colProps:N=h==="column"?{width:12}:{width:"auto"},onChange:m,hideLabel:$,helper:i,tooltip:B,type:p="radio",variant:l="default",color:G="primary",layout:I,showIndicator:k,justifyContent:x="start"}=_(u),{currentValue:r,name:b,onChange:f,inputType:P}=R.useContext(L.ChoiceGroupContext),s=Array.isArray(r)?r.includes(a):a===r,M=r===void 0?u.defaultChecked:s,y=(o,g)=>{f==null||f(o,g),m==null||m(o,g)},T=n.default(e.default[`tedi-choice-group-item--${I==="separated"?"separated":"segmented"}`],h&&e.default[`tedi-choice-group-item--${h}`]),w=n.default(e.default["tedi-choice-group-item"],e.default[`tedi-choice-group-item--${l}`],e.default[`tedi-choice-group-item--${l}-${G}`],k&&e.default["tedi-choice-group-item--indicator"],p&&e.default[`tedi-choice-group-item--${p}`],{[e.default["tedi-choice-group-item--disabled"]]:d},{[e.default["tedi-choice-group-item--checked"]]:s},{[`justify-content-${x}`]:x}),E=p==="radio"?H.Radio:S.Checkbox,F=o=>{var j;d||l!=="card"||o.target.closest("input, label")||(j=document.getElementById(c))==null||j.click()};return t.jsx(V.Col,{...N,className:T,children:t.jsx("div",{className:w,onClick:F,"aria-disabled":d||void 0,children:l==="default"||k?t.jsx(E,{id:c,label:C,value:a,name:b,className:n.default(e.default["tedi-choice-group-item__indicator"],q),disabled:d,checked:s,defaultChecked:M,onChange:y,hideLabel:$,helper:i?{...i,className:n.default(e.default["tedi-choice-group-item__feedback-text"],i.className)}:void 0,tooltip:B,"data-testid":"choice-group-item-indicator"}):t.jsxs(t.Fragment,{children:[t.jsx("input",{id:c,value:a,name:b,type:P,disabled:d,checked:s,defaultChecked:r===void 0?u.defaultChecked:void 0,onChange:o=>{y(a,o.target.checked)},className:"visually-hidden"}),t.jsxs("label",{htmlFor:c,className:e.default["tedi-choice-group-item__label"],children:[C,i&&t.jsx(A.FeedbackText,{...i,id:i.id??`${c}-helper`,className:e.default["tedi-choice-group-item__feedback-text"]})]})]})})})};exports.ChoiceGroupItem=v;exports.default=v;
|