@iress-oss/ids-components 6.0.0-alpha.14 → 6.0.0-alpha.15

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,88 +1,94 @@
1
- import { jsx as r, jsxs as i } from "react/jsx-runtime";
2
- import { useMemo as k, createElement as y } from "react";
3
- import { IressIcon as j } from "../Icon/Icon.js";
1
+ import { jsx as t, jsxs as a } from "react/jsx-runtime";
2
+ import { useMemo as B, createElement as E } from "react";
3
+ import { IressIcon as V } from "../Icon/Icon.js";
4
4
  import "../Icon/Icon.styles.js";
5
5
  import { IressText as u } from "../Text/Text.js";
6
6
  import { propagateTestid as N } from "../../helpers/utility/propagateTestid.js";
7
- import { alert as w } from "./Alert.styles.js";
8
- import { c as h } from "../../cx-DN21T1EH.js";
9
- import { GlobalCSSClass as B } from "../../enums.js";
10
- import { I as E } from "../../Button-BTkololu.js";
11
- import { IressCloseButton as V } from "../Button/CloseButton/CloseButton.js";
7
+ import { alert as h } from "./Alert.styles.js";
8
+ import { c as q } from "../../css-DNdLYQld.js";
9
+ import { c as I } from "../../cx-DN21T1EH.js";
10
+ import { GlobalCSSClass as F } from "../../enums.js";
11
+ import { I as G } from "../../Button-BTkololu.js";
12
+ import { IressCloseButton as L } from "../Button/CloseButton/CloseButton.js";
12
13
  import "../Inline/Inline.styles.js";
