@kopexa/chip 17.1.77 → 17.2.0
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/badge.d.mts +38 -0
- package/dist/badge.d.ts +38 -0
- package/dist/badge.js +72 -0
- package/dist/badge.mjs +7 -0
- package/dist/chunk-GBHBWHH6.mjs +49 -0
- package/dist/index.d.mts +1 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +82 -36
- package/dist/index.mjs +4 -0
- package/package.json +6 -6
package/dist/badge.d.mts
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { BadgeVariantProps } from '@kopexa/theme';
|
|
3
|
+
import { ComponentProps, ReactNode } from 'react';
|
|
4
|
+
|
|
5
|
+
type BadgeProps = ComponentProps<"span"> & BadgeVariantProps & {
|
|
6
|
+
/**
|
|
7
|
+
* Element rendered before the badge children. Use for an icon
|
|
8
|
+
* (e.g. a status dot) or a short prefix like "v3" that the rest of
|
|
9
|
+
* the badge text qualifies. When `dividerAfterStart` is `true`, a
|
|
10
|
+
* thin separator is drawn between `startContent` and the children
|
|
11
|
+
* — the "v3 | needs attention" pattern.
|
|
12
|
+
*/
|
|
13
|
+
startContent?: ReactNode;
|
|
14
|
+
/** Element rendered after the badge children — typically an icon. */
|
|
15
|
+
endContent?: ReactNode;
|
|
16
|
+
/**
|
|
17
|
+
* Render a thin vertical separator between `startContent` and the
|
|
18
|
+
* main children. No-op when `startContent` is not set. Default `false`.
|
|
19
|
+
*/
|
|
20
|
+
dividerAfterStart?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Override the badge with a custom hex color (e.g. `#3b82f6`). When
|
|
23
|
+
* set, the badge renders with a tinted background derived from the
|
|
24
|
+
* color and the color itself as the foreground — matching the
|
|
25
|
+
* tinted look of `success`/`warning`. Use this for entities that
|
|
26
|
+
* carry their own brand color (categories, labels, confidentiality
|
|
27
|
+
* levels). Takes precedence over `variant` colors.
|
|
28
|
+
*/
|
|
29
|
+
customColor?: string;
|
|
30
|
+
};
|
|
31
|
+
/**
|
|
32
|
+
* Badge — small, non-interactive status pill. Pick this when you need
|
|
33
|
+
* an at-a-glance label (status, category, tag) and don't need close
|
|
34
|
+
* buttons, indicators or compound slots; reach for `<Chip>` when you do.
|
|
35
|
+
*/
|
|
36
|
+
declare const Badge: ({ className, variant, size, startContent, endContent, dividerAfterStart, customColor, style, children, ...rest }: BadgeProps) => react_jsx_runtime.JSX.Element;
|
|
37
|
+
|
|
38
|
+
export { Badge, type BadgeProps };
|
package/dist/badge.d.ts
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import { BadgeVariantProps } from '@kopexa/theme';
|
|
3
|
+
import { ComponentProps, ReactNode } from 'react';
|
|
4
|
+
|
|
5
|
+
type BadgeProps = ComponentProps<"span"> & BadgeVariantProps & {
|
|
6
|
+
/**
|
|
7
|
+
* Element rendered before the badge children. Use for an icon
|
|
8
|
+
* (e.g. a status dot) or a short prefix like "v3" that the rest of
|
|
9
|
+
* the badge text qualifies. When `dividerAfterStart` is `true`, a
|
|
10
|
+
* thin separator is drawn between `startContent` and the children
|
|
11
|
+
* — the "v3 | needs attention" pattern.
|
|
12
|
+
*/
|
|
13
|
+
startContent?: ReactNode;
|
|
14
|
+
/** Element rendered after the badge children — typically an icon. */
|
|
15
|
+
endContent?: ReactNode;
|
|
16
|
+
/**
|
|
17
|
+
* Render a thin vertical separator between `startContent` and the
|
|
18
|
+
* main children. No-op when `startContent` is not set. Default `false`.
|
|
19
|
+
*/
|
|
20
|
+
dividerAfterStart?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* Override the badge with a custom hex color (e.g. `#3b82f6`). When
|
|
23
|
+
* set, the badge renders with a tinted background derived from the
|
|
24
|
+
* color and the color itself as the foreground — matching the
|
|
25
|
+
* tinted look of `success`/`warning`. Use this for entities that
|
|
26
|
+
* carry their own brand color (categories, labels, confidentiality
|
|
27
|
+
* levels). Takes precedence over `variant` colors.
|
|
28
|
+
*/
|
|
29
|
+
customColor?: string;
|
|
30
|
+
};
|
|
31
|
+
/**
|
|
32
|
+
* Badge — small, non-interactive status pill. Pick this when you need
|
|
33
|
+
* an at-a-glance label (status, category, tag) and don't need close
|
|
34
|
+
* buttons, indicators or compound slots; reach for `<Chip>` when you do.
|
|
35
|
+
*/
|
|
36
|
+
declare const Badge: ({ className, variant, size, startContent, endContent, dividerAfterStart, customColor, style, children, ...rest }: BadgeProps) => react_jsx_runtime.JSX.Element;
|
|
37
|
+
|
|
38
|
+
export { Badge, type BadgeProps };
|
package/dist/badge.js
ADDED
|
@@ -0,0 +1,72 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
"use strict";
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
|
+
|
|
21
|
+
// src/badge.tsx
|
|
22
|
+
var badge_exports = {};
|
|
23
|
+
__export(badge_exports, {
|
|
24
|
+
Badge: () => Badge
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(badge_exports);
|
|
27
|
+
var import_shared_utils = require("@kopexa/shared-utils");
|
|
28
|
+
var import_theme = require("@kopexa/theme");
|
|
29
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
30
|
+
var Badge = ({
|
|
31
|
+
className,
|
|
32
|
+
variant,
|
|
33
|
+
size,
|
|
34
|
+
startContent,
|
|
35
|
+
endContent,
|
|
36
|
+
dividerAfterStart = false,
|
|
37
|
+
customColor,
|
|
38
|
+
style,
|
|
39
|
+
children,
|
|
40
|
+
...rest
|
|
41
|
+
}) => {
|
|
42
|
+
const customStyle = customColor ? {
|
|
43
|
+
backgroundColor: `color-mix(in oklch, ${customColor} 14%, transparent)`,
|
|
44
|
+
color: customColor,
|
|
45
|
+
borderColor: "transparent",
|
|
46
|
+
...style
|
|
47
|
+
} : style;
|
|
48
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
49
|
+
"span",
|
|
50
|
+
{
|
|
51
|
+
className: (0, import_shared_utils.cn)((0, import_theme.badge)({ variant, size }), className),
|
|
52
|
+
style: customStyle,
|
|
53
|
+
...rest,
|
|
54
|
+
children: [
|
|
55
|
+
startContent,
|
|
56
|
+
startContent && dividerAfterStart && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
57
|
+
"span",
|
|
58
|
+
{
|
|
59
|
+
"aria-hidden": "true",
|
|
60
|
+
className: "self-stretch w-px bg-current opacity-30"
|
|
61
|
+
}
|
|
62
|
+
),
|
|
63
|
+
children,
|
|
64
|
+
endContent
|
|
65
|
+
]
|
|
66
|
+
}
|
|
67
|
+
);
|
|
68
|
+
};
|
|
69
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
70
|
+
0 && (module.exports = {
|
|
71
|
+
Badge
|
|
72
|
+
});
|
package/dist/badge.mjs
ADDED
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
|
|
3
|
+
// src/badge.tsx
|
|
4
|
+
import { cn } from "@kopexa/shared-utils";
|
|
5
|
+
import { badge } from "@kopexa/theme";
|
|
6
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
+
var Badge = ({
|
|
8
|
+
className,
|
|
9
|
+
variant,
|
|
10
|
+
size,
|
|
11
|
+
startContent,
|
|
12
|
+
endContent,
|
|
13
|
+
dividerAfterStart = false,
|
|
14
|
+
customColor,
|
|
15
|
+
style,
|
|
16
|
+
children,
|
|
17
|
+
...rest
|
|
18
|
+
}) => {
|
|
19
|
+
const customStyle = customColor ? {
|
|
20
|
+
backgroundColor: `color-mix(in oklch, ${customColor} 14%, transparent)`,
|
|
21
|
+
color: customColor,
|
|
22
|
+
borderColor: "transparent",
|
|
23
|
+
...style
|
|
24
|
+
} : style;
|
|
25
|
+
return /* @__PURE__ */ jsxs(
|
|
26
|
+
"span",
|
|
27
|
+
{
|
|
28
|
+
className: cn(badge({ variant, size }), className),
|
|
29
|
+
style: customStyle,
|
|
30
|
+
...rest,
|
|
31
|
+
children: [
|
|
32
|
+
startContent,
|
|
33
|
+
startContent && dividerAfterStart && /* @__PURE__ */ jsx(
|
|
34
|
+
"span",
|
|
35
|
+
{
|
|
36
|
+
"aria-hidden": "true",
|
|
37
|
+
className: "self-stretch w-px bg-current opacity-30"
|
|
38
|
+
}
|
|
39
|
+
),
|
|
40
|
+
children,
|
|
41
|
+
endContent
|
|
42
|
+
]
|
|
43
|
+
}
|
|
44
|
+
);
|
|
45
|
+
};
|
|
46
|
+
|
|
47
|
+
export {
|
|
48
|
+
Badge
|
|
49
|
+
};
|
package/dist/index.d.mts
CHANGED
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -31,18 +31,63 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
31
31
|
// src/index.ts
|
|
32
32
|
var index_exports = {};
|
|
33
33
|
__export(index_exports, {
|
|
34
|
+
Badge: () => Badge,
|
|
34
35
|
Chip: () => Chip,
|
|
35
36
|
RelatedControlChip: () => RelatedControlChip,
|
|
36
37
|
StandardChip: () => StandardChip
|
|
37
38
|
});
|
|
38
39
|
module.exports = __toCommonJS(index_exports);
|
|
39
40
|
|
|
40
|
-
// src/
|
|
41
|
-
var import_icons = require("@kopexa/icons");
|
|
41
|
+
// src/badge.tsx
|
|
42
42
|
var import_shared_utils = require("@kopexa/shared-utils");
|
|
43
43
|
var import_theme = require("@kopexa/theme");
|
|
44
|
-
var import_react = require("react");
|
|
45
44
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
45
|
+
var Badge = ({
|
|
46
|
+
className,
|
|
47
|
+
variant,
|
|
48
|
+
size,
|
|
49
|
+
startContent,
|
|
50
|
+
endContent,
|
|
51
|
+
dividerAfterStart = false,
|
|
52
|
+
customColor,
|
|
53
|
+
style,
|
|
54
|
+
children,
|
|
55
|
+
...rest
|
|
56
|
+
}) => {
|
|
57
|
+
const customStyle = customColor ? {
|
|
58
|
+
backgroundColor: `color-mix(in oklch, ${customColor} 14%, transparent)`,
|
|
59
|
+
color: customColor,
|
|
60
|
+
borderColor: "transparent",
|
|
61
|
+
...style
|
|
62
|
+
} : style;
|
|
63
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
64
|
+
"span",
|
|
65
|
+
{
|
|
66
|
+
className: (0, import_shared_utils.cn)((0, import_theme.badge)({ variant, size }), className),
|
|
67
|
+
style: customStyle,
|
|
68
|
+
...rest,
|
|
69
|
+
children: [
|
|
70
|
+
startContent,
|
|
71
|
+
startContent && dividerAfterStart && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
72
|
+
"span",
|
|
73
|
+
{
|
|
74
|
+
"aria-hidden": "true",
|
|
75
|
+
className: "self-stretch w-px bg-current opacity-30"
|
|
76
|
+
}
|
|
77
|
+
),
|
|
78
|
+
children,
|
|
79
|
+
endContent
|
|
80
|
+
]
|
|
81
|
+
}
|
|
82
|
+
);
|
|
83
|
+
};
|
|
84
|
+
|
|
85
|
+
// src/chip.tsx
|
|
86
|
+
var import_icons = require("@kopexa/icons");
|
|
87
|
+
var import_shared_utils2 = require("@kopexa/shared-utils");
|
|
88
|
+
var import_theme2 = require("@kopexa/theme");
|
|
89
|
+
var import_react = require("react");
|
|
90
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
46
91
|
var Chip = (props) => {
|
|
47
92
|
const {
|
|
48
93
|
className,
|
|
@@ -63,7 +108,7 @@ var Chip = (props) => {
|
|
|
63
108
|
onClose,
|
|
64
109
|
...rest
|
|
65
110
|
} = props;
|
|
66
|
-
const styles = (0,
|
|
111
|
+
const styles = (0, import_theme2.chip)({
|
|
67
112
|
size,
|
|
68
113
|
radius,
|
|
69
114
|
variant,
|
|
@@ -77,8 +122,8 @@ var Chip = (props) => {
|
|
|
77
122
|
});
|
|
78
123
|
const start = (0, import_react.useMemo)(() => {
|
|
79
124
|
if (indicator) {
|
|
80
|
-
return /* @__PURE__ */ (0,
|
|
81
|
-
/* @__PURE__ */ (0,
|
|
125
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: styles.indicator({ class: classNames == null ? void 0 : classNames.indicator }), children: [
|
|
126
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
82
127
|
"span",
|
|
83
128
|
{
|
|
84
129
|
className: styles.indicatorPulse({
|
|
@@ -86,7 +131,7 @@ var Chip = (props) => {
|
|
|
86
131
|
})
|
|
87
132
|
}
|
|
88
133
|
),
|
|
89
|
-
/* @__PURE__ */ (0,
|
|
134
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
90
135
|
"span",
|
|
91
136
|
{
|
|
92
137
|
className: styles.indicatorDot({
|
|
@@ -102,7 +147,7 @@ var Chip = (props) => {
|
|
|
102
147
|
if (isCloseable) {
|
|
103
148
|
return (
|
|
104
149
|
// biome-ignore lint/a11y/useSemanticElements: we use a span here
|
|
105
|
-
/* @__PURE__ */ (0,
|
|
150
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
106
151
|
"span",
|
|
107
152
|
{
|
|
108
153
|
role: "button",
|
|
@@ -115,24 +160,24 @@ var Chip = (props) => {
|
|
|
115
160
|
onClose == null ? void 0 : onClose();
|
|
116
161
|
}
|
|
117
162
|
},
|
|
118
|
-
children: endContent || /* @__PURE__ */ (0,
|
|
163
|
+
children: endContent || /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons.CloseIcon, {})
|
|
119
164
|
}
|
|
120
165
|
)
|
|
121
166
|
);
|
|
122
167
|
}
|
|
123
168
|
return endContent;
|
|
124
169
|
}, [endContent, isCloseable, styles, classNames, onClose]);
|
|
125
|
-
return /* @__PURE__ */ (0,
|
|
170
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
|
|
126
171
|
"div",
|
|
127
172
|
{
|
|
128
173
|
className: styles.root({
|
|
129
|
-
className: (0,
|
|
174
|
+
className: (0, import_shared_utils2.cn)(classNames == null ? void 0 : classNames.root, className)
|
|
130
175
|
}),
|
|
131
176
|
...rest,
|
|
132
177
|
children: [
|
|
133
178
|
start,
|
|
134
|
-
status && /* @__PURE__ */ (0,
|
|
135
|
-
/* @__PURE__ */ (0,
|
|
179
|
+
status && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.status({ class: classNames == null ? void 0 : classNames.status }), children: status }),
|
|
180
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: styles.content({ class: classNames == null ? void 0 : classNames.content }), children }),
|
|
136
181
|
end
|
|
137
182
|
]
|
|
138
183
|
}
|
|
@@ -141,16 +186,16 @@ var Chip = (props) => {
|
|
|
141
186
|
|
|
142
187
|
// src/related-control-chip.tsx
|
|
143
188
|
var import_icons2 = require("@kopexa/icons");
|
|
144
|
-
var
|
|
189
|
+
var import_theme3 = require("@kopexa/theme");
|
|
145
190
|
var import_tooltip = require("@kopexa/tooltip");
|
|
146
191
|
var Slot = __toESM(require("@radix-ui/react-slot"));
|
|
147
|
-
var
|
|
192
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
148
193
|
var MappingIconMapper = {
|
|
149
|
-
EQUAL: /* @__PURE__ */ (0,
|
|
150
|
-
INTERSECT: /* @__PURE__ */ (0,
|
|
151
|
-
SUBSET: /* @__PURE__ */ (0,
|
|
152
|
-
PARTIAL: /* @__PURE__ */ (0,
|
|
153
|
-
SUPERSET: /* @__PURE__ */ (0,
|
|
194
|
+
EQUAL: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons2.EqualsIcon, {}),
|
|
195
|
+
INTERSECT: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons2.IntersectIcon, {}),
|
|
196
|
+
SUBSET: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons2.SubsetIcon, {}),
|
|
197
|
+
PARTIAL: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons2.PartialIcon, {}),
|
|
198
|
+
SUPERSET: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons2.SupersetIcon, {})
|
|
154
199
|
};
|
|
155
200
|
var RelatedControlChip = ({
|
|
156
201
|
refCode,
|
|
@@ -160,35 +205,35 @@ var RelatedControlChip = ({
|
|
|
160
205
|
}) => {
|
|
161
206
|
const tooltipDisabled = !relation && !mappingType;
|
|
162
207
|
const Comp = asChild ? Slot.Root : "span";
|
|
163
|
-
const styles = (0,
|
|
208
|
+
const styles = (0, import_theme3.relatedControlChip)();
|
|
164
209
|
if (!tooltipDisabled) {
|
|
165
|
-
return /* @__PURE__ */ (0,
|
|
210
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
166
211
|
import_tooltip.Tooltip,
|
|
167
212
|
{
|
|
168
213
|
side: "top",
|
|
169
214
|
className: styles.tooltip(),
|
|
170
|
-
content: /* @__PURE__ */ (0,
|
|
171
|
-
/* @__PURE__ */ (0,
|
|
172
|
-
/* @__PURE__ */ (0,
|
|
173
|
-
/* @__PURE__ */ (0,
|
|
215
|
+
content: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex flex-col gap-1", children: mappingType && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "flex gap-1 items-center", children: [
|
|
216
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_icons2.ChevronsLeftRightEllipsisIcon, { size: 12 }),
|
|
217
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { children: "Mapping type" }),
|
|
218
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
174
219
|
"div",
|
|
175
220
|
{
|
|
176
221
|
className: `ml-4 flex w-2.5 h-2.5 justify-center items-center ${mappingType === "SUPERSET" ? "h-5 w-5" : "h-2.5 w-2.5"}`,
|
|
177
222
|
children: MappingIconMapper[mappingType]
|
|
178
223
|
}
|
|
179
224
|
),
|
|
180
|
-
/* @__PURE__ */ (0,
|
|
225
|
+
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "capitalize", children: mappingType.toLowerCase() })
|
|
181
226
|
] }) }),
|
|
182
|
-
children: /* @__PURE__ */ (0,
|
|
227
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Comp, { className: styles.root(), children: refCode })
|
|
183
228
|
}
|
|
184
229
|
);
|
|
185
230
|
}
|
|
186
|
-
return /* @__PURE__ */ (0,
|
|
231
|
+
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Comp, { className: styles.root(), children: refCode });
|
|
187
232
|
};
|
|
188
233
|
|
|
189
234
|
// src/standard-chip.tsx
|
|
190
|
-
var
|
|
191
|
-
var
|
|
235
|
+
var import_theme4 = require("@kopexa/theme");
|
|
236
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
192
237
|
var StandardChip = (props) => {
|
|
193
238
|
const {
|
|
194
239
|
className,
|
|
@@ -200,10 +245,10 @@ var StandardChip = (props) => {
|
|
|
200
245
|
...rest
|
|
201
246
|
} = props;
|
|
202
247
|
let standard = standardProp;
|
|
203
|
-
if (
|
|
248
|
+
if (import_theme4.standardChip.variants.standard[standardProp]) {
|
|
204
249
|
standard = standardProp;
|
|
205
250
|
}
|
|
206
|
-
const styles = (0,
|
|
251
|
+
const styles = (0, import_theme4.standardChip)({
|
|
207
252
|
size,
|
|
208
253
|
radius,
|
|
209
254
|
color,
|
|
@@ -211,13 +256,14 @@ var StandardChip = (props) => {
|
|
|
211
256
|
className,
|
|
212
257
|
standard
|
|
213
258
|
});
|
|
214
|
-
return /* @__PURE__ */ (0,
|
|
215
|
-
/* @__PURE__ */ (0,
|
|
216
|
-
/* @__PURE__ */ (0,
|
|
259
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: styles.root(), ...rest, children: [
|
|
260
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: styles.hexagon() }),
|
|
261
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: styles.content(), children: standard })
|
|
217
262
|
] });
|
|
218
263
|
};
|
|
219
264
|
// Annotate the CommonJS export names for ESM import in node:
|
|
220
265
|
0 && (module.exports = {
|
|
266
|
+
Badge,
|
|
221
267
|
Chip,
|
|
222
268
|
RelatedControlChip,
|
|
223
269
|
StandardChip
|
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import {
|
|
3
|
+
Badge
|
|
4
|
+
} from "./chunk-GBHBWHH6.mjs";
|
|
2
5
|
import {
|
|
3
6
|
Chip
|
|
4
7
|
} from "./chunk-DJQHDHYG.mjs";
|
|
@@ -9,6 +12,7 @@ import {
|
|
|
9
12
|
StandardChip
|
|
10
13
|
} from "./chunk-YHRMEWSB.mjs";
|
|
11
14
|
export {
|
|
15
|
+
Badge,
|
|
12
16
|
Chip,
|
|
13
17
|
RelatedControlChip,
|
|
14
18
|
StandardChip
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kopexa/chip",
|
|
3
|
-
"version": "17.
|
|
3
|
+
"version": "17.2.0",
|
|
4
4
|
"description": "A Chip is a small block of essential information that represent an input, attribute, or action.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"chip"
|
|
@@ -28,14 +28,14 @@
|
|
|
28
28
|
"motion": ">=12.23.6",
|
|
29
29
|
"react": ">=19.0.0-rc.0",
|
|
30
30
|
"react-dom": ">=19.0.0-rc.0",
|
|
31
|
-
"@kopexa/theme": "17.
|
|
31
|
+
"@kopexa/theme": "17.31.0"
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
34
|
"@radix-ui/react-slot": "^1.2.4",
|
|
35
|
-
"@kopexa/icons": "17.10.
|
|
36
|
-
"@kopexa/react-utils": "17.1.
|
|
37
|
-
"@kopexa/shared-utils": "17.0.
|
|
38
|
-
"@kopexa/tooltip": "17.2.
|
|
35
|
+
"@kopexa/icons": "17.10.11",
|
|
36
|
+
"@kopexa/react-utils": "17.1.24",
|
|
37
|
+
"@kopexa/shared-utils": "17.0.82",
|
|
38
|
+
"@kopexa/tooltip": "17.2.47"
|
|
39
39
|
},
|
|
40
40
|
"clean-package": "../../../clean-package.config.json",
|
|
41
41
|
"module": "dist/index.mjs",
|