@ogcio/design-system-react 1.30.0 → 1.31.1
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/dist/atoms/DsButton.js +3 -2
- package/dist/atoms/InsetText.d.ts +14 -0
- package/dist/atoms/InsetText.js +17 -0
- package/dist/atoms/icons/Close.js +9 -8
- package/dist/atoms/icons/KeyboardArrowDown.js +6 -5
- package/dist/atoms/icons/KeyboardArrowUp.js +6 -5
- package/dist/atoms/icons/Visibility.js +15 -14
- package/dist/atoms/icons/VisibilityOff.js +9 -8
- package/dist/atoms/icons/logos/LogoBlack.d.ts +3 -0
- package/dist/atoms/icons/logos/LogoBlack.js +327 -0
- package/dist/atoms/icons/logos/LogoGoldGreen.d.ts +3 -0
- package/dist/atoms/icons/logos/LogoGoldGreen.js +327 -0
- package/dist/atoms/icons/logos/LogoGoldWhite.d.ts +3 -0
- package/dist/atoms/icons/logos/LogoGoldWhite.js +87 -0
- package/dist/atoms/icons/logos/LogoHarpBlack.d.ts +3 -0
- package/dist/atoms/icons/logos/LogoHarpBlack.js +68 -0
- package/dist/atoms/icons/logos/LogoHarpWhite.d.ts +3 -0
- package/dist/{assets/logos/LogoHarpBlack.js → atoms/icons/logos/LogoHarpWhite.js} +33 -31
- package/dist/atoms/icons/logos/LogoWhite.d.ts +3 -0
- package/dist/atoms/icons/logos/LogoWhite.js +327 -0
- package/dist/atoms/icons/logos/index.d.ts +6 -0
- package/dist/atoms/icons/logos/index.js +14 -0
- package/dist/atoms/icons/types.d.ts +5 -5
- package/dist/atoms/index.d.ts +1 -0
- package/dist/atoms/index.js +12 -10
- package/dist/blockquote/blockquote.d.ts +4 -1
- package/dist/blockquote/blockquote.js +18 -4
- package/dist/breadcrumbs/breadcrumbs.js +54 -33
- package/dist/button-group/button-group.js +31 -28
- package/dist/character-count/character-count.js +5 -5
- package/dist/chip/chip.js +41 -19
- package/dist/combo-box/combo-box.js +6 -13
- package/dist/cookie-banner/cookie-banner.js +28 -20
- package/dist/details/details.js +43 -23
- package/dist/drawer/drawer.js +35 -32
- package/dist/footer/footer.js +54 -46
- package/dist/header/header-legacy.js +8 -8
- package/dist/hooks/use-aria-hider.d.ts +1 -1
- package/dist/hooks/use-aria-hider.js +14 -13
- package/dist/hooks/use-focus-trap.d.ts +1 -1
- package/dist/hooks/use-focus-trap.js +179 -179
- package/dist/icons/index.d.ts +1 -0
- package/dist/icons/index.js +12 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +144 -142
- package/dist/input-file/input-file.js +15 -12
- package/dist/logos/index.d.ts +1 -0
- package/dist/logos/index.js +14 -0
- package/dist/modal/modal.js +125 -128
- package/dist/popover/popover.js +67 -64
- package/dist/score-select/score-select.js +20 -20
- package/dist/select/select-next.js +45 -45
- package/dist/styles.css +1 -1
- package/dist/table/table-row.js +14 -7
- package/dist/tabs/tab-panel.js +6 -6
- package/dist/tabs/tabs.js +19 -19
- package/package.json +10 -10
- package/dist/assets/logos/LogoBlack.d.ts +0 -3
- package/dist/assets/logos/LogoBlack.js +0 -322
- package/dist/assets/logos/LogoGoldGreen.d.ts +0 -3
- package/dist/assets/logos/LogoGoldGreen.js +0 -322
- package/dist/assets/logos/LogoGoldWhite.d.ts +0 -3
- package/dist/assets/logos/LogoGoldWhite.js +0 -82
- package/dist/assets/logos/LogoHarpBlack.d.ts +0 -3
- package/dist/assets/logos/LogoHarpWhite.d.ts +0 -3
- package/dist/assets/logos/LogoHarpWhite.js +0 -60
- package/dist/assets/logos/LogoWhite.d.ts +0 -3
- package/dist/assets/logos/LogoWhite.js +0 -322
- package/dist/assets/logos/index.d.ts +0 -6
- package/dist/assets/logos/index.js +0 -14
|
@@ -1,34 +1,34 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsx as
|
|
3
|
-
import { forwardRef as B, useRef as
|
|
2
|
+
import { jsx as s, jsxs as _ } from "react/jsx-runtime";
|
|
3
|
+
import { forwardRef as B, useRef as T, useState as k, useImperativeHandle as ee, Children as R, isValidElement as G, useEffect as O, useCallback as te } from "react";
|
|
4
4
|
import { cn as H } from "../cn.js";
|
|
5
5
|
import { useDomId as re } from "../hooks/use-dom-id.js";
|
|
6
6
|
import { useScrollHighlightedItem as ne } from "../hooks/use-scroll-highlighted-item.js";
|
|
7
7
|
import { translate as F } from "../i18n/utility.js";
|
|
8
8
|
import { InputText as oe } from "../input-text/input-text.js";
|
|
9
|
-
import { Popover as
|
|
9
|
+
import { Popover as le } from "../popover/popover.js";
|
|
10
10
|
import { cycleEnabledIndex as ae } from "../utilities.js";
|
|
11
|
-
import { SelectMenu as
|
|
11
|
+
import { SelectMenu as se, SelectMenuOption as J, SelectMenuGroupItem as ce } from "./select-menu.js";
|
|
12
12
|
import { SelectSearch as ie } from "./select-search.js";
|
|
13
13
|
const pe = B(
|
|
14
14
|
({
|
|
15
|
-
children:
|
|
15
|
+
children: x,
|
|
16
16
|
value: u,
|
|
17
17
|
defaultValue: E = "",
|
|
18
|
-
onChange:
|
|
18
|
+
onChange: I,
|
|
19
19
|
onMenuClose: f,
|
|
20
20
|
enableSearch: h,
|
|
21
|
-
disabled:
|
|
21
|
+
disabled: l,
|
|
22
22
|
name: i,
|
|
23
23
|
onBlur: m,
|
|
24
24
|
placeholder: P,
|
|
25
25
|
...N
|
|
26
26
|
}, Q) => {
|
|
27
|
-
const c =
|
|
27
|
+
const c = T(null), D = T(null), A = T(null), $ = T(!1), [a, j] = k(
|
|
28
28
|
E || u
|
|
29
29
|
), [S, p] = k(!1), [W, K] = k(""), [g, V] = k(-1);
|
|
30
30
|
ee(Q, () => c.current), ne(A, g);
|
|
31
|
-
const d = R.toArray(
|
|
31
|
+
const d = R.toArray(x).filter(
|
|
32
32
|
(e) => G(e)
|
|
33
33
|
);
|
|
34
34
|
O(() => {
|
|
@@ -45,9 +45,9 @@ const pe = B(
|
|
|
45
45
|
}
|
|
46
46
|
if (o === "SelectGroupItemNext") {
|
|
47
47
|
const y = n, b = R.toArray(y.props.children).find(
|
|
48
|
-
(
|
|
48
|
+
(v) => {
|
|
49
49
|
var z;
|
|
50
|
-
return ((z =
|
|
50
|
+
return ((z = v == null ? void 0 : v.type) == null ? void 0 : z.componentType) === "SelectItemNext" && v.props.value === a;
|
|
51
51
|
}
|
|
52
52
|
);
|
|
53
53
|
if (b && G(b)) {
|
|
@@ -68,11 +68,11 @@ const pe = B(
|
|
|
68
68
|
}, [u]);
|
|
69
69
|
const L = () => {
|
|
70
70
|
var e;
|
|
71
|
-
|
|
71
|
+
l || (p(!0), (e = c.current) == null || e.focus());
|
|
72
72
|
}, X = (e) => {
|
|
73
73
|
p(e), e || f == null || f();
|
|
74
74
|
}, U = (e) => {
|
|
75
|
-
if (p(!1), j(e),
|
|
75
|
+
if (p(!1), j(e), I && (I({
|
|
76
76
|
target: { name: i, value: e },
|
|
77
77
|
currentTarget: { name: i, value: e },
|
|
78
78
|
type: "change",
|
|
@@ -89,7 +89,7 @@ const pe = B(
|
|
|
89
89
|
}, Y = te(
|
|
90
90
|
(e) => {
|
|
91
91
|
var r;
|
|
92
|
-
if (!
|
|
92
|
+
if (!l)
|
|
93
93
|
switch (e.key) {
|
|
94
94
|
case "ArrowDown":
|
|
95
95
|
case "ArrowUp": {
|
|
@@ -137,40 +137,40 @@ const pe = B(
|
|
|
137
137
|
}, C = re(), q = N["aria-label"] ?? F("select.next.placeholder", { defaultValue: "Select" });
|
|
138
138
|
return O(() => {
|
|
139
139
|
c.current && c.current.setAttribute("aria-labelledby", C);
|
|
140
|
-
}, [C, h]), h ? /* @__PURE__ */
|
|
140
|
+
}, [C, h]), h ? /* @__PURE__ */ s("div", { className: H("gi-relative gi-w-full", N.className), children: /* @__PURE__ */ s(
|
|
141
141
|
ie,
|
|
142
142
|
{
|
|
143
143
|
...N,
|
|
144
144
|
value: a,
|
|
145
|
-
onChange:
|
|
146
|
-
disabled:
|
|
145
|
+
onChange: I,
|
|
146
|
+
disabled: l,
|
|
147
147
|
ref: c,
|
|
148
148
|
onBlur: m,
|
|
149
149
|
name: i,
|
|
150
150
|
placeholder: P,
|
|
151
|
-
children:
|
|
151
|
+
children: x
|
|
152
152
|
}
|
|
153
153
|
) }) : /* @__PURE__ */ _(
|
|
154
154
|
"div",
|
|
155
155
|
{
|
|
156
|
-
"aria-disabled":
|
|
157
|
-
className: H("gi-
|
|
156
|
+
"aria-disabled": l,
|
|
157
|
+
className: H("gi-relative gi-w-full", N.className),
|
|
158
158
|
children: [
|
|
159
|
-
/* @__PURE__ */
|
|
160
|
-
/* @__PURE__ */
|
|
159
|
+
/* @__PURE__ */ s("span", { id: C, className: "gi-sr-only", children: q }),
|
|
160
|
+
/* @__PURE__ */ s(
|
|
161
161
|
oe,
|
|
162
162
|
{
|
|
163
163
|
...N,
|
|
164
164
|
autoComplete: "off",
|
|
165
165
|
"aria-label": q,
|
|
166
|
-
"aria-disabled":
|
|
167
|
-
disabled:
|
|
166
|
+
"aria-disabled": l,
|
|
167
|
+
disabled: l,
|
|
168
168
|
placeholder: P ?? F("select.next.placeholder", { defaultValue: "Search" }),
|
|
169
169
|
readOnly: !0,
|
|
170
170
|
inputClassName: "gi-cursor-pointer",
|
|
171
171
|
iconEndClassName: H({
|
|
172
|
-
"gi-cursor-pointer": !
|
|
173
|
-
"gi-cursor-not-allowed gi-pointer-events-none":
|
|
172
|
+
"gi-cursor-pointer": !l,
|
|
173
|
+
"gi-cursor-not-allowed gi-pointer-events-none": l
|
|
174
174
|
}),
|
|
175
175
|
iconEnd: S ? "keyboard_arrow_up" : "keyboard_arrow_down",
|
|
176
176
|
onIconEndClick: L,
|
|
@@ -183,8 +183,8 @@ const pe = B(
|
|
|
183
183
|
name: i
|
|
184
184
|
}
|
|
185
185
|
),
|
|
186
|
-
/* @__PURE__ */
|
|
187
|
-
|
|
186
|
+
/* @__PURE__ */ s(
|
|
187
|
+
le,
|
|
188
188
|
{
|
|
189
189
|
triggerRef: c,
|
|
190
190
|
extraRefs: [D],
|
|
@@ -199,8 +199,8 @@ const pe = B(
|
|
|
199
199
|
{ name: "flip", options: { fallbackPlacements: ["top"] } }
|
|
200
200
|
]
|
|
201
201
|
},
|
|
202
|
-
children: /* @__PURE__ */
|
|
203
|
-
|
|
202
|
+
children: /* @__PURE__ */ s(
|
|
203
|
+
se,
|
|
204
204
|
{
|
|
205
205
|
ref: A,
|
|
206
206
|
onChange: (e) => {
|
|
@@ -212,7 +212,7 @@ const pe = B(
|
|
|
212
212
|
const t = (n = e == null ? void 0 : e.type) == null ? void 0 : n.componentType;
|
|
213
213
|
if (t === "SelectItemNext") {
|
|
214
214
|
const o = e;
|
|
215
|
-
return /* @__PURE__ */
|
|
215
|
+
return /* @__PURE__ */ s(
|
|
216
216
|
J,
|
|
217
217
|
{
|
|
218
218
|
...o.props,
|
|
@@ -223,20 +223,20 @@ const pe = B(
|
|
|
223
223
|
`SelectItemNext-${o.props.value.toString()}`
|
|
224
224
|
);
|
|
225
225
|
} else if (t === "SelectGroupItemNext") {
|
|
226
|
-
const o = e, y = R.toArray(o.props.children).filter((b) => G(b)).map((b,
|
|
227
|
-
const
|
|
228
|
-
return /* @__PURE__ */
|
|
226
|
+
const o = e, y = R.toArray(o.props.children).filter((b) => G(b)).map((b, v) => {
|
|
227
|
+
const w = b.props;
|
|
228
|
+
return /* @__PURE__ */ s(
|
|
229
229
|
J,
|
|
230
230
|
{
|
|
231
|
-
...
|
|
231
|
+
...w,
|
|
232
232
|
isHighlighted: g === r,
|
|
233
|
-
selected: (a == null ? void 0 : a.toString()) ===
|
|
234
|
-
index:
|
|
233
|
+
selected: (a == null ? void 0 : a.toString()) === w.value.toString(),
|
|
234
|
+
index: v
|
|
235
235
|
},
|
|
236
|
-
`SelectGroupItemNext-SelectItemNext-${
|
|
236
|
+
`SelectGroupItemNext-SelectItemNext-${w.value.toString()}`
|
|
237
237
|
);
|
|
238
238
|
});
|
|
239
|
-
return /* @__PURE__ */
|
|
239
|
+
return /* @__PURE__ */ s(
|
|
240
240
|
ce,
|
|
241
241
|
{
|
|
242
242
|
label: o.props.label,
|
|
@@ -267,17 +267,17 @@ Object.defineProperty(ue, "componentType", {
|
|
|
267
267
|
writable: !1,
|
|
268
268
|
enumerable: !1
|
|
269
269
|
});
|
|
270
|
-
const Ne = (
|
|
271
|
-
const { options: u, defaultValue: E, onChange:
|
|
272
|
-
return /* @__PURE__ */
|
|
270
|
+
const Ne = (x) => {
|
|
271
|
+
const { options: u, defaultValue: E, onChange: I, error: f } = x;
|
|
272
|
+
return /* @__PURE__ */ s(
|
|
273
273
|
pe,
|
|
274
274
|
{
|
|
275
|
-
...
|
|
275
|
+
...x,
|
|
276
276
|
defaultValue: E,
|
|
277
|
-
onChange:
|
|
277
|
+
onChange: I,
|
|
278
278
|
"data-table-cell": "true",
|
|
279
279
|
"data-table-cell-error-state": f == null ? void 0 : f.toString(),
|
|
280
|
-
children: u.map(({ value: h, label:
|
|
280
|
+
children: u.map(({ value: h, label: l }) => /* @__PURE__ */ s(M, { value: h, children: l }, `${h}-${l}`))
|
|
281
281
|
}
|
|
282
282
|
);
|
|
283
283
|
};
|