13
- import { IressInline as q } from "../Inline/Inline.js";
14
- import { useControlledState as F } from "../../hooks/useControlledState.js";
15
- const G = {
14
+ import { IressInline as M } from "../Inline/Inline.js";
15
+ import { useControlledState as O } from "../../hooks/useControlledState.js";
16
+ import { s as R } from "../../is-valid-prop-DweT-eOL.js";
17
+ const W = {
16
18
  danger: "ban",
17
19
  info: "info-square",
18
20
  success: "check",
19
21
  warning: "exclamation-triangle"
20
- }, L = ({
22
+ }, _ = ({
21
23
  actions: n,
22
- children: I,
23
- className: g,
24
- defaultDismissed: x,
24
+ children: g,
25
+ className: x,
26
+ defaultDismissed: C,
25
27
  dismissed: b,
26
28
  footer: c,
27
- heading: t,
28
- icon: o,
29
+ heading: o,
30
+ icon: m,
29
31
  onDismiss: d,
30
- status: a = "info",
31
- variant: m,
32
+ status: r = "info",
33
+ variant: i,
32
34
  ...l
33
35
  }) => {
34
- const A = !!d, e = w({ status: a, variant: m }), p = !!n?.length, C = !!c || p, { value: v, setValue: S } = F({
36
+ const y = !!d, e = h({ status: r, variant: i }), A = h.raw({ status: r, variant: i }), p = !!n?.length, S = !!c || p, [T, k] = R(l), { value: v, setValue: w } = O({
35
37
  component: "IressAlert",
36
- defaultValue: x,
38
+ defaultValue: C,
37
39
  propName: "dismissed",
38
40
  value: b
39
- }), f = k(() => {
40
- if (o === !1)
41
+ }), f = B(() => {
42
+ if (m === !1)
41
43
  return null;
42
- const s = o ?? G[a];
43
- return /* @__PURE__ */ r(
44
- j,
44
+ const s = m ?? W[r];
45
+ return /* @__PURE__ */ t(
46
+ V,
45
47
  {
46
48
  name: s,
47
- screenreaderText: `${a}: `,
49
+ screenreaderText: `${r}: `,
48
50
  fixedWidth: !0,
49
51
  className: e.icon
50
52
  }
51
53
  );
52
- }, [e.icon, o, a]);
53
- return v ? null : /* @__PURE__ */ i(
54
+ }, [e.icon, m, r]);
55
+ return v ? null : /* @__PURE__ */ a(
54
56
  u,
55
57
  {
56
- className: h(g, e.alert, B.Alert),
57
- ...l,
58
+ className: I(
59
+ x,
60
+ q(A.alert, T),
61
+ F.Alert
62
+ ),
63
+ ...k,
58
64
  children: [
59
- m !== "sidebar" && f,
60
- /* @__PURE__ */ i("div", { className: e.wrapper, children: [
61
- t && /* @__PURE__ */ r(
65
+ i !== "sidebar" && f,
66
+ /* @__PURE__ */ a("div", { className: e.wrapper, children: [
67
+ o && /* @__PURE__ */ t(
62
68
  "div",
63
69
  {
64
70
  className: e.heading,
65
71
  "data-testid": N(l["data-testid"], "heading"),
66
- children: typeof t == "string" ? /* @__PURE__ */ i(u, { element: "h2", className: e.heading, children: [
67
- m === "sidebar" && f,
72
+ children: typeof o == "string" ? /* @__PURE__ */ a(u, { element: "h2", className: e.heading, children: [
73
+ i === "sidebar" && f,
68
74
  " ",
69
- t
70
- ] }) : t
75
+ o
76
+ ] }) : o
71
77
  }
72
78
  ),
73
- /* @__PURE__ */ r("div", { className: e.children, children: I }),
74
- C && /* @__PURE__ */ i(
79
+ /* @__PURE__ */ t("div", { className: e.children, children: g }),
80
+ S && /* @__PURE__ */ a(
75
81
  "div",
76
82
  {
77
83
  className: e.footer,
78
84
  "data-testid": N(l["data-testid"], "footer"),
79
85
  children: [
80
- p && /* @__PURE__ */ r(q, { gap: "sm", pb: "spacing.1", children: n?.map((s, T) => /* @__PURE__ */ y(
81
- E,
86
+ p && /* @__PURE__ */ t(M, { gap: "sm", pb: "spacing.1", children: n?.map((s, j) => /* @__PURE__ */ E(
87
+ G,
82
88
  {
83
89
  ...s,
84
- className: h(s.className, e.action),
85
- key: T
90
+ className: I(s.className, e.action),
91
+ key: j
86
92
  }
87
93
  )) }),
88
94
  c
@@ -90,12 +96,12 @@ const G = {
90
96
  }
91
97
  )
92
98
  ] }),
93
- A && /* @__PURE__ */ r(
94
- V,
99
+ y && /* @__PURE__ */ t(
100
+ L,
95
101
  {
96
102
  className: e.dismiss,
97
103
  onClick: (s) => {
98
- d?.(s), S(!0);
104
+ d?.(s), w(!0);
99
105
  }
100
106
  }
101
107
  )
@@ -103,7 +109,7 @@ const G = {
103
109
  }
104
110
  );
105
111
  };
106
- L.displayName = "IressAlert";
112
+ _.displayName = "IressAlert";
107
113
  export {
108
- L as IressAlert
114
+ _ as IressAlert
109
115
  };
@@ -1,50 +1,56 @@
1
- import { jsx as r, jsxs as f } from "react/jsx-runtime";
1
+ import { jsx as o, jsxs as v } from "react/jsx-runtime";
2
2
  import "react";
3
- import { useIdIfNeeded as b } from "../../hooks/useIdIfNeeded.js";
4
- import { propagateTestid as G } from "../../helpers/utility/propagateTestid.js";
5
- import { buttonGroup as v } from "./ButtonGroup.styles.js";
6
- import { c as N } from "../../cx-DN21T1EH.js";
7
- import { s as x } from "../../factory-CsinCTPr.js";
8
- import { ButtonGroupProvider as B } from "./ButtonGroupProvider.js";
9
- import { GlobalCSSClass as I } from "../../enums.js";
3
+ import { useIdIfNeeded as N } from "../../hooks/useIdIfNeeded.js";
4
+ import { propagateTestid as x } from "../../helpers/utility/propagateTestid.js";
5
+ import { buttonGroup as l } from "./ButtonGroup.styles.js";
6
+ import { c as B } from "../../css-DNdLYQld.js";
7
+ import { c as I } from "../../cx-DN21T1EH.js";
8
+ import { s as C } from "../../factory-CsinCTPr.js";
9
+ import { s as P } from "../../is-valid-prop-DweT-eOL.js";
10
+ import { ButtonGroupProvider as S } from "./ButtonGroupProvider.js";
11
+ import { GlobalCSSClass as g } from "../../enums.js";
10
12
  const h = ({
11
- children: i,
12
- className: l,
13
- "data-testid": t,
13
+ children: m,
14
+ className: p,
15
+ "data-testid": s,
14
16
  defaultSelected: d,
15
- hiddenLabel: m,
16
- label: p,
17
- multiple: u,
18
- onChange: c,
19
- selected: n,
20
- ...s
17
+ hiddenLabel: r,
18
+ label: c,
19
+ multiple: n,
20
+ onChange: u,
21
+ selected: f,
22
+ ...t
21
23
  }) => {
22
- const e = b({ id: s.id }), a = `${e}--label`, o = v({ hiddenLabel: m });
23
- return /* @__PURE__ */ r(
24
- B,
24
+ const e = N({ id: t.id }), a = `${e}--label`, i = l({ hiddenLabel: r }), b = l.raw({ hiddenLabel: r }), [y, G] = P(t);
25
+ return /* @__PURE__ */ o(
26
+ S,
25
27
  {
26
28
  defaultSelected: d,
27
- multiple: u,
28
- onChange: c,
29
- selected: n,
30
- children: /* @__PURE__ */ f(
31
- x.div,
29
+ multiple: n,
30
+ onChange: u,
31
+ selected: f,
32
+ children: /* @__PURE__ */ v(
33
+ C.div,
32
34
  {
33
- className: N(l, o.root, I.ButtonGroup),
35
+ className: I(
36
+ p,
37
+ B(b.root, y),
38
+ g.ButtonGroup
39
+ ),
34
40
  id: e,
35
- "data-testid": t,
36
- ...s,
41
+ "data-testid": s,
42
+ ...G,
37
43
  children: [
38
- /* @__PURE__ */ r(
44
+ /* @__PURE__ */ o(
39
45
  "div",
40
46
  {
41
- className: o.label,
42
- "data-testid": G(t, "label"),
47
+ className: i.label,
48
+ "data-testid": x(s, "label"),
43
49
  id: a,
44
- children: p
50
+ children: c
45
51
  }
46
52
  ),
47
- /* @__PURE__ */ r("div", { role: "group", "aria-labelledby": a, className: o.values, children: i })
53
+ /* @__PURE__ */ o("div", { role: "group", "aria-labelledby": a, className: i.values, children: m })
48
54
  ]
49
55
  }
50
56
  )
@@ -39,7 +39,7 @@ export type IressCardProps<E extends ElementType = 'div'> = ElementProps<E> & In
39
39
  export type IressButtonCardProps = IressCardProps<'button'>;
40
40
  export type IressLinkCardProps = IressCardProps<'a'>;
41
41
  export declare const IressCard: {
42
- <E extends ElementType = "div">({ element, className, selected, stretch, children, footer, heading, media, prepend, topRight, ...restProps }: IressCardProps<E>): import("react/jsx-runtime").JSX.Element;
42
+ <E extends ElementType = "div">({ element, className, selected, children, footer, heading, media, prepend, topRight, ...restProps }: IressCardProps<E>): import("react/jsx-runtime").JSX.Element;
43
43
  displayName: string;
44
44
  };
45
45
  export declare const IressButtonCard: {
@@ -1,107 +1,114 @@
1
- import { jsx as s, jsxs as E, Fragment as P } from "react/jsx-runtime";
2
- import { s as j } from "../../is-valid-prop-DweT-eOL.js";
3
- import { card as B } from "./Card.styles.js";
1
+ import { jsx as t, jsxs as E, Fragment as j } from "react/jsx-runtime";
2
+ import { s as B } from "../../is-valid-prop-DweT-eOL.js";
3
+ import { card as L } from "./Card.styles.js";
4
4
  import { c as e } from "../../css-DNdLYQld.js";
5
- import { c as L } from "../../cx-DN21T1EH.js";
5
+ import { c as M } from "../../cx-DN21T1EH.js";
6
6
  import { propagateTestid as o } from "../../helpers/utility/propagateTestid.js";
7
- import { useMemo as M } from "react";
8
- import { GlobalCSSClass as w } from "../../enums.js";
7
+ import { useMemo as w } from "react";
8
+ import { GlobalCSSClass as F } from "../../enums.js";
9
9
  const N = ({
10
- element: t,
11
- className: c,
12
- selected: l,
13
- stretch: u,
14
- children: m,
15
- footer: p,
16
- heading: h,
17
- media: d,
18
- prepend: i,
19
- topRight: y,
20
- ...C
10
+ element: s,
11
+ className: l,
12
+ selected: m,
13
+ children: p,
14
+ footer: h,
15
+ heading: y,
16
+ media: i,
17
+ prepend: n,
18
+ topRight: C,
19
+ ...f
21
20
  }) => {
22
- const n = typeof h == "string" ? /* @__PURE__ */ s("h2", { children: h }) : h, v = !!i, f = !!(i ?? y ?? d ?? n ?? p), I = !!n, b = !!d, S = t == "button" || t == "a" || !!C.onClick, a = B.raw({
23
- clickable: S,
21
+ const c = typeof y == "string" ? /* @__PURE__ */ t("h2", { children: y }) : y, I = !!n, u = !!(n ?? C ?? i ?? c ?? h), b = !!c, S = !!i, g = s == "button" || s == "a" || !!f.onClick, [P, v] = B(f), { stretch: k, ...d } = P, a = L.raw({
22
+ clickable: g,
24
23
  // Convert the element to a string for compatibility with the card.raw function
25
- element: String(t),
26
- selected: l,
27
- stretch: u,
28
- hasSlots: f,
29
- hasHeading: I,
30
- hasMedia: b,
31
- hasPrepend: v
32
- }), r = C["data-testid"], [g, k] = j(C), x = M(() => t ?? "div", [t]);
33
- return /* @__PURE__ */ s(
24
+ element: String(s),
25
+ selected: m,
26
+ stretch: !!k,
27
+ hasSlots: u,
28
+ hasHeading: b,
29
+ hasMedia: S,
30
+ hasPrepend: I
31
+ }), r = v["data-testid"], x = w(() => s ?? "div", [s]);
32
+ return /* @__PURE__ */ t(
34
33
  x,
35
34
  {
36
- ...k,
37
- className: L(
38
- e(a.root, g),
39
- c,
40
- w.Card
35
+ ...v,
36
+ className: M(
37
+ e(a.root, d),
38
+ l,
39
+ F.Card
41
40
  ),
42
- children: f ? /* @__PURE__ */ E(P, { children: [
43
- i && /* @__PURE__ */ s(
41
+ children: u ? /* @__PURE__ */ E(j, { children: [
42
+ n && /* @__PURE__ */ t(
44
43
  "div",
45
44
  {
46
- className: e(a.prepend),
45
+ className: e(a.prepend, {
46
+ p: d.p
47
+ }),
47
48
  "data-testid": o(r, "prepend"),
48
- children: i
49
+ children: n
49
50
  }
50
51
  ),
51
- y && /* @__PURE__ */ s(
52
+ C && /* @__PURE__ */ t(
52
53
  "div",
53
54
  {
54
55
  className: e(a.topRight),
55
56
  "data-testid": o(r, "topRight"),
56
- children: y
57
+ children: C
57
58
  }
58
59
  ),
59
- d && /* @__PURE__ */ s(
60
+ i && /* @__PURE__ */ t(
60
61
  "div",
61
62
  {
62
63
  className: e(a.media),
63
64
  "data-testid": o(r, "media"),
64
- children: d
65
+ children: i
65
66
  }
66
67
  ),
67
- n && /* @__PURE__ */ s(
68
+ c && /* @__PURE__ */ t(
68
69
  "div",
69
70
  {
70
- className: e(a.heading),
71
+ className: e(a.heading, {
72
+ p: d.p
73
+ }),
71
74
  "data-testid": o(r, "heading"),
72
- children: n
75
+ children: c
73
76
  }
74
77
  ),
75
- m && /* @__PURE__ */ s(
78
+ p && /* @__PURE__ */ t(
76
79
  "div",
77
80
  {
78
- className: e(a.body),
81
+ className: e(a.body, {
82
+ p: d.p
83
+ }),
79
84
  "data-testid": o(r, "body"),
80
- children: m
85
+ children: p
81
86
  }
82
87
  ),
83
- p && /* @__PURE__ */ s(
88
+ h && /* @__PURE__ */ t(
84
89
  "div",
85
90
  {
86
- className: e(a.footer),
91
+ className: e(a.footer, {
92
+ p: d.p
93
+ }),
87
94
  "data-testid": o(r, "footer"),
88
- children: p
95
+ children: h
89
96
  }
90
97
  )
91
- ] }) : m
98
+ ] }) : p
92
99
  }
93
100
  );
94
101
  };
95
102
  N.displayName = "IressCard";
96
- const F = (t) => {
97
- const { type: c = "button", ...l } = t;
98
- return /* @__PURE__ */ s(N, { element: "button", type: c, ...l });
103
+ const G = (s) => {
104
+ const { type: l = "button", ...m } = s;
105
+ return /* @__PURE__ */ t(N, { element: "button", type: l, ...m });
99
106
  };
100
- F.displayName = "IressButtonCard";
101
- const G = (t) => /* @__PURE__ */ s(N, { element: "a", ...t });
102
- G.displayName = "IressLinkCard";
107
+ G.displayName = "IressButtonCard";
108
+ const H = (s) => /* @__PURE__ */ t(N, { element: "a", ...s });
109
+ H.displayName = "IressLinkCard";
103
110
  export {
104
- F as IressButtonCard,
111
+ G as IressButtonCard,
105
112
  N as IressCard,
106
- G as IressLinkCard
113
+ H as IressLinkCard
107
114
  };
@@ -13,7 +13,7 @@ export declare const expander: import('../../styled-system/types').SlotRecipeRun
13
13
  activator: {
14
14
  display: "flex";
15
15
  justifyContent: "space-between";
16
- alignItems: "flex-end";
16
+ alignItems: "flex-start";
17
17
  width: "[100%]";
18
18
  textStyle: "typography.heading.3";
19
19
  _hover: {
@@ -1,5 +1,5 @@
1
- import { s as e } from "../../sva-B7kca5XO.js";
2
- const r = e({
1
+ import { s as o } from "../../sva-B7kca5XO.js";
2
+ const r = o({
3
3
  slots: [
4
4
  "root",
5
5
  "activator",
@@ -60,7 +60,7 @@ const r = e({
60
60
  activator: {
61
61
  display: "flex",
62
62
  justifyContent: "space-between",
63
- alignItems: "flex-end",
63
+ alignItems: "flex-start",
64
64
  width: "[100%]",
65
65
  textStyle: "typography.heading.3",
66
66
  _hover: {
@@ -4154,10 +4154,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
4154
4154
  justify-content: space-between;
4155
4155
  }
4156
4156
 
4157
- .ai_flex-end {
4158
- align-items: flex-end;
4159
- }
4160
-
4161
4157
  .c_colour\\.neutral\\.90 {
4162
4158
  color: var(--colors-colour\\.neutral\\.90);
4163
4159
  }
@@ -4291,6 +4287,10 @@ const z = `@layer reset, base, tokens, recipes, utilities;
4291
4287
  justify-content: flex-end;
4292
4288
  }
4293
4289
 
4290
+ .ai_flex-end {
4291
+ align-items: flex-end;
4292
+ }
4293
+
4294
4294
  .ai_stretch {
4295
4295
  align-items: stretch;
4296
4296
  }
@@ -4377,7 +4377,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
4377
4377
 
4378
4378
  .scrollable_y {
4379
4379
  overflow-y: auto;
4380
- scrollbar-gutter: stable;
4381
4380
  }
4382
4381
 
4383
4382
  .scrollable_y::-webkit-scrollbar {
@@ -5262,7 +5261,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
5262
5261
 
5263
5262
  .scrollable_x {
5264
5263
  overflow-x: auto;
5265
- scrollbar-gutter: stable;
5266
5264
  }
5267
5265
 
5268
5266
  .scrollable_x::-webkit-scrollbar {
@@ -5295,7 +5293,6 @@ const z = `@layer reset, base, tokens, recipes, utilities;
5295
5293
 
5296
5294
  .scrollable_true {
5297
5295
  overflow: auto;
5298
- scrollbar-gutter: stable;
5299
5296
  }
5300
5297
 
5301
5298
  .scrollable_true::-webkit-scrollbar {