@wistia/ui 0.22.10 → 0.23.0-beta.3f5d16e2.7eba552
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/index.d.ts +86 -36
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1216 -316
- package/dist/index.js.map +1 -1
- package/package.json +2 -1
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
|
|
2
2
|
/*
|
|
3
|
-
* @license @wistia/ui v0.
|
|
3
|
+
* @license @wistia/ui v0.23.0-beta.3f5d16e2.7eba552
|
|
4
4
|
*
|
|
5
5
|
* Copyright (c) 2024-2026, Wistia, Inc. and its affiliates.
|
|
6
6
|
*
|
|
@@ -13,6 +13,12 @@ import { createGlobalStyle, css, keyframes, styled } from "styled-components";
|
|
|
13
13
|
import { isArray, isBoolean, isEmptyString, isFunction, isNil, isNonEmptyArray, isNonEmptyString, isNotNil, isNotUndefined, isNumber, isRecord, isString, isUndefined } from "@wistia/type-guards";
|
|
14
14
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
15
15
|
import { Toaster, toast } from "sonner";
|
|
16
|
+
import { isValid } from "date-fns/isValid";
|
|
17
|
+
import { startOfToday } from "date-fns/startOfToday";
|
|
18
|
+
import { startOfTomorrow } from "date-fns/startOfTomorrow";
|
|
19
|
+
import { startOfDay } from "date-fns/startOfDay";
|
|
20
|
+
import { isPast } from "date-fns/isPast";
|
|
21
|
+
import { parse } from "date-fns/parse";
|
|
16
22
|
import { getValueAndUnit } from "polished";
|
|
17
23
|
import { useFilePicker as useFilePicker$1, useImperativeFilePicker as useImperativeFilePicker$1 } from "use-file-picker";
|
|
18
24
|
import { FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, ImageDimensionsValidator, PersistentFileAmountLimitValidator } from "use-file-picker/validators";
|
|
@@ -28,6 +34,7 @@ import * as Ariakit from "@ariakit/react";
|
|
|
28
34
|
import { matchSorter } from "match-sorter";
|
|
29
35
|
import { createPortal } from "react-dom";
|
|
30
36
|
import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuItemIndicator, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "@radix-ui/react-dropdown-menu";
|
|
37
|
+
import { DayPicker } from "react-day-picker";
|
|
31
38
|
import { ValidationError } from "yup";
|
|
32
39
|
import { Content as Content$3, Portal as Portal$2, Root as Root$6, Trigger as Trigger$3 } from "@radix-ui/react-hover-card";
|
|
33
40
|
import ReactMarkdown from "react-markdown";
|
|
@@ -871,6 +878,53 @@ const monthDayStringNumeric = (date, { timeZone = defaultTimeZone } = {}) => {
|
|
|
871
878
|
}
|
|
872
879
|
};
|
|
873
880
|
//#endregion
|
|
881
|
+
//#region src/helpers/dateTime/parseDateString.ts
|
|
882
|
+
const MONTH_NAMES = [
|
|
883
|
+
"January",
|
|
884
|
+
"February",
|
|
885
|
+
"March",
|
|
886
|
+
"April",
|
|
887
|
+
"May",
|
|
888
|
+
"June",
|
|
889
|
+
"July",
|
|
890
|
+
"August",
|
|
891
|
+
"September",
|
|
892
|
+
"October",
|
|
893
|
+
"November",
|
|
894
|
+
"December"
|
|
895
|
+
];
|
|
896
|
+
const DATE_FORMATS = [
|
|
897
|
+
"MMM d, yyyy",
|
|
898
|
+
"MMM d",
|
|
899
|
+
"MMMM d, yyyy",
|
|
900
|
+
"MMMM d",
|
|
901
|
+
"M/d/yyyy",
|
|
902
|
+
"M/d",
|
|
903
|
+
"M-d-yyyy",
|
|
904
|
+
"M-d",
|
|
905
|
+
"yyyy-MM-dd"
|
|
906
|
+
];
|
|
907
|
+
const parseDateString = (str) => {
|
|
908
|
+
const trimmed = str.trim();
|
|
909
|
+
if (!trimmed) return null;
|
|
910
|
+
const lower = trimmed.toLowerCase();
|
|
911
|
+
if (lower === "today") return startOfToday();
|
|
912
|
+
if (lower === "tomorrow") return startOfTomorrow();
|
|
913
|
+
const monthIndex = MONTH_NAMES.findIndex((name) => name.toLowerCase().startsWith(lower));
|
|
914
|
+
if (monthIndex > -1) {
|
|
915
|
+
const today = startOfToday();
|
|
916
|
+
let date = new Date(today.getFullYear(), monthIndex, 1);
|
|
917
|
+
if (isPast(date)) date = new Date(today.getFullYear() + 1, monthIndex, 1);
|
|
918
|
+
return startOfDay(date);
|
|
919
|
+
}
|
|
920
|
+
const referenceDate = /* @__PURE__ */ new Date();
|
|
921
|
+
const parsedDate = DATE_FORMATS.map((fmt) => parse(trimmed, fmt, referenceDate)).find(isValid);
|
|
922
|
+
if (parsedDate !== void 0) return startOfDay(parsedDate);
|
|
923
|
+
const native = new Date(trimmed);
|
|
924
|
+
if (isValid(native)) return startOfDay(native);
|
|
925
|
+
return null;
|
|
926
|
+
};
|
|
927
|
+
//#endregion
|
|
874
928
|
//#region src/helpers/dateTime/sessionDurationString.ts
|
|
875
929
|
/**
|
|
876
930
|
* A string representation of a duration for a user session. Assumes that
|
|
@@ -1031,6 +1085,7 @@ const dateTime = {
|
|
|
1031
1085
|
mediaDurationString,
|
|
1032
1086
|
millisecondsToDurationISOString,
|
|
1033
1087
|
monthDayStringNumeric,
|
|
1088
|
+
parseDateString,
|
|
1034
1089
|
sessionDurationString,
|
|
1035
1090
|
timeAgoString,
|
|
1036
1091
|
timeOnlyString
|
|
@@ -2279,17 +2334,6 @@ const BrandsIcon = (props) => /* @__PURE__ */ jsxs("svg", {
|
|
|
2279
2334
|
]
|
|
2280
2335
|
});
|
|
2281
2336
|
//#endregion
|
|
2282
|
-
//#region src/components/Icon/icons/BulletListIcon.tsx
|
|
2283
|
-
const BulletListIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
2284
|
-
...props,
|
|
2285
|
-
viewBox: "0 0 24 24",
|
|
2286
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
2287
|
-
children: /* @__PURE__ */ jsx("path", {
|
|
2288
|
-
d: "M20.4004 18C21.063 18.0002 21.5996 18.5376 21.5996 19.2002C21.5995 19.8627 21.0629 20.4002 20.4004 20.4004H10.7998C10.1372 20.4003 9.59971 19.8628 9.59961 19.2002C9.59961 18.5375 10.1372 18.0001 10.7998 18H20.4004ZM4.7998 12C6.12529 12 7.2002 13.0749 7.2002 14.4004C7.19998 15.7257 6.12516 16.7998 4.7998 16.7998C3.47454 16.7997 2.4006 15.7256 2.40039 14.4004C2.40039 13.075 3.47441 12.0001 4.7998 12ZM20.4004 13.2002C21.063 13.2004 21.5996 13.7378 21.5996 14.4004C21.5994 15.0628 21.0628 15.5994 20.4004 15.5996H10.7998C10.1373 15.5995 9.59982 15.0629 9.59961 14.4004C9.59961 13.7377 10.1372 13.2003 10.7998 13.2002H20.4004ZM20.4004 8.40039C21.0628 8.4006 21.5994 8.93718 21.5996 9.59961C21.5996 10.2622 21.063 10.7996 20.4004 10.7998H10.7998C10.1372 10.7997 9.59961 10.2623 9.59961 9.59961C9.59982 8.93711 10.1373 8.4005 10.7998 8.40039H20.4004ZM4.7998 2.40039C6.12522 2.40039 7.20009 3.47441 7.2002 4.7998C7.2002 6.12529 6.12529 7.2002 4.7998 7.2002C3.47441 7.20009 2.40039 6.12522 2.40039 4.7998C2.4005 3.47448 3.47448 2.4005 4.7998 2.40039ZM20.4004 3.59961C21.0629 3.59982 21.5995 4.13728 21.5996 4.7998C21.5996 5.46242 21.063 5.99979 20.4004 6H10.7998C10.1372 5.99989 9.59961 5.46248 9.59961 4.7998C9.59971 4.13722 10.1372 3.59971 10.7998 3.59961H20.4004Z",
|
|
2289
|
-
fill: "currentColor"
|
|
2290
|
-
})
|
|
2291
|
-
});
|
|
2292
|
-
//#endregion
|
|
2293
2337
|
//#region src/components/Icon/icons/CalendarIcon.tsx
|
|
2294
2338
|
const CalendarIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
2295
2339
|
...props,
|
|
@@ -3073,6 +3117,28 @@ const FitIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
3073
3117
|
})
|
|
3074
3118
|
});
|
|
3075
3119
|
//#endregion
|
|
3120
|
+
//#region src/components/Icon/icons/FlipHorizontalIcon.tsx
|
|
3121
|
+
const FlipHorizontalIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
3122
|
+
...props,
|
|
3123
|
+
viewBox: "0 0 24 24",
|
|
3124
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3125
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
3126
|
+
d: "M12 19.333C12.5522 19.333 12.9998 19.7809 13 20.333C13 20.8853 12.5523 21.333 12 21.333C11.4477 21.333 11 20.8853 11 20.333C11.0002 19.7809 11.4478 19.333 12 19.333ZM19.8877 6.58301C20.385 6.13773 21.0704 6.02954 21.6797 6.30273C22.2877 6.5734 22.667 7.15755 22.667 7.82422V16.1758C22.667 16.8424 22.2877 17.4253 21.6797 17.6973C21.4571 17.7959 21.2238 17.8457 20.9932 17.8457C20.5932 17.8457 20.2023 17.6983 19.8877 17.417L15.2217 13.2432C14.8683 12.9258 14.667 12.4733 14.667 12C14.667 11.5268 14.8679 11.0748 15.2197 10.7588L19.8877 6.58301ZM2.32031 6.30273C2.92959 6.03217 3.61635 6.1381 4.1123 6.58203L8.77832 10.7568C9.13165 11.0742 9.33301 11.5267 9.33301 12C9.33295 12.4732 9.13215 12.9253 8.78027 13.2412L4.11035 17.417C3.79708 17.6982 3.40673 17.8447 3.00684 17.8447C2.77628 17.8447 2.54289 17.7972 2.32031 17.6973C1.71231 17.4266 1.33301 16.8424 1.33301 16.1758V7.82422C1.33301 7.15755 1.71231 6.57473 2.32031 6.30273ZM12 15.167C12.5523 15.167 13 15.6147 13 16.167C12.9998 16.7191 12.5522 17.167 12 17.167C11.4478 17.167 11.0002 16.7191 11 16.167C11 15.6147 11.4477 15.167 12 15.167ZM3.33301 15.4287L7.16797 12L3.33301 8.57031V15.4287ZM12 11C12.5523 11 13 11.4477 13 12C13 12.5523 12.5523 13 12 13C11.4477 13 11 12.5523 11 12C11 11.4477 11.4477 11 12 11ZM12 6.83301C12.5522 6.83301 12.9998 7.28087 13 7.83301C13 8.38529 12.5523 8.83301 12 8.83301C11.4477 8.83301 11 8.38529 11 7.83301C11.0002 7.28087 11.4478 6.83301 12 6.83301ZM12 2.66699C12.5523 2.66699 13 3.11471 13 3.66699C12.9998 4.21913 12.5522 4.66699 12 4.66699C11.4478 4.66699 11.0002 4.21913 11 3.66699C11 3.11471 11.4477 2.66699 12 2.66699Z",
|
|
3127
|
+
fill: "currentColor"
|
|
3128
|
+
})
|
|
3129
|
+
});
|
|
3130
|
+
//#endregion
|
|
3131
|
+
//#region src/components/Icon/icons/FlipVerticalIcon.tsx
|
|
3132
|
+
const FlipVerticalIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
3133
|
+
...props,
|
|
3134
|
+
viewBox: "0 0 24 24",
|
|
3135
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3136
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
3137
|
+
d: "M10.7588 15.2207C11.3908 14.5144 12.6089 14.5157 13.2422 15.2207L13.2441 15.2197L17.418 19.8867C17.8633 20.384 17.9709 21.0694 17.7002 21.6787C17.4282 22.2879 16.8433 22.666 16.1768 22.666H7.8252C7.15872 22.666 6.57483 22.2877 6.30273 21.6787C6.03209 21.0694 6.13876 20.384 6.58398 19.8867L10.7588 15.2207ZM3.66699 11C4.21913 11.0002 4.66699 11.4478 4.66699 12C4.66699 12.5522 4.21913 12.9998 3.66699 13C3.11471 13 2.66699 12.5523 2.66699 12C2.66699 11.4477 3.11471 11 3.66699 11ZM7.83301 11C8.38529 11 8.83301 11.4477 8.83301 12C8.83301 12.5523 8.38529 13 7.83301 13C7.28087 12.9998 6.83301 12.5522 6.83301 12C6.83301 11.4478 7.28087 11.0002 7.83301 11ZM12 11C12.5523 11 13 11.4477 13 12C13 12.5523 12.5523 13 12 13C11.4477 13 11 12.5523 11 12C11 11.4477 11.4477 11 12 11ZM16.167 11C16.7191 11.0002 17.167 11.4478 17.167 12C17.167 12.5522 16.7191 12.9998 16.167 13C15.6147 13 15.167 12.5523 15.167 12C15.167 11.4477 15.6147 11 16.167 11ZM20.333 11C20.8853 11 21.333 11.4477 21.333 12C21.333 12.5523 20.8853 13 20.333 13C19.7809 12.9998 19.333 12.5522 19.333 12C19.333 11.4478 19.7809 11.0002 20.333 11ZM16.1758 1.33301C16.8424 1.33301 17.4262 1.71098 17.6982 2.32031C17.9688 2.9296 17.8623 3.61502 17.417 4.1123L13.2422 8.77734C12.9249 9.13188 12.4732 9.33294 12 9.33301C11.5267 9.33301 11.0728 9.13165 10.7568 8.77832L6.58203 4.1123C6.13675 3.61632 6.03015 2.93059 6.30078 2.32129C6.57278 1.71196 7.15755 1.33301 7.82422 1.33301H16.1758ZM12 7.16699H12.001L15.4307 3.33301H8.57031L12 7.16699Z",
|
|
3138
|
+
fill: "currentColor"
|
|
3139
|
+
})
|
|
3140
|
+
});
|
|
3141
|
+
//#endregion
|
|
3076
3142
|
//#region src/components/Icon/icons/FontsIcon.tsx
|
|
3077
3143
|
const FontsIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
3078
3144
|
...props,
|
|
@@ -3299,6 +3365,18 @@ const KeyboardIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
3299
3365
|
})
|
|
3300
3366
|
});
|
|
3301
3367
|
//#endregion
|
|
3368
|
+
//#region src/components/Icon/icons/LayersIcon.tsx
|
|
3369
|
+
const LayersIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
3370
|
+
...props,
|
|
3371
|
+
viewBox: "0 0 24 24",
|
|
3372
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3373
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
3374
|
+
transform: "translate(2.018 1.507)",
|
|
3375
|
+
d: "M18.9629 13.8271C19.5147 13.8273 19.9629 14.2752 19.9629 14.8271C19.9629 15.5711 19.5532 16.25 18.8945 16.5966L11.0674 20.7177C10.7276 20.8976 10.3546 20.9872 9.98145 20.9872C9.6083 20.9872 9.23342 20.8966 8.89355 20.7167L1.06738 16.5966C0.40884 16.2499 6.62335e-06 15.5723 0 14.8271C0 14.2751 0.448 13.8271 1 13.8271C1.55189 13.8272 2 14.2752 2 14.8271L9.82617 18.9482C9.92484 18.9988 10.0397 18.9988 10.1357 18.9482L17.9629 14.8271C17.9629 14.2751 18.4109 13.8271 18.9629 13.8271ZM18.9629 9.49408C19.5147 9.49433 19.9629 9.94223 19.9629 10.4941C19.9628 11.2378 19.5529 11.916 18.8945 12.2626L11.0674 16.3847C10.7276 16.5645 10.3545 16.6532 9.98145 16.6533C9.6082 16.6533 9.23349 16.5627 8.89355 16.3827L1.06738 12.2626C0.409093 11.9159 0.000125654 11.2391 0 10.4941C0 9.94208 0.448 9.49408 1 9.49408C1.55189 9.49421 2 9.94216 2 10.4941L9.82617 14.6152C9.92482 14.6658 10.0398 14.6658 10.1357 14.6152L17.9629 10.4941C17.9629 9.94208 18.4109 9.49408 18.9629 9.49408ZM8.89453 0.270445C9.57449 -0.0894448 10.3881 -0.0908513 11.0693 0.270445L18.8945 4.39056C19.5532 4.73723 19.9629 5.4161 19.9629 6.16009C19.9629 6.90409 19.5532 7.58296 18.8945 7.92962L11.0674 12.0507C10.7276 12.2306 10.3546 12.3202 9.98145 12.3202C9.6083 12.3202 9.23342 12.2296 8.89355 12.0497L1.06738 7.92962C0.40884 7.58293 5.37071e-06 6.90401 0 6.16009C0 5.41618 0.408843 4.73726 1.06738 4.39056L8.89453 0.270445Z",
|
|
3376
|
+
fill: "currentColor"
|
|
3377
|
+
})
|
|
3378
|
+
});
|
|
3379
|
+
//#endregion
|
|
3302
3380
|
//#region src/components/Icon/icons/LayoutIcon.tsx
|
|
3303
3381
|
const LayoutIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
3304
3382
|
...props,
|
|
@@ -3749,6 +3827,25 @@ const PasswordIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
3749
3827
|
})
|
|
3750
3828
|
});
|
|
3751
3829
|
//#endregion
|
|
3830
|
+
//#region src/components/Icon/icons/PasteIcon.tsx
|
|
3831
|
+
const PasteIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
3832
|
+
...props,
|
|
3833
|
+
viewBox: "0 0 24 24",
|
|
3834
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
3835
|
+
children: /* @__PURE__ */ jsxs("g", {
|
|
3836
|
+
transform: "translate(1.332 1.315)",
|
|
3837
|
+
children: [/* @__PURE__ */ jsx("path", {
|
|
3838
|
+
fillRule: "evenodd",
|
|
3839
|
+
clipRule: "evenodd",
|
|
3840
|
+
d: "M5.563 17.8883C3.55962 18.1835 1.69516 16.7989 1.39991 14.7955L0.0395602 5.56112C-0.255241 3.55812 1.1294 1.69539 3.13233 1.39999L12.3667 0.0396351C14.3698 -0.255396 16.2323 1.12846 16.5278 3.13143L17.8892 12.3658C18.1841 14.3689 16.7994 16.2315 14.7964 16.5269L5.563 17.8883ZM8.37354 14.0914L8.3755 14.0904C8.67314 14.0434 8.93374 13.8647 9.08546 13.6031L13.648 5.10018C13.9247 4.62188 13.7609 4.01078 13.2827 3.73397C12.803 3.45618 12.1934 3.62111 11.9165 4.09921L7.97608 11.5269L5.17237 9.36678C4.76543 8.99532 4.13436 9.02371 3.76026 9.43221C3.38743 9.84072 3.41719 10.4715 3.82569 10.8443L7.5464 13.8424C7.76891 14.0461 8.07459 14.1386 8.37354 14.0914Z",
|
|
3841
|
+
fill: "currentColor"
|
|
3842
|
+
}), /* @__PURE__ */ jsx("path", {
|
|
3843
|
+
d: "M8.32667 21.2467C7.82531 21.2467 7.40868 20.8755 7.33741 20.3941H7.33937C7.33217 20.3454 7.32695 20.2956 7.32765 20.2457C7.32722 19.6947 7.77609 19.2452 8.32862 19.2457L17.6616 19.2525C18.1066 19.254 18.5267 19.0809 18.8413 18.7662C19.1557 18.4529 19.3293 18.0339 19.3296 17.5894L19.3364 8.25546C19.3388 7.4802 18.8135 6.81479 18.063 6.63339C17.525 6.5026 17.1943 5.96017 17.3257 5.42733C17.4551 4.8895 17.9952 4.56072 18.5317 4.69003C20.1836 5.08862 21.3363 6.5596 21.3355 8.25643L21.3296 17.5894C21.329 18.5694 20.9463 19.4907 20.2534 20.1822C19.5609 20.8747 18.6402 21.2549 17.6607 21.2545L8.32667 21.2467Z",
|
|
3844
|
+
fill: "currentColor"
|
|
3845
|
+
})]
|
|
3846
|
+
})
|
|
3847
|
+
});
|
|
3848
|
+
//#endregion
|
|
3752
3849
|
//#region src/components/Icon/icons/PauseIcon.tsx
|
|
3753
3850
|
const PauseIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
3754
3851
|
...props,
|
|
@@ -4074,14 +4171,24 @@ const RefreshIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4074
4171
|
});
|
|
4075
4172
|
//#endregion
|
|
4076
4173
|
//#region src/components/Icon/icons/RemixIcon.tsx
|
|
4077
|
-
const RemixIcon = (props) => /* @__PURE__ */
|
|
4174
|
+
const RemixIcon = (props) => /* @__PURE__ */ jsxs("svg", {
|
|
4078
4175
|
...props,
|
|
4079
|
-
viewBox:
|
|
4176
|
+
viewBox: `0 0 24 24`,
|
|
4080
4177
|
xmlns: "http://www.w3.org/2000/svg",
|
|
4081
|
-
children:
|
|
4082
|
-
|
|
4083
|
-
|
|
4084
|
-
|
|
4178
|
+
children: [
|
|
4179
|
+
/* @__PURE__ */ jsx("path", {
|
|
4180
|
+
d: "M21.6895 11.2705C21.1376 11.2096 20.6774 11.6911 20.6631 12.2432C20.5326 16.9661 16.7276 20.6668 12 20.667C9.11295 20.667 6.49383 19.2363 4.89649 16.9316L6.83888 17.2002C7.38301 17.2672 7.89104 16.8934 7.96681 16.3467C8.04241 15.7998 7.65976 15.2949 7.11231 15.2188L3.18751 14.6758C2.64911 14.6047 2.13669 14.9824 2.06056 15.5293L1.51563 19.4561C1.43967 20.0028 1.82238 20.5076 2.36915 20.583C2.41598 20.5895 2.46232 20.5928 2.50782 20.5928C2.9992 20.5926 3.42695 20.2309 3.4961 19.7305L3.6504 18.623C5.63987 21.1363 8.68002 22.667 12 22.667C17.8189 22.6668 22.5027 18.1111 22.6621 12.2969C22.6775 11.7451 22.2414 11.2854 21.6895 11.2705Z",
|
|
4181
|
+
fill: "currentColor"
|
|
4182
|
+
}),
|
|
4183
|
+
/* @__PURE__ */ jsx("path", {
|
|
4184
|
+
d: "M12 8.33301C9.97497 8.33301 8.33302 9.97496 8.33302 12C8.33302 14.0251 9.97497 15.667 12 15.667C14.0249 15.6668 15.666 14.0249 15.666 12C15.666 9.9751 14.0249 8.33323 12 8.33301Z",
|
|
4185
|
+
fill: "currentColor"
|
|
4186
|
+
}),
|
|
4187
|
+
/* @__PURE__ */ jsx("path", {
|
|
4188
|
+
d: "M12 1.33301C6.18171 1.33301 1.49828 5.88656 1.3379 11.7002C1.3223 12.2521 1.75753 12.7125 2.30958 12.7275C2.31865 12.7282 2.32883 12.7275 2.3379 12.7275C2.87757 12.7275 3.32102 12.2978 3.33595 11.7549C3.4671 7.03242 7.27289 3.33301 12 3.33301C14.8857 3.33303 17.5052 4.76386 19.1025 7.06836L17.1611 6.7998C16.6222 6.72489 16.1102 7.10608 16.0332 7.65332C15.9576 8.20025 16.3402 8.70512 16.8877 8.78125L20.8125 9.32422C20.8587 9.33007 20.9047 9.333 20.9502 9.33301C21.4418 9.33301 21.8704 8.97136 21.9395 8.4707L22.4834 4.54395C22.5595 3.99718 22.1776 3.49253 21.6309 3.41699C21.0794 3.34139 20.5784 3.72206 20.5029 4.26953L20.3496 5.37891C18.3599 2.86535 15.3187 1.33307 12 1.33301Z",
|
|
4189
|
+
fill: "currentColor"
|
|
4190
|
+
})
|
|
4191
|
+
]
|
|
4085
4192
|
});
|
|
4086
4193
|
//#endregion
|
|
4087
4194
|
//#region src/components/Icon/icons/ReplaceIcon.tsx
|
|
@@ -4147,6 +4254,19 @@ const RewindIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4147
4254
|
})
|
|
4148
4255
|
});
|
|
4149
4256
|
//#endregion
|
|
4257
|
+
//#region src/components/Icon/icons/RoundnessIcon.tsx
|
|
4258
|
+
const RoundnessIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4259
|
+
...props,
|
|
4260
|
+
viewBox: "0 0 24 24",
|
|
4261
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4262
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4263
|
+
clipRule: "evenodd",
|
|
4264
|
+
d: "M11.6667 4.66667C7.80066 4.66667 4.66667 7.80032 4.66667 11.6667V20.3333C4.66667 20.8856 4.21895 21.3333 3.66667 21.3333C3.11439 21.3333 2.66667 20.8856 2.66667 20.3333V11.6667C2.66667 6.69568 6.69615 2.66667 11.6667 2.66667H20.3333C20.8856 2.66667 21.3333 3.11439 21.3333 3.66667C21.3333 4.21895 20.8856 4.66667 20.3333 4.66667H11.6667Z",
|
|
4265
|
+
fill: "currentColor",
|
|
4266
|
+
fillRule: "evenodd"
|
|
4267
|
+
})
|
|
4268
|
+
});
|
|
4269
|
+
//#endregion
|
|
4150
4270
|
//#region src/components/Icon/icons/SaveIcon.tsx
|
|
4151
4271
|
const SaveIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4152
4272
|
...props,
|
|
@@ -4232,6 +4352,17 @@ const SendIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4232
4352
|
})
|
|
4233
4353
|
});
|
|
4234
4354
|
//#endregion
|
|
4355
|
+
//#region src/components/Icon/icons/ShadowIcon.tsx
|
|
4356
|
+
const ShadowIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4357
|
+
...props,
|
|
4358
|
+
viewBox: "0 0 24 24",
|
|
4359
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4360
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4361
|
+
d: "M9.33301 1.33301C12.942 1.33301 15.9977 3.73474 16.9912 7.02344C20.2709 8.02123 22.666 11.0655 22.666 14.667C22.666 19.079 19.078 22.667 14.666 22.667C11.0644 22.6668 8.02001 20.2712 7.02246 16.9912C3.73422 15.9974 1.33301 12.9416 1.33301 9.33301C1.33318 4.92127 4.92127 1.33318 9.33301 1.33301ZM9.33301 3.33301C6.02527 3.33318 3.33318 6.02527 3.33301 9.33301C3.33301 12.6409 6.02516 15.3328 9.33301 15.333C12.641 15.333 15.333 12.641 15.333 9.33301C15.3328 6.02516 12.6409 3.33301 9.33301 3.33301Z",
|
|
4362
|
+
fill: "currentColor"
|
|
4363
|
+
})
|
|
4364
|
+
});
|
|
4365
|
+
//#endregion
|
|
4235
4366
|
//#region src/components/Icon/icons/ShapesIcon.tsx
|
|
4236
4367
|
const ShapesIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4237
4368
|
...props,
|
|
@@ -4398,6 +4529,31 @@ const TeleprompterIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4398
4529
|
})
|
|
4399
4530
|
});
|
|
4400
4531
|
//#endregion
|
|
4532
|
+
//#region src/components/Icon/icons/TextIcon.tsx
|
|
4533
|
+
const TextIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4534
|
+
...props,
|
|
4535
|
+
viewBox: "0 0 24 24",
|
|
4536
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4537
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4538
|
+
transform: "translate(3.334 2.664)",
|
|
4539
|
+
d: "M15.3339 0C15.7126 4.39001e-05 16.0592 0.215079 16.2285 0.553711L17.2285 2.55371C17.4764 3.04837 17.2749 3.64787 16.7802 3.89453C16.6376 3.96652 16.4842 4.00195 16.3349 4.00195C15.9683 4.00186 15.6154 3.79881 15.4394 3.44824L14.7148 2.00195H9.66694V16.668H11.6669C12.2188 16.668 12.6668 17.1161 12.6669 17.668C12.6669 18.2199 12.2189 18.6679 11.6669 18.668H5.66694C5.11494 18.668 4.66694 18.22 4.66694 17.668C4.66712 17.1161 5.11505 16.668 5.66694 16.668H7.66694V2.00195H2.61909L1.89546 3.44824C1.64879 3.94158 1.04833 4.14253 0.553663 3.89453C0.0592901 3.64647 -0.141039 3.0469 0.105421 2.55371L1.10542 0.553711C1.27475 0.215044 1.62226 0 2.00093 0H15.3339Z",
|
|
4540
|
+
fill: "currentColor"
|
|
4541
|
+
})
|
|
4542
|
+
});
|
|
4543
|
+
//#endregion
|
|
4544
|
+
//#region src/components/Icon/icons/TextAllCapsIcon.tsx
|
|
4545
|
+
const TextAllCapsIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4546
|
+
...props,
|
|
4547
|
+
viewBox: "0 0 24 24",
|
|
4548
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4549
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4550
|
+
clipRule: "evenodd",
|
|
4551
|
+
d: "M18.5396 5.33301C20.957 5.33301 22.3489 6.82032 22.8355 7.45898C23.1701 7.89898 23.0864 8.52571 22.6451 8.86035C22.2051 9.19486 21.5784 9.10889 21.2437 8.66895C20.8636 8.17025 20.0074 7.33301 18.5396 7.33301C16.1144 7.33308 14.6666 9.10566 14.6666 12.0723C14.6667 14.7348 16.1746 16.667 18.2506 16.667C19.3239 16.667 21.2427 16.6666 21.5601 13.3896H18.3941C17.8424 13.3895 17.3943 12.9414 17.3941 12.3896C17.3941 11.8378 17.8423 11.3898 18.3941 11.3896H22.6051C23.1571 11.3896 23.6051 11.8376 23.6051 12.3896C23.605 16.5547 21.8037 18.6669 18.2506 18.667C15.0666 18.667 12.6667 15.8321 12.6666 12.0723C12.6666 7.97899 14.9717 5.33308 18.5396 5.33301ZM6.33065 5.33301C6.73184 5.33313 7.09557 5.57478 7.25155 5.94531L12.0113 17.2773C12.226 17.7867 11.9865 18.3736 11.4771 18.5869C11.3505 18.6402 11.2197 18.665 11.0904 18.665C10.6998 18.665 10.3286 18.4363 10.1685 18.0537L9.30624 15.999H3.11678L2.25448 18.0537C2.04105 18.5642 1.45246 18.8012 0.945884 18.5879C0.438175 18.3744 0.198431 17.7875 0.411705 17.2783L5.17147 5.94531C5.32747 5.57465 5.69068 5.33301 6.09335 5.33301H6.33065ZM3.95663 14H8.46639L6.21151 8.63379L3.95663 14Z",
|
|
4552
|
+
fill: "currentColor",
|
|
4553
|
+
fillRule: "evenodd"
|
|
4554
|
+
})
|
|
4555
|
+
});
|
|
4556
|
+
//#endregion
|
|
4401
4557
|
//#region src/components/Icon/icons/TextBoldIcon.tsx
|
|
4402
4558
|
const TextBoldIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4403
4559
|
...props,
|
|
@@ -4409,6 +4565,28 @@ const TextBoldIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4409
4565
|
})
|
|
4410
4566
|
});
|
|
4411
4567
|
//#endregion
|
|
4568
|
+
//#region src/components/Icon/icons/TextBulletedListIcon.tsx
|
|
4569
|
+
const TextBulletedListIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4570
|
+
...props,
|
|
4571
|
+
viewBox: "0 0 24 24",
|
|
4572
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4573
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4574
|
+
d: "M5 14C6.65685 14 8 15.3431 8 17C8 18.6569 6.65685 20 5 20C3.34315 20 2 18.6569 2 17C2 15.3431 3.34315 14 5 14ZM21.667 16C22.2188 16.0002 22.667 16.4481 22.667 17C22.667 17.5519 22.2188 17.9998 21.667 18H11.667C11.115 18 10.667 17.552 10.667 17C10.667 16.448 11.115 16 11.667 16H21.667ZM5 4C6.65685 4 8 5.34315 8 7C8 8.65685 6.65685 10 5 10C3.34315 10 2 8.65685 2 7C2 5.34315 3.34315 4 5 4ZM21.667 6C22.2188 6.00018 22.667 6.44811 22.667 7C22.667 7.55189 22.2188 7.99982 21.667 8H11.667C11.115 8 10.667 7.552 10.667 7C10.667 6.448 11.115 6 11.667 6H21.667Z",
|
|
4575
|
+
fill: "currentColor"
|
|
4576
|
+
})
|
|
4577
|
+
});
|
|
4578
|
+
//#endregion
|
|
4579
|
+
//#region src/components/Icon/icons/TextCenterAlignIcon.tsx
|
|
4580
|
+
const TextCenterAlignIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4581
|
+
...props,
|
|
4582
|
+
viewBox: "0 0 24 24",
|
|
4583
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4584
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4585
|
+
d: "M16.333 18C16.885 18 17.333 18.448 17.333 19C17.333 19.552 16.885 20 16.333 20H7.66699C7.11499 20 6.66699 19.552 6.66699 19C6.66699 18.448 7.11499 18 7.66699 18H16.333ZM20.333 13.333C20.8849 13.333 21.3328 13.7812 21.333 14.333C21.333 14.885 20.885 15.333 20.333 15.333H3.66699C3.11499 15.333 2.66699 14.885 2.66699 14.333C2.66717 13.7812 3.1151 13.333 3.66699 13.333H20.333ZM16.333 8.66699C16.885 8.66699 17.333 9.11499 17.333 9.66699C17.3328 10.2188 16.8849 10.667 16.333 10.667H7.66699C7.1151 10.667 6.66717 10.2188 6.66699 9.66699C6.66699 9.11499 7.11499 8.66699 7.66699 8.66699H16.333ZM20.333 4C20.885 4 21.333 4.448 21.333 5C21.333 5.552 20.885 6 20.333 6H3.66699C3.11499 6 2.66699 5.552 2.66699 5C2.66699 4.448 3.11499 4 3.66699 4H20.333Z",
|
|
4586
|
+
fill: "currentColor"
|
|
4587
|
+
})
|
|
4588
|
+
});
|
|
4589
|
+
//#endregion
|
|
4412
4590
|
//#region src/components/Icon/icons/TextItalicsIcon.tsx
|
|
4413
4591
|
const TextItalicsIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4414
4592
|
...props,
|
|
@@ -4420,6 +4598,54 @@ const TextItalicsIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4420
4598
|
})
|
|
4421
4599
|
});
|
|
4422
4600
|
//#endregion
|
|
4601
|
+
//#region src/components/Icon/icons/TextLeftAlignIcon.tsx
|
|
4602
|
+
const TextLeftAlignIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4603
|
+
...props,
|
|
4604
|
+
viewBox: "0 0 24 24",
|
|
4605
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4606
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4607
|
+
d: "M12.333 18C12.885 18 13.333 18.448 13.333 19C13.333 19.552 12.885 20 12.333 20H3.66699C3.11499 20 2.66699 19.552 2.66699 19C2.66699 18.448 3.11499 18 3.66699 18H12.333ZM20.333 13.333C20.8849 13.333 21.3328 13.7812 21.333 14.333C21.333 14.885 20.885 15.333 20.333 15.333H3.66699C3.11499 15.333 2.66699 14.885 2.66699 14.333C2.66717 13.7812 3.1151 13.333 3.66699 13.333H20.333ZM12.333 8.66699C12.885 8.66699 13.333 9.11499 13.333 9.66699C13.3328 10.2188 12.8849 10.667 12.333 10.667H3.66699C3.1151 10.667 2.66717 10.2188 2.66699 9.66699C2.66699 9.11499 3.11499 8.66699 3.66699 8.66699H12.333ZM20.333 4C20.885 4 21.333 4.448 21.333 5C21.333 5.552 20.885 6 20.333 6H3.66699C3.11499 6 2.66699 5.552 2.66699 5C2.66699 4.448 3.11499 4 3.66699 4H20.333Z",
|
|
4608
|
+
fill: "currentColor"
|
|
4609
|
+
})
|
|
4610
|
+
});
|
|
4611
|
+
//#endregion
|
|
4612
|
+
//#region src/components/Icon/icons/TextLineHeightIcon.tsx
|
|
4613
|
+
const TextLineHeightIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4614
|
+
...props,
|
|
4615
|
+
viewBox: "0 0 24 24",
|
|
4616
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4617
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4618
|
+
clipRule: "evenodd",
|
|
4619
|
+
d: "M4.29227 1.62639C4.68289 1.236 5.31572 1.23598 5.70633 1.62639L8.37332 4.29338C8.76377 4.68398 8.76372 5.3168 8.37332 5.70744C8.17866 5.90344 7.92229 6.00139 7.66629 6.00139C7.41039 6.00131 7.15483 5.90203 6.96024 5.70744L6.00028 4.74748V19.2533L6.96024 18.2934L6.95828 18.2914C7.3489 17.9009 7.98266 17.9009 8.37332 18.2914C8.76398 18.6821 8.76395 19.3158 8.37332 19.7065L5.70633 22.3735C5.51179 22.5692 5.25604 22.6663 5.00028 22.6664C4.74434 22.6664 4.48789 22.568 4.29324 22.3735L1.62625 19.7065C1.23577 19.3158 1.23565 18.682 1.62625 18.2914C2.01686 17.9008 2.65062 17.9009 3.04129 18.2914L4.00125 19.2514V4.74748L3.04129 5.70744C2.65062 6.09811 2.01692 6.09811 1.62625 5.70744C1.23604 5.31684 1.23599 4.68395 1.62625 4.29338L4.29227 1.62639ZM17.6663 17.9994C18.2182 17.9994 18.6661 18.4476 18.6663 18.9994C18.6663 19.5514 18.2183 19.9994 17.6663 19.9994H11.6663C11.1144 19.9993 10.6663 19.5513 10.6663 18.9994C10.6665 18.4477 11.1146 17.9996 11.6663 17.9994H17.6663ZM21.6663 13.3334C22.2183 13.3334 22.6663 13.7814 22.6663 14.3334C22.6662 14.8853 22.2182 15.3334 21.6663 15.3334H11.6663C11.1145 15.3332 10.6664 14.8852 10.6663 14.3334C10.6663 13.7815 11.1144 13.3336 11.6663 13.3334H21.6663ZM21.6663 8.66643C22.2183 8.66643 22.6663 9.11446 22.6663 9.66643C22.6663 10.2184 22.2183 10.6664 21.6663 10.6664H11.6663C11.1144 10.6663 10.6663 10.2183 10.6663 9.66643C10.6663 9.11456 11.1145 8.6666 11.6663 8.66643H21.6663ZM21.6663 3.99943C22.2182 3.99943 22.6661 4.44761 22.6663 4.99943C22.6663 5.55143 22.2183 5.99943 21.6663 5.99943H11.6663C11.1144 5.99926 10.6663 5.55133 10.6663 4.99943C10.6665 4.44772 11.1146 3.9996 11.6663 3.99943H21.6663Z",
|
|
4620
|
+
fill: "currentColor",
|
|
4621
|
+
fillRule: "evenodd"
|
|
4622
|
+
})
|
|
4623
|
+
});
|
|
4624
|
+
//#endregion
|
|
4625
|
+
//#region src/components/Icon/icons/TextNumberedListIcon.tsx
|
|
4626
|
+
const TextNumberedListIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4627
|
+
...props,
|
|
4628
|
+
viewBox: "0 0 24 24",
|
|
4629
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4630
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4631
|
+
clipRule: "evenodd",
|
|
4632
|
+
d: "M6.17018 12.6667C8.19818 12.6961 9.62815 13.8307 9.72682 15.488C9.81747 17.016 8.69946 18.2653 6.40748 19.1999C5.67037 19.5012 5.177 19.7358 4.85573 19.9997H8.73073C9.2826 19.9998 9.73059 20.4479 9.73073 20.9997C9.73073 21.5517 9.28268 21.9997 8.73073 21.9997H3.33327C3.05594 21.9997 2.79017 21.8854 2.60084 21.6814C2.41165 21.4774 2.31623 21.2053 2.33619 20.9294C2.49884 18.6377 4.32099 17.8924 5.65162 17.3484C6.44756 17.0244 7.77487 16.3667 7.72975 15.6081C7.67908 14.7561 6.49955 14.6721 6.14088 14.6667C5.39838 14.6335 4.5402 14.9521 4.29616 15.8171C4.14816 16.3478 3.60273 16.6624 3.06276 16.5105C2.53209 16.3611 2.22104 15.8091 2.37037 15.2771C2.81043 13.7078 4.30428 12.6667 6.09889 12.6667H6.17018ZM21.6663 15.9997C22.2182 15.9997 22.6661 16.4479 22.6663 16.9997C22.6663 17.5517 22.2183 17.9997 21.6663 17.9997H12.6663C12.1145 17.9995 11.6663 17.5516 11.6663 16.9997C11.6664 16.448 12.1145 15.9999 12.6663 15.9997H21.6663ZM5.46901 2.16673C5.69965 1.77876 6.168 1.58782 6.59596 1.70774C7.03054 1.82638 7.33412 2.21715 7.33424 2.6677V9.99973C7.33424 10.5517 6.88527 10.9997 6.33327 10.9997C5.78131 10.9997 5.33327 10.5517 5.33327 9.99973V4.94407C4.92398 5.17203 4.44794 5.36085 3.89869 5.46751C3.36813 5.56615 2.83256 5.21605 2.72975 4.67356C2.62577 4.13098 2.97985 3.60776 3.52369 3.50364C4.80563 3.2587 5.44043 2.21388 5.46901 2.16673ZM21.6663 5.99973C22.2182 5.99973 22.6661 6.44785 22.6663 6.99973C22.6663 7.55173 22.2183 7.99973 21.6663 7.99973H12.6663C12.1145 7.99952 11.6663 7.5516 11.6663 6.99973C11.6664 6.44798 12.1145 5.99995 12.6663 5.99973H21.6663Z",
|
|
4633
|
+
fill: "currentColor",
|
|
4634
|
+
fillRule: "evenodd"
|
|
4635
|
+
})
|
|
4636
|
+
});
|
|
4637
|
+
//#endregion
|
|
4638
|
+
//#region src/components/Icon/icons/TextRightAlignIcon.tsx
|
|
4639
|
+
const TextRightAlignIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4640
|
+
...props,
|
|
4641
|
+
viewBox: "0 0 24 24",
|
|
4642
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4643
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4644
|
+
d: "M20.333 18C20.885 18 21.333 18.448 21.333 19C21.333 19.552 20.885 20 20.333 20H11.667C11.115 20 10.667 19.552 10.667 19C10.667 18.448 11.115 18 11.667 18H20.333ZM20.333 13.333C20.8849 13.333 21.3328 13.7812 21.333 14.333C21.333 14.885 20.885 15.333 20.333 15.333H3.66699C3.11499 15.333 2.66699 14.885 2.66699 14.333C2.66717 13.7812 3.1151 13.333 3.66699 13.333H20.333ZM20.333 8.66699C20.885 8.66699 21.333 9.11499 21.333 9.66699C21.3328 10.2188 20.8849 10.667 20.333 10.667H11.667C11.1151 10.667 10.6672 10.2188 10.667 9.66699C10.667 9.11499 11.115 8.66699 11.667 8.66699H20.333ZM20.333 4C20.885 4 21.333 4.448 21.333 5C21.333 5.552 20.885 6 20.333 6H3.66699C3.11499 6 2.66699 5.552 2.66699 5C2.66699 4.448 3.11499 4 3.66699 4H20.333Z",
|
|
4645
|
+
fill: "currentColor"
|
|
4646
|
+
})
|
|
4647
|
+
});
|
|
4648
|
+
//#endregion
|
|
4423
4649
|
//#region src/components/Icon/icons/TextSizeIcon.tsx
|
|
4424
4650
|
const TextSizeIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4425
4651
|
...props,
|
|
@@ -4433,6 +4659,41 @@ const TextSizeIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4433
4659
|
})
|
|
4434
4660
|
});
|
|
4435
4661
|
//#endregion
|
|
4662
|
+
//#region src/components/Icon/icons/TextStrikethroughIcon.tsx
|
|
4663
|
+
const TextStrikethroughIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4664
|
+
...props,
|
|
4665
|
+
viewBox: "0 0 24 24",
|
|
4666
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4667
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4668
|
+
d: "M17.4229 15.0039C17.9727 14.9516 18.4614 15.3555 18.5137 15.9053C18.5262 16.0368 18.5339 16.1715 18.5371 16.3096C18.6235 19.8362 15.4641 21.9999 12.1055 22C10.546 22 9.12593 21.6974 7.96387 20.9717C6.78263 20.2339 5.95172 19.1104 5.50293 17.6377C5.34227 17.1096 5.64082 16.5507 6.16895 16.3896C6.69702 16.2291 7.25598 16.5267 7.41699 17.0547C7.74021 18.1154 8.29401 18.8199 9.02344 19.2754C9.77202 19.7429 10.7891 20 12.1055 20C14.7654 19.9999 16.5877 18.3774 16.5381 16.3574C16.5359 16.2668 16.5304 16.1785 16.5225 16.0947C16.4701 15.545 16.8731 15.0563 17.4229 15.0039ZM12.1064 2C13.693 2 16.5637 2.49065 17.9531 5.77832C18.1678 6.28632 17.9289 6.87287 17.4209 7.08887C16.913 7.30337 16.325 7.06546 16.1104 6.55762C15.393 4.86028 14.0464 4 12.1064 4C11.3037 4.00006 9.52758 4.28239 8.55566 5.35156C8.03034 5.93023 7.81985 6.66149 7.90918 7.59082C7.96919 8.21496 8.1537 10.1158 12.1494 10.8291C12.4221 10.8775 12.7101 10.9351 13.0059 11H21.333C21.885 11 22.333 11.448 22.333 12C22.333 12.552 21.885 13 21.333 13H2.66699C2.11499 13 1.66699 12.552 1.66699 12C1.66699 11.448 2.11499 11 2.66699 11H7.56055C6.42585 10.0063 6.01814 8.81225 5.91895 7.78223C5.77639 6.30373 6.1759 4.99839 7.07715 4.00781C8.84871 2.05762 11.7773 2.00003 12.1064 2Z",
|
|
4669
|
+
fill: "currentColor"
|
|
4670
|
+
})
|
|
4671
|
+
});
|
|
4672
|
+
//#endregion
|
|
4673
|
+
//#region src/components/Icon/icons/TextTitleCaseIcon.tsx
|
|
4674
|
+
const TextTitleCaseIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4675
|
+
...props,
|
|
4676
|
+
viewBox: "0 0 24 24",
|
|
4677
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4678
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4679
|
+
clipRule: "evenodd",
|
|
4680
|
+
d: "M18.2077 8C18.9103 8 19.5613 8.20537 20.1266 8.54004C20.2946 8.22276 20.6157 8.00004 20.9996 8H21.0006C21.5526 8 22.0006 8.448 22.0006 9V17.4023C22.0006 19.569 20.2385 21.3319 18.0719 21.332C16.8239 21.332 15.6393 20.7303 14.902 19.7236C14.5758 19.2785 14.672 18.6538 15.1168 18.3271C15.5635 18.0005 16.189 18.0976 16.5143 18.543C16.877 19.0376 17.46 19.332 18.0719 19.332C19.1358 19.3319 20.0006 18.4663 20.0006 17.4023V16.1943C19.4633 16.4863 18.8596 16.667 18.2077 16.667H17.9342C15.8423 16.6669 14.1412 14.965 14.1412 12.873V11.793C14.1414 9.7012 15.8438 8.00011 17.9342 8H18.2077ZM7.3307 4C7.7319 4.00014 8.09564 4.24174 8.2516 4.6123L13.0114 15.9443C13.2259 16.4535 12.9863 17.0395 12.4772 17.2529C12.3506 17.3062 12.2198 17.332 12.0905 17.332C11.6998 17.332 11.3286 17.1024 11.1686 16.7197L10.3063 14.665H4.11683L3.25453 16.7197C3.04119 17.2304 2.4526 17.4682 1.94593 17.2549C1.43813 17.0414 1.19846 16.4546 1.41175 15.9453L6.17152 4.6123C6.32752 4.24164 6.69073 4 7.09339 4H7.3307ZM17.9332 10C16.9454 10 16.1395 10.8038 16.1393 11.793V12.873C16.1393 13.861 16.9452 14.667 17.9332 14.667H18.2067C19.1946 14.6669 19.9996 13.8623 19.9996 12.873V11.793C19.9994 10.8052 19.1944 10.0001 18.2067 10H17.9332ZM4.95667 12.667H9.46644L7.21156 7.2998L4.95667 12.667Z",
|
|
4681
|
+
fill: "currentColor",
|
|
4682
|
+
fillRule: "evenodd"
|
|
4683
|
+
})
|
|
4684
|
+
});
|
|
4685
|
+
//#endregion
|
|
4686
|
+
//#region src/components/Icon/icons/TextUnderlineIcon.tsx
|
|
4687
|
+
const TextUnderlineIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4688
|
+
...props,
|
|
4689
|
+
viewBox: "0 0 24 24",
|
|
4690
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
4691
|
+
children: /* @__PURE__ */ jsx("path", {
|
|
4692
|
+
d: "M20.333 19.333C20.8849 19.333 21.3328 19.7812 21.333 20.333C21.333 20.885 20.885 21.333 20.333 21.333H3.66699C3.11499 21.333 2.66699 20.885 2.66699 20.333C2.66717 19.7812 3.1151 19.333 3.66699 19.333H20.333ZM17 2.66699C17.552 2.66699 18 3.11499 18 3.66699V11.333C18 14.641 15.308 17.333 12 17.333C8.692 17.333 6 14.641 6 11.333V3.66699C6 3.11499 6.448 2.66699 7 2.66699C7.552 2.66699 8 3.11499 8 3.66699V11.333C8 13.5383 9.79467 15.333 12 15.333C14.2053 15.333 16 13.5383 16 11.333V3.66699C16 3.11499 16.448 2.66699 17 2.66699Z",
|
|
4693
|
+
fill: "currentColor"
|
|
4694
|
+
})
|
|
4695
|
+
});
|
|
4696
|
+
//#endregion
|
|
4436
4697
|
//#region src/components/Icon/icons/ThumbnailIcon.tsx
|
|
4437
4698
|
const ThumbnailIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
4438
4699
|
...props,
|
|
@@ -4774,7 +5035,7 @@ const ZoomOutIcon = (props) => /* @__PURE__ */ jsx("svg", {
|
|
|
4774
5035
|
//#endregion
|
|
4775
5036
|
//#region src/components/Icon/iconMap.ts
|
|
4776
5037
|
/**
|
|
4777
|
-
* This file is auto-generated by the generateIconMap script on
|
|
5038
|
+
* This file is auto-generated by the generateIconMap script on 4/22/2026.
|
|
4778
5039
|
*/
|
|
4779
5040
|
const iconMap = {
|
|
4780
5041
|
"ab-test": AbTestIcon,
|
|
@@ -4798,7 +5059,6 @@ const iconMap = {
|
|
|
4798
5059
|
bank: BankIcon,
|
|
4799
5060
|
bell: BellIcon,
|
|
4800
5061
|
bolt: BoltIcon,
|
|
4801
|
-
"bullet-list": BulletListIcon,
|
|
4802
5062
|
brands: BrandsIcon,
|
|
4803
5063
|
calendar: CalendarIcon,
|
|
4804
5064
|
"call-to-action": CallToActionIcon,
|
|
@@ -4863,6 +5123,8 @@ const iconMap = {
|
|
|
4863
5123
|
"film-strip": FilmStripIcon,
|
|
4864
5124
|
filter: FilterIcon,
|
|
4865
5125
|
fit: FitIcon,
|
|
5126
|
+
"flip-horizontal": FlipHorizontalIcon,
|
|
5127
|
+
"flip-vertical": FlipVerticalIcon,
|
|
4866
5128
|
fonts: FontsIcon,
|
|
4867
5129
|
footer: FooterIcon,
|
|
4868
5130
|
"full-screen": FullScreenIcon,
|
|
@@ -4880,6 +5142,7 @@ const iconMap = {
|
|
|
4880
5142
|
info: InfoIcon,
|
|
4881
5143
|
integrations: IntegrationsIcon,
|
|
4882
5144
|
keyboard: KeyboardIcon,
|
|
5145
|
+
layers: LayersIcon,
|
|
4883
5146
|
layout: LayoutIcon,
|
|
4884
5147
|
leave: LeaveIcon,
|
|
4885
5148
|
library: LibraryIcon,
|
|
@@ -4914,6 +5177,7 @@ const iconMap = {
|
|
|
4914
5177
|
"panel-up": PanelUpIcon,
|
|
4915
5178
|
"paper-clip": PaperClipIcon,
|
|
4916
5179
|
password: PasswordIcon,
|
|
5180
|
+
paste: PasteIcon,
|
|
4917
5181
|
pause: PauseIcon,
|
|
4918
5182
|
pencil: PencilIcon,
|
|
4919
5183
|
"pencil-sparkle": PencilSparkleIcon,
|
|
@@ -4945,6 +5209,7 @@ const iconMap = {
|
|
|
4945
5209
|
"request-video": RequestVideoIcon,
|
|
4946
5210
|
"revert-to-original": RevertToOriginalIcon,
|
|
4947
5211
|
rewind: RewindIcon,
|
|
5212
|
+
roundness: RoundnessIcon,
|
|
4948
5213
|
save: SaveIcon,
|
|
4949
5214
|
"save-as-copy": SaveAsCopyIcon,
|
|
4950
5215
|
scissors: ScissorsIcon,
|
|
@@ -4952,6 +5217,7 @@ const iconMap = {
|
|
|
4952
5217
|
"screenshare-on": ScreenshareOnIcon,
|
|
4953
5218
|
search: SearchIcon,
|
|
4954
5219
|
send: SendIcon,
|
|
5220
|
+
shadow: ShadowIcon,
|
|
4955
5221
|
shapes: ShapesIcon,
|
|
4956
5222
|
share: ShareIcon,
|
|
4957
5223
|
"sharing-permissions": SharingPermissionsIcon,
|
|
@@ -4964,9 +5230,20 @@ const iconMap = {
|
|
|
4964
5230
|
"switch-accounts": SwitchAccountsIcon,
|
|
4965
5231
|
tag: TagIcon,
|
|
4966
5232
|
teleprompter: TeleprompterIcon,
|
|
5233
|
+
text: TextIcon,
|
|
5234
|
+
"text-all-caps": TextAllCapsIcon,
|
|
4967
5235
|
"text-bold": TextBoldIcon,
|
|
5236
|
+
"text-bulleted-list": TextBulletedListIcon,
|
|
5237
|
+
"text-center-align": TextCenterAlignIcon,
|
|
4968
5238
|
"text-italics": TextItalicsIcon,
|
|
5239
|
+
"text-left-align": TextLeftAlignIcon,
|
|
5240
|
+
"text-line-height": TextLineHeightIcon,
|
|
5241
|
+
"text-numbered-list": TextNumberedListIcon,
|
|
5242
|
+
"text-right-align": TextRightAlignIcon,
|
|
4969
5243
|
"text-size": TextSizeIcon,
|
|
5244
|
+
"text-strikethrough": TextStrikethroughIcon,
|
|
5245
|
+
"text-title-case": TextTitleCaseIcon,
|
|
5246
|
+
"text-underline": TextUnderlineIcon,
|
|
4970
5247
|
thumbnail: ThumbnailIcon,
|
|
4971
5248
|
"thumbs-down": ThumbsDownIcon,
|
|
4972
5249
|
"thumbs-up": ThumbsUpIcon,
|
|
@@ -5235,7 +5512,7 @@ const StyledButtonLoading = styled.div`
|
|
|
5235
5512
|
position: absolute;
|
|
5236
5513
|
display: flex;
|
|
5237
5514
|
`;
|
|
5238
|
-
const ButtonContent = ({ isLoading = false, leftIcon, rightIcon, children, fullWidth
|
|
5515
|
+
const ButtonContent = ({ isLoading = false, leftIcon, rightIcon, children, fullWidth }) => {
|
|
5239
5516
|
return /* @__PURE__ */ jsxs(Fragment, { children: [isLoading ? /* @__PURE__ */ jsx(StyledButtonLoading, { children: /* @__PURE__ */ jsx(Icon, { type: "spinner" }) }) : null, /* @__PURE__ */ jsxs(StyledButtonContent, {
|
|
5240
5517
|
$hasLeftIcon: isNotNil(leftIcon),
|
|
5241
5518
|
$hasRightIcon: isNotNil(rightIcon),
|
|
@@ -7266,7 +7543,7 @@ const getAccessibleColorInDirection = ({ originalColor, colorForComparison, minC
|
|
|
7266
7543
|
* Finds the accessible color that is closest to the original color by trying both
|
|
7267
7544
|
* brighter and darker variants and choosing the one with the smallest change in value.
|
|
7268
7545
|
*/
|
|
7269
|
-
const getAccessibleColor = ({ originalColor, colorForComparison, minContrast
|
|
7546
|
+
const getAccessibleColor = ({ originalColor, colorForComparison, minContrast, maxIterations = 50, opacityForContrastCalculation }) => {
|
|
7270
7547
|
if (calculateContrast({
|
|
7271
7548
|
backgroundColor: formatHex(convertToHsv(originalColor)),
|
|
7272
7549
|
foregroundColor: colorForComparison,
|
|
@@ -7294,7 +7571,7 @@ const getAccessibleColor = ({ originalColor, colorForComparison, minContrast = D
|
|
|
7294
7571
|
* Checks if any accessible color derivatives exist for the given parameters.
|
|
7295
7572
|
* Returns true if at least one accessible color can be found by going brighter or darker.
|
|
7296
7573
|
*/
|
|
7297
|
-
const hasAccessibleDerivatives = ({ originalColor, colorForComparison, minContrast
|
|
7574
|
+
const hasAccessibleDerivatives = ({ originalColor, colorForComparison, minContrast, opacityForContrastCalculation }) => {
|
|
7298
7575
|
if (calculateContrast({
|
|
7299
7576
|
backgroundColor: formatHex(convertToHsv(originalColor)),
|
|
7300
7577
|
foregroundColor: colorForComparison,
|
|
@@ -8258,23 +8535,46 @@ const inputCss = css`
|
|
|
8258
8535
|
--wui-input-line-height: 16px;
|
|
8259
8536
|
--wui-input-font-weight: var(--wui-typography-weight-body);
|
|
8260
8537
|
`;
|
|
8538
|
+
/**
|
|
8539
|
+
* Applies the shared visual styling for input-like form controls (background,
|
|
8540
|
+
* outline, focus/error/disabled states, typography). Consumes the tokens from
|
|
8541
|
+
* `inputCss`, which must be applied to the element itself or an ancestor.
|
|
8542
|
+
*/
|
|
8543
|
+
const inputShellCss = css`
|
|
8544
|
+
padding: var(--wui-input-vertical-padding) var(--wui-input-horizontal-padding);
|
|
8545
|
+
background-color: var(--wui-input-color-bg);
|
|
8546
|
+
border: none;
|
|
8547
|
+
outline: 1px solid var(--wui-input-color-border);
|
|
8548
|
+
outline-offset: -1px;
|
|
8549
|
+
border-radius: var(--wui-input-border-radius);
|
|
8550
|
+
font-size: var(--wui-input-font-size);
|
|
8551
|
+
line-height: var(--wui-input-line-height);
|
|
8552
|
+
font-weight: var(--wui-input-font-weight);
|
|
8553
|
+
color: var(--wui-input-color-text);
|
|
8554
|
+
|
|
8555
|
+
&:focus,
|
|
8556
|
+
&[aria-expanded='true'] {
|
|
8557
|
+
outline-width: 2px;
|
|
8558
|
+
outline-color: var(--wui-input-color-border-focus);
|
|
8559
|
+
outline-offset: -2px;
|
|
8560
|
+
}
|
|
8561
|
+
|
|
8562
|
+
&[aria-invalid='true'] {
|
|
8563
|
+
outline-color: var(--wui-input-color-border-error);
|
|
8564
|
+
}
|
|
8565
|
+
|
|
8566
|
+
&:disabled {
|
|
8567
|
+
outline-color: var(--wui-color-border-disabled);
|
|
8568
|
+
background-color: var(--wui-color-bg-surface-disabled);
|
|
8569
|
+
}
|
|
8570
|
+
`;
|
|
8261
8571
|
//#endregion
|
|
8262
8572
|
//#region src/components/Input/Input.tsx
|
|
8263
8573
|
const inputStyles = css`
|
|
8264
8574
|
${inputCss}
|
|
8265
8575
|
input,
|
|
8266
8576
|
textarea {
|
|
8267
|
-
|
|
8268
|
-
background-color: var(--wui-input-color-bg);
|
|
8269
|
-
border: none;
|
|
8270
|
-
outline: 1px solid var(--wui-input-color-border);
|
|
8271
|
-
outline-offset: -1px;
|
|
8272
|
-
border-radius: var(--wui-input-border-radius);
|
|
8273
|
-
font-size: var(--wui-input-font-size);
|
|
8274
|
-
line-height: var(--wui-input-line-height);
|
|
8275
|
-
font-weight: var(--wui-input-font-weight);
|
|
8276
|
-
color: var(--wui-input-color-text);
|
|
8277
|
-
|
|
8577
|
+
${inputShellCss}
|
|
8278
8578
|
&:read-only {
|
|
8279
8579
|
outline-style: dashed;
|
|
8280
8580
|
}
|
|
@@ -8283,21 +8583,6 @@ const inputStyles = css`
|
|
|
8283
8583
|
color: var(--wui-input-placeholder);
|
|
8284
8584
|
opacity: 1; /* Firefox */
|
|
8285
8585
|
}
|
|
8286
|
-
|
|
8287
|
-
&:focus {
|
|
8288
|
-
outline-width: 2px;
|
|
8289
|
-
outline-color: var(--wui-input-color-border-focus);
|
|
8290
|
-
outline-offset: -2px;
|
|
8291
|
-
}
|
|
8292
|
-
|
|
8293
|
-
&[aria-invalid='true'] {
|
|
8294
|
-
outline-color: var(--wui-input-color-border-error);
|
|
8295
|
-
}
|
|
8296
|
-
|
|
8297
|
-
&:disabled {
|
|
8298
|
-
outline-color: var(--wui-color-border-disabled);
|
|
8299
|
-
background-color: var(--wui-color-bg-surface-disabled);
|
|
8300
|
-
}
|
|
8301
8586
|
}
|
|
8302
8587
|
`;
|
|
8303
8588
|
const calculateTextareaHeight = (rows = 1) => `calc((var(--wui-input-line-height) * ${rows}) + (var(--wui-input-vertical-padding) * 2));`;
|
|
@@ -8789,7 +9074,7 @@ const drawGradientBackground = (ctx, width, height, hue) => {
|
|
|
8789
9074
|
* - Y-axis: value (1-0, top to bottom)
|
|
8790
9075
|
* - Optional contrast threshold curve overlay
|
|
8791
9076
|
*/
|
|
8792
|
-
const HSVSaturationValueCanvas = ({ hue, shouldShowContrastCurve
|
|
9077
|
+
const HSVSaturationValueCanvas = ({ hue, shouldShowContrastCurve, minimumContrastRatio, colorForComparison, opacityForContrastCalculation }) => {
|
|
8793
9078
|
const canvasRef = useRef(null);
|
|
8794
9079
|
useEffect(() => {
|
|
8795
9080
|
const canvas = canvasRef.current;
|
|
@@ -9287,7 +9572,7 @@ const defaultDisplayValues = (values, onRemove) => {
|
|
|
9287
9572
|
onClickRemoveLabel: `Remove ${selectedValue}`
|
|
9288
9573
|
}, selectedValue));
|
|
9289
9574
|
};
|
|
9290
|
-
const Combobox = ({ placeholder, value
|
|
9575
|
+
const Combobox = ({ placeholder, value, onChange, searchValue, onSearchValueChange, displayValues = defaultDisplayValues, children, flipPopover = true, fullWidth = true }) => {
|
|
9291
9576
|
const [isOpen, setIsOpen] = useState(false);
|
|
9292
9577
|
const [isPending, startTransition] = useTransition();
|
|
9293
9578
|
const [wrapperWidth, setWrapperWidth] = useState("auto");
|
|
@@ -9465,10 +9750,10 @@ const MenuContent = styled(DropdownMenuContent)`
|
|
|
9465
9750
|
*/
|
|
9466
9751
|
const Menu = forwardRef(({ align = "start", children, disabled = false, compact = false, trigger, label, isOpen, side = "bottom", triggerProps = {}, onOpenChange, ...props }, ref) => {
|
|
9467
9752
|
const contextValue = useMemo(() => ({ compact }), [compact]);
|
|
9468
|
-
let controlProps =
|
|
9753
|
+
let controlProps = isNotNil(onOpenChange) && isNotNil(isOpen) ? {
|
|
9469
9754
|
open: isOpen,
|
|
9470
9755
|
onOpenChange
|
|
9471
|
-
} : {}
|
|
9756
|
+
} : {};
|
|
9472
9757
|
if (disabled) controlProps = {
|
|
9473
9758
|
open: false,
|
|
9474
9759
|
onOpenChange: () => null
|
|
@@ -10273,37 +10558,879 @@ const DataListItemValue = (props) => {
|
|
|
10273
10558
|
};
|
|
10274
10559
|
DataListItemValue.displayName = "DataListItemValue_UI";
|
|
10275
10560
|
//#endregion
|
|
10276
|
-
//#region src/components/
|
|
10277
|
-
const horizontalBorderCss = css`
|
|
10278
|
-
border-top-color: var(--wui-color-border);
|
|
10279
|
-
border-top-style: solid;
|
|
10280
|
-
border-top-width: 1px;
|
|
10281
|
-
clear: both; /* for horizontal dividers, ensure it clears any floats */
|
|
10282
|
-
height: 0;
|
|
10283
|
-
margin-left: var(--wui-divider-inset);
|
|
10284
|
-
margin-right: var(--wui-divider-inset);
|
|
10285
|
-
`;
|
|
10286
|
-
const verticalBorderCss = css`
|
|
10287
|
-
background-color: var(--wui-color-border);
|
|
10288
|
-
max-width: 1px;
|
|
10289
|
-
min-height: 100%;
|
|
10290
|
-
width: 1px;
|
|
10291
|
-
margin-top: var(--wui-divider-inset);
|
|
10292
|
-
margin-bottom: var(--wui-divider-inset);
|
|
10293
|
-
`;
|
|
10294
|
-
const DividerComponent = styled.div`
|
|
10295
|
-
${({ $orientation }) => {
|
|
10296
|
-
switch ($orientation) {
|
|
10297
|
-
case "vertical": return verticalBorderCss;
|
|
10298
|
-
default: return horizontalBorderCss;
|
|
10299
|
-
}
|
|
10300
|
-
}}
|
|
10301
|
-
--wui-divider-inset: ${({ $inset }) => `var(--wui-${$inset})`};
|
|
10302
|
-
|
|
10303
|
-
align-self: stretch;
|
|
10304
|
-
`;
|
|
10561
|
+
//#region src/components/Popover/PopoverRoot.tsx
|
|
10305
10562
|
/**
|
|
10306
|
-
*
|
|
10563
|
+
* The root of a composable popover. Wrap `PopoverTrigger` (or `PopoverAnchor`)
|
|
10564
|
+
* and `PopoverContent` inside it.
|
|
10565
|
+
*
|
|
10566
|
+
* For the common "button opens a panel" case, prefer the bundled `Popover`.
|
|
10567
|
+
*/
|
|
10568
|
+
const PopoverRoot = ({ isOpen, ...props }) => /* @__PURE__ */ jsx(Root$4, {
|
|
10569
|
+
...props,
|
|
10570
|
+
...isOpen !== void 0 ? { open: isOpen } : {}
|
|
10571
|
+
});
|
|
10572
|
+
PopoverRoot.displayName = "PopoverRoot_UI";
|
|
10573
|
+
//#endregion
|
|
10574
|
+
//#region src/components/Popover/PopoverTrigger.tsx
|
|
10575
|
+
/**
|
|
10576
|
+
* The button that toggles the popover open and closed. By default it renders a
|
|
10577
|
+
* `<button>` wrapping its children; pass `asChild` to merge the trigger
|
|
10578
|
+
* behavior onto a single child element (e.g. a `Button` or `IconButton`).
|
|
10579
|
+
*/
|
|
10580
|
+
const PopoverTrigger = forwardRef((props, forwardedRef) => /* @__PURE__ */ jsx(Trigger$2, {
|
|
10581
|
+
ref: forwardedRef,
|
|
10582
|
+
...props
|
|
10583
|
+
}));
|
|
10584
|
+
PopoverTrigger.displayName = "PopoverTrigger_UI";
|
|
10585
|
+
//#endregion
|
|
10586
|
+
//#region src/components/Popover/PopoverPortal.tsx
|
|
10587
|
+
/**
|
|
10588
|
+
* Portals the popover content out of the DOM hierarchy of its trigger so it can
|
|
10589
|
+
* escape clipping ancestors (`overflow: hidden`, transformed containers, etc.).
|
|
10590
|
+
*/
|
|
10591
|
+
const PopoverPortal = (props) => /* @__PURE__ */ jsx(Portal$1, { ...props });
|
|
10592
|
+
PopoverPortal.displayName = "PopoverPortal_UI";
|
|
10593
|
+
//#endregion
|
|
10594
|
+
//#region src/components/Popover/PopoverContent.tsx
|
|
10595
|
+
const StyledContent$2 = styled(Content$2)`
|
|
10596
|
+
z-index: var(--wui-zindex-popover);
|
|
10597
|
+
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
10598
|
+
${({ $unstyled }) => !$unstyled && css`
|
|
10599
|
+
border-radius: var(--wui-border-radius-02);
|
|
10600
|
+
padding: var(--wui-space-04);
|
|
10601
|
+
max-width: var(--wui-popover-max-width);
|
|
10602
|
+
max-height: var(--wui-popover-max-height);
|
|
10603
|
+
background-color: var(--wui-color-bg-surface);
|
|
10604
|
+
box-shadow: var(--wui-elevation-01);
|
|
10605
|
+
border: 1px solid var(--wui-color-border);
|
|
10606
|
+
overflow: auto;
|
|
10607
|
+
`}
|
|
10608
|
+
|
|
10609
|
+
[data-wui-popover-close] {
|
|
10610
|
+
position: absolute;
|
|
10611
|
+
top: var(--wui-space-02);
|
|
10612
|
+
right: var(--wui-space-02);
|
|
10613
|
+
}
|
|
10614
|
+
`;
|
|
10615
|
+
const DEFAULT_SIDE_OFFSET = 8;
|
|
10616
|
+
const DEFAULT_MAX_WIDTH = "320px";
|
|
10617
|
+
const DEFAULT_MAX_HEIGHT = "auto";
|
|
10618
|
+
/**
|
|
10619
|
+
* The styled popover surface. Place inside a `PopoverRoot` (typically wrapped
|
|
10620
|
+
* in a `PopoverPortal`). Forwards all Radix Content props, including
|
|
10621
|
+
* dismissal/focus event handlers such as `onPointerDownOutside`,
|
|
10622
|
+
* `onOpenAutoFocus`, and `onCloseAutoFocus`.
|
|
10623
|
+
*/
|
|
10624
|
+
const PopoverContent = forwardRef(({ colorScheme = "inherit", unstyled = false, maxWidth = DEFAULT_MAX_WIDTH, maxHeight = DEFAULT_MAX_HEIGHT, sideOffset = DEFAULT_SIDE_OFFSET, style, ...props }, forwardedRef) => {
|
|
10625
|
+
return /* @__PURE__ */ jsx(StyledContent$2, {
|
|
10626
|
+
ref: forwardedRef,
|
|
10627
|
+
$colorScheme: colorScheme,
|
|
10628
|
+
$unstyled: unstyled,
|
|
10629
|
+
sideOffset,
|
|
10630
|
+
style: {
|
|
10631
|
+
"--wui-popover-max-width": maxWidth,
|
|
10632
|
+
"--wui-popover-max-height": maxHeight,
|
|
10633
|
+
...style
|
|
10634
|
+
},
|
|
10635
|
+
...props
|
|
10636
|
+
});
|
|
10637
|
+
});
|
|
10638
|
+
PopoverContent.displayName = "PopoverContent_UI";
|
|
10639
|
+
//#endregion
|
|
10640
|
+
//#region src/components/Popover/PopoverClose.tsx
|
|
10641
|
+
/**
|
|
10642
|
+
* An element that closes the popover when activated. Defaults to a `<button>`;
|
|
10643
|
+
* pass `asChild` to merge the close behavior onto a single child element. For
|
|
10644
|
+
* a pre-styled icon close button, use `PopoverCloseButton`.
|
|
10645
|
+
*/
|
|
10646
|
+
const PopoverClose = forwardRef((props, forwardedRef) => /* @__PURE__ */ jsx(Close, {
|
|
10647
|
+
ref: forwardedRef,
|
|
10648
|
+
...props
|
|
10649
|
+
}));
|
|
10650
|
+
PopoverClose.displayName = "PopoverClose_UI";
|
|
10651
|
+
//#endregion
|
|
10652
|
+
//#region src/components/Popover/PopoverCloseButton.tsx
|
|
10653
|
+
/**
|
|
10654
|
+
* A pre-styled close button intended to be placed inside a `PopoverContent`.
|
|
10655
|
+
* For a custom close control, use `PopoverClose` directly.
|
|
10656
|
+
*/
|
|
10657
|
+
const PopoverCloseButton = ({ label = "Close" } = {}) => /* @__PURE__ */ jsx(PopoverClose, {
|
|
10658
|
+
asChild: true,
|
|
10659
|
+
children: /* @__PURE__ */ jsx(IconButton, {
|
|
10660
|
+
"data-wui-popover-close": true,
|
|
10661
|
+
label,
|
|
10662
|
+
variant: "ghost",
|
|
10663
|
+
children: /* @__PURE__ */ jsx(Icon, { type: "close" })
|
|
10664
|
+
})
|
|
10665
|
+
});
|
|
10666
|
+
PopoverCloseButton.displayName = "PopoverCloseButton_UI";
|
|
10667
|
+
//#endregion
|
|
10668
|
+
//#region src/components/Popover/PopoverArrow.tsx
|
|
10669
|
+
const StyledPath = styled.path`
|
|
10670
|
+
fill: var(--wui-color-border-secondary);
|
|
10671
|
+
`;
|
|
10672
|
+
const circleAnimation = keyframes`
|
|
10673
|
+
0% {
|
|
10674
|
+
opacity: var(--wui-popover-arrow-circle-starting-opacity);
|
|
10675
|
+
}
|
|
10676
|
+
100% {
|
|
10677
|
+
opacity: 0;
|
|
10678
|
+
}
|
|
10679
|
+
`;
|
|
10680
|
+
const StyledCircle = styled.circle`
|
|
10681
|
+
stroke: var(--wui-color-border-active);
|
|
10682
|
+
animation-duration: 2s;
|
|
10683
|
+
animation-iteration-count: infinite;
|
|
10684
|
+
animation-direction: alternate;
|
|
10685
|
+
animation-timing-function: ease-in-out;
|
|
10686
|
+
|
|
10687
|
+
&[data-wui-popover-arrow-inner-circle] {
|
|
10688
|
+
--wui-popover-arrow-circle-starting-opacity: 0.36;
|
|
10689
|
+
|
|
10690
|
+
opacity: var(--wui-popover-arrow-circle-starting-opacity);
|
|
10691
|
+
}
|
|
10692
|
+
|
|
10693
|
+
&[data-wui-popover-arrow-outer-circle] {
|
|
10694
|
+
--wui-popover-arrow-circle-starting-opacity: 0.2;
|
|
10695
|
+
|
|
10696
|
+
animation-direction: alternate-reverse;
|
|
10697
|
+
opacity: 0.11;
|
|
10698
|
+
}
|
|
10699
|
+
|
|
10700
|
+
@media (prefers-reduced-motion: no-preference) {
|
|
10701
|
+
${({ $isAnimated }) => $isAnimated && css`
|
|
10702
|
+
animation-name: ${circleAnimation};
|
|
10703
|
+
`}
|
|
10704
|
+
}
|
|
10705
|
+
`;
|
|
10706
|
+
const PopoverArrow = ({ isAnimated }) => {
|
|
10707
|
+
return /* @__PURE__ */ jsx(PopoverArrow$1, {
|
|
10708
|
+
asChild: true,
|
|
10709
|
+
children: /* @__PURE__ */ jsxs("svg", {
|
|
10710
|
+
fill: "none",
|
|
10711
|
+
height: "56",
|
|
10712
|
+
viewBox: "0 0 48 56",
|
|
10713
|
+
width: "48",
|
|
10714
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
10715
|
+
children: [
|
|
10716
|
+
/* @__PURE__ */ jsx(StyledPath, { d: "M24 26.6667C21.0545 26.6667 18.6667 29.0545 18.6667 32C18.6667 34.9455 21.0545 37.3333 24 37.3333C26.9455 37.3333 29.3333 34.9455 29.3333 32C29.3333 29.0545 26.9455 26.6667 24 26.6667ZM23 0V32H25V0H23Z" }),
|
|
10717
|
+
/* @__PURE__ */ jsx(StyledCircle, {
|
|
10718
|
+
$isAnimated: isAnimated,
|
|
10719
|
+
cx: "24",
|
|
10720
|
+
cy: "32",
|
|
10721
|
+
"data-wui-popover-arrow-inner-circle": true,
|
|
10722
|
+
r: "10",
|
|
10723
|
+
strokeWidth: "4"
|
|
10724
|
+
}),
|
|
10725
|
+
/* @__PURE__ */ jsx(StyledCircle, {
|
|
10726
|
+
$isAnimated: isAnimated,
|
|
10727
|
+
cx: "24",
|
|
10728
|
+
cy: "32",
|
|
10729
|
+
"data-wui-popover-arrow-outer-circle": true,
|
|
10730
|
+
r: "20",
|
|
10731
|
+
strokeWidth: "8"
|
|
10732
|
+
})
|
|
10733
|
+
]
|
|
10734
|
+
})
|
|
10735
|
+
});
|
|
10736
|
+
};
|
|
10737
|
+
PopoverArrow.displayName = "PopoverArrow_UI";
|
|
10738
|
+
//#endregion
|
|
10739
|
+
//#region src/components/Popover/Popover.tsx
|
|
10740
|
+
/**
|
|
10741
|
+
* Displays rich content in a portal, triggered by a button.
|
|
10742
|
+
*
|
|
10743
|
+
* For more control — custom anchor, access to event handlers like
|
|
10744
|
+
* `onPointerDownOutside`, no injected close button, etc. — compose the
|
|
10745
|
+
* primitives directly: `PopoverRoot`, `PopoverTrigger`, `PopoverAnchor`,
|
|
10746
|
+
* `PopoverPortal`, `PopoverContent`, `PopoverClose`.
|
|
10747
|
+
*/
|
|
10748
|
+
const Popover = ({ children, trigger, isOpen, hideCloseButton = false, maxWidth, maxHeight, onOpenChange, unstyled = false, withArrow = false, isAnimated = false, colorScheme = "inherit", style, ...props }) => {
|
|
10749
|
+
const sideOffset = withArrow ? -24 : 8;
|
|
10750
|
+
return /* @__PURE__ */ jsxs(PopoverRoot, {
|
|
10751
|
+
...isOpen !== void 0 ? {
|
|
10752
|
+
isOpen,
|
|
10753
|
+
onOpenChange
|
|
10754
|
+
} : {},
|
|
10755
|
+
children: [/* @__PURE__ */ jsx(PopoverTrigger, {
|
|
10756
|
+
asChild: true,
|
|
10757
|
+
children: trigger
|
|
10758
|
+
}), /* @__PURE__ */ jsx(PopoverPortal, { children: /* @__PURE__ */ jsxs(PopoverContent, {
|
|
10759
|
+
colorScheme,
|
|
10760
|
+
...maxHeight !== void 0 ? { maxHeight } : {},
|
|
10761
|
+
...maxWidth !== void 0 ? { maxWidth } : {},
|
|
10762
|
+
sideOffset,
|
|
10763
|
+
unstyled,
|
|
10764
|
+
...props,
|
|
10765
|
+
style,
|
|
10766
|
+
children: [
|
|
10767
|
+
!hideCloseButton && /* @__PURE__ */ jsx(PopoverCloseButton, {}),
|
|
10768
|
+
withArrow ? /* @__PURE__ */ jsx(PopoverArrow, { isAnimated }) : null,
|
|
10769
|
+
/* @__PURE__ */ jsx("div", { children })
|
|
10770
|
+
]
|
|
10771
|
+
}) })]
|
|
10772
|
+
});
|
|
10773
|
+
};
|
|
10774
|
+
Popover.displayName = "Popover_UI";
|
|
10775
|
+
//#endregion
|
|
10776
|
+
//#region src/components/Popover/PopoverAnchor.tsx
|
|
10777
|
+
/**
|
|
10778
|
+
* Positions the popover relative to an element other than the trigger. Useful
|
|
10779
|
+
* when the element the user interacts with (e.g. a text input) is separate
|
|
10780
|
+
* from what the popover attaches to.
|
|
10781
|
+
*/
|
|
10782
|
+
const PopoverAnchor = forwardRef((props, forwardedRef) => /* @__PURE__ */ jsx(Anchor, {
|
|
10783
|
+
ref: forwardedRef,
|
|
10784
|
+
...props
|
|
10785
|
+
}));
|
|
10786
|
+
PopoverAnchor.displayName = "PopoverAnchor_UI";
|
|
10787
|
+
//#endregion
|
|
10788
|
+
//#region src/components/DatePicker/DatePickerContext.tsx
|
|
10789
|
+
const DatePickerContext = createContext(null);
|
|
10790
|
+
const DatePickerProvider = DatePickerContext.Provider;
|
|
10791
|
+
const useDatePickerContext = () => {
|
|
10792
|
+
const context = useContext(DatePickerContext);
|
|
10793
|
+
if (context === null) throw new Error("useDatePickerContext must be used within a DatePickerProvider");
|
|
10794
|
+
return context;
|
|
10795
|
+
};
|
|
10796
|
+
//#endregion
|
|
10797
|
+
//#region src/components/DatePicker/datePickerUtils.ts
|
|
10798
|
+
/**
|
|
10799
|
+
* Formats a Date into a human-readable string (e.g. "Jun 3, 2021").
|
|
10800
|
+
* Returns an empty string for null/undefined.
|
|
10801
|
+
*/
|
|
10802
|
+
const formatDate = (date) => {
|
|
10803
|
+
if (date === null) return "";
|
|
10804
|
+
return dateOnlyString(date);
|
|
10805
|
+
};
|
|
10806
|
+
/**
|
|
10807
|
+
* Formats a Date as an ISO 8601 date-only string (`YYYY-MM-DD`) in local time.
|
|
10808
|
+
* Intended for form submission — unlike the locale-formatted display string,
|
|
10809
|
+
* this is stable across locales and trivial for backends to parse.
|
|
10810
|
+
*/
|
|
10811
|
+
const toISODate = (date) => {
|
|
10812
|
+
return `${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, "0")}-${String(date.getDate()).padStart(2, "0")}`;
|
|
10813
|
+
};
|
|
10814
|
+
const stripTime = (date) => new Date(date.getFullYear(), date.getMonth(), date.getDate());
|
|
10815
|
+
/**
|
|
10816
|
+
* Returns true if the date falls within the min/max range (inclusive).
|
|
10817
|
+
*/
|
|
10818
|
+
const isDateInRange = (date, minDate, maxDate) => {
|
|
10819
|
+
const dateOnly = stripTime(date);
|
|
10820
|
+
if (minDate !== void 0 && dateOnly < stripTime(minDate)) return false;
|
|
10821
|
+
if (maxDate !== void 0 && dateOnly > stripTime(maxDate)) return false;
|
|
10822
|
+
return true;
|
|
10823
|
+
};
|
|
10824
|
+
/**
|
|
10825
|
+
* Returns true if the date matches any of the disabled matchers.
|
|
10826
|
+
* Supports a subset of react-day-picker Matcher types:
|
|
10827
|
+
* - Date objects (exact match by day)
|
|
10828
|
+
* - { dayOfWeek: number[] }
|
|
10829
|
+
* - { before: Date } / { after: Date }
|
|
10830
|
+
* - { from: Date, to: Date }
|
|
10831
|
+
*/
|
|
10832
|
+
const isDateDisabled = (date, disabledDates) => {
|
|
10833
|
+
if (disabledDates === void 0) return false;
|
|
10834
|
+
const matchers = Array.isArray(disabledDates) ? disabledDates : [disabledDates];
|
|
10835
|
+
const dateOnly = stripTime(date);
|
|
10836
|
+
return matchers.some((matcher) => {
|
|
10837
|
+
if (matcher instanceof Date) return dateOnly.getTime() === stripTime(matcher).getTime();
|
|
10838
|
+
if (typeof matcher !== "object") return false;
|
|
10839
|
+
if ("dayOfWeek" in matcher && Array.isArray(matcher.dayOfWeek)) return matcher.dayOfWeek.includes(date.getDay());
|
|
10840
|
+
if ("before" in matcher && matcher.before instanceof Date) return dateOnly < stripTime(matcher.before);
|
|
10841
|
+
if ("after" in matcher && matcher.after instanceof Date) return dateOnly > stripTime(matcher.after);
|
|
10842
|
+
if ("from" in matcher && "to" in matcher) {
|
|
10843
|
+
const { from } = matcher;
|
|
10844
|
+
const { to } = matcher;
|
|
10845
|
+
if (from instanceof Date && to instanceof Date) return dateOnly >= stripTime(from) && dateOnly <= stripTime(to);
|
|
10846
|
+
}
|
|
10847
|
+
return false;
|
|
10848
|
+
});
|
|
10849
|
+
};
|
|
10850
|
+
/**
|
|
10851
|
+
* Builds a combined disabled matcher array for react-day-picker from
|
|
10852
|
+
* minDate, maxDate, and user-provided disabledDates.
|
|
10853
|
+
*/
|
|
10854
|
+
const buildDisabledMatcher = (minDate, maxDate, disabledDates) => {
|
|
10855
|
+
const matchers = [];
|
|
10856
|
+
if (minDate !== void 0) matchers.push({ before: minDate });
|
|
10857
|
+
if (maxDate !== void 0) matchers.push({ after: maxDate });
|
|
10858
|
+
if (disabledDates !== void 0) if (Array.isArray(disabledDates)) matchers.push(...disabledDates);
|
|
10859
|
+
else matchers.push(disabledDates);
|
|
10860
|
+
return matchers;
|
|
10861
|
+
};
|
|
10862
|
+
//#endregion
|
|
10863
|
+
//#region src/components/DatePicker/DatePickerInput.tsx
|
|
10864
|
+
const StyledMobileTrigger = styled.button`
|
|
10865
|
+
${inputCss}
|
|
10866
|
+
${inputShellCss}
|
|
10867
|
+
|
|
10868
|
+
display: inline-flex;
|
|
10869
|
+
align-items: center;
|
|
10870
|
+
justify-content: space-between;
|
|
10871
|
+
gap: var(--wui-space-02);
|
|
10872
|
+
width: 100%;
|
|
10873
|
+
font-family: inherit;
|
|
10874
|
+
text-align: left;
|
|
10875
|
+
cursor: pointer;
|
|
10876
|
+
|
|
10877
|
+
&:disabled {
|
|
10878
|
+
cursor: not-allowed;
|
|
10879
|
+
}
|
|
10880
|
+
|
|
10881
|
+
&[data-empty='true'] {
|
|
10882
|
+
color: var(--wui-input-placeholder);
|
|
10883
|
+
}
|
|
10884
|
+
`;
|
|
10885
|
+
const DatePickerInput = ({ placeholder = "Select a date...", fullWidth, name, id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedBy }) => {
|
|
10886
|
+
const { selectedDate, isOpen, inputText, disabled, isMobile, inputRef, popoverContentRef, setIsOpen, handleInputChange, handleCommit } = useDatePickerContext();
|
|
10887
|
+
const submittedValue = selectedDate !== null ? toISODate(selectedDate) : "";
|
|
10888
|
+
const handleClick = () => {
|
|
10889
|
+
if (!isOpen) setIsOpen(true);
|
|
10890
|
+
};
|
|
10891
|
+
if (isMobile) {
|
|
10892
|
+
const handleMobileKeyDown = (event) => {
|
|
10893
|
+
if (event.key === "Escape" && isOpen) {
|
|
10894
|
+
event.preventDefault();
|
|
10895
|
+
setIsOpen(false);
|
|
10896
|
+
}
|
|
10897
|
+
};
|
|
10898
|
+
const isEmpty = inputText.length === 0;
|
|
10899
|
+
return /* @__PURE__ */ jsxs(PopoverAnchor, { children: [/* @__PURE__ */ jsxs(StyledMobileTrigger, {
|
|
10900
|
+
ref: inputRef,
|
|
10901
|
+
"aria-describedby": ariaDescribedBy,
|
|
10902
|
+
"aria-expanded": isOpen,
|
|
10903
|
+
"aria-haspopup": "dialog",
|
|
10904
|
+
...ariaInvalid !== void 0 ? { "aria-invalid": ariaInvalid } : {},
|
|
10905
|
+
$fullWidth: fullWidth ?? false,
|
|
10906
|
+
"data-empty": isEmpty,
|
|
10907
|
+
disabled,
|
|
10908
|
+
id,
|
|
10909
|
+
type: "button",
|
|
10910
|
+
onClick: handleClick,
|
|
10911
|
+
onKeyDown: handleMobileKeyDown,
|
|
10912
|
+
children: [/* @__PURE__ */ jsx("span", { children: isEmpty ? placeholder : inputText }), /* @__PURE__ */ jsx(Icon, {
|
|
10913
|
+
type: "calendar",
|
|
10914
|
+
size: "md"
|
|
10915
|
+
})]
|
|
10916
|
+
}), name !== void 0 && /* @__PURE__ */ jsx("input", {
|
|
10917
|
+
name,
|
|
10918
|
+
type: "hidden",
|
|
10919
|
+
value: submittedValue
|
|
10920
|
+
})] });
|
|
10921
|
+
}
|
|
10922
|
+
const handleBlur = (event) => {
|
|
10923
|
+
const relatedTarget = event.relatedTarget;
|
|
10924
|
+
if (relatedTarget !== null && popoverContentRef.current?.contains(relatedTarget)) return;
|
|
10925
|
+
handleCommit();
|
|
10926
|
+
};
|
|
10927
|
+
const handleKeyDown = (event) => {
|
|
10928
|
+
if (event.key === "Enter") {
|
|
10929
|
+
event.preventDefault();
|
|
10930
|
+
handleCommit();
|
|
10931
|
+
}
|
|
10932
|
+
if (event.key === "Tab" && isOpen && popoverContentRef.current !== null) {
|
|
10933
|
+
event.preventDefault();
|
|
10934
|
+
popoverContentRef.current.focus();
|
|
10935
|
+
}
|
|
10936
|
+
if (event.key === "Escape" && isOpen) setIsOpen(false);
|
|
10937
|
+
};
|
|
10938
|
+
return /* @__PURE__ */ jsxs(PopoverAnchor, { children: [/* @__PURE__ */ jsx(Input, {
|
|
10939
|
+
ref: inputRef,
|
|
10940
|
+
"aria-describedby": ariaDescribedBy,
|
|
10941
|
+
"aria-expanded": isOpen,
|
|
10942
|
+
"aria-haspopup": "dialog",
|
|
10943
|
+
...ariaInvalid !== void 0 ? { "aria-invalid": ariaInvalid } : {},
|
|
10944
|
+
autoSelect: true,
|
|
10945
|
+
disabled,
|
|
10946
|
+
...fullWidth !== void 0 ? { fullWidth } : {},
|
|
10947
|
+
id,
|
|
10948
|
+
placeholder,
|
|
10949
|
+
rightIcon: /* @__PURE__ */ jsx(Icon, { type: "calendar" }),
|
|
10950
|
+
role: "combobox",
|
|
10951
|
+
value: inputText,
|
|
10952
|
+
onBlur: handleBlur,
|
|
10953
|
+
onChange: (event) => {
|
|
10954
|
+
handleInputChange(event.target.value);
|
|
10955
|
+
},
|
|
10956
|
+
onClick: handleClick,
|
|
10957
|
+
onKeyDown: handleKeyDown
|
|
10958
|
+
}), name !== void 0 && /* @__PURE__ */ jsx("input", {
|
|
10959
|
+
name,
|
|
10960
|
+
type: "hidden",
|
|
10961
|
+
value: submittedValue
|
|
10962
|
+
})] });
|
|
10963
|
+
};
|
|
10964
|
+
DatePickerInput.displayName = "DatePickerInput_UI";
|
|
10965
|
+
//#endregion
|
|
10966
|
+
//#region src/private/components/Calendar/CalendarNavigation.tsx
|
|
10967
|
+
const StyledNav = styled.div`
|
|
10968
|
+
position: absolute;
|
|
10969
|
+
inset-block-start: 0;
|
|
10970
|
+
inset-inline-end: 0;
|
|
10971
|
+
display: flex;
|
|
10972
|
+
align-items: center;
|
|
10973
|
+
`;
|
|
10974
|
+
const CalendarNavigation = ({ onPreviousClick, onNextClick, previousMonth, nextMonth }) => {
|
|
10975
|
+
return /* @__PURE__ */ jsxs(StyledNav, { children: [/* @__PURE__ */ jsx(IconButton, {
|
|
10976
|
+
disabled: !previousMonth,
|
|
10977
|
+
label: "Go to previous month",
|
|
10978
|
+
onClick: onPreviousClick,
|
|
10979
|
+
size: "md",
|
|
10980
|
+
variant: "ghost",
|
|
10981
|
+
children: /* @__PURE__ */ jsx(Icon, { type: "caret-left" })
|
|
10982
|
+
}), /* @__PURE__ */ jsx(IconButton, {
|
|
10983
|
+
disabled: !nextMonth,
|
|
10984
|
+
label: "Go to next month",
|
|
10985
|
+
onClick: onNextClick,
|
|
10986
|
+
size: "md",
|
|
10987
|
+
variant: "ghost",
|
|
10988
|
+
children: /* @__PURE__ */ jsx(Icon, { type: "caret-right" })
|
|
10989
|
+
})] });
|
|
10990
|
+
};
|
|
10991
|
+
CalendarNavigation.displayName = "CalendarNavigation";
|
|
10992
|
+
//#endregion
|
|
10993
|
+
//#region src/private/components/Calendar/calendarStyles.ts
|
|
10994
|
+
const calendarCss = css`
|
|
10995
|
+
/* stylelint-disable selector-class-pattern, no-descending-specificity --
|
|
10996
|
+
react-day-picker ships class names with underscores (e.g. rdp-day_button, rdp-range_start).
|
|
10997
|
+
We can't rename library classes, so the kebab-case pattern doesn't apply here. The
|
|
10998
|
+
descending-specificity rule is disabled because state rules (.rdp-today, .rdp-selected,
|
|
10999
|
+
.rdp-range_*) intentionally layer on top of the base .rdp-day_button block. */
|
|
11000
|
+
|
|
11001
|
+
/* Root */
|
|
11002
|
+
.rdp-root {
|
|
11003
|
+
--rdp-day-size: 36px;
|
|
11004
|
+
|
|
11005
|
+
font-family: var(--wui-typography-family-default);
|
|
11006
|
+
font-size: var(--wui-typography-body-3-size);
|
|
11007
|
+
font-weight: var(--wui-typography-body-3-weight);
|
|
11008
|
+
user-select: none;
|
|
11009
|
+
position: relative;
|
|
11010
|
+
}
|
|
11011
|
+
|
|
11012
|
+
/* Months layout */
|
|
11013
|
+
.rdp-months {
|
|
11014
|
+
display: flex;
|
|
11015
|
+
gap: var(--wui-space-05);
|
|
11016
|
+
}
|
|
11017
|
+
|
|
11018
|
+
.rdp-month {
|
|
11019
|
+
display: flex;
|
|
11020
|
+
flex-direction: column;
|
|
11021
|
+
}
|
|
11022
|
+
|
|
11023
|
+
/* Caption / navigation row */
|
|
11024
|
+
.rdp-month_caption {
|
|
11025
|
+
display: flex;
|
|
11026
|
+
align-items: center;
|
|
11027
|
+
justify-content: space-between;
|
|
11028
|
+
padding-left: var(--wui-space-01);
|
|
11029
|
+
}
|
|
11030
|
+
|
|
11031
|
+
.rdp-caption_label {
|
|
11032
|
+
font-family: var(--wui-typography-heading-4-family);
|
|
11033
|
+
font-weight: var(--wui-typography-heading-4-weight);
|
|
11034
|
+
font-size: var(--wui-typography-heading-4-size);
|
|
11035
|
+
line-height: var(--wui-typography-heading-4-line-height);
|
|
11036
|
+
min-height: 32px;
|
|
11037
|
+
display: flex;
|
|
11038
|
+
align-items: center;
|
|
11039
|
+
white-space: nowrap;
|
|
11040
|
+
}
|
|
11041
|
+
|
|
11042
|
+
/* Grid */
|
|
11043
|
+
.rdp-month_grid {
|
|
11044
|
+
border-collapse: collapse;
|
|
11045
|
+
border-spacing: 0;
|
|
11046
|
+
}
|
|
11047
|
+
|
|
11048
|
+
/* Weekday headers */
|
|
11049
|
+
.rdp-weekday {
|
|
11050
|
+
color: var(--wui-color-text-secondary);
|
|
11051
|
+
font-weight: var(--wui-typography-label-3-weight);
|
|
11052
|
+
font-size: var(--wui-typography-label-3-size);
|
|
11053
|
+
line-height: var(--wui-typography-label-3-line-height);
|
|
11054
|
+
text-align: center;
|
|
11055
|
+
width: var(--rdp-day-size);
|
|
11056
|
+
height: var(--rdp-day-size);
|
|
11057
|
+
padding: 0;
|
|
11058
|
+
}
|
|
11059
|
+
|
|
11060
|
+
/* Day cells */
|
|
11061
|
+
.rdp-day {
|
|
11062
|
+
width: var(--rdp-day-size);
|
|
11063
|
+
height: var(--rdp-day-size);
|
|
11064
|
+
text-align: center;
|
|
11065
|
+
padding: 0;
|
|
11066
|
+
}
|
|
11067
|
+
|
|
11068
|
+
/* Day button — base */
|
|
11069
|
+
.rdp-day_button {
|
|
11070
|
+
--rdp-day-button-size: calc(var(--rdp-day-size) - 4px);
|
|
11071
|
+
|
|
11072
|
+
display: inline-flex;
|
|
11073
|
+
align-items: center;
|
|
11074
|
+
justify-content: center;
|
|
11075
|
+
width: var(--rdp-day-button-size);
|
|
11076
|
+
height: var(--rdp-day-button-size);
|
|
11077
|
+
border: none;
|
|
11078
|
+
border-radius: var(--wui-border-radius-rounded);
|
|
11079
|
+
background: none;
|
|
11080
|
+
cursor: pointer;
|
|
11081
|
+
font-family: var(--wui-typography-label-3-family);
|
|
11082
|
+
font-size: var(--wui-typography-label-3-size);
|
|
11083
|
+
font-weight: var(--wui-typography-label-3-weight);
|
|
11084
|
+
line-height: var(--wui-typography-label-3-line-height);
|
|
11085
|
+
color: var(--wui-color-text);
|
|
11086
|
+
padding: 0;
|
|
11087
|
+
transition: background-color var(--wui-motion-duration-01) var(--wui-motion-ease);
|
|
11088
|
+
|
|
11089
|
+
&:hover:not([disabled]) {
|
|
11090
|
+
background-color: var(--wui-color-bg-surface-hover);
|
|
11091
|
+
}
|
|
11092
|
+
|
|
11093
|
+
&:focus-visible {
|
|
11094
|
+
outline: 2px solid var(--wui-color-focus-ring);
|
|
11095
|
+
outline-offset: 1px;
|
|
11096
|
+
}
|
|
11097
|
+
}
|
|
11098
|
+
|
|
11099
|
+
/* Day button — today */
|
|
11100
|
+
.rdp-today .rdp-day_button {
|
|
11101
|
+
color: var(--wui-color-text-button-blue);
|
|
11102
|
+
font-weight: var(--wui-typography-weight-label-bold);
|
|
11103
|
+
}
|
|
11104
|
+
|
|
11105
|
+
/* Day button — outside month */
|
|
11106
|
+
.rdp-outside .rdp-day_button {
|
|
11107
|
+
color: var(--wui-color-text-secondary);
|
|
11108
|
+
}
|
|
11109
|
+
|
|
11110
|
+
/* Day button — selected */
|
|
11111
|
+
.rdp-selected .rdp-day_button {
|
|
11112
|
+
background-color: var(--wui-color-bg-fill);
|
|
11113
|
+
color: var(--wui-color-text-on-fill);
|
|
11114
|
+
|
|
11115
|
+
&:hover:not([disabled]) {
|
|
11116
|
+
background-color: var(--wui-color-bg-fill-hover);
|
|
11117
|
+
}
|
|
11118
|
+
}
|
|
11119
|
+
|
|
11120
|
+
/* Day button — disabled */
|
|
11121
|
+
.rdp-disabled .rdp-day_button {
|
|
11122
|
+
color: var(--wui-color-text-disabled);
|
|
11123
|
+
font-weight: var(--wui-typography-weight-body);
|
|
11124
|
+
cursor: not-allowed;
|
|
11125
|
+
}
|
|
11126
|
+
|
|
11127
|
+
/* Day button — disabled + selected (forced state: match disabled button) */
|
|
11128
|
+
.rdp-selected.rdp-disabled .rdp-day_button {
|
|
11129
|
+
background-color: var(--wui-color-bg-surface-disabled);
|
|
11130
|
+
color: var(--wui-color-text-disabled);
|
|
11131
|
+
}
|
|
11132
|
+
|
|
11133
|
+
/* Range — cell backgrounds (the connecting band on the <td>) */
|
|
11134
|
+
.rdp-range_start {
|
|
11135
|
+
border-top-left-radius: var(--wui-border-radius-rounded);
|
|
11136
|
+
border-bottom-left-radius: var(--wui-border-radius-rounded);
|
|
11137
|
+
background-color: var(--wui-color-bg-surface-selected);
|
|
11138
|
+
}
|
|
11139
|
+
|
|
11140
|
+
.rdp-range_end {
|
|
11141
|
+
border-top-right-radius: var(--wui-border-radius-rounded);
|
|
11142
|
+
border-bottom-right-radius: var(--wui-border-radius-rounded);
|
|
11143
|
+
background-color: var(--wui-color-bg-surface-selected);
|
|
11144
|
+
}
|
|
11145
|
+
|
|
11146
|
+
.rdp-range_middle {
|
|
11147
|
+
background-color: var(--wui-color-bg-surface-selected);
|
|
11148
|
+
}
|
|
11149
|
+
|
|
11150
|
+
.rdp-range_start.rdp-range_end {
|
|
11151
|
+
background-color: transparent;
|
|
11152
|
+
}
|
|
11153
|
+
|
|
11154
|
+
/* Range — button overrides */
|
|
11155
|
+
.rdp-range_start .rdp-day_button,
|
|
11156
|
+
.rdp-range_end .rdp-day_button {
|
|
11157
|
+
background-color: var(--wui-color-bg-fill);
|
|
11158
|
+
color: var(--wui-color-text-on-fill);
|
|
11159
|
+
}
|
|
11160
|
+
|
|
11161
|
+
.rdp-range_middle .rdp-day_button {
|
|
11162
|
+
color: var(--wui-color-text-selected);
|
|
11163
|
+
background: none;
|
|
11164
|
+
|
|
11165
|
+
&:hover:not([disabled]) {
|
|
11166
|
+
background-color: var(--wui-color-bg-surface-selected-hover);
|
|
11167
|
+
}
|
|
11168
|
+
}
|
|
11169
|
+
|
|
11170
|
+
/* Hidden */
|
|
11171
|
+
.rdp-hidden {
|
|
11172
|
+
visibility: hidden;
|
|
11173
|
+
}
|
|
11174
|
+
`;
|
|
11175
|
+
//#endregion
|
|
11176
|
+
//#region src/private/components/Calendar/Calendar.tsx
|
|
11177
|
+
const StyledCalendarWrapper = styled.div`
|
|
11178
|
+
${calendarCss}
|
|
11179
|
+
`;
|
|
11180
|
+
/**
|
|
11181
|
+
* Removes keys with `undefined` values so that exactOptionalPropertyTypes
|
|
11182
|
+
* does not complain when we spread into DayPicker.
|
|
11183
|
+
*/
|
|
11184
|
+
const stripUndefined = (obj) => Object.fromEntries(Object.entries(obj).filter(([, value]) => value !== void 0));
|
|
11185
|
+
/**
|
|
11186
|
+
* A calendar grid for selecting dates or date ranges. Built on
|
|
11187
|
+
* react-day-picker and styled with WUI design tokens.
|
|
11188
|
+
*/
|
|
11189
|
+
const Calendar = (props) => {
|
|
11190
|
+
const { mode, selected, onSelect, month, defaultMonth, onMonthChange, startMonth, endMonth, disabled, numberOfMonths = 1, showOutsideDays, weekStartsOn, today, ...rest } = props;
|
|
11191
|
+
const rangeMin = mode === "range" ? props.min : void 0;
|
|
11192
|
+
const rangeMax = mode === "range" ? props.max : void 0;
|
|
11193
|
+
const dayPickerProps = stripUndefined({
|
|
11194
|
+
...mode === "range" ? {
|
|
11195
|
+
mode: "range",
|
|
11196
|
+
selected,
|
|
11197
|
+
onSelect,
|
|
11198
|
+
min: rangeMin,
|
|
11199
|
+
max: rangeMax
|
|
11200
|
+
} : {
|
|
11201
|
+
mode: "single",
|
|
11202
|
+
selected,
|
|
11203
|
+
onSelect
|
|
11204
|
+
},
|
|
11205
|
+
components: { Nav: CalendarNavigation },
|
|
11206
|
+
defaultMonth,
|
|
11207
|
+
disabled,
|
|
11208
|
+
endMonth,
|
|
11209
|
+
month,
|
|
11210
|
+
numberOfMonths,
|
|
11211
|
+
onMonthChange,
|
|
11212
|
+
showOutsideDays,
|
|
11213
|
+
startMonth,
|
|
11214
|
+
today,
|
|
11215
|
+
weekStartsOn
|
|
11216
|
+
});
|
|
11217
|
+
return /* @__PURE__ */ jsx(StyledCalendarWrapper, {
|
|
11218
|
+
...rest,
|
|
11219
|
+
children: /* @__PURE__ */ jsx(DayPicker, { ...dayPickerProps })
|
|
11220
|
+
});
|
|
11221
|
+
};
|
|
11222
|
+
Calendar.displayName = "Calendar";
|
|
11223
|
+
//#endregion
|
|
11224
|
+
//#region src/components/DatePicker/DatePickerPopover.tsx
|
|
11225
|
+
const DatePickerPopover = () => {
|
|
11226
|
+
const { selectedDate, previewDate, displayedMonth, align, side, minDate, maxDate, disabledDates, inputRef, popoverContentRef, handleDaySelect, setDisplayedMonth, setIsOpen } = useDatePickerContext();
|
|
11227
|
+
const disabledMatcher = buildDisabledMatcher(minDate, maxDate, disabledDates);
|
|
11228
|
+
const handleOpenAutoFocus = (event) => {
|
|
11229
|
+
event.preventDefault();
|
|
11230
|
+
};
|
|
11231
|
+
const handleCloseAutoFocus = (event) => {
|
|
11232
|
+
event.preventDefault();
|
|
11233
|
+
};
|
|
11234
|
+
const handlePointerDownOutside = (event) => {
|
|
11235
|
+
const { target } = event.detail.originalEvent;
|
|
11236
|
+
if (target instanceof Node && inputRef.current?.contains(target)) event.preventDefault();
|
|
11237
|
+
};
|
|
11238
|
+
const handleKeyDown = (event) => {
|
|
11239
|
+
if (event.key === "Escape") {
|
|
11240
|
+
setIsOpen(false);
|
|
11241
|
+
inputRef.current?.focus();
|
|
11242
|
+
}
|
|
11243
|
+
};
|
|
11244
|
+
return /* @__PURE__ */ jsx(PopoverPortal, { children: /* @__PURE__ */ jsx(PopoverContent, {
|
|
11245
|
+
ref: popoverContentRef,
|
|
11246
|
+
align,
|
|
11247
|
+
maxWidth: "none",
|
|
11248
|
+
side,
|
|
11249
|
+
onCloseAutoFocus: handleCloseAutoFocus,
|
|
11250
|
+
onKeyDown: handleKeyDown,
|
|
11251
|
+
onOpenAutoFocus: handleOpenAutoFocus,
|
|
11252
|
+
onPointerDownOutside: handlePointerDownOutside,
|
|
11253
|
+
children: /* @__PURE__ */ jsx(Calendar, {
|
|
11254
|
+
...disabledMatcher.length > 0 ? { disabled: disabledMatcher } : {},
|
|
11255
|
+
...maxDate !== void 0 ? { endMonth: maxDate } : {},
|
|
11256
|
+
mode: "single",
|
|
11257
|
+
month: displayedMonth,
|
|
11258
|
+
selected: previewDate ?? selectedDate ?? void 0,
|
|
11259
|
+
...minDate !== void 0 ? { startMonth: minDate } : {},
|
|
11260
|
+
onMonthChange: setDisplayedMonth,
|
|
11261
|
+
onSelect: handleDaySelect
|
|
11262
|
+
})
|
|
11263
|
+
}) });
|
|
11264
|
+
};
|
|
11265
|
+
DatePickerPopover.displayName = "DatePickerPopover_UI";
|
|
11266
|
+
//#endregion
|
|
11267
|
+
//#region src/components/DatePicker/DatePicker.tsx
|
|
11268
|
+
/**
|
|
11269
|
+
* A date picker that combines a text input with natural language parsing
|
|
11270
|
+
* and a calendar popover for visual date selection.
|
|
11271
|
+
*/
|
|
11272
|
+
const DatePicker = forwardRef(({ value, onChange, defaultValue, minDate, maxDate, disabledDates, disabled = false, placeholder, fullWidth, align = "start", side = "bottom", name, id, "aria-invalid": ariaInvalid, "aria-describedby": ariaDescribedBy, ...rest }, ref) => {
|
|
11273
|
+
const isControlled = value !== void 0;
|
|
11274
|
+
const [internalDate, setInternalDate] = useState(defaultValue ?? null);
|
|
11275
|
+
const selectedDate = isControlled ? value : internalDate;
|
|
11276
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
11277
|
+
const [inputText, setInputText] = useState(() => formatDate(selectedDate));
|
|
11278
|
+
const [previewDate, setPreviewDate] = useState(null);
|
|
11279
|
+
const [displayedMonth, setDisplayedMonth] = useState(() => selectedDate ?? /* @__PURE__ */ new Date());
|
|
11280
|
+
const inputRef = useRef(null);
|
|
11281
|
+
const popoverContentRef = useRef(null);
|
|
11282
|
+
const skipNextCommitRef = useRef(false);
|
|
11283
|
+
const { isSmAndDown } = useMq();
|
|
11284
|
+
const commitDate = useCallback((date) => {
|
|
11285
|
+
if (isControlled) onChange(date);
|
|
11286
|
+
else setInternalDate(date);
|
|
11287
|
+
setInputText(formatDate(date));
|
|
11288
|
+
setPreviewDate(null);
|
|
11289
|
+
}, [isControlled, onChange]);
|
|
11290
|
+
const handleInputChange = useCallback((text) => {
|
|
11291
|
+
setInputText(text);
|
|
11292
|
+
const parsed = parseDateString(text);
|
|
11293
|
+
if (parsed !== null) {
|
|
11294
|
+
const inRange = isDateInRange(parsed, minDate, maxDate);
|
|
11295
|
+
const isDisabled = isDateDisabled(parsed, disabledDates);
|
|
11296
|
+
if (inRange && !isDisabled) {
|
|
11297
|
+
setPreviewDate(parsed);
|
|
11298
|
+
setDisplayedMonth(parsed);
|
|
11299
|
+
} else setPreviewDate(null);
|
|
11300
|
+
} else setPreviewDate(null);
|
|
11301
|
+
}, [
|
|
11302
|
+
minDate,
|
|
11303
|
+
maxDate,
|
|
11304
|
+
disabledDates
|
|
11305
|
+
]);
|
|
11306
|
+
const handleCommit = useCallback(() => {
|
|
11307
|
+
if (previewDate !== null) {
|
|
11308
|
+
commitDate(previewDate);
|
|
11309
|
+
setIsOpen(false);
|
|
11310
|
+
return;
|
|
11311
|
+
}
|
|
11312
|
+
setInputText(formatDate(selectedDate));
|
|
11313
|
+
setPreviewDate(null);
|
|
11314
|
+
}, [
|
|
11315
|
+
previewDate,
|
|
11316
|
+
selectedDate,
|
|
11317
|
+
commitDate
|
|
11318
|
+
]);
|
|
11319
|
+
const handleDaySelect = useCallback((date) => {
|
|
11320
|
+
if (date !== void 0) {
|
|
11321
|
+
skipNextCommitRef.current = true;
|
|
11322
|
+
commitDate(date);
|
|
11323
|
+
setDisplayedMonth(date);
|
|
11324
|
+
setIsOpen(false);
|
|
11325
|
+
inputRef.current?.focus();
|
|
11326
|
+
requestAnimationFrame(() => {
|
|
11327
|
+
const input = inputRef.current;
|
|
11328
|
+
if (input instanceof HTMLInputElement) input.setSelectionRange(input.value.length, input.value.length);
|
|
11329
|
+
});
|
|
11330
|
+
}
|
|
11331
|
+
}, [commitDate]);
|
|
11332
|
+
const handleOpenChange = useCallback((open) => {
|
|
11333
|
+
if (!open) if (skipNextCommitRef.current) skipNextCommitRef.current = false;
|
|
11334
|
+
else handleCommit();
|
|
11335
|
+
setIsOpen(open);
|
|
11336
|
+
}, [handleCommit]);
|
|
11337
|
+
useEffect(() => {
|
|
11338
|
+
if (!isControlled) return;
|
|
11339
|
+
setInputText(formatDate(value));
|
|
11340
|
+
setPreviewDate(null);
|
|
11341
|
+
if (value !== null) setDisplayedMonth(value);
|
|
11342
|
+
}, [isControlled, value]);
|
|
11343
|
+
const contextValue = useMemo(() => ({
|
|
11344
|
+
selectedDate,
|
|
11345
|
+
isOpen,
|
|
11346
|
+
inputText,
|
|
11347
|
+
previewDate,
|
|
11348
|
+
displayedMonth,
|
|
11349
|
+
disabled,
|
|
11350
|
+
isMobile: isSmAndDown,
|
|
11351
|
+
align,
|
|
11352
|
+
side,
|
|
11353
|
+
minDate,
|
|
11354
|
+
maxDate,
|
|
11355
|
+
disabledDates,
|
|
11356
|
+
inputRef,
|
|
11357
|
+
popoverContentRef,
|
|
11358
|
+
setIsOpen,
|
|
11359
|
+
setInputText,
|
|
11360
|
+
handleInputChange,
|
|
11361
|
+
handleCommit,
|
|
11362
|
+
handleDaySelect,
|
|
11363
|
+
setDisplayedMonth
|
|
11364
|
+
}), [
|
|
11365
|
+
selectedDate,
|
|
11366
|
+
isOpen,
|
|
11367
|
+
inputText,
|
|
11368
|
+
previewDate,
|
|
11369
|
+
displayedMonth,
|
|
11370
|
+
disabled,
|
|
11371
|
+
isSmAndDown,
|
|
11372
|
+
align,
|
|
11373
|
+
side,
|
|
11374
|
+
minDate,
|
|
11375
|
+
maxDate,
|
|
11376
|
+
disabledDates,
|
|
11377
|
+
handleInputChange,
|
|
11378
|
+
handleCommit,
|
|
11379
|
+
handleDaySelect
|
|
11380
|
+
]);
|
|
11381
|
+
return /* @__PURE__ */ jsx("div", {
|
|
11382
|
+
ref,
|
|
11383
|
+
...rest,
|
|
11384
|
+
children: /* @__PURE__ */ jsx(PopoverRoot, {
|
|
11385
|
+
isOpen,
|
|
11386
|
+
onOpenChange: handleOpenChange,
|
|
11387
|
+
children: /* @__PURE__ */ jsxs(DatePickerProvider, {
|
|
11388
|
+
value: contextValue,
|
|
11389
|
+
children: [/* @__PURE__ */ jsx(DatePickerInput, {
|
|
11390
|
+
"aria-describedby": ariaDescribedBy,
|
|
11391
|
+
"aria-invalid": ariaInvalid,
|
|
11392
|
+
fullWidth,
|
|
11393
|
+
id,
|
|
11394
|
+
name,
|
|
11395
|
+
placeholder
|
|
11396
|
+
}), /* @__PURE__ */ jsx(DatePickerPopover, {})]
|
|
11397
|
+
})
|
|
11398
|
+
})
|
|
11399
|
+
});
|
|
11400
|
+
});
|
|
11401
|
+
DatePicker.displayName = "DatePicker_UI";
|
|
11402
|
+
//#endregion
|
|
11403
|
+
//#region src/components/Divider/Divider.tsx
|
|
11404
|
+
const horizontalBorderCss = css`
|
|
11405
|
+
border-top-color: var(--wui-color-border);
|
|
11406
|
+
border-top-style: solid;
|
|
11407
|
+
border-top-width: 1px;
|
|
11408
|
+
clear: both; /* for horizontal dividers, ensure it clears any floats */
|
|
11409
|
+
height: 0;
|
|
11410
|
+
margin-left: var(--wui-divider-inset);
|
|
11411
|
+
margin-right: var(--wui-divider-inset);
|
|
11412
|
+
`;
|
|
11413
|
+
const verticalBorderCss = css`
|
|
11414
|
+
background-color: var(--wui-color-border);
|
|
11415
|
+
max-width: 1px;
|
|
11416
|
+
min-height: 100%;
|
|
11417
|
+
width: 1px;
|
|
11418
|
+
margin-top: var(--wui-divider-inset);
|
|
11419
|
+
margin-bottom: var(--wui-divider-inset);
|
|
11420
|
+
`;
|
|
11421
|
+
const DividerComponent = styled.div`
|
|
11422
|
+
${({ $orientation }) => {
|
|
11423
|
+
switch ($orientation) {
|
|
11424
|
+
case "vertical": return verticalBorderCss;
|
|
11425
|
+
default: return horizontalBorderCss;
|
|
11426
|
+
}
|
|
11427
|
+
}}
|
|
11428
|
+
--wui-divider-inset: ${({ $inset }) => `var(--wui-${$inset})`};
|
|
11429
|
+
|
|
11430
|
+
align-self: stretch;
|
|
11431
|
+
`;
|
|
11432
|
+
/**
|
|
11433
|
+
* A line used to visually separate content; note that dividers have no external margin/spacing on their own.
|
|
10307
11434
|
*/
|
|
10308
11435
|
const Divider = ({ orientation = "horizontal", inset = "space-00", ...props }) => {
|
|
10309
11436
|
const responsiveOrientation = useResponsiveProp(orientation);
|
|
@@ -11358,7 +12485,7 @@ const previewCardClose = keyframes`
|
|
|
11358
12485
|
transform: scale(0.96);
|
|
11359
12486
|
}
|
|
11360
12487
|
`;
|
|
11361
|
-
const StyledContent$
|
|
12488
|
+
const StyledContent$1 = styled(Content$3)`
|
|
11362
12489
|
--preview-card-animation-duration: var(--wui-motion-duration-03);
|
|
11363
12490
|
--preview-card-animation-ease: var(--wui-motion-ease-out);
|
|
11364
12491
|
|
|
@@ -11405,7 +12532,7 @@ const PreviewCard = ({ children, trigger, maxWidth = "320px", maxHeight = "auto"
|
|
|
11405
12532
|
children: [/* @__PURE__ */ jsx(Trigger$3, {
|
|
11406
12533
|
asChild: true,
|
|
11407
12534
|
children: trigger
|
|
11408
|
-
}), /* @__PURE__ */ jsx(Portal$2, { children: /* @__PURE__ */ jsx(StyledContent$
|
|
12535
|
+
}), /* @__PURE__ */ jsx(Portal$2, { children: /* @__PURE__ */ jsx(StyledContent$1, {
|
|
11409
12536
|
$colorScheme: colorScheme,
|
|
11410
12537
|
$paddingSize: paddingSize,
|
|
11411
12538
|
sideOffset: 8,
|
|
@@ -12280,7 +13407,7 @@ const StyledModalContent = styled(Content$4)`
|
|
|
12280
13407
|
${({ $positionVariant }) => positionStyleMap[$positionVariant]}
|
|
12281
13408
|
}
|
|
12282
13409
|
`;
|
|
12283
|
-
const ModalContent = forwardRef(({ width, positionVariant
|
|
13410
|
+
const ModalContent = forwardRef(({ width, positionVariant, children, ...props }, ref) => {
|
|
12284
13411
|
useFocusRestore();
|
|
12285
13412
|
return /* @__PURE__ */ jsx(StyledModalContent, {
|
|
12286
13413
|
ref,
|
|
@@ -12403,233 +13530,6 @@ const ModalCallout = ({ title, image, children }) => {
|
|
|
12403
13530
|
};
|
|
12404
13531
|
ModalCallout.displayName = "ModalCallout_UI";
|
|
12405
13532
|
//#endregion
|
|
12406
|
-
//#region src/components/Popover/PopoverRoot.tsx
|
|
12407
|
-
/**
|
|
12408
|
-
* The root of a composable popover. Wrap `PopoverTrigger` (or `PopoverAnchor`)
|
|
12409
|
-
* and `PopoverContent` inside it.
|
|
12410
|
-
*
|
|
12411
|
-
* For the common "button opens a panel" case, prefer the bundled `Popover`.
|
|
12412
|
-
*/
|
|
12413
|
-
const PopoverRoot = ({ isOpen, ...props }) => /* @__PURE__ */ jsx(Root$4, {
|
|
12414
|
-
...props,
|
|
12415
|
-
...isOpen !== void 0 ? { open: isOpen } : {}
|
|
12416
|
-
});
|
|
12417
|
-
PopoverRoot.displayName = "PopoverRoot_UI";
|
|
12418
|
-
//#endregion
|
|
12419
|
-
//#region src/components/Popover/PopoverTrigger.tsx
|
|
12420
|
-
/**
|
|
12421
|
-
* The button that toggles the popover open and closed. By default it renders a
|
|
12422
|
-
* `<button>` wrapping its children; pass `asChild` to merge the trigger
|
|
12423
|
-
* behavior onto a single child element (e.g. a `Button` or `IconButton`).
|
|
12424
|
-
*/
|
|
12425
|
-
const PopoverTrigger = forwardRef((props, forwardedRef) => /* @__PURE__ */ jsx(Trigger$2, {
|
|
12426
|
-
ref: forwardedRef,
|
|
12427
|
-
...props
|
|
12428
|
-
}));
|
|
12429
|
-
PopoverTrigger.displayName = "PopoverTrigger_UI";
|
|
12430
|
-
//#endregion
|
|
12431
|
-
//#region src/components/Popover/PopoverPortal.tsx
|
|
12432
|
-
/**
|
|
12433
|
-
* Portals the popover content out of the DOM hierarchy of its trigger so it can
|
|
12434
|
-
* escape clipping ancestors (`overflow: hidden`, transformed containers, etc.).
|
|
12435
|
-
*/
|
|
12436
|
-
const PopoverPortal = (props) => /* @__PURE__ */ jsx(Portal$1, { ...props });
|
|
12437
|
-
PopoverPortal.displayName = "PopoverPortal_UI";
|
|
12438
|
-
//#endregion
|
|
12439
|
-
//#region src/components/Popover/PopoverContent.tsx
|
|
12440
|
-
const StyledContent$1 = styled(Content$2)`
|
|
12441
|
-
z-index: var(--wui-zindex-popover);
|
|
12442
|
-
${({ $colorScheme }) => getColorScheme($colorScheme)};
|
|
12443
|
-
${({ $unstyled }) => !$unstyled && css`
|
|
12444
|
-
border-radius: var(--wui-border-radius-02);
|
|
12445
|
-
padding: var(--wui-space-04);
|
|
12446
|
-
max-width: var(--wui-popover-max-width);
|
|
12447
|
-
max-height: var(--wui-popover-max-height);
|
|
12448
|
-
background-color: var(--wui-color-bg-surface);
|
|
12449
|
-
box-shadow: var(--wui-elevation-01);
|
|
12450
|
-
border: 1px solid var(--wui-color-border);
|
|
12451
|
-
overflow: auto;
|
|
12452
|
-
`}
|
|
12453
|
-
|
|
12454
|
-
[data-wui-popover-close] {
|
|
12455
|
-
position: absolute;
|
|
12456
|
-
top: var(--wui-space-02);
|
|
12457
|
-
right: var(--wui-space-02);
|
|
12458
|
-
}
|
|
12459
|
-
`;
|
|
12460
|
-
const DEFAULT_SIDE_OFFSET = 8;
|
|
12461
|
-
const DEFAULT_MAX_WIDTH = "320px";
|
|
12462
|
-
const DEFAULT_MAX_HEIGHT = "auto";
|
|
12463
|
-
/**
|
|
12464
|
-
* The styled popover surface. Place inside a `PopoverRoot` (typically wrapped
|
|
12465
|
-
* in a `PopoverPortal`). Forwards all Radix Content props, including
|
|
12466
|
-
* dismissal/focus event handlers such as `onPointerDownOutside`,
|
|
12467
|
-
* `onOpenAutoFocus`, and `onCloseAutoFocus`.
|
|
12468
|
-
*/
|
|
12469
|
-
const PopoverContent = forwardRef(({ colorScheme = "inherit", unstyled = false, maxWidth = DEFAULT_MAX_WIDTH, maxHeight = DEFAULT_MAX_HEIGHT, sideOffset = DEFAULT_SIDE_OFFSET, style, ...props }, forwardedRef) => {
|
|
12470
|
-
return /* @__PURE__ */ jsx(StyledContent$1, {
|
|
12471
|
-
ref: forwardedRef,
|
|
12472
|
-
$colorScheme: colorScheme,
|
|
12473
|
-
$unstyled: unstyled,
|
|
12474
|
-
sideOffset,
|
|
12475
|
-
style: {
|
|
12476
|
-
"--wui-popover-max-width": maxWidth,
|
|
12477
|
-
"--wui-popover-max-height": maxHeight,
|
|
12478
|
-
...style
|
|
12479
|
-
},
|
|
12480
|
-
...props
|
|
12481
|
-
});
|
|
12482
|
-
});
|
|
12483
|
-
PopoverContent.displayName = "PopoverContent_UI";
|
|
12484
|
-
//#endregion
|
|
12485
|
-
//#region src/components/Popover/PopoverClose.tsx
|
|
12486
|
-
/**
|
|
12487
|
-
* An element that closes the popover when activated. Defaults to a `<button>`;
|
|
12488
|
-
* pass `asChild` to merge the close behavior onto a single child element. For
|
|
12489
|
-
* a pre-styled icon close button, use `PopoverCloseButton`.
|
|
12490
|
-
*/
|
|
12491
|
-
const PopoverClose = forwardRef((props, forwardedRef) => /* @__PURE__ */ jsx(Close, {
|
|
12492
|
-
ref: forwardedRef,
|
|
12493
|
-
...props
|
|
12494
|
-
}));
|
|
12495
|
-
PopoverClose.displayName = "PopoverClose_UI";
|
|
12496
|
-
//#endregion
|
|
12497
|
-
//#region src/components/Popover/PopoverCloseButton.tsx
|
|
12498
|
-
/**
|
|
12499
|
-
* A pre-styled close button intended to be placed inside a `PopoverContent`.
|
|
12500
|
-
* For a custom close control, use `PopoverClose` directly.
|
|
12501
|
-
*/
|
|
12502
|
-
const PopoverCloseButton = ({ label = "Close" } = {}) => /* @__PURE__ */ jsx(PopoverClose, {
|
|
12503
|
-
asChild: true,
|
|
12504
|
-
children: /* @__PURE__ */ jsx(IconButton, {
|
|
12505
|
-
"data-wui-popover-close": true,
|
|
12506
|
-
label,
|
|
12507
|
-
variant: "ghost",
|
|
12508
|
-
children: /* @__PURE__ */ jsx(Icon, { type: "close" })
|
|
12509
|
-
})
|
|
12510
|
-
});
|
|
12511
|
-
PopoverCloseButton.displayName = "PopoverCloseButton_UI";
|
|
12512
|
-
//#endregion
|
|
12513
|
-
//#region src/components/Popover/PopoverArrow.tsx
|
|
12514
|
-
const StyledPath = styled.path`
|
|
12515
|
-
fill: var(--wui-color-border-secondary);
|
|
12516
|
-
`;
|
|
12517
|
-
const circleAnimation = keyframes`
|
|
12518
|
-
0% {
|
|
12519
|
-
opacity: var(--wui-popover-arrow-circle-starting-opacity);
|
|
12520
|
-
}
|
|
12521
|
-
100% {
|
|
12522
|
-
opacity: 0;
|
|
12523
|
-
}
|
|
12524
|
-
`;
|
|
12525
|
-
const StyledCircle = styled.circle`
|
|
12526
|
-
stroke: var(--wui-color-border-active);
|
|
12527
|
-
animation-duration: 2s;
|
|
12528
|
-
animation-iteration-count: infinite;
|
|
12529
|
-
animation-direction: alternate;
|
|
12530
|
-
animation-timing-function: ease-in-out;
|
|
12531
|
-
|
|
12532
|
-
&[data-wui-popover-arrow-inner-circle] {
|
|
12533
|
-
--wui-popover-arrow-circle-starting-opacity: 0.36;
|
|
12534
|
-
|
|
12535
|
-
opacity: var(--wui-popover-arrow-circle-starting-opacity);
|
|
12536
|
-
}
|
|
12537
|
-
|
|
12538
|
-
&[data-wui-popover-arrow-outer-circle] {
|
|
12539
|
-
--wui-popover-arrow-circle-starting-opacity: 0.2;
|
|
12540
|
-
|
|
12541
|
-
animation-direction: alternate-reverse;
|
|
12542
|
-
opacity: 0.11;
|
|
12543
|
-
}
|
|
12544
|
-
|
|
12545
|
-
@media (prefers-reduced-motion: no-preference) {
|
|
12546
|
-
${({ $isAnimated }) => $isAnimated && css`
|
|
12547
|
-
animation-name: ${circleAnimation};
|
|
12548
|
-
`}
|
|
12549
|
-
}
|
|
12550
|
-
`;
|
|
12551
|
-
const PopoverArrow = ({ isAnimated }) => {
|
|
12552
|
-
return /* @__PURE__ */ jsx(PopoverArrow$1, {
|
|
12553
|
-
asChild: true,
|
|
12554
|
-
children: /* @__PURE__ */ jsxs("svg", {
|
|
12555
|
-
fill: "none",
|
|
12556
|
-
height: "56",
|
|
12557
|
-
viewBox: "0 0 48 56",
|
|
12558
|
-
width: "48",
|
|
12559
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
12560
|
-
children: [
|
|
12561
|
-
/* @__PURE__ */ jsx(StyledPath, { d: "M24 26.6667C21.0545 26.6667 18.6667 29.0545 18.6667 32C18.6667 34.9455 21.0545 37.3333 24 37.3333C26.9455 37.3333 29.3333 34.9455 29.3333 32C29.3333 29.0545 26.9455 26.6667 24 26.6667ZM23 0V32H25V0H23Z" }),
|
|
12562
|
-
/* @__PURE__ */ jsx(StyledCircle, {
|
|
12563
|
-
$isAnimated: isAnimated,
|
|
12564
|
-
cx: "24",
|
|
12565
|
-
cy: "32",
|
|
12566
|
-
"data-wui-popover-arrow-inner-circle": true,
|
|
12567
|
-
r: "10",
|
|
12568
|
-
strokeWidth: "4"
|
|
12569
|
-
}),
|
|
12570
|
-
/* @__PURE__ */ jsx(StyledCircle, {
|
|
12571
|
-
$isAnimated: isAnimated,
|
|
12572
|
-
cx: "24",
|
|
12573
|
-
cy: "32",
|
|
12574
|
-
"data-wui-popover-arrow-outer-circle": true,
|
|
12575
|
-
r: "20",
|
|
12576
|
-
strokeWidth: "8"
|
|
12577
|
-
})
|
|
12578
|
-
]
|
|
12579
|
-
})
|
|
12580
|
-
});
|
|
12581
|
-
};
|
|
12582
|
-
PopoverArrow.displayName = "PopoverArrow_UI";
|
|
12583
|
-
//#endregion
|
|
12584
|
-
//#region src/components/Popover/Popover.tsx
|
|
12585
|
-
/**
|
|
12586
|
-
* Displays rich content in a portal, triggered by a button.
|
|
12587
|
-
*
|
|
12588
|
-
* For more control — custom anchor, access to event handlers like
|
|
12589
|
-
* `onPointerDownOutside`, no injected close button, etc. — compose the
|
|
12590
|
-
* primitives directly: `PopoverRoot`, `PopoverTrigger`, `PopoverAnchor`,
|
|
12591
|
-
* `PopoverPortal`, `PopoverContent`, `PopoverClose`.
|
|
12592
|
-
*/
|
|
12593
|
-
const Popover = ({ children, trigger, isOpen, hideCloseButton = false, maxWidth, maxHeight, onOpenChange, unstyled = false, withArrow = false, isAnimated = false, colorScheme = "inherit", style, ...props }) => {
|
|
12594
|
-
const sideOffset = withArrow ? -24 : 8;
|
|
12595
|
-
return /* @__PURE__ */ jsxs(PopoverRoot, {
|
|
12596
|
-
...isOpen !== void 0 ? {
|
|
12597
|
-
isOpen,
|
|
12598
|
-
onOpenChange
|
|
12599
|
-
} : {},
|
|
12600
|
-
children: [/* @__PURE__ */ jsx(PopoverTrigger, {
|
|
12601
|
-
asChild: true,
|
|
12602
|
-
children: trigger
|
|
12603
|
-
}), /* @__PURE__ */ jsx(PopoverPortal, { children: /* @__PURE__ */ jsxs(PopoverContent, {
|
|
12604
|
-
colorScheme,
|
|
12605
|
-
...maxHeight !== void 0 ? { maxHeight } : {},
|
|
12606
|
-
...maxWidth !== void 0 ? { maxWidth } : {},
|
|
12607
|
-
sideOffset,
|
|
12608
|
-
unstyled,
|
|
12609
|
-
...props,
|
|
12610
|
-
style,
|
|
12611
|
-
children: [
|
|
12612
|
-
!hideCloseButton && /* @__PURE__ */ jsx(PopoverCloseButton, {}),
|
|
12613
|
-
withArrow ? /* @__PURE__ */ jsx(PopoverArrow, { isAnimated }) : null,
|
|
12614
|
-
/* @__PURE__ */ jsx("div", { children })
|
|
12615
|
-
]
|
|
12616
|
-
}) })]
|
|
12617
|
-
});
|
|
12618
|
-
};
|
|
12619
|
-
Popover.displayName = "Popover_UI";
|
|
12620
|
-
//#endregion
|
|
12621
|
-
//#region src/components/Popover/PopoverAnchor.tsx
|
|
12622
|
-
/**
|
|
12623
|
-
* Positions the popover relative to an element other than the trigger. Useful
|
|
12624
|
-
* when the element the user interacts with (e.g. a text input) is separate
|
|
12625
|
-
* from what the popover attaches to.
|
|
12626
|
-
*/
|
|
12627
|
-
const PopoverAnchor = forwardRef((props, forwardedRef) => /* @__PURE__ */ jsx(Anchor, {
|
|
12628
|
-
ref: forwardedRef,
|
|
12629
|
-
...props
|
|
12630
|
-
}));
|
|
12631
|
-
PopoverAnchor.displayName = "PopoverAnchor_UI";
|
|
12632
|
-
//#endregion
|
|
12633
13533
|
//#region src/components/ProgressBar/ProgressBar.tsx
|
|
12634
13534
|
const ProgressBarWrapper = styled.div`
|
|
12635
13535
|
--progress-bar-height: 8px;
|
|
@@ -14159,7 +15059,7 @@ const gradients = {
|
|
|
14159
15059
|
* @param {GradientName} gradientName - The name of the gradient to retrieve.
|
|
14160
15060
|
* @returns {CssStyleType} The CSS string representing the specified gradient.
|
|
14161
15061
|
*/
|
|
14162
|
-
const getBackgroundGradient = (gradientName
|
|
15062
|
+
const getBackgroundGradient = (gradientName) => {
|
|
14163
15063
|
return isNotNil(gradientName) ? gradients[gradientName] : gradients.defaultDarkOne;
|
|
14164
15064
|
};
|
|
14165
15065
|
//#endregion
|
|
@@ -14532,7 +15432,7 @@ const WistiaLogoComponent = styled.svg`
|
|
|
14532
15432
|
/**
|
|
14533
15433
|
* Render the Wistia logo in various ways.
|
|
14534
15434
|
*/
|
|
14535
|
-
const WistiaLogo = ({ description
|
|
15435
|
+
const WistiaLogo = ({ description, height = 100, hoverColor, href, iconOnly = false, opticallyCentered = false, title = "Wistia Logo", variant = "standard", ...props }) => {
|
|
14536
15436
|
const primaryColor = "#2949e5";
|
|
14537
15437
|
const darkColor = "#000934";
|
|
14538
15438
|
const lightColor = "#ffffff";
|
|
@@ -14576,6 +15476,6 @@ const WistiaLogo = ({ description = void 0, height = 100, hoverColor = void 0, h
|
|
|
14576
15476
|
};
|
|
14577
15477
|
WistiaLogo.displayName = "WistiaLogo_UI";
|
|
14578
15478
|
//#endregion
|
|
14579
|
-
export { ActionButton, Avatar, Badge, Banner, Box, Breadcrumb, Breadcrumbs, Button, ButtonGroup, Card, Center, Checkbox, CheckboxGroup, CheckboxMenuItem, ClickRegion, Collapsible, CollapsibleContent, CollapsibleTrigger, CollapsibleTriggerIcon, ColorGrid, ColorGridOption, ColorList, ColorListGroup, ColorListOption, ColorPicker, ColorPickerPopoverContent, ColorPickerSection, ColorPickerTrigger, ColorSchemeWrapper, Combobox, ComboboxOption, ContextMenu, ContrastControls, CustomizableThemeWrapper, DataCard, DataCardHoverArrow, DataCardTrend, DataCards, DataList, DataListItem, DataListItemLabel, DataListItemValue, Divider, EditableHeading, EditableText, EditableTextCancelButton, EditableTextContext, EditableTextDisplay, EditableTextInput, EditableTextLabel, EditableTextRoot, EditableTextSubmitButton, EditableTextTrigger, Ellipsis, FeatureCard, FeatureCardImage, FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, FilterMenu, FilterMenuItem, Form, FormErrorSummary, FormField, FormGroup, Grid, Heading, HexColorInput, HueSlider, Icon, IconButton, Image, ImageDimensionsValidator, Input, InputClickToCopy, InputPassword, KeyboardShortcut, Label, Link, List, ListItem, Mark, Markdown, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Meter, Modal, ModalCallout, ModalCallouts, PersistentFileAmountLimitValidator, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverCloseButton, PopoverContent, PopoverPortal, PopoverRoot, PopoverTrigger, PreviewCard, ProgressBar, Radio, RadioCard, RadioCardImage, RadioGroup, RadioMenuItem, SaturationAndValuePicker, ScreenReaderOnly, ScrollArea, SegmentedControl, SegmentedControlItem, Select, SelectOption, SelectOptionGroup, Slider, SplitButton, Stack, SubMenu, Switch, Table, TableBody, TableCell, TableFoot, TableHead, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, Text, Thumbnail, ThumbnailBadge, ThumbnailCollage, Tooltip, UIProvider, ValueNameOrHexCode, ValueSwatch, WistiaLogo, calculateContrast, coerceToBoolean, colorSchemeOptions, copyToClipboard, dateTime, iconSizeMap, isKeyboardKey, mergeRefs, mq, useActiveMq, useAriaLive, useBoolean, useClipboard, useElementObserver, useFilePicker, useFocusTrap, useForceUpdate, useFormState, useImperativeFilePicker, useIsHovered, useKey, useKeyPress, useLocalStorage, useLockBodyScroll, useMq, useOnClickOutside, usePreviousValue, useToast, useWindowSize, validateWithYup };
|
|
15479
|
+
export { ActionButton, Avatar, Badge, Banner, Box, Breadcrumb, Breadcrumbs, Button, ButtonGroup, Card, Center, Checkbox, CheckboxGroup, CheckboxMenuItem, ClickRegion, Collapsible, CollapsibleContent, CollapsibleTrigger, CollapsibleTriggerIcon, ColorGrid, ColorGridOption, ColorList, ColorListGroup, ColorListOption, ColorPicker, ColorPickerPopoverContent, ColorPickerSection, ColorPickerTrigger, ColorSchemeWrapper, Combobox, ComboboxOption, ContextMenu, ContrastControls, CustomizableThemeWrapper, DataCard, DataCardHoverArrow, DataCardTrend, DataCards, DataList, DataListItem, DataListItemLabel, DataListItemValue, DatePicker, Divider, EditableHeading, EditableText, EditableTextCancelButton, EditableTextContext, EditableTextDisplay, EditableTextInput, EditableTextLabel, EditableTextRoot, EditableTextSubmitButton, EditableTextTrigger, Ellipsis, FeatureCard, FeatureCardImage, FileAmountLimitValidator, FileSizeValidator, FileTypeValidator, FilterMenu, FilterMenuItem, Form, FormErrorSummary, FormField, FormGroup, Grid, Heading, HexColorInput, HueSlider, Icon, IconButton, Image, ImageDimensionsValidator, Input, InputClickToCopy, InputPassword, KeyboardShortcut, Label, Link, List, ListItem, Mark, Markdown, Menu, MenuItem, MenuItemDescription, MenuItemLabel, MenuLabel, MenuRadioGroup, Meter, Modal, ModalCallout, ModalCallouts, PersistentFileAmountLimitValidator, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverCloseButton, PopoverContent, PopoverPortal, PopoverRoot, PopoverTrigger, PreviewCard, ProgressBar, Radio, RadioCard, RadioCardImage, RadioGroup, RadioMenuItem, SaturationAndValuePicker, ScreenReaderOnly, ScrollArea, SegmentedControl, SegmentedControlItem, Select, SelectOption, SelectOptionGroup, Slider, SplitButton, Stack, SubMenu, Switch, Table, TableBody, TableCell, TableFoot, TableHead, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Tag, Text, Thumbnail, ThumbnailBadge, ThumbnailCollage, Tooltip, UIProvider, ValueNameOrHexCode, ValueSwatch, WistiaLogo, calculateContrast, coerceToBoolean, colorSchemeOptions, copyToClipboard, dateTime, iconSizeMap, isKeyboardKey, mergeRefs, mq, useActiveMq, useAriaLive, useBoolean, useClipboard, useElementObserver, useFilePicker, useFocusTrap, useForceUpdate, useFormState, useImperativeFilePicker, useIsHovered, useKey, useKeyPress, useLocalStorage, useLockBodyScroll, useMq, useOnClickOutside, usePreviousValue, useToast, useWindowSize, validateWithYup };
|
|
14580
15480
|
|
|
14581
15481
|
//# sourceMappingURL=index.js.map
|