@vygruppen/spor-react 12.4.2 → 12.4.3
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/.turbo/turbo-build.log +17 -11
- package/.turbo/turbo-postinstall.log +1 -1
- package/CHANGELOG.md +6 -0
- package/dist/icons/index.d.mts +1 -0
- package/dist/icons/index.d.ts +1 -0
- package/dist/icons/index.js +14 -0
- package/dist/icons/index.js.map +1 -0
- package/dist/icons/index.mjs +3 -0
- package/dist/icons/index.mjs.map +1 -0
- package/dist/index.js +26 -41
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +32 -47
- package/dist/index.mjs.map +1 -1
- package/package.json +15 -6
- package/src/icons/index.tsx +1 -0
- package/src/theme/semantic-tokens/colors.ts +3 -3
- package/src/theme/tokens/colors.ts +3 -3
- package/tsup.config.ts +10 -1
package/dist/index.mjs
CHANGED
@@ -23,12 +23,12 @@ import * as tokens20 from '@vygruppen/spor-design-tokens';
|
|
23
23
|
export { tokens20 as tokens };
|
24
24
|
import { usePopoverContext as usePopoverContext$1, PopoverCloseTrigger } from '@ark-ui/react';
|
25
25
|
import { Global } from '@emotion/react';
|
26
|
-
import cargonetJson from '@vygruppen/spor-design-tokens/tokens/color/cargonet.json';
|
27
|
-
import vyDigitalJson from '@vygruppen/spor-design-tokens/tokens/color/vy-digital.json';
|
28
|
-
import VyUtviklingJson from '@vygruppen/spor-design-tokens/tokens/color/vy-utvikling.json';
|
29
|
-
import aliasJson from '@vygruppen/spor-design-tokens/tokens/color/alias.json';
|
30
|
-
import linjetagJson from '@vygruppen/spor-design-tokens/tokens/color/linjetag.json';
|
31
|
-
import paletteJson from '@vygruppen/spor-design-tokens/tokens/color/palette.json';
|
26
|
+
import cargonetJson from '@vygruppen/spor-design-tokens/tokens/color/cargonet.json' assert { type: 'json' };
|
27
|
+
import vyDigitalJson from '@vygruppen/spor-design-tokens/tokens/color/vy-digital.json' assert { type: 'json' };
|
28
|
+
import VyUtviklingJson from '@vygruppen/spor-design-tokens/tokens/color/vy-utvikling.json' assert { type: 'json' };
|
29
|
+
import aliasJson from '@vygruppen/spor-design-tokens/tokens/color/alias.json' assert { type: 'json' };
|
30
|
+
import linjetagJson from '@vygruppen/spor-design-tokens/tokens/color/linjetag.json' assert { type: 'json' };
|
31
|
+
import paletteJson from '@vygruppen/spor-design-tokens/tokens/color/palette.json' assert { type: 'json' };
|
32
32
|
|
33
33
|
// src/accordion/Accordion.tsx
|
34
34
|
|
@@ -36,9 +36,8 @@ import paletteJson from '@vygruppen/spor-design-tokens/tokens/color/palette.json
|
|
36
36
|
var warnAboutMismatchingIcon = ({
|
37
37
|
icon
|
38
38
|
}) => {
|
39
|
-
var _a5, _b4;
|
40
39
|
if (process.env.NODE_ENV !== "production") {
|
41
|
-
const displayName =
|
40
|
+
const displayName = icon?.type?.render?.displayName;
|
42
41
|
if (!displayName) {
|
43
42
|
return;
|
44
43
|
}
|
@@ -804,7 +803,6 @@ var badgeRecipie = defineRecipe({
|
|
804
803
|
});
|
805
804
|
|
806
805
|
// src/theme/recipes/code.ts
|
807
|
-
var _a;
|
808
806
|
var codeRecipie = defineRecipe({
|
809
807
|
base: {
|
810
808
|
fontFamily: "monospace",
|
@@ -813,7 +811,7 @@ var codeRecipie = defineRecipe({
|
|
813
811
|
paddingX: 1
|
814
812
|
},
|
815
813
|
variants: {
|
816
|
-
colorPalette:
|
814
|
+
colorPalette: badgeRecipie.variants?.colorPalette ?? {}
|
817
815
|
}
|
818
816
|
});
|
819
817
|
var StyledCode = chakra(Code$1, codeRecipie);
|
@@ -1130,7 +1128,7 @@ var Alert = forwardRef((props, ref) => {
|
|
1130
1128
|
const { open, onClose } = useDisclosure({ defaultOpen: true });
|
1131
1129
|
const handleAlertClose = () => {
|
1132
1130
|
onClose();
|
1133
|
-
onAlertClose
|
1131
|
+
onAlertClose?.();
|
1134
1132
|
};
|
1135
1133
|
const recipe = useSlotRecipe({ key: "alert" });
|
1136
1134
|
const styles = recipe({ variant: props.variant });
|
@@ -1966,8 +1964,7 @@ function CalendarCell({
|
|
1966
1964
|
stateProps["data-unavailable"] = true;
|
1967
1965
|
}
|
1968
1966
|
useEffect(() => {
|
1969
|
-
|
1970
|
-
(_a5 = ref.current) == null ? void 0 : _a5.addEventListener(
|
1967
|
+
ref.current?.addEventListener(
|
1971
1968
|
"touchend",
|
1972
1969
|
(event) => {
|
1973
1970
|
event.preventDefault();
|
@@ -2013,7 +2010,7 @@ var getCurrentTime = () => {
|
|
2013
2010
|
return parseTime(now.toTimeString().split(" ")[0]);
|
2014
2011
|
};
|
2015
2012
|
var getTimestampFromTime = (time) => {
|
2016
|
-
return `${
|
2013
|
+
return `${time?.hour ?? 0}:${time?.minute ?? 0}`;
|
2017
2014
|
};
|
2018
2015
|
var weekDays = {
|
2019
2016
|
nb: ["Ma", "Ti", "On", "To", "Fr", "L\xF8", "S\xF8"],
|
@@ -2317,7 +2314,6 @@ function createCalendar2(identifier) {
|
|
2317
2314
|
}
|
2318
2315
|
var DateField = forwardRef(
|
2319
2316
|
({ labelId, ...props }, externalRef) => {
|
2320
|
-
var _a5;
|
2321
2317
|
const locale = useCurrentLocale();
|
2322
2318
|
const recipe = useSlotRecipe({
|
2323
2319
|
key: "datePicker",
|
@@ -2363,7 +2359,7 @@ var DateField = forwardRef(
|
|
2363
2359
|
"input",
|
2364
2360
|
{
|
2365
2361
|
type: "hidden",
|
2366
|
-
value:
|
2362
|
+
value: state.value?.toString() ?? "",
|
2367
2363
|
name: props.name
|
2368
2364
|
}
|
2369
2365
|
)
|
@@ -2449,8 +2445,8 @@ var DatePicker = forwardRef(
|
|
2449
2445
|
...props,
|
2450
2446
|
shouldCloseOnSelect: true,
|
2451
2447
|
errorMessage: errorText,
|
2452
|
-
isRequired: props.isRequired ??
|
2453
|
-
validationState:
|
2448
|
+
isRequired: props.isRequired ?? chakraFieldProps?.required,
|
2449
|
+
validationState: chakraFieldProps?.invalid ? "invalid" : "valid"
|
2454
2450
|
});
|
2455
2451
|
const internalRef = useRef(null);
|
2456
2452
|
const ref = externalRef ?? internalRef;
|
@@ -2586,8 +2582,8 @@ function DateRangePicker({
|
|
2586
2582
|
shouldCloseOnSelect: true,
|
2587
2583
|
isInvalid: invalid,
|
2588
2584
|
errorMessage: errorText,
|
2589
|
-
isRequired: props.required ??
|
2590
|
-
validationState:
|
2585
|
+
isRequired: props.required ?? fieldContextPRops?.required,
|
2586
|
+
validationState: fieldContextPRops?.invalid ? "invalid" : "valid"
|
2591
2587
|
});
|
2592
2588
|
const ref = useRef(null);
|
2593
2589
|
const uniqueId = useId$1();
|
@@ -2763,7 +2759,7 @@ var TimePicker = ({
|
|
2763
2759
|
)}`;
|
2764
2760
|
const inputLabel = label ?? t(texts11.time);
|
2765
2761
|
const ariaLabel = `${inputLabel} \u2013 ${t(
|
2766
|
-
texts11.selectedTimeIs(`${
|
2762
|
+
texts11.selectedTimeIs(`${dateTime?.hour ?? 0} ${dateTime?.minute ?? 0}`)
|
2767
2763
|
)}`;
|
2768
2764
|
return /* @__PURE__ */ jsx(Field3, { as: "time", ...boxProps, children: /* @__PURE__ */ jsxs(
|
2769
2765
|
StyledField,
|
@@ -3111,7 +3107,6 @@ var Popover = forwardRef(
|
|
3111
3107
|
hasBackdrop = true,
|
3112
3108
|
containerPadding = 12
|
3113
3109
|
}, ref) => {
|
3114
|
-
var _a5;
|
3115
3110
|
const internalRef = useRef(null);
|
3116
3111
|
const popoverRef = ref ?? internalRef;
|
3117
3112
|
const { popoverProps, underlayProps } = usePopover(
|
@@ -3132,7 +3127,7 @@ var Popover = forwardRef(
|
|
3132
3127
|
{
|
3133
3128
|
...popoverProps,
|
3134
3129
|
ref: popoverRef,
|
3135
|
-
minWidth:
|
3130
|
+
minWidth: triggerRef.current?.clientWidth ?? "auto",
|
3136
3131
|
children: [
|
3137
3132
|
/* @__PURE__ */ jsx(DismissButton, { onDismiss: state.close }),
|
3138
3133
|
children,
|
@@ -3514,8 +3509,7 @@ function Option({ item, state }) {
|
|
3514
3509
|
dataFields["data-focus-visible"] = true;
|
3515
3510
|
}
|
3516
3511
|
useEffect(() => {
|
3517
|
-
|
3518
|
-
(_a5 = ref == null ? void 0 : ref.current) == null ? void 0 : _a5.addEventListener(
|
3512
|
+
ref?.current?.addEventListener(
|
3519
3513
|
"touchend",
|
3520
3514
|
(event) => {
|
3521
3515
|
event.preventDefault();
|
@@ -3533,7 +3527,6 @@ var useOptionContext = () => {
|
|
3533
3527
|
return useContext(OptionContext);
|
3534
3528
|
};
|
3535
3529
|
function ListBoxSection({ section, state }) {
|
3536
|
-
var _a5, _b4;
|
3537
3530
|
const { itemProps, headingProps, groupProps } = useListBoxSection({
|
3538
3531
|
heading: section.rendered,
|
3539
3532
|
"aria-label": section["aria-label"]
|
@@ -3555,7 +3548,7 @@ function ListBoxSection({ section, state }) {
|
|
3555
3548
|
children: section.rendered
|
3556
3549
|
}
|
3557
3550
|
),
|
3558
|
-
/* @__PURE__ */ jsx(List, { ...groupProps, padding: 0, listStyleType: "none", children: [...
|
3551
|
+
/* @__PURE__ */ jsx(List, { ...groupProps, padding: 0, listStyleType: "none", children: [...state.collection.getChildren?.(section.key) ?? []].map(
|
3559
3552
|
(item) => /* @__PURE__ */ jsx(Option, { item, state }, item.key)
|
3560
3553
|
) })
|
3561
3554
|
] }) });
|
@@ -3695,7 +3688,6 @@ function coreText(state) {
|
|
3695
3688
|
}
|
3696
3689
|
|
3697
3690
|
// src/theme/slot-recipes/native-select.ts
|
3698
|
-
var _a2, _b;
|
3699
3691
|
var nativeSelectSlotRecipe = defineSlotRecipe({
|
3700
3692
|
slots: NativeSelectAnatomy.keys(),
|
3701
3693
|
className: "spor-nativeSelect",
|
@@ -3734,12 +3726,12 @@ var nativeSelectSlotRecipe = defineSlotRecipe({
|
|
3734
3726
|
variant: {
|
3735
3727
|
core: {
|
3736
3728
|
field: {
|
3737
|
-
...
|
3729
|
+
...inputRecipe.variants?.variant.core
|
3738
3730
|
}
|
3739
3731
|
},
|
3740
3732
|
floating: {
|
3741
3733
|
field: {
|
3742
|
-
...
|
3734
|
+
...inputRecipe.variants?.variant.floating
|
3743
3735
|
}
|
3744
3736
|
}
|
3745
3737
|
}
|
@@ -3882,8 +3874,7 @@ var NumericStepper = React28__default.forwardRef((props, ref) => {
|
|
3882
3874
|
});
|
3883
3875
|
const clampedStepSize = Math.max(Math.min(stepSize, 10), 1);
|
3884
3876
|
const focusOnAddButton = () => {
|
3885
|
-
|
3886
|
-
(_a5 = addButtonRef.current) == null ? void 0 : _a5.focus();
|
3877
|
+
addButtonRef.current?.focus();
|
3887
3878
|
};
|
3888
3879
|
return /* @__PURE__ */ jsxs(Field3, { css: styles.root, width: "auto", ...rest, ref, children: [
|
3889
3880
|
/* @__PURE__ */ jsx(
|
@@ -4140,10 +4131,7 @@ var CountryCodeSelect = forwardRef((props, ref) => {
|
|
4140
4131
|
const { t } = useTranslation();
|
4141
4132
|
if (props.allowedCountryCodes) {
|
4142
4133
|
callingCodes.items = callingCodes.items.filter(
|
4143
|
-
(callingCode) =>
|
4144
|
-
var _a5;
|
4145
|
-
return (_a5 = props.allowedCountryCodes) == null ? void 0 : _a5.some((code) => code === callingCode.label);
|
4146
|
-
}
|
4134
|
+
(callingCode) => props.allowedCountryCodes?.some((code) => code === callingCode.label)
|
4147
4135
|
);
|
4148
4136
|
}
|
4149
4137
|
return /* @__PURE__ */ jsx(
|
@@ -4847,8 +4835,7 @@ var icons = {
|
|
4847
4835
|
walk: { sm: WalkFill18Icon, md: WalkFill24Icon, lg: WalkFill30Icon }
|
4848
4836
|
};
|
4849
4837
|
var getCorrectIcon = ({ variant, size }) => {
|
4850
|
-
|
4851
|
-
return ((_a5 = icons[variant]) == null ? void 0 : _a5[size]) ?? Box;
|
4838
|
+
return icons[variant]?.[size] ?? Box;
|
4852
4839
|
};
|
4853
4840
|
var LineIcon = forwardRef(
|
4854
4841
|
function LineIcon2({
|
@@ -5006,7 +4993,7 @@ var ExternalIcon = ({ label }) => /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
5006
4993
|
var TextLink = forwardRef(
|
5007
4994
|
({ children, external, href, ...props }, ref) => {
|
5008
4995
|
const { t } = useTranslation();
|
5009
|
-
const isExternal = external ?? Boolean(
|
4996
|
+
const isExternal = external ?? Boolean(href?.startsWith("http://") || href?.startsWith("https://"));
|
5010
4997
|
const externalLabel = t ? t(texts18.externalLink) : texts18.externalLink.en;
|
5011
4998
|
if (props.asChild && isValidElement(children)) {
|
5012
4999
|
return /* @__PURE__ */ jsx(Link, { href, ...props, ref, children: cloneElement(children, {
|
@@ -6808,7 +6795,6 @@ var linkRecipe = defineRecipe({
|
|
6808
6795
|
}
|
6809
6796
|
}
|
6810
6797
|
});
|
6811
|
-
var _a3, _b2;
|
6812
6798
|
var textareaRecipe = defineRecipe({
|
6813
6799
|
className: "spor-textarea",
|
6814
6800
|
base: {
|
@@ -6825,10 +6811,10 @@ var textareaRecipe = defineRecipe({
|
|
6825
6811
|
variants: {
|
6826
6812
|
variant: {
|
6827
6813
|
core: {
|
6828
|
-
...
|
6814
|
+
...inputRecipe.variants?.variant.core
|
6829
6815
|
},
|
6830
6816
|
floating: {
|
6831
|
-
...
|
6817
|
+
...inputRecipe.variants?.variant.floating
|
6832
6818
|
}
|
6833
6819
|
}
|
6834
6820
|
}
|
@@ -8433,7 +8419,6 @@ var travelTagSlotRecipe = defineSlotRecipe({
|
|
8433
8419
|
});
|
8434
8420
|
|
8435
8421
|
// src/theme/slot-recipes/info-tag.ts
|
8436
|
-
var _a4, _b3, _c, _d;
|
8437
8422
|
var infoTagSlotRecipe = defineSlotRecipe({
|
8438
8423
|
slots: infoTagAnatomy.keys(),
|
8439
8424
|
className: "spor-info-tag",
|
@@ -8466,21 +8451,21 @@ var infoTagSlotRecipe = defineSlotRecipe({
|
|
8466
8451
|
}
|
8467
8452
|
},
|
8468
8453
|
size: {
|
8469
|
-
...
|
8454
|
+
...travelTagSlotRecipe.variants?.size,
|
8470
8455
|
sm: {
|
8471
|
-
...
|
8456
|
+
...travelTagSlotRecipe.variants?.size.sm,
|
8472
8457
|
iconContainer: {
|
8473
8458
|
borderRadius: "0.375rem"
|
8474
8459
|
}
|
8475
8460
|
},
|
8476
8461
|
md: {
|
8477
|
-
...
|
8462
|
+
...travelTagSlotRecipe.variants?.size.md,
|
8478
8463
|
iconContainer: {
|
8479
8464
|
borderRadius: "0.375rem"
|
8480
8465
|
}
|
8481
8466
|
},
|
8482
8467
|
lg: {
|
8483
|
-
...
|
8468
|
+
...travelTagSlotRecipe.variants?.size.lg,
|
8484
8469
|
iconContainer: {
|
8485
8470
|
borderRadius: "sm"
|
8486
8471
|
}
|