@syscore/ui-library 1.15.3 → 1.15.4
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/client/components/icons/imperative-badges/BadgeImperativePrimary.tsx +45 -0
- package/client/components/icons/imperative-badges/BadgeImperativeSecondary.tsx +53 -0
- package/client/components/icons/imperative-badges/index.tsx +2 -0
- package/client/components/ui/tooltip.tsx +39 -20
- package/client/global.css +14 -1
- package/client/ui/Icons.stories.tsx +52 -30
- package/client/ui/PageHeader.stories.tsx +82 -0
- package/client/ui/Tooltip.stories.tsx +38 -30
- package/dist/index.cjs.js +1 -1
- package/dist/index.d.ts +6 -0
- package/dist/index.es.js +135 -4
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -30,6 +30,8 @@ import { BadgeCertificationGold } from '../client/components/icons/achievement-b
|
|
|
30
30
|
import { BadgeCertificationPlatinum } from '../client/components/icons/achievement-badges';
|
|
31
31
|
import { BadgeCertificationSilver } from '../client/components/icons/achievement-badges';
|
|
32
32
|
import { BadgeEnterpriseProvider } from '../client/components/icons/provider-badges';
|
|
33
|
+
import { BadgeImperativePrimary } from '../client/components/icons/imperative-badges';
|
|
34
|
+
import { BadgeImperativeSecondary } from '../client/components/icons/imperative-badges';
|
|
33
35
|
import { BadgePerformanceTestingProvider } from '../client/components/icons/provider-badges';
|
|
34
36
|
import { BadgeProductProvider } from '../client/components/icons/provider-badges';
|
|
35
37
|
import { BadgeRatingCoworking } from '../client/components/icons/achievement-badges';
|
|
@@ -424,6 +426,10 @@ export { BadgeCertificationSilver }
|
|
|
424
426
|
|
|
425
427
|
export { BadgeEnterpriseProvider }
|
|
426
428
|
|
|
429
|
+
export { BadgeImperativePrimary }
|
|
430
|
+
|
|
431
|
+
export { BadgeImperativeSecondary }
|
|
432
|
+
|
|
427
433
|
export { BadgePerformanceTestingProvider }
|
|
428
434
|
|
|
429
435
|
export { BadgeProductProvider }
|
package/dist/index.es.js
CHANGED
|
@@ -926,6 +926,17 @@ const UtilityClose = ({ className }) => {
|
|
|
926
926
|
}
|
|
927
927
|
);
|
|
928
928
|
};
|
|
929
|
+
const tooltipContentVariants = cva("tooltip-content", {
|
|
930
|
+
variants: {
|
|
931
|
+
variant: {
|
|
932
|
+
default: "tooltip-content--default",
|
|
933
|
+
simple: "tooltip-content--simple"
|
|
934
|
+
}
|
|
935
|
+
},
|
|
936
|
+
defaultVariants: {
|
|
937
|
+
variant: "default"
|
|
938
|
+
}
|
|
939
|
+
});
|
|
929
940
|
const TooltipContext = React.createContext({
|
|
930
941
|
trigger: "hover",
|
|
931
942
|
toggle: () => {
|
|
@@ -1018,6 +1029,7 @@ function TooltipTrigger({
|
|
|
1018
1029
|
}
|
|
1019
1030
|
function TooltipContent({
|
|
1020
1031
|
className,
|
|
1032
|
+
variant: variant2,
|
|
1021
1033
|
sideOffset = 0,
|
|
1022
1034
|
side: side2 = "bottom",
|
|
1023
1035
|
children,
|
|
@@ -1053,10 +1065,10 @@ function TooltipContent({
|
|
|
1053
1065
|
sideOffset,
|
|
1054
1066
|
alignOffset,
|
|
1055
1067
|
side: side2,
|
|
1056
|
-
className: cn(
|
|
1068
|
+
className: cn(tooltipContentVariants({ variant: variant2 }), className),
|
|
1057
1069
|
...props,
|
|
1058
1070
|
children: [
|
|
1059
|
-
/* @__PURE__ */ jsx("div", { className: "tooltip-arrow", children: /* @__PURE__ */ jsx(
|
|
1071
|
+
variant2 !== "simple" && /* @__PURE__ */ jsx("div", { className: "tooltip-arrow", children: /* @__PURE__ */ jsx(
|
|
1060
1072
|
"svg",
|
|
1061
1073
|
{
|
|
1062
1074
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1068,12 +1080,12 @@ function TooltipContent({
|
|
|
1068
1080
|
"path",
|
|
1069
1081
|
{
|
|
1070
1082
|
d: "M10 -1.74846e-06L-7.36867e-07 0C-3.29906e-07 2.76142 2.23858 5 5 5C7.76142 5 10 2.76142 10 -1.74846e-06Z",
|
|
1071
|
-
fill: "
|
|
1083
|
+
fill: "currentColor"
|
|
1072
1084
|
}
|
|
1073
1085
|
)
|
|
1074
1086
|
}
|
|
1075
1087
|
) }),
|
|
1076
|
-
!hideClose && /* @__PURE__ */ jsx(ToggleClose, { className: "absolute top-4 right-4" }),
|
|
1088
|
+
variant2 !== "simple" && !hideClose && /* @__PURE__ */ jsx(ToggleClose, { className: "absolute top-4 right-4" }),
|
|
1077
1089
|
children
|
|
1078
1090
|
]
|
|
1079
1091
|
}
|
|
@@ -12146,6 +12158,123 @@ const BadgeSurveyProvider = () => {
|
|
|
12146
12158
|
}
|
|
12147
12159
|
);
|
|
12148
12160
|
};
|
|
12161
|
+
const BadgeImperativePrimary = ({
|
|
12162
|
+
className
|
|
12163
|
+
}) => {
|
|
12164
|
+
return /* @__PURE__ */ jsx("div", { className: cn("size-6 flex items-center justify-center", className), children: /* @__PURE__ */ jsxs(
|
|
12165
|
+
"svg",
|
|
12166
|
+
{
|
|
12167
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
12168
|
+
width: "20",
|
|
12169
|
+
height: "22",
|
|
12170
|
+
viewBox: "0 0 20 22",
|
|
12171
|
+
fill: "none",
|
|
12172
|
+
children: [
|
|
12173
|
+
/* @__PURE__ */ jsx(
|
|
12174
|
+
"path",
|
|
12175
|
+
{
|
|
12176
|
+
d: "M19.2133 7.81921C19.2133 6.38498 18.4454 5.06051 17.2008 4.3479L11.5941 1.13788C10.3629 0.432974 8.85042 0.432974 7.61921 1.13788L2.01255 4.3479C0.767878 5.06051 0 6.38498 0 7.81921V14.1808C0 15.615 0.767878 16.9395 2.01255 17.6521L7.61921 20.8621C8.85042 21.567 10.3629 21.567 11.5941 20.8621L17.2008 17.6521C18.4454 16.9395 19.2133 15.615 19.2133 14.1808V7.81921Z",
|
|
12177
|
+
fill: "#905C84"
|
|
12178
|
+
}
|
|
12179
|
+
),
|
|
12180
|
+
/* @__PURE__ */ jsx(
|
|
12181
|
+
"path",
|
|
12182
|
+
{
|
|
12183
|
+
d: "M9.68994 5.5V16.5023",
|
|
12184
|
+
stroke: "white",
|
|
12185
|
+
"stroke-width": "1.5",
|
|
12186
|
+
"stroke-linecap": "round",
|
|
12187
|
+
"stroke-linejoin": "round"
|
|
12188
|
+
}
|
|
12189
|
+
),
|
|
12190
|
+
/* @__PURE__ */ jsx(
|
|
12191
|
+
"path",
|
|
12192
|
+
{
|
|
12193
|
+
d: "M14.4542 8.25055L4.92627 13.7517",
|
|
12194
|
+
stroke: "white",
|
|
12195
|
+
"stroke-width": "1.5",
|
|
12196
|
+
"stroke-linecap": "round",
|
|
12197
|
+
"stroke-linejoin": "round"
|
|
12198
|
+
}
|
|
12199
|
+
),
|
|
12200
|
+
/* @__PURE__ */ jsx(
|
|
12201
|
+
"path",
|
|
12202
|
+
{
|
|
12203
|
+
d: "M4.92627 8.25055L14.4542 13.7517",
|
|
12204
|
+
stroke: "white",
|
|
12205
|
+
"stroke-width": "1.5",
|
|
12206
|
+
"stroke-linecap": "round",
|
|
12207
|
+
"stroke-linejoin": "round"
|
|
12208
|
+
}
|
|
12209
|
+
)
|
|
12210
|
+
]
|
|
12211
|
+
}
|
|
12212
|
+
) });
|
|
12213
|
+
};
|
|
12214
|
+
const BadgeImperativeSecondary = ({
|
|
12215
|
+
className
|
|
12216
|
+
}) => {
|
|
12217
|
+
return /* @__PURE__ */ jsx("div", { className: cn("size-6 flex items-center justify-center", className), children: /* @__PURE__ */ jsxs(
|
|
12218
|
+
"svg",
|
|
12219
|
+
{
|
|
12220
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
12221
|
+
width: "20",
|
|
12222
|
+
height: "22",
|
|
12223
|
+
viewBox: "0 0 20 22",
|
|
12224
|
+
fill: "none",
|
|
12225
|
+
children: [
|
|
12226
|
+
/* @__PURE__ */ jsx(
|
|
12227
|
+
"path",
|
|
12228
|
+
{
|
|
12229
|
+
d: "M19.2133 7.81921C19.2133 6.38498 18.4454 5.06051 17.2008 4.3479L11.5941 1.13788C10.3629 0.432974 8.85042 0.432974 7.61921 1.13788L2.01255 4.3479C0.767878 5.06051 0 6.38498 0 7.81921V14.1808C0 15.615 0.767878 16.9395 2.01255 17.6521L7.61921 20.8621C8.85042 21.567 10.3629 21.567 11.5941 20.8621L17.2008 17.6521C18.4454 16.9395 19.2133 15.615 19.2133 14.1808V7.81921Z",
|
|
12230
|
+
fill: "#128BA6",
|
|
12231
|
+
"fill-opacity": "0.08"
|
|
12232
|
+
}
|
|
12233
|
+
),
|
|
12234
|
+
/* @__PURE__ */ jsx(
|
|
12235
|
+
"path",
|
|
12236
|
+
{
|
|
12237
|
+
d: "M7.86719 1.57227C8.9445 0.955469 10.2684 0.955469 11.3457 1.57227L16.9521 4.78223C18.0412 5.40577 18.7129 6.56439 18.7129 7.81934V14.1807C18.7129 15.4356 18.0412 16.5942 16.9521 17.2178L11.3457 20.4277C10.2684 21.0445 8.9445 21.0445 7.86719 20.4277L2.26074 17.2178C1.17187 16.5942 0.5 15.4355 0.5 14.1807V7.81934C0.5 6.56452 1.17187 5.40582 2.26074 4.78223L7.86719 1.57227Z",
|
|
12238
|
+
stroke: "#128BA6",
|
|
12239
|
+
"stroke-opacity": "0.16",
|
|
12240
|
+
"stroke-linecap": "round",
|
|
12241
|
+
"stroke-linejoin": "round"
|
|
12242
|
+
}
|
|
12243
|
+
),
|
|
12244
|
+
/* @__PURE__ */ jsx(
|
|
12245
|
+
"path",
|
|
12246
|
+
{
|
|
12247
|
+
d: "M9.68994 5.5V16.5023",
|
|
12248
|
+
stroke: "#0F748A",
|
|
12249
|
+
"stroke-width": "1.5",
|
|
12250
|
+
"stroke-linecap": "round",
|
|
12251
|
+
"stroke-linejoin": "round"
|
|
12252
|
+
}
|
|
12253
|
+
),
|
|
12254
|
+
/* @__PURE__ */ jsx(
|
|
12255
|
+
"path",
|
|
12256
|
+
{
|
|
12257
|
+
d: "M14.4542 8.25055L4.92627 13.7517",
|
|
12258
|
+
stroke: "#0F748A",
|
|
12259
|
+
"stroke-width": "1.5",
|
|
12260
|
+
"stroke-linecap": "round",
|
|
12261
|
+
"stroke-linejoin": "round"
|
|
12262
|
+
}
|
|
12263
|
+
),
|
|
12264
|
+
/* @__PURE__ */ jsx(
|
|
12265
|
+
"path",
|
|
12266
|
+
{
|
|
12267
|
+
d: "M4.92627 8.25055L14.4542 13.7517",
|
|
12268
|
+
stroke: "#0F748A",
|
|
12269
|
+
"stroke-width": "1.5",
|
|
12270
|
+
"stroke-linecap": "round",
|
|
12271
|
+
"stroke-linejoin": "round"
|
|
12272
|
+
}
|
|
12273
|
+
)
|
|
12274
|
+
]
|
|
12275
|
+
}
|
|
12276
|
+
) });
|
|
12277
|
+
};
|
|
12149
12278
|
const X = ({ className = "", color = "#71747D" }) => {
|
|
12150
12279
|
return /* @__PURE__ */ jsxs(
|
|
12151
12280
|
"svg",
|
|
@@ -12797,6 +12926,8 @@ export {
|
|
|
12797
12926
|
BadgeCertificationPlatinum,
|
|
12798
12927
|
BadgeCertificationSilver,
|
|
12799
12928
|
BadgeEnterpriseProvider,
|
|
12929
|
+
BadgeImperativePrimary,
|
|
12930
|
+
BadgeImperativeSecondary,
|
|
12800
12931
|
BadgePerformanceTestingProvider,
|
|
12801
12932
|
BadgeProductProvider,
|
|
12802
12933
|
BadgeRatingCoworking,
|