aristid-ds 14.0.0-cdba7e7 → 14.0.0-e1a6d31
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/CHANGELOG.md +48 -17
- package/dist/Kit/App/index.js +14 -14
- package/dist/Kit/DataDisplay/Avatar/index.js +1 -1
- package/dist/Kit/DataDisplay/Avatar/types.d.ts +1 -0
- package/dist/Kit/DataDisplay/IdCard/index.js +59 -24
- package/dist/Kit/DataDisplay/IdCard/types.d.ts +1 -1
- package/dist/Kit/DataDisplay/Tabs/index.js +36 -22
- package/dist/Kit/DataDisplay/Tabs/types.d.ts +1 -1
- package/dist/Kit/DataDisplay/Tag/index.js +20 -20
- package/dist/Kit/DataEntry/AutoComplete/index.js +1 -1
- package/dist/Kit/DataEntry/Checkbox/index.js +1 -1
- package/dist/Kit/DataEntry/ColorPicker/index.js +69 -65
- package/dist/Kit/DataEntry/ColorPicker/types.d.ts +3 -1
- package/dist/Kit/DataEntry/DatePicker/RangePicker.d.ts +1 -12
- package/dist/Kit/DataEntry/DatePicker/index.js +30 -28
- package/dist/Kit/DataEntry/DatePicker/types.d.ts +4 -2
- package/dist/Kit/DataEntry/Input/index.js +34 -30
- package/dist/Kit/DataEntry/Input/types.d.ts +3 -1
- package/dist/Kit/DataEntry/InputNumber/index.js +20 -19
- package/dist/Kit/DataEntry/InputNumber/types.d.ts +2 -1
- package/dist/Kit/DataEntry/InputWrapper/InputWrapper.d.ts +2 -2
- package/dist/Kit/DataEntry/InputWrapper/index.js +1 -1
- package/dist/Kit/DataEntry/Radio/index.js +1 -1
- package/dist/Kit/DataEntry/RichText/index.js +51 -50
- package/dist/Kit/DataEntry/RichText/types.d.ts +1 -0
- package/dist/Kit/DataEntry/Select/index.js +66 -65
- package/dist/Kit/DataEntry/Select/types.d.ts +3 -1
- package/dist/Kit/DataEntry/TreeSelect/index.js +2 -2
- package/dist/Kit/DataEntry/Upload/index.js +21 -21
- package/dist/Kit/Feedback/SnackBar/SnackBarProvider.d.ts +3 -1
- package/dist/Kit/Feedback/SnackBar/index.d.ts +4 -3
- package/dist/Kit/Feedback/SnackBar/index.js +19 -18
- package/dist/Kit/Feedback/SnackBar/snack-bar-function.d.ts +2 -2
- package/dist/Kit/Feedback/SnackBar/types.d.ts +4 -0
- package/dist/Kit/General/Button/index.js +53 -53
- package/dist/Kit/General/Button/types.d.ts +0 -1
- package/dist/Kit/Navigation/DropDown/index.js +40 -40
- package/dist/Kit/Navigation/Header/index.js +28 -28
- package/dist/Kit/Navigation/SideMenu/index.js +33 -33
- package/dist/Kit/index.js +1 -1
- package/dist/assets/Avatar.css +1 -1
- package/dist/assets/index2.css +1 -1
- package/dist/assets/index26.css +1 -1
- package/dist/assets/index34.css +1 -1
- package/dist/assets/index35.css +1 -1
- package/dist/assets/index39.css +1 -1
- package/dist/assets/index42.css +1 -1
- package/dist/assets/index44.css +1 -1
- package/dist/assets/index45.css +1 -1
- package/dist/assets/index5.css +1 -1
- package/dist/assets/index7.css +1 -1
- package/dist/assets/index9.css +1 -1
- package/dist/assets/styles2.css +1 -1
- package/dist/chunks/Avatar.BvI60jet.js +47 -0
- package/dist/chunks/InputWrapper.hIFFr5AB.js +27 -0
- package/dist/chunks/SnackBarProvider.hc5vyNRJ.js +23 -0
- package/dist/chunks/{styles.module.iV2bcv-5.js → styles.module.V-A2OGgm.js} +1 -1
- package/dist/index.es.js +1 -1
- package/dist/index.umd.js +4 -4
- package/package.json +3 -3
- package/dist/chunks/Avatar.N2w2jq_C.js +0 -30
- package/dist/chunks/InputWrapper.XK7lKnUm.js +0 -24
- package/dist/chunks/SnackBarProvider.T-xLQpTN.js +0 -23
package/CHANGELOG.md
CHANGED
|
@@ -2,41 +2,62 @@
|
|
|
2
2
|
|
|
3
3
|
## [X.Y.Z](https://www.npmjs.com/package/aristid-ds/v/X.Y.Z) (2025-MM-DD)
|
|
4
4
|
|
|
5
|
-
### ✨ Features
|
|
6
|
-
|
|
5
|
+
### ✨ Features
|
|
6
|
+
|
|
7
|
+
- **⚠️ Breaking change - Button**:
|
|
8
|
+
- Remove `checked` prop from segmented button (@evoiron)
|
|
9
|
+
- **⚠️ Breaking change - IdCard**:
|
|
10
|
+
- Replacing `size` options (@fatb38)
|
|
11
|
+
- removing `medium` and `large`
|
|
12
|
+
- adding `xxs-medium`, `xs-medium`, `xs-bold`, `s`, `m`, `l`, `xl`
|
|
13
|
+
- **⚠️ Breaking change - Input**:
|
|
14
|
+
- Rename `readonly` property to `readonlyLight` (@philippechevieux)
|
|
15
|
+
- Add `readonly` property whith a render similar to disabled state (@philippechevieux)
|
|
16
|
+
- **⚠️ Breaking change - DatePicker/RangePicker**:
|
|
17
|
+
- Rename `readonly` property to `readonlyLight` (@philippechevieux)
|
|
18
|
+
- Add `readonly` property whith a render similar to disabled state (@philippechevieux)
|
|
7
19
|
- Add `size` property to enable `small`, `middle` and `large` sizes (@fatb38)
|
|
8
|
-
|
|
9
|
-
-
|
|
20
|
+
- **⚠️ Breaking change - RichText**:
|
|
21
|
+
- Rename `readonly` property to `readonlyLight` (@philippechevieux)
|
|
22
|
+
- Add `readonly` property whith a render similar to disabled state (@philippechevieux)
|
|
23
|
+
- **⚠️ Breaking change - Select**:
|
|
24
|
+
- Rename `readonly` property to `readonlyLight` (@philippechevieux)
|
|
25
|
+
- Add `readonly` property whith a render similar to disabled state (@philippechevieux)
|
|
10
26
|
- Add `size` property to enable `small`, `middle` and `large` sizes (@fatb38)
|
|
11
|
-
|
|
12
|
-
-
|
|
27
|
+
- **⚠️ Breaking change - Avatar**:
|
|
28
|
+
- Replace `size` option by : `xs`, `s`, `m`, `l`, `xl` (@fatb38)
|
|
29
|
+
- **Header**:
|
|
30
|
+
- Change 'height' to 48px instead of 64px
|
|
31
|
+
- **SideMenu**:
|
|
32
|
+
- Change 'width' to 48px instead of 64px
|
|
33
|
+
- **AutoComplete**:
|
|
13
34
|
- Add `size` property to enable `small`, `middle` and `large` sizes (@fatb38)
|
|
14
|
-
|
|
15
|
-
- **Input**:
|
|
35
|
+
- **ColorPicker**:
|
|
16
36
|
- Add `size` property to enable `small`, `middle` and `large` sizes (@fatb38)
|
|
17
|
-
|
|
37
|
+
- Add `readonly` property whith a render similar to disabled state (@philippechevieux)
|
|
18
38
|
- **InputNumber**:
|
|
19
39
|
- Add `size` property to enable `small`, `middle` and `large` sizes (@fatb38)
|
|
20
|
-
|
|
21
|
-
- **Select**:
|
|
22
|
-
- Add `size` property to enable `small`, `middle` and `large` sizes (@fatb38)
|
|
23
|
-
|
|
40
|
+
- Add `readonly` property whith a render similar to disabled state (@philippechevieux)
|
|
24
41
|
- **SidePanel**:
|
|
25
42
|
- Add opening and closing animations (@philippechevieux)
|
|
26
43
|
- Add `l` size (@7Remy)
|
|
27
|
-
|
|
28
|
-
- **SidePanel:**
|
|
29
44
|
- Add `useChildrenOnly` property to display the side panel as a container for other components or not. Also export two new components `KitSidePanelHeader` and `KitSidePanelContent` for layout purpose (@philippechevieux)
|
|
30
45
|
- Add `headerExtraButtons` property to display buttons or any components on the right side of the header next to the close button (@philippechevieux)
|
|
31
46
|
- Add `showSeparator` property to display a separator between header and content (@philippechevieux)
|
|
32
47
|
- Allow user to use `size` property when using `idCardProps` (@philippechevieux)
|
|
33
48
|
- Reduce internal paddings to save space (@philippechevieux)
|
|
34
|
-
|
|
35
49
|
- **IdCard:**
|
|
36
50
|
- Add support for ReactNode in `title` and `descriptions` props to allow custom rendering (@philippechevieux)
|
|
37
|
-
|
|
51
|
+
- **Tabs:**
|
|
52
|
+
- Add `xsmall` size (@florianSimonAristid)
|
|
38
53
|
- **All components with a DropDown:**
|
|
39
54
|
- All components using a dropdown inside a `SidePanel` component, will render the dropdown inside the `SidePanel`, to avoid issues with the `closeOnOutsideClick` property of `SidePanel` (@evoiron)
|
|
55
|
+
- **Snackbar**
|
|
56
|
+
- Allow multiple snackbar areas (@evoiron)
|
|
57
|
+
- **Button**
|
|
58
|
+
- Add size `m`and `s` to segmented button (@evoiron)
|
|
59
|
+
- **InputWrapper**:
|
|
60
|
+
- Add forwardRef support to enable ref forwarding to the wrapper element (@philippechevieux)
|
|
40
61
|
|
|
41
62
|
### 🐛 Bug Fixes
|
|
42
63
|
|
|
@@ -45,6 +66,16 @@
|
|
|
45
66
|
- **DropDown:**
|
|
46
67
|
- Clicking outside the `DropDown` now closes it even when inside an iframe (@philippechevieux)
|
|
47
68
|
- Keep the `DropDown` open when selecting items (@philippechevieux)
|
|
69
|
+
- Fix double toggle issue when clicking the trigger after closing via blur (@philippechevieux)
|
|
70
|
+
- **Upload:**
|
|
71
|
+
- Fix upload dragger height unexpectedly growing in some cases (@evoiron)
|
|
72
|
+
|
|
73
|
+
### 📚 Documentation
|
|
74
|
+
|
|
75
|
+
- **Table**:
|
|
76
|
+
- Add `onRow` usage (@philippechevieux)
|
|
77
|
+
- **Filter**:
|
|
78
|
+
- Update `With custom Action` exemple implementation (@philippechevieux)
|
|
48
79
|
|
|
49
80
|
## [14.0.0](https://www.npmjs.com/package/aristid-ds/v/14.0.0) (2025-05-20)
|
|
50
81
|
|
package/dist/Kit/App/index.js
CHANGED
|
@@ -2,20 +2,20 @@ import "../../assets/index29.css";
|
|
|
2
2
|
import { jsx as n, jsxs as f, Fragment as h } from "react/jsx-runtime";
|
|
3
3
|
import { useState as u, useLayoutEffect as L, useRef as S, useEffect as P } from "react";
|
|
4
4
|
import { ConfigProvider as C } from "antd";
|
|
5
|
-
import {
|
|
5
|
+
import { I as b } from "../../chunks/SnackBarProvider.hc5vyNRJ.js";
|
|
6
6
|
import { toCssVariables as g, uuid as y } from "../../utils/functions/index.js";
|
|
7
7
|
import a from "lodash/merge";
|
|
8
8
|
import { Style as m } from "react-style-tag";
|
|
9
9
|
import { K as E } from "../../chunks/useKitTheme.KSAU-Pdv.js";
|
|
10
10
|
import { KitAristidThemeGeneral as l } from "../../theme/aristid/general/index.js";
|
|
11
|
-
import { antdThemeConfig as
|
|
11
|
+
import { antdThemeConfig as I } from "../../theme/utils/tokens-mapper/index.js";
|
|
12
12
|
import { frFR as d } from "../../translation/fr-FR/index.js";
|
|
13
|
-
import { enUS as
|
|
14
|
-
import { K as
|
|
15
|
-
import { mapKitLocaleToAntdLocale as
|
|
16
|
-
import { d as
|
|
13
|
+
import { enUS as T } from "../../translation/en-US/index.js";
|
|
14
|
+
import { K as $, u as j } from "../../chunks/useKitLocale.96CdK3og.js";
|
|
15
|
+
import { mapKitLocaleToAntdLocale as k } from "../../translation/utils/index.js";
|
|
16
|
+
import { d as x } from "../../chunks/notification-provider.9msrEKBe.js";
|
|
17
17
|
import { KitEmpty as p } from "../DataDisplay/Empty/index.js";
|
|
18
|
-
const
|
|
18
|
+
const A = "aristid-ds-global", F = (t, e) => {
|
|
19
19
|
const o = g(t);
|
|
20
20
|
return `
|
|
21
21
|
.${e} {
|
|
@@ -27,11 +27,11 @@ const F = "aristid-ds-global", I = (t, e) => {
|
|
|
27
27
|
return L(() => {
|
|
28
28
|
const s = g(l, "--general");
|
|
29
29
|
i(s);
|
|
30
|
-
}, []), n(E.Provider, { value: { theme: v, appId: c, spacing: K }, children: r !== null && f(h, { children: [n(m, { id:
|
|
30
|
+
}, []), n(E.Provider, { value: { theme: v, appId: c, spacing: K }, children: r !== null && f(h, { children: [n(m, { id: A, hasSourceMap: !1, children: `
|
|
31
31
|
:root {
|
|
32
32
|
${Object.keys(r).map((s) => `${s}: ${r[s]}`).join(";")}
|
|
33
33
|
}
|
|
34
|
-
` }), e && n(m, { hasSourceMap: !1, children:
|
|
34
|
+
` }), e && n(m, { hasSourceMap: !1, children: F(a({ general: { utilities: l.utilities } }, e), c) }), t] }) });
|
|
35
35
|
}, _ = (t, e) => {
|
|
36
36
|
var o;
|
|
37
37
|
const r = S(t || "ds-" + y().substring(0, 8)), i = a(l.spacing, (o = e == null ? void 0 : e.general) === null || o === void 0 ? void 0 : o.spacing);
|
|
@@ -42,7 +42,7 @@ const F = "aristid-ds-global", I = (t, e) => {
|
|
|
42
42
|
};
|
|
43
43
|
}, M = ({ children: t }) => {
|
|
44
44
|
const e = N();
|
|
45
|
-
return n(
|
|
45
|
+
return n($.Provider, { value: e, children: t });
|
|
46
46
|
}, N = () => {
|
|
47
47
|
const [t, e] = u(d);
|
|
48
48
|
return { locale: t, setKitLocale: (r) => {
|
|
@@ -50,18 +50,18 @@ const F = "aristid-ds-global", I = (t, e) => {
|
|
|
50
50
|
const i = a(d, r);
|
|
51
51
|
e(i);
|
|
52
52
|
} else {
|
|
53
|
-
const i = a(
|
|
53
|
+
const i = a(T, r);
|
|
54
54
|
e(i);
|
|
55
55
|
}
|
|
56
56
|
} };
|
|
57
57
|
}, te = ({ children: t, locale: e, customTheme: o, id: r }) => n(R, { customTheme: o, id: r, children: n(M, { children: n(O, { locale: e, children: t }) }) }), O = ({ children: t, locale: e }) => {
|
|
58
|
-
const { locale: o, setKitLocale: r } =
|
|
58
|
+
const { locale: o, setKitLocale: r } = j();
|
|
59
59
|
return P(() => {
|
|
60
60
|
e !== void 0 && r(e);
|
|
61
|
-
}, [e, r]), n(C, { theme:
|
|
61
|
+
}, [e, r]), n(C, { theme: I, locale: k(e), renderEmpty: () => {
|
|
62
62
|
var i;
|
|
63
63
|
return n(p, { className: "default-render", image: p.ASSET_LIST, description: (i = o.Empty) === null || i === void 0 ? void 0 : i.noData });
|
|
64
|
-
}, children: f(
|
|
64
|
+
}, children: f(x, { children: [n(b, {}), t] }) });
|
|
65
65
|
};
|
|
66
66
|
export {
|
|
67
67
|
te as KitApp
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { s as t, K as n } from "../../../chunks/Avatar.
|
|
1
|
+
import { s as t, K as n } from "../../../chunks/Avatar.BvI60jet.js";
|
|
2
2
|
import { jsx as u } from "react/jsx-runtime";
|
|
3
3
|
import { Avatar as c } from "antd";
|
|
4
4
|
import { u as d } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
|
|
@@ -1,37 +1,72 @@
|
|
|
1
1
|
import "../../../assets/index2.css";
|
|
2
|
-
import { jsxs as
|
|
2
|
+
import { jsxs as y, jsx as a } from "react/jsx-runtime";
|
|
3
3
|
import n from "classnames";
|
|
4
|
-
import { t as
|
|
5
|
-
import { u as
|
|
6
|
-
import { K as
|
|
7
|
-
import { KitTooltip as
|
|
4
|
+
import { t as S } from "../../../chunks/styles.module.shsViPAW.js";
|
|
5
|
+
import { u as T } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
|
|
6
|
+
import { K as v } from "../../../chunks/Avatar.BvI60jet.js";
|
|
7
|
+
import { KitTooltip as d } from "../Tooltip/index.js";
|
|
8
8
|
import { T as m } from "../../../chunks/constants.DINGxt3I.js";
|
|
9
|
-
const
|
|
10
|
-
"kit-id-card": "_kit-id-
|
|
9
|
+
const D = {
|
|
10
|
+
"kit-id-card": "_kit-id-card_1vabr_2"
|
|
11
11
|
}, h = [
|
|
12
|
-
|
|
12
|
+
S["kit-typography-text"],
|
|
13
13
|
"ant-typography",
|
|
14
14
|
"ant-typography-text",
|
|
15
15
|
"ant-typography-ellipsis",
|
|
16
16
|
"ant-typography-ellipsis-single-line"
|
|
17
|
-
],
|
|
18
|
-
|
|
19
|
-
"
|
|
20
|
-
|
|
17
|
+
], z = (t) => {
|
|
18
|
+
switch (t) {
|
|
19
|
+
case "xl":
|
|
20
|
+
return "kit-typography-fontSize5";
|
|
21
|
+
case "l":
|
|
22
|
+
return "kit-typography-fontSize6";
|
|
23
|
+
default:
|
|
24
|
+
return "kit-typography-fontSize7";
|
|
25
|
+
}
|
|
26
|
+
}, N = (t) => {
|
|
27
|
+
switch (t) {
|
|
28
|
+
case "xl":
|
|
29
|
+
return "kit-typography-fontSize1";
|
|
30
|
+
case "l":
|
|
31
|
+
return "kit-typography-fontSize2";
|
|
32
|
+
case "m":
|
|
33
|
+
return "kit-typography-fontSize3";
|
|
34
|
+
case "s":
|
|
35
|
+
return "kit-typography-fontSize4";
|
|
36
|
+
case "xs-bold":
|
|
37
|
+
case "xs-medium":
|
|
38
|
+
case "xxs-medium":
|
|
39
|
+
return "kit-typography-fontSize5";
|
|
40
|
+
}
|
|
41
|
+
}, _ = (t) => {
|
|
42
|
+
switch (t) {
|
|
43
|
+
case "xl":
|
|
44
|
+
case "l":
|
|
45
|
+
return "xl";
|
|
46
|
+
case "m":
|
|
47
|
+
case "s":
|
|
48
|
+
return "l";
|
|
49
|
+
case "xxs-medium":
|
|
50
|
+
return "s";
|
|
51
|
+
default:
|
|
52
|
+
return "m";
|
|
53
|
+
}
|
|
54
|
+
}, E = (t, e, r, i) => {
|
|
55
|
+
const s = n("kit-id-card-title", ...h, N(e), {
|
|
56
|
+
"ant-typography-bold": e !== "xs-medium",
|
|
57
|
+
"ant-typography-disabled": r
|
|
21
58
|
});
|
|
22
|
-
return
|
|
23
|
-
},
|
|
24
|
-
const s = n("kit-id-card-description", ...h, "ant-typography-regular", {
|
|
25
|
-
"
|
|
26
|
-
"kit-typography-fontSize7": t === "medium",
|
|
27
|
-
"ant-typography-disabled": a
|
|
59
|
+
return a("span", { className: s, children: a(d, { title: i ? "" : t, mouseEnterDelay: m, children: a("span", { children: t }) }) });
|
|
60
|
+
}, K = (t, e, r, i) => {
|
|
61
|
+
const s = n("kit-id-card-description", ...h, "ant-typography-regular", z(e), {
|
|
62
|
+
"ant-typography-disabled": r
|
|
28
63
|
});
|
|
29
|
-
return
|
|
30
|
-
},
|
|
31
|
-
const { appId:
|
|
32
|
-
return
|
|
64
|
+
return a("span", { className: s, children: a(d, { title: i ? "" : t, mouseEnterDelay: m, children: a("span", { children: t }) }) });
|
|
65
|
+
}, I = ({ className: t, title: e, description: r, avatarProps: i, size: s = "xs-bold", disabled: o = !1, disableTooltip: c = !1, ...u }) => {
|
|
66
|
+
const { appId: g } = T(), f = n(g, D["kit-id-card"], t), x = i !== void 0, p = e !== void 0, l = r !== void 0, k = p || l;
|
|
67
|
+
return y("div", { className: `${f} id-card-grid`, ...u, children: [x && a("div", { className: "card-avatar", children: a(v, { size: _(s), ...i, disabled: o }) }), k && y("div", { className: "card-info", children: [p && typeof e == "string" ? E(e, s, o, c) : e, l && typeof r == "string" ? K(r, s, o, c) : r] })] });
|
|
33
68
|
};
|
|
34
|
-
|
|
69
|
+
I.displayName = "KitIdCard";
|
|
35
70
|
export {
|
|
36
|
-
|
|
71
|
+
I as KitIdCard
|
|
37
72
|
};
|
|
@@ -4,7 +4,7 @@ import {IKitAvatar} from '../Avatar/types';
|
|
|
4
4
|
|
|
5
5
|
export interface IKitIdCard extends KitHTMLAttributes<HTMLDivElement> {
|
|
6
6
|
avatarProps?: IKitAvatar;
|
|
7
|
-
size?: 'medium' | '
|
|
7
|
+
size?: 'xxs-medium' | 'xs-medium' | 'xs-bold' | 's' | 'm' | 'l' | 'xl';
|
|
8
8
|
title?: ReactNode;
|
|
9
9
|
description?: ReactNode;
|
|
10
10
|
disabled?: boolean;
|
|
@@ -1,30 +1,44 @@
|
|
|
1
1
|
import "../../../assets/index5.css";
|
|
2
|
-
import { jsxs as
|
|
3
|
-
import { useState as
|
|
4
|
-
import { u as
|
|
5
|
-
import
|
|
6
|
-
import { KitButton as
|
|
7
|
-
import { KitTypography as
|
|
2
|
+
import { jsxs as a, Fragment as I, jsx as e } from "react/jsx-runtime";
|
|
3
|
+
import { useState as D } from "react";
|
|
4
|
+
import { u as E } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
|
|
5
|
+
import x from "classnames";
|
|
6
|
+
import { KitButton as j } from "../../General/Button/index.js";
|
|
7
|
+
import { KitTypography as z } from "../../General/Typography/index.js";
|
|
8
8
|
import { KitBadge as C } from "../Badge/index.js";
|
|
9
9
|
import { FontAwesomeIcon as O } from "@fortawesome/react-fontawesome";
|
|
10
10
|
import { faPlus as U } from "@fortawesome/free-solid-svg-icons";
|
|
11
|
-
import { F as
|
|
12
|
-
const
|
|
13
|
-
"kit-tabs": "_kit-
|
|
14
|
-
},
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
11
|
+
import { F as L } from "../../../chunks/constants.DINGxt3I.js";
|
|
12
|
+
const P = {
|
|
13
|
+
"kit-tabs": "_kit-tabs_1kygn_2"
|
|
14
|
+
}, X = (s) => {
|
|
15
|
+
switch (s) {
|
|
16
|
+
case "xsmall":
|
|
17
|
+
return "fontSize7";
|
|
18
|
+
case "small":
|
|
19
|
+
return "fontSize6";
|
|
20
|
+
case "medium":
|
|
21
|
+
return "fontSize4";
|
|
22
|
+
default:
|
|
23
|
+
return "fontSize4";
|
|
24
|
+
}
|
|
25
|
+
}, g = ({ addTab: s, centered: _, className: h, activeKey: m, defaultKey: d, items: i, onChange: o, fullwidthTab: b, size: l = "small", variant: n = "classic" }) => {
|
|
26
|
+
var u, p;
|
|
27
|
+
const { appId: w } = E(), [y, f] = D(d ?? ((u = i[0]) === null || u === void 0 ? void 0 : u.key)), k = m ?? y, N = (p = i.find((t) => t.key === k)) === null || p === void 0 ? void 0 : p.tabContent, K = x(w, h, P["kit-tabs"], _ ? "centered" : "", l ?? "medium", n, b ? "fullwidth" : "", N && n === "pill" ? "tabs-bottom-spacing" : ""), T = (t) => {
|
|
28
|
+
f(t), o == null || o(t);
|
|
29
|
+
}, A = (t, r) => {
|
|
30
|
+
t.code === "Enter" && (f(r), o == null || o(r));
|
|
20
31
|
};
|
|
21
|
-
return
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
32
|
+
return a(I, { children: [a("div", { className: K, role: "tablist", children: [i == null ? void 0 : i.map(({ icon: t, label: r, badgeCount: S, key: c, disabled: v }) => {
|
|
33
|
+
const B = k === c;
|
|
34
|
+
return a("div", { className: x("kit-tab", "kit-tab-" + l, n, {
|
|
35
|
+
disabled: v,
|
|
36
|
+
active: B,
|
|
37
|
+
fullwidth: b
|
|
38
|
+
}), role: "tab", tabIndex: L, onClick: v ? void 0 : () => T(c), onKeyDown: v ? void 0 : (F) => A(F, c), children: [t && e("div", { className: "kit-tab-icon", children: t }), a("div", { className: "kit-tab-label-wrapper", children: [e(z.Text, { className: "kit-tab-label", size: X(l), children: r }), !!S && e(C, { className: "kit-tab-count", count: S })] })] }, c);
|
|
39
|
+
}), s && n === "classic" && e(j, { disableSecureClick: !0, type: "tertiary", icon: e(O, { icon: U }), onClick: s })] }), N] });
|
|
26
40
|
};
|
|
27
|
-
|
|
41
|
+
g.displayName = "KitTabs";
|
|
28
42
|
export {
|
|
29
|
-
|
|
43
|
+
g as KitTabs
|
|
30
44
|
};
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import "../../../assets/index38.css";
|
|
2
|
-
import { jsx as t, Fragment as
|
|
2
|
+
import { jsx as t, Fragment as A, jsxs as W } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef as D, useState as G, useRef as O, useLayoutEffect as L } from "react";
|
|
4
|
-
import
|
|
4
|
+
import E from "classnames";
|
|
5
5
|
import { Tag as z } from "antd";
|
|
6
|
-
import { u as
|
|
6
|
+
import { u as $ } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
|
|
7
7
|
import { FontAwesomeIcon as P } from "@fortawesome/react-fontawesome";
|
|
8
8
|
import { faXmark as X } from "@fortawesome/free-solid-svg-icons";
|
|
9
9
|
import { KitIdCard as j } from "../IdCard/index.js";
|
|
@@ -16,31 +16,31 @@ const I = {
|
|
|
16
16
|
"kit-tag-group": "_kit-tag-group_6ocqb_111",
|
|
17
17
|
"kit-tag-group-measure": "_kit-tag-group-measure_6ocqb_117",
|
|
18
18
|
"kit-tag-group-container": "_kit-tag-group-container_6ocqb_124"
|
|
19
|
-
}, h = D(({ className: r, closeIcon: s, type:
|
|
20
|
-
const { appId: b } =
|
|
21
|
-
[`kit-tag-${
|
|
19
|
+
}, h = D(({ className: r, closeIcon: s, type: c = "neutral", disabled: i, disableTooltip: a = !1, onClick: p, idCardProps: o, ...d }, u) => {
|
|
20
|
+
const { appId: b } = $(), _ = E(b, I["kit-tag"], r, {
|
|
21
|
+
[`kit-tag-${c}`]: c,
|
|
22
22
|
"kit-tag-disabled": i,
|
|
23
23
|
"kit-tag-clickable": p
|
|
24
24
|
});
|
|
25
|
-
return t(z, { tabIndex: i ? M : R, ref: u, ...d, className: _, closeIcon: s ?? t(P, { icon: X }), onClick: p, closable: !!d.onClose, children: t(j, { disabled: i, disableTooltip:
|
|
26
|
-
}), H = ({ tags: r, containerRef: s, measureRef:
|
|
27
|
-
var
|
|
28
|
-
const [p, o] = G([]), [d, u] = G(0), [b, _] = G(t(
|
|
25
|
+
return t(z, { tabIndex: i ? M : R, ref: u, ...d, className: _, closeIcon: s ?? t(P, { icon: X }), onClick: p, closable: !!d.onClose, children: t(j, { disabled: i, disableTooltip: a, avatarProps: o != null && o.avatarProps ? { ...o == null ? void 0 : o.avatarProps, size: "xs" } : void 0, description: o == null ? void 0 : o.description }) });
|
|
26
|
+
}), H = ({ tags: r, containerRef: s, measureRef: c, handleCloseTag: i }) => {
|
|
27
|
+
var a;
|
|
28
|
+
const [p, o] = G([]), [d, u] = G(0), [b, _] = G(t(A, {})), v = O(null), { locale: T } = F();
|
|
29
29
|
return L(() => {
|
|
30
30
|
const K = () => {
|
|
31
31
|
var k, g, e;
|
|
32
|
-
const l = s.current, f =
|
|
32
|
+
const l = s.current, f = c.current;
|
|
33
33
|
if (!l || !f)
|
|
34
34
|
return;
|
|
35
|
-
_(W(
|
|
35
|
+
_(W(A, { children: [r.map((n, y) => t(h, { type: n == null ? void 0 : n.type, disabled: n == null ? void 0 : n.disabled, idCardProps: n.idCardProps, onClose: () => {
|
|
36
36
|
i == null || i(y);
|
|
37
37
|
} }, y)), t(h, { idCardProps: { description: `+${d} ${(k = T.General) === null || k === void 0 ? void 0 : k.others}` } })] }));
|
|
38
38
|
const q = l == null ? void 0 : l.clientWidth, w = Array.from(f.children), B = (g = w[w.length - 1]) === null || g === void 0 ? void 0 : g.clientWidth;
|
|
39
|
-
let
|
|
39
|
+
let x = 0, C = 0;
|
|
40
40
|
for (let n = 0; n < w.length - 1; n++) {
|
|
41
41
|
const y = ((e = w[n]) === null || e === void 0 ? void 0 : e.clientWidth) + 8;
|
|
42
|
-
if (
|
|
43
|
-
|
|
42
|
+
if (x + y + 8 + (n < r.length - 1 ? B : 0) <= q)
|
|
43
|
+
x += y, C++;
|
|
44
44
|
else
|
|
45
45
|
break;
|
|
46
46
|
}
|
|
@@ -53,20 +53,20 @@ const I = {
|
|
|
53
53
|
return K(), v.current = new ResizeObserver(N), s.current && v.current.observe(s.current), () => {
|
|
54
54
|
v.current && v.current.disconnect(), clearTimeout(m);
|
|
55
55
|
};
|
|
56
|
-
}, [s, i, d, (
|
|
56
|
+
}, [s, i, d, (a = T.General) === null || a === void 0 ? void 0 : a.others, c, r]), {
|
|
57
57
|
measureTags: b,
|
|
58
58
|
visibleTags: p,
|
|
59
59
|
hiddenCount: d
|
|
60
60
|
};
|
|
61
|
-
}, J = ({ tags: r, style: s, className:
|
|
61
|
+
}, J = ({ tags: r, style: s, className: c, handleCloseTag: i, othersTagType: a = "neutral", othersTagDisabled: p }) => {
|
|
62
62
|
var o;
|
|
63
|
-
const d = O(null), u = O(null), { locale: b } = F(), { appId: _ } =
|
|
63
|
+
const d = O(null), u = O(null), { locale: b } = F(), { appId: _ } = $(), [v, T] = G(!1), { measureTags: K, visibleTags: m, hiddenCount: N } = H({ tags: r, containerRef: d, measureRef: u, handleCloseTag: i }), k = () => r.slice(m.length).map((e, l) => {
|
|
64
64
|
var f;
|
|
65
65
|
return t("div", { children: (f = e.idCardProps) === null || f === void 0 ? void 0 : f.description }, l);
|
|
66
|
-
}), g =
|
|
66
|
+
}), g = E(_, I["kit-tag-group"], c);
|
|
67
67
|
return W("div", { className: I["kit-tag-group-container"], children: [W("div", { ref: d, style: s, className: g, children: [m.map((e, l) => t(h, { type: e == null ? void 0 : e.type, disabled: e == null ? void 0 : e.disabled, idCardProps: e.idCardProps, onClose: i ? () => {
|
|
68
68
|
i(l);
|
|
69
|
-
} : void 0 }, l)), N > 0 && t(V, { overlay: k(), children: t(h, { type:
|
|
69
|
+
} : void 0 }, l)), N > 0 && t(V, { overlay: k(), children: t(h, { type: a, disabled: p, disableTooltip: !0, idCardProps: { description: `+${N} ${(o = b.General) === null || o === void 0 ? void 0 : o.others}` }, onClick: () => T(!0) }) }), t(U, { isOpen: v, close: () => T(!1), showCloseIcon: !0, title: "Tags", appElement: document.body, children: t("div", { style: { display: "flex", flexWrap: "wrap", rowGap: "8px" }, children: r.map((e, l) => t(h, { id: `tag-${l}`, type: e == null ? void 0 : e.type, disabled: e == null ? void 0 : e.disabled, idCardProps: e.idCardProps, onClose: i ? () => {
|
|
70
70
|
i(l);
|
|
71
71
|
} : void 0 }, l)) }) })] }), t("div", { ref: u, className: I["kit-tag-group-measure"], "aria-hidden": "true", children: K })] });
|
|
72
72
|
}, Q = J, S = h;
|
|
@@ -3,7 +3,7 @@ import { jsx as e } from "react/jsx-runtime";
|
|
|
3
3
|
import { forwardRef as O, useState as b, useRef as j } from "react";
|
|
4
4
|
import { AutoComplete as B } from "antd";
|
|
5
5
|
import { KitInput as M } from "../Input/index.js";
|
|
6
|
-
import { K as S } from "../../../chunks/InputWrapper.
|
|
6
|
+
import { K as S } from "../../../chunks/InputWrapper.hIFFr5AB.js";
|
|
7
7
|
import { FontAwesomeIcon as W } from "@fortawesome/react-fontawesome";
|
|
8
8
|
import { faMagnifyingGlass as q } from "@fortawesome/free-solid-svg-icons";
|
|
9
9
|
import z from "classnames";
|
|
@@ -7,7 +7,7 @@ import { u as ae } from "../../../chunks/useKitTheme.KSAU-Pdv.js";
|
|
|
7
7
|
import ne from "rc-util/es/omit";
|
|
8
8
|
import { ConfigContext as ie } from "antd/es/config-provider/";
|
|
9
9
|
import ce from "antd/es/checkbox/style";
|
|
10
|
-
import { K as ue } from "../../../chunks/InputWrapper.
|
|
10
|
+
import { K as ue } from "../../../chunks/InputWrapper.hIFFr5AB.js";
|
|
11
11
|
const j = P(null), te = ({ defaultValue: b, children: v, options: a = [], prefixCls: f, className: e, wrapperClassName: x, status: g, rootClassName: t, style: i, onChange: d, label: h, helper: o, required: r, actions: B, extra: k, ...n }, D) => {
|
|
12
12
|
const { getPrefixCls: E, direction: T } = R(ie), [m, K] = w(n.value || b || []), [W, S] = w([]);
|
|
13
13
|
I(() => {
|