@wix/editor-react-components 1.2344.0 → 1.2346.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/site/components/AudioPlayer/component.js +3 -4
- package/dist/site/components/Breadcrumbs/component.js +1 -1
- package/dist/site/components/Button/component.js +1 -1
- package/dist/site/components/Checkbox/css.css +4 -4
- package/dist/site/components/CheckboxGroup/css.css +4 -4
- package/dist/site/components/CollapsibleText/component.js +1 -1
- package/dist/site/components/DatePicker/DatePicker.types.d.ts +6 -1
- package/dist/site/components/DatePicker/component.js +61 -11
- package/dist/site/components/DatePicker/components/DatePickerLabel.d.ts +2 -1
- package/dist/site/components/DatePicker/constants.d.ts +8 -0
- package/dist/site/components/DatePicker/css.css +13 -0
- package/dist/site/components/DatePicker/hooks/useDatePickerValue.d.ts +1 -1
- package/dist/site/components/DatePicker/manifest.js +12 -1
- package/dist/site/components/Lottie/component.js +1 -1
- package/dist/site/components/Menu/component.js +1 -1
- package/dist/site/components/Slideshow/component.js +1 -1
- package/dist/site/components/TextInput/TextInput.types.d.ts +3 -1
- package/dist/site/components/TextInput/component.js +86 -19
- package/dist/site/components/TextInput/constants.d.ts +13 -0
- package/dist/site/components/TextInput/css.css +47 -4
- package/dist/site/components/TextInput/manifest.js +8 -1
- package/dist/site/components/TimePicker/TimePicker.types.d.ts +7 -1
- package/dist/site/components/TimePicker/component.js +61 -11
- package/dist/site/components/TimePicker/constants.d.ts +7 -0
- package/dist/site/components/TimePicker/css.css +13 -0
- package/dist/site/components/TimePicker/hooks/useTimePickerValue.d.ts +1 -1
- package/dist/site/components/TimePicker/manifest.js +8 -1
- package/dist/site/components/chunks/Button.js +347 -1057
- package/dist/site/components/chunks/{Tooltip.js → DateField.js} +52 -1018
- package/dist/site/components/chunks/Group.js +970 -46
- package/dist/site/components/chunks/NumberFormatter.js +140 -0
- package/dist/site/components/chunks/VisuallyHidden.js +1 -1
- package/dist/site/components/chunks/constants2.js +9 -2
- package/dist/site/components/chunks/constants3.js +10 -1
- package/dist/site/components/chunks/constants33.js +10 -2
- package/dist/site/components/chunks/filterDOMProps.js +139 -18
- package/dist/site/components/chunks/manifest2.js +73 -0
- package/dist/site/components/chunks/useLocalizedStringFormatter.js +1 -1
- package/dist/site/components/chunks/useValidatedField.js +1411 -0
- package/package.json +5 -5
- package/dist/site/components/chunks/Button2.js +0 -365
- package/dist/site/components/chunks/I18nProvider.js +0 -125
- package/dist/site/components/chunks/Input.js +0 -341
|
@@ -9,10 +9,9 @@ import { d as directionStyles } from "../chunks/direction.module.js";
|
|
|
9
9
|
import Image3 from "../Image3/component.js";
|
|
10
10
|
import { A as ARIA_LABELS, s as selectors, d as dataDefaults } from "../chunks/constants38.js";
|
|
11
11
|
import { c as commonjsGlobal } from "../chunks/_commonjsHelpers.js";
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import { a as $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7 } from "../chunks/I18nProvider.js";
|
|
12
|
+
import { x as $48a7d519b337145d$export$4eaf04e54aa8eed6, v as $fe16bffc7a557bf0$export$7f54fc3180508a52, S as $cbf007e418543821$export$b0d6fa1ab32e3295, r as $d447af545b77c9f1$export$f21a1ffae260145a, g as $23f2114a1b82827e$export$e58f029f0fbfdb29, T as $cbf007e418543821$export$16a4697467175487, G as $0beb20c9744a2065$export$8467354a121f1b9f, J as $240e9101ba2842f5$export$7d15b64cf5a3a4c4, F as $8f5a2122b0992be3$export$8397ddfc504fdb9a, f as $bbaa08b3cd72f041$export$9d1611c77c2fe928, N as $1969ac565cfec8d0$export$de79e2c695e052f3, U as $8296dad1a4c5e0dc$export$8f71654801c2f7cd, d as $d1116acdf220c2da$export$4c014de7c8940b4c, e as $3274bf1495747a7b$export$5add1d006293d136, V as $240e9101ba2842f5$export$cb6e0bb50bc19463, c as $3e6197669829fe11$export$40bfa8c7b0832715, h as $01b77f81d0f07f68$export$75b6ee27786ba447, E as $e969f22b6713ca4a$export$ae780daf29e6d456, D as $0c4a58759813079a$export$4e328f61c538687f, b as $d2b4bc8c273e7be6$export$353f5b6fc5456de1, $ as $a049562f99e7db0e$export$eb2fcfdbd7ba97d4 } from "../chunks/Group.js";
|
|
13
|
+
import { k as $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7, c as $64fa3d84918910a7$export$29f1550f4b0d4415, e as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, g as $64fa3d84918910a7$export$4d86445c2cf5e3, h as $65484d02dcb7eb3e$export$457c3d6518dd4c6f, i as $64fa3d84918910a7$export$2881499e37b75b9a, d as $64fa3d84918910a7$export$fabf2dc03a41866e } from "../chunks/filterDOMProps.js";
|
|
14
|
+
import { $ as $1dfb119a85e764e5$export$cc77c4ff7e8673c5 } from "../chunks/NumberFormatter.js";
|
|
16
15
|
import { $ as $ea3928288112382f$export$439d29a4e110a164 } from "../chunks/VisuallyHidden.js";
|
|
17
16
|
function $1dfdc54e7eb53ba0$export$36da96379f79f245(props) {
|
|
18
17
|
let { onMoveStart, onMove, onMoveEnd } = props;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import React__default, { useContext, useState, useRef, useMemo, cloneElement, forwardRef, createContext, useCallback, isValidElement, useEffect } from "react";
|
|
3
3
|
import { c as clsx } from "../chunks/clsx.js";
|
|
4
|
-
import {
|
|
4
|
+
import { r as $f39a9eba43920ace$export$8dc98ba7eadeaa56, m as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, a as $8e9d2fae0ecb9001$export$457c3d6518dd4c6f, c as $64fa3d84918910a7$export$29f1550f4b0d4415, h as $65484d02dcb7eb3e$export$457c3d6518dd4c6f, p as $3ef42575df84b30b$export$9d1611c77c2fe928, d as $64fa3d84918910a7$export$fabf2dc03a41866e, g as $64fa3d84918910a7$export$4d86445c2cf5e3 } from "../chunks/filterDOMProps.js";
|
|
5
5
|
import { $ as $cf2482eff2eeeec2$export$f12b703ca79dfbb1 } from "../chunks/useLocalizedStringFormatter.js";
|
|
6
6
|
import { createPortal } from "react-dom";
|
|
7
7
|
import { f as convertA11yKeysToHtmlFormat } from "../chunks/a11y.js";
|
|
@@ -188,10 +188,10 @@
|
|
|
188
188
|
}
|
|
189
189
|
.requiredIndicator__j5mIH {
|
|
190
190
|
display: inline-block;
|
|
191
|
-
width: 0.
|
|
192
|
-
height: 0.
|
|
193
|
-
margin-inline-start: 0.
|
|
194
|
-
vertical-align:
|
|
191
|
+
width: 0.6em;
|
|
192
|
+
height: 0.6em;
|
|
193
|
+
margin-inline-start: 0.2em;
|
|
194
|
+
vertical-align: super;
|
|
195
195
|
color: inherit;
|
|
196
196
|
}
|
|
197
197
|
.fallbackDirection__HeRgn:not([dir]) {
|
|
@@ -218,10 +218,10 @@
|
|
|
218
218
|
}
|
|
219
219
|
.requiredIndicator__j5mIH {
|
|
220
220
|
display: inline-block;
|
|
221
|
-
width: 0.
|
|
222
|
-
height: 0.
|
|
223
|
-
margin-inline-start: 0.
|
|
224
|
-
vertical-align:
|
|
221
|
+
width: 0.6em;
|
|
222
|
+
height: 0.6em;
|
|
223
|
+
margin-inline-start: 0.2em;
|
|
224
|
+
vertical-align: super;
|
|
225
225
|
color: inherit;
|
|
226
226
|
}
|
|
227
227
|
.fallbackDirection__HeRgn:not([dir]) {
|
|
@@ -10,7 +10,7 @@ import { a as getDataAttributes } from "../chunks/dataUtils.js";
|
|
|
10
10
|
import { u as useResizeObserver } from "../chunks/useResizeObserver.js";
|
|
11
11
|
import { d as directionStyles } from "../chunks/direction.module.js";
|
|
12
12
|
import { L as LINE_HEIGHT_ROUNDING_ERROR_TOLERANCE, F as FALLBACK_LINE_HEIGHT, m as manifestClasses, E as ExpandModeValues, T as TestIds, s as semanticClassNames } from "../chunks/constants34.js";
|
|
13
|
-
import { B as Button } from "../chunks/
|
|
13
|
+
import { B as Button } from "../chunks/Button.js";
|
|
14
14
|
const root = "root__kOEn9";
|
|
15
15
|
const text = "text__rjuUh";
|
|
16
16
|
const plain = "plain__a16K-";
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { DateValue } from 'react-aria-components';
|
|
2
2
|
import { A11y, Direction } from '@wix/editor-react-types';
|
|
3
3
|
import { SdkFunctionChangeableProps, SdkFunctionFocusableProps } from '../../../utils/functions/sdkFunctionCallbackProps';
|
|
4
|
+
import { FieldValidationProps } from '../../../utils/validation/types';
|
|
4
5
|
/** Single date or a start–end range. */
|
|
5
6
|
export type DatePickerSelectionMode = 'single' | 'range';
|
|
6
7
|
/** Smallest editable time unit (React Aria `granularity`). */
|
|
@@ -19,7 +20,7 @@ export type UnavailableDateRange = {
|
|
|
19
20
|
from?: string;
|
|
20
21
|
to?: string;
|
|
21
22
|
};
|
|
22
|
-
export type DatePickerProps = Omit<SdkFunctionChangeableProps, 'onChange'> & SdkFunctionFocusableProps & {
|
|
23
|
+
export type DatePickerProps = Omit<SdkFunctionChangeableProps, 'onChange'> & SdkFunctionFocusableProps & FieldValidationProps<string> & {
|
|
23
24
|
/** Fires with the selected ISO date string (range mode: the start date). */
|
|
24
25
|
onChange?: (value: string) => void;
|
|
25
26
|
/** Range mode: fires with the selected end date as an ISO string. */
|
|
@@ -46,6 +47,10 @@ export type DatePickerProps = Omit<SdkFunctionChangeableProps, 'onChange'> & Sdk
|
|
|
46
47
|
* `YYYY-MM-DDTHH:MM` with time granularity).
|
|
47
48
|
*/
|
|
48
49
|
endValue?: string;
|
|
50
|
+
/** Uncontrolled initial selected date (ISO string). Used only when `value` is not provided. */
|
|
51
|
+
defaultValue?: string;
|
|
52
|
+
/** Uncontrolled initial range end date (ISO string). Used only when `endValue` is not provided (range mode). */
|
|
53
|
+
defaultEndValue?: string;
|
|
49
54
|
/** Optional text label rendered above the field. */
|
|
50
55
|
label: string;
|
|
51
56
|
/** Site-facing helper text rendered under the field. */
|
|
@@ -2,13 +2,11 @@ import { jsxs, Fragment, jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import * as React from "react";
|
|
3
3
|
import React__default, { createContext, useEffect, useMemo, useRef, useState, useContext, forwardRef, useCallback } from "react";
|
|
4
4
|
import { c as clsx } from "../chunks/clsx.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
5
|
+
import { v as $fe16bffc7a557bf0$export$7f54fc3180508a52, H as $390e54f620492c70$export$b4cc09c592e8fdb8, B as $e8ac3c3f5d4bae7f$export$d6875122194c7b44, f as $bbaa08b3cd72f041$export$9d1611c77c2fe928, y as $d27d541f9569d26d$export$45712eceda6fad21, N as $1969ac565cfec8d0$export$de79e2c695e052f3, u as $8f5a2122b0992be3$export$630ff653c5ada6a9, l as $23f2114a1b82827e$export$cd4e5573fbe2b576, g as $23f2114a1b82827e$export$e58f029f0fbfdb29, k as $23f2114a1b82827e$export$4282f70798064fe0, K as $23f2114a1b82827e$export$b4f377a2b6254582, r as $d447af545b77c9f1$export$f21a1ffae260145a, j as $6a20a7989e6c817a$export$98658e8c59125e6a, m as $d447af545b77c9f1$export$b204af158042fbac, A as $390e54f620492c70$export$f680877a34711e37, z as $2c9edc598a03d523$export$420e68273165f4ec, O as $24f9a20f226ad820$export$5165eccb35aaadb5, q as $c4867b2f328c2698$export$e5c5a5f917a5871c, p as $f192c2f16961cbe0$export$80f3e147d781571c, w as $2add3ce32c6007eb$export$fedb369cb70207f1, P as $2b2d34ff061957fb$export$2b85b721e524d74b, Q as $a4e76a5424781910$export$e08e3b67e392101e, c as $3e6197669829fe11$export$40bfa8c7b0832715, R as $d2b4bc8c273e7be6$export$24d547caef80ccd1, E as $e969f22b6713ca4a$export$ae780daf29e6d456, D as $0c4a58759813079a$export$4e328f61c538687f, i as $a049562f99e7db0e$export$f9c6924e160136d1, h as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $a049562f99e7db0e$export$eb2fcfdbd7ba97d4, b as $d2b4bc8c273e7be6$export$353f5b6fc5456de1, a as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../chunks/Group.js";
|
|
6
|
+
import { a as $8e9d2fae0ecb9001$export$457c3d6518dd4c6f, k as $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7, n as $c7eafbbe1ea5834e$export$535bd6ca7f90a273, c as $64fa3d84918910a7$export$29f1550f4b0d4415, g as $64fa3d84918910a7$export$4d86445c2cf5e3, h as $65484d02dcb7eb3e$export$457c3d6518dd4c6f, i as $64fa3d84918910a7$export$2881499e37b75b9a, d as $64fa3d84918910a7$export$fabf2dc03a41866e, o as $f39a9eba43920ace$export$b5d7cc18bb8d2b59, m as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, p as $3ef42575df84b30b$export$9d1611c77c2fe928, q as $64fa3d84918910a7$export$c62b8e45d58ddad9, e as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, f as $64fa3d84918910a7$export$ef03459518577ad4, $ as $2eb8e6d23f3d0cb0$export$a54013f0d02a8f82 } from "../chunks/filterDOMProps.js";
|
|
7
|
+
import { e as $191c9b6d48a0a4e2$export$294aa081a6c6f55d, n as $fd2148440a13ec26$export$a763b9476acd3eb, o as $fd2148440a13ec26$export$dad6ae84456c676a, l as $fd2148440a13ec26$export$75ee7c75d68f5b0e, p as $72abaeab4d80592f$export$9fc1347d4195ccb3, q as $b3526bc71400be8d$export$d39e1813b3bdd0e1, r as $f11fb0bcf1b2687a$export$61c6a8c84e605fb6, d as $fd2148440a13ec26$export$fc1a364ae1f3ff10, i as $514c0188e459b4c0$export$9afb8bc826b033ea, s as $d3f049242431219c$export$45fda7c47f93fd48, t as $d3f049242431219c$export$6d3443f2c48bfc20, v as $44f671af83e7d9e0$export$2de4954e8ae13b9f, g as $d3e0e05bdfcf66bd$export$c24727297075ec6a, j as $ee014567cb39d3f0$export$ff05c3ac10437e03, $ as $4e3b923658d69c60$export$8c610744efcf8a1d, a as $4e3b923658d69c60$export$28c660c63b792dea, u as useValidatedField, b as $514c0188e459b4c0$export$5f1af8db9871e1d6, c as $ee014567cb39d3f0$export$f551688fc98f2e09 } from "../chunks/useValidatedField.js";
|
|
8
|
+
import { d as $60f33508b4cd9d3b$export$85fd5fdf27bacc79, e as $ad063034c8620db8$export$ea39ec197993aef0, f as $ad063034c8620db8$export$a5a3b454ada2268e, g as $ad063034c8620db8$export$a2258d9c4118825c, h as $a46cf152bb926da5$export$a9b970dcc4ae71a9, i as $9c268ab73a5d55e5$export$722debc0e56fea39, j as $ad063034c8620db8$export$91b62ebf2ba703ee, k as $ad063034c8620db8$export$629b0a497aa65267, l as $121970af65029459$export$f8aeda7b10753fa1, m as $51a3e22a5186a962$export$c826860796309d1b, n as $3578607fe3d4b096$export$cfa2225e87938781, o as $ad063034c8620db8$export$42c81a444fbfb5d4, p as $ad063034c8620db8$export$d0bdf45af03a6ea3, q as $ad063034c8620db8$export$ccc1b2479e7dd654, r as $600b3cf69ae46262$export$90fc3a17d93f704c, s as $654b97e09f2a30c1$export$4d0f8be8b12a7ef6, t as $6a440d0e2d99dd46$export$4a931266a3838b86, u as $535772f9d2c1f38d$export$c5251b9e124bf29, v as $7541913c0284d84b$export$300019f83c56d282, w as $0014db39426443c5$exports, x as $7541913c0284d84b$export$7b3062cd49e80452, y as $535772f9d2c1f38d$export$20e40289641fbbb6, z as $535772f9d2c1f38d$export$1258395f99bf9cbf, A as $901761b40e390936$export$2bb74740c4e19def, B as $ad063034c8620db8$export$a75f2bff57811055, C as $d07e34cce18680fd$export$93522d1a439f3617, D as $ad063034c8620db8$export$5c333a116e949cdd, E as $ad063034c8620db8$export$f91e89d3d0406102, F as $12a3c853105e5a70$export$ad991b66133851cf, G as $d07e34cce18680fd$export$b4a036af3fc0b032, H as $ad063034c8620db8$export$dbc69fd56b53d5e, I as $ad063034c8620db8$export$2061056d06d7cdf7, J as $ad063034c8620db8$export$ef8b6d9133084f4e, K as $93635573935797de$export$80ee6245ec4f29ec, L as $8b141f2f71e88f85$export$2440da353cedad43, M as $8b141f2f71e88f85$export$f18627323ab57ac0, N as $8b141f2f71e88f85$export$7e319ea407e63bc0, O as $8b141f2f71e88f85$export$c5221a78ef73c5e9, P as $d07e34cce18680fd$export$b21e0b124e224484, Q as $8b141f2f71e88f85$export$80ff8fc0ae339c13, R as $84102b64e5ca022f$export$dd0bbc9b26defe37, S as $ad063034c8620db8$export$a18c89cbd24170ff, T as $58246871e4652552$export$588937bcd60ade55, U as $58246871e4652552$export$6b862160d295c8e, V as $40825cdb76e74f70$export$7b3e670c86da5fe8, W as $ad063034c8620db8$export$aa8b41735afcabd2, X as $2aaf608024c21ca1$export$680ea196effce5f, a as $40825cdb76e74f70$export$7edc06cf1783b30f, b as $40825cdb76e74f70$export$336ab7fa954c4b5f } from "../chunks/DateField.js";
|
|
9
9
|
import { $ as $cf2482eff2eeeec2$export$f12b703ca79dfbb1 } from "../chunks/useLocalizedStringFormatter.js";
|
|
10
|
-
import { n as $fe16bffc7a557bf0$export$7f54fc3180508a52, T as $390e54f620492c70$export$b4cc09c592e8fdb8, M as $e8ac3c3f5d4bae7f$export$d6875122194c7b44, e as $bbaa08b3cd72f041$export$9d1611c77c2fe928, t as $1969ac565cfec8d0$export$de79e2c695e052f3, K as $8f5a2122b0992be3$export$630ff653c5ada6a9, D as $23f2114a1b82827e$export$cd4e5573fbe2b576, f as $23f2114a1b82827e$export$e58f029f0fbfdb29, q as $23f2114a1b82827e$export$4282f70798064fe0, O as $23f2114a1b82827e$export$b4f377a2b6254582, l as $d447af545b77c9f1$export$f21a1ffae260145a, C as $6a20a7989e6c817a$export$98658e8c59125e6a, j as $d447af545b77c9f1$export$b204af158042fbac, B as $390e54f620492c70$export$f680877a34711e37, L as $2c9edc598a03d523$export$420e68273165f4ec, H as $c4867b2f328c2698$export$e5c5a5f917a5871c, G as $f192c2f16961cbe0$export$80f3e147d781571c, i as $2add3ce32c6007eb$export$fedb369cb70207f1, x as $a4e76a5424781910$export$e08e3b67e392101e, b as $3e6197669829fe11$export$40bfa8c7b0832715, A as $e969f22b6713ca4a$export$ae780daf29e6d456, z as $0c4a58759813079a$export$4e328f61c538687f, h as $a049562f99e7db0e$export$f9c6924e160136d1, g as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $a049562f99e7db0e$export$eb2fcfdbd7ba97d4, a as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../chunks/Group.js";
|
|
11
|
-
import { a as $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7, $ as $2eb8e6d23f3d0cb0$export$a54013f0d02a8f82 } from "../chunks/I18nProvider.js";
|
|
12
10
|
import { $ as $ea3928288112382f$export$439d29a4e110a164, a as $ea3928288112382f$export$a966af930f325cab } from "../chunks/VisuallyHidden.js";
|
|
13
11
|
import __rspack_external_react_dom_7136dc57__default from "react-dom";
|
|
14
12
|
import { useService } from "@wix/services-manager-react";
|
|
@@ -17,7 +15,8 @@ import { T as TranslationsDefinition } from "../chunks/index5.js";
|
|
|
17
15
|
import { a as getDataAttributes } from "../chunks/dataUtils.js";
|
|
18
16
|
import { d as directionStyles } from "../chunks/direction.module.js";
|
|
19
17
|
import { p as presetWrapperStyles } from "../chunks/presetWrapper.module.js";
|
|
20
|
-
import { E as EMPTY_VALUE, T as TestIds, s as selectors, D as DesignStates, A as ARIA_LABEL_NAMESPACE, d as defaultValues, S as SelectionModeValues, G as GranularityValues, a as AriaLabels } from "../chunks/constants33.js";
|
|
18
|
+
import { E as EMPTY_VALUE, T as TestIds, s as selectors, D as DesignStates, A as ARIA_LABEL_NAMESPACE, d as defaultValues, S as SelectionModeValues, G as GranularityValues, V as VALUE_MISSING_MESSAGE, a as AriaLabels } from "../chunks/constants33.js";
|
|
19
|
+
import { R as RequiredIndicator } from "../chunks/RequiredIndicator.js";
|
|
21
20
|
import { I as InfoCircleSmall_default } from "../chunks/InfoCircleSmall.js";
|
|
22
21
|
import { D as DismissSmall_default } from "../chunks/DismissSmall.js";
|
|
23
22
|
createContext(null);
|
|
@@ -4236,6 +4235,7 @@ const group = "group__2UIvk";
|
|
|
4236
4235
|
const field = "field__lHZ2g";
|
|
4237
4236
|
const rangeSeparator = "rangeSeparator__jAkz-";
|
|
4238
4237
|
const description = "description__nmlkW";
|
|
4238
|
+
const errorMessage = "errorMessage__b9Pp3";
|
|
4239
4239
|
const segment = "segment__w-IAO";
|
|
4240
4240
|
const clearButton = "clearButton__NdcRh";
|
|
4241
4241
|
const clearIcon = "clearIcon__Klxmr";
|
|
@@ -4262,6 +4262,7 @@ const styles = {
|
|
|
4262
4262
|
field,
|
|
4263
4263
|
rangeSeparator,
|
|
4264
4264
|
description,
|
|
4265
|
+
errorMessage,
|
|
4265
4266
|
segment,
|
|
4266
4267
|
clearButton,
|
|
4267
4268
|
clearIcon,
|
|
@@ -4521,13 +4522,23 @@ const DatePickerTooltip = ({
|
|
|
4521
4522
|
const DatePickerLabel = ({
|
|
4522
4523
|
label: label2,
|
|
4523
4524
|
tooltip: tooltip2,
|
|
4525
|
+
required,
|
|
4524
4526
|
portalContainer
|
|
4525
4527
|
}) => {
|
|
4526
4528
|
if (!label2 && !tooltip2) {
|
|
4527
4529
|
return null;
|
|
4528
4530
|
}
|
|
4529
4531
|
return /* @__PURE__ */ jsxs("div", { className: styles.labelRow, children: [
|
|
4530
|
-
label2 ? /* @__PURE__ */
|
|
4532
|
+
label2 ? /* @__PURE__ */ jsxs($01b77f81d0f07f68$export$b04be29aa201d4f5, { className: clsx(styles.label, selectors.label), children: [
|
|
4533
|
+
label2,
|
|
4534
|
+
required && /* @__PURE__ */ jsx(
|
|
4535
|
+
RequiredIndicator,
|
|
4536
|
+
{
|
|
4537
|
+
className: selectors.requiredIndicator,
|
|
4538
|
+
"data-testid": TestIds.requiredIndicator
|
|
4539
|
+
}
|
|
4540
|
+
)
|
|
4541
|
+
] }) : null,
|
|
4531
4542
|
tooltip2 ? /* @__PURE__ */ jsx(DatePickerTooltip, { text: tooltip2, portalContainer }) : null
|
|
4532
4543
|
] });
|
|
4533
4544
|
};
|
|
@@ -4557,6 +4568,10 @@ function DatePicker2(props) {
|
|
|
4557
4568
|
onEndChange = noop,
|
|
4558
4569
|
onFocus = noop,
|
|
4559
4570
|
onBlur = noop,
|
|
4571
|
+
fieldValidity,
|
|
4572
|
+
showValidityIndication,
|
|
4573
|
+
onValidate,
|
|
4574
|
+
onValidityChange,
|
|
4560
4575
|
wix
|
|
4561
4576
|
} = props;
|
|
4562
4577
|
const label2 = readString(props.label);
|
|
@@ -4566,6 +4581,9 @@ function DatePicker2(props) {
|
|
|
4566
4581
|
const isRequired = readBool(props.required, defaultValues.required);
|
|
4567
4582
|
const isRange = selectionMode === SelectionModeValues.Range;
|
|
4568
4583
|
const withTime = granularity !== GranularityValues.Day;
|
|
4584
|
+
const isControlled = props.value !== void 0;
|
|
4585
|
+
const sourceValue = isControlled ? props.value : props.defaultValue;
|
|
4586
|
+
const sourceEndValue = isControlled ? props.endValue : props.defaultEndValue;
|
|
4569
4587
|
const {
|
|
4570
4588
|
dateValue,
|
|
4571
4589
|
rangeValue,
|
|
@@ -4573,12 +4591,34 @@ function DatePicker2(props) {
|
|
|
4573
4591
|
handleRangeChange,
|
|
4574
4592
|
hasValue
|
|
4575
4593
|
} = useDatePickerValue({
|
|
4576
|
-
value:
|
|
4577
|
-
endValue:
|
|
4594
|
+
value: sourceValue,
|
|
4595
|
+
endValue: sourceEndValue,
|
|
4578
4596
|
onChange,
|
|
4579
4597
|
onEndChange,
|
|
4580
4598
|
withTime
|
|
4581
4599
|
});
|
|
4600
|
+
const startStr = readString(props.value);
|
|
4601
|
+
const endStr = readString(props.endValue);
|
|
4602
|
+
const intrinsic = isRequired && !hasValue(isRange) ? { valid: false, validationMessage: VALUE_MISSING_MESSAGE } : { valid: true, validationMessage: "" };
|
|
4603
|
+
const {
|
|
4604
|
+
validity,
|
|
4605
|
+
showValidityIndication: showIndication,
|
|
4606
|
+
handleBlur: validateOnBlur
|
|
4607
|
+
} = useValidatedField({
|
|
4608
|
+
value: startStr,
|
|
4609
|
+
// Range change-detection keys on both endpoints; single is a plain string.
|
|
4610
|
+
valueKey: isRange ? `${startStr}|${endStr}` : startStr,
|
|
4611
|
+
intrinsic,
|
|
4612
|
+
fieldValidity,
|
|
4613
|
+
showValidityIndication,
|
|
4614
|
+
onValidate,
|
|
4615
|
+
onValidityChange
|
|
4616
|
+
});
|
|
4617
|
+
const isInvalid = showIndication && !validity.valid;
|
|
4618
|
+
const handleBlur = (event) => {
|
|
4619
|
+
onBlur(event);
|
|
4620
|
+
validateOnBlur();
|
|
4621
|
+
};
|
|
4582
4622
|
const { minValue, maxValue } = useDateConstraints({
|
|
4583
4623
|
minDate: props.minDate,
|
|
4584
4624
|
maxDate: props.maxDate,
|
|
@@ -4610,6 +4650,7 @@ function DatePicker2(props) {
|
|
|
4610
4650
|
{
|
|
4611
4651
|
label: label2,
|
|
4612
4652
|
tooltip: tooltip2,
|
|
4653
|
+
required: isRequired,
|
|
4613
4654
|
portalContainer
|
|
4614
4655
|
}
|
|
4615
4656
|
),
|
|
@@ -4622,6 +4663,14 @@ function DatePicker2(props) {
|
|
|
4622
4663
|
}
|
|
4623
4664
|
),
|
|
4624
4665
|
description2 ? /* @__PURE__ */ jsx($514c0188e459b4c0$export$5f1af8db9871e1d6, { slot: "description", className: styles.description, children: description2 }) : null,
|
|
4666
|
+
isInvalid && validity.validationMessage ? /* @__PURE__ */ jsx(
|
|
4667
|
+
$ee014567cb39d3f0$export$f551688fc98f2e09,
|
|
4668
|
+
{
|
|
4669
|
+
className: clsx(styles.errorMessage, selectors.errorMessage),
|
|
4670
|
+
"data-testid": TestIds.errorMessage,
|
|
4671
|
+
children: validity.validationMessage
|
|
4672
|
+
}
|
|
4673
|
+
) : null,
|
|
4625
4674
|
/* @__PURE__ */ jsx(DatePickerCalendar, { isRange, portalContainer })
|
|
4626
4675
|
] });
|
|
4627
4676
|
const sharedProps = {
|
|
@@ -4632,9 +4681,10 @@ function DatePicker2(props) {
|
|
|
4632
4681
|
isDisabled,
|
|
4633
4682
|
isReadOnly: readOnly,
|
|
4634
4683
|
isRequired,
|
|
4684
|
+
isInvalid,
|
|
4635
4685
|
"aria-label": ariaLabel,
|
|
4636
4686
|
onFocus,
|
|
4637
|
-
onBlur,
|
|
4687
|
+
onBlur: handleBlur,
|
|
4638
4688
|
isOpen: previewCalendarOpen || void 0
|
|
4639
4689
|
};
|
|
4640
4690
|
const pickerClassName = styles.datePicker;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
export declare const DatePickerLabel: ({ label, tooltip, portalContainer, }: {
|
|
2
|
+
export declare const DatePickerLabel: ({ label, tooltip, required, portalContainer, }: {
|
|
3
3
|
label: string;
|
|
4
4
|
tooltip: string;
|
|
5
|
+
required: boolean;
|
|
5
6
|
portalContainer: HTMLElement | null;
|
|
6
7
|
}) => React.JSX.Element | null;
|
|
@@ -4,6 +4,8 @@ export declare const DisplayNames: {
|
|
|
4
4
|
data: {
|
|
5
5
|
value: string;
|
|
6
6
|
endValue: string;
|
|
7
|
+
defaultValue: string;
|
|
8
|
+
defaultEndValue: string;
|
|
7
9
|
onEndChange: string;
|
|
8
10
|
selectionMode: {
|
|
9
11
|
displayName: string;
|
|
@@ -165,13 +167,19 @@ export declare const TestIds: {
|
|
|
165
167
|
readonly clearButton: "datepicker-clear-button";
|
|
166
168
|
readonly calendar: "datepicker-calendar";
|
|
167
169
|
readonly tooltipButton: "datepicker-tooltip-button";
|
|
170
|
+
readonly errorMessage: "datepicker-error-message";
|
|
171
|
+
readonly requiredIndicator: "datepicker-required-indicator";
|
|
168
172
|
};
|
|
169
173
|
export declare const selectors: {
|
|
170
174
|
readonly root: "datePicker";
|
|
171
175
|
readonly label: "datePicker__label";
|
|
176
|
+
readonly requiredIndicator: "datePicker__required-indicator";
|
|
172
177
|
readonly group: "datePicker__group";
|
|
173
178
|
readonly calendarButton: "datePicker__calendar-button";
|
|
174
179
|
readonly popover: "datePicker__popover";
|
|
175
180
|
readonly calendar: "datePicker__calendar";
|
|
176
181
|
readonly day: "datePicker__day";
|
|
182
|
+
readonly errorMessage: "datePicker__error-message";
|
|
177
183
|
};
|
|
184
|
+
/** Intrinsic `required` failure message (pre-resolved; i18n is a shared TODO). */
|
|
185
|
+
export declare const VALUE_MISSING_MESSAGE = "This field is required";
|
|
@@ -173,6 +173,11 @@
|
|
|
173
173
|
color: var(--description-text-color);
|
|
174
174
|
opacity: 0.7;
|
|
175
175
|
}
|
|
176
|
+
.errorMessage__b9Pp3 {
|
|
177
|
+
margin-top: 4px;
|
|
178
|
+
font: var(--description-font);
|
|
179
|
+
color: var(--errorColor, var(--wst-error-color, #e21c21));
|
|
180
|
+
}
|
|
176
181
|
.segment__w-IAO {
|
|
177
182
|
padding: 0 2px;
|
|
178
183
|
border-radius: 3px;
|
|
@@ -346,4 +351,12 @@
|
|
|
346
351
|
}
|
|
347
352
|
.presetWrapper__J1yzj {
|
|
348
353
|
display: contents;
|
|
354
|
+
}
|
|
355
|
+
.requiredIndicator__j5mIH {
|
|
356
|
+
display: inline-block;
|
|
357
|
+
width: 0.6em;
|
|
358
|
+
height: 0.6em;
|
|
359
|
+
margin-inline-start: 0.2em;
|
|
360
|
+
vertical-align: super;
|
|
361
|
+
color: inherit;
|
|
349
362
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { DateValue } from 'react-aria-components';
|
|
2
2
|
import { DatePickerProps, DateRangeValue } from '../DatePicker.types';
|
|
3
3
|
export declare const useDatePickerValue: (params: {
|
|
4
|
-
value: DatePickerProps["value"];
|
|
4
|
+
value: DatePickerProps["value"] | undefined;
|
|
5
5
|
endValue: DatePickerProps["endValue"];
|
|
6
6
|
onChange: NonNullable<DatePickerProps["onChange"]>;
|
|
7
7
|
onEndChange: NonNullable<DatePickerProps["onEndChange"]>;
|
|
@@ -3,6 +3,7 @@ import { D as DesignStates, P as PREVIEW_CALENDAR_OPEN, b as DisplayNames, d as
|
|
|
3
3
|
import { w as withSpec, g as getSelector } from "../chunks/manifest.js";
|
|
4
4
|
import { I as IS_SUPPORT_DESIGN_STATE_SPEC } from "../chunks/specs.js";
|
|
5
5
|
import { m as manifestFocusable, a as manifestChangeable } from "../chunks/manifestSdkMixins.js";
|
|
6
|
+
import { m as manifestValidation } from "../chunks/manifest2.js";
|
|
6
7
|
import { D as DomEventType } from "../chunks/types.impl.js";
|
|
7
8
|
const cssProperties = {
|
|
8
9
|
font: {},
|
|
@@ -162,6 +163,14 @@ const manifest = {
|
|
|
162
163
|
dataType: DATA.DATA_TYPE.text,
|
|
163
164
|
displayName: DisplayNames.root.data.endValue
|
|
164
165
|
},
|
|
166
|
+
defaultValue: {
|
|
167
|
+
dataType: DATA.DATA_TYPE.text,
|
|
168
|
+
displayName: DisplayNames.root.data.defaultValue
|
|
169
|
+
},
|
|
170
|
+
defaultEndValue: {
|
|
171
|
+
dataType: DATA.DATA_TYPE.text,
|
|
172
|
+
displayName: DisplayNames.root.data.defaultEndValue
|
|
173
|
+
},
|
|
165
174
|
selectionMode: {
|
|
166
175
|
dataType: DATA.DATA_TYPE.textEnum,
|
|
167
176
|
displayName: DisplayNames.root.data.selectionMode.displayName,
|
|
@@ -288,7 +297,9 @@ const manifest = {
|
|
|
288
297
|
parameters: [{ domEvent: DomEventType.CHANGE }]
|
|
289
298
|
}
|
|
290
299
|
},
|
|
291
|
-
...manifestFocusable()
|
|
300
|
+
...manifestFocusable(),
|
|
301
|
+
// The bound value is an ISO date string, so `onValidate` carries text.
|
|
302
|
+
...manifestValidation({ valueDataType: DATA.DATA_TYPE.text })
|
|
292
303
|
},
|
|
293
304
|
displayGroups: {
|
|
294
305
|
orderedDataGroup: {
|
|
@@ -4,7 +4,7 @@ var __publicField = (obj, key2, value2) => __defNormalProp(obj, typeof key2 !==
|
|
|
4
4
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
import { c as clsx } from "../chunks/clsx.js";
|
|
6
6
|
import { d as directionStyles } from "../chunks/direction.module.js";
|
|
7
|
-
import { B as Button } from "../chunks/
|
|
7
|
+
import { B as Button } from "../chunks/Button.js";
|
|
8
8
|
import { s as semanticSelectors, r as rootDataDefaults, d as displayPropertyToObserve, a as ariaLabels, t as testIds, p as pauseIconSvg, b as playIconSvg, c as showButtonOnHoverDefaults } from "../chunks/constants27.js";
|
|
9
9
|
import { g as getDefaultExportFromCjs } from "../chunks/_commonjsHelpers.js";
|
|
10
10
|
import React__default, { useEffect, useState, useRef, useMemo } from "react";
|
|
@@ -16,7 +16,7 @@ import { u as useResizeObserver } from "../chunks/useResizeObserver.js";
|
|
|
16
16
|
import { d as directionStyles } from "../chunks/direction.module.js";
|
|
17
17
|
import { E as EnvironmentDefinition } from "../chunks/index2.js";
|
|
18
18
|
import AnimatedIconWithReducedMotion from "../AnimatedIcon/component.js";
|
|
19
|
-
import { B as Button } from "../chunks/
|
|
19
|
+
import { B as Button } from "../chunks/Button.js";
|
|
20
20
|
import { f as convertA11yKeysToHtmlFormat } from "../chunks/a11y.js";
|
|
21
21
|
const AnchorsDefinition = defineService("@wix/viewer-service-anchors");
|
|
22
22
|
const EMPTY_ANCHOR_URL = "#";
|
|
@@ -2,7 +2,7 @@ import { jsxs, jsx, Fragment } from "react/jsx-runtime";
|
|
|
2
2
|
import { useState, useRef, useEffect, useCallback, useMemo } from "react";
|
|
3
3
|
import { c as clsx } from "../chunks/clsx.js";
|
|
4
4
|
import { M as MOVEMENT_DIRECTION, A as AUTOPLAY_STATE, s as slideshowDataDefaults, a as semanticClassNames, S as SLIDESHOW_SLIDE_LTR_DIRECTION_EXPERIMENT } from "../chunks/Slideshow.semanticClassNames.js";
|
|
5
|
-
import { B as Button } from "../chunks/
|
|
5
|
+
import { B as Button } from "../chunks/Button.js";
|
|
6
6
|
import { p as presetWrapperStyles } from "../chunks/presetWrapper.module.js";
|
|
7
7
|
import { d as directionStyles } from "../chunks/direction.module.js";
|
|
8
8
|
import { useService } from "@wix/services-manager-react";
|
|
@@ -17,6 +17,7 @@ import { ErrorMessageType, ViewerTranslations } from '../../../types/vendored/ed
|
|
|
17
17
|
import { IValidationControllerProps } from '../../../utils/controllerUtils';
|
|
18
18
|
import { LogicalAlignment, PhysicalAlignment, WithInherit } from '../../../utils/direction.types';
|
|
19
19
|
import { InlineErrorMessageTranslationKeys } from '../../../common/InlineErrorMessage/InlineErrorMessage';
|
|
20
|
+
import { FieldValidationProps } from '../../../utils/validation/types';
|
|
20
21
|
import type * as React from 'react';
|
|
21
22
|
type ResolverType = 'scale' | 'fixed';
|
|
22
23
|
type Spx = {
|
|
@@ -24,7 +25,7 @@ type Spx = {
|
|
|
24
25
|
resolverType: ResolverType;
|
|
25
26
|
};
|
|
26
27
|
export type ITextInputImperativeActions = IFocusPropsImperativeActions & IValidationPropsImperativeActions;
|
|
27
|
-
export type ITextInputProps = ITextInputMapperProps & DefaultCompPlatformProps & IValidationPropSDKProps & IChangePropsSDKActions<HTMLInputElement> & Partial<ITextInputPropsSDKActions<HTMLInputElement>> & Partial<IFocusPropsSDKActions> & Partial<IClickPropsSDKActions> & Partial<IValidationPropsSDKActions<ITextInputProps>> & Partial<IElementPropsSDKActions> & Partial<HydrationSDKAction> & ITextInputControllerProps & IAccessibilityPropSDKProps & {
|
|
28
|
+
export type ITextInputProps = ITextInputMapperProps & DefaultCompPlatformProps & IValidationPropSDKProps & FieldValidationProps<string> & IChangePropsSDKActions<HTMLInputElement> & Partial<ITextInputPropsSDKActions<HTMLInputElement>> & Partial<IFocusPropsSDKActions> & Partial<IClickPropsSDKActions> & Partial<IValidationPropsSDKActions<ITextInputProps>> & Partial<IElementPropsSDKActions> & Partial<HydrationSDKAction> & ITextInputControllerProps & IAccessibilityPropSDKProps & {
|
|
28
29
|
ref?: React.Ref<ITextInputImperativeActions>;
|
|
29
30
|
autoFocus?: boolean;
|
|
30
31
|
className?: string;
|
|
@@ -73,6 +74,7 @@ export type TextInputAutocomplete = 'on' | 'off';
|
|
|
73
74
|
export type ITextInputMapperProps = {
|
|
74
75
|
skin: TextInputSkin;
|
|
75
76
|
value: string;
|
|
77
|
+
defaultValue?: string;
|
|
76
78
|
inputType: TextInputType;
|
|
77
79
|
label?: string;
|
|
78
80
|
placeholder?: string;
|