@wix/patterns-fields 1.113.0 → 1.115.0

package/src/components/date-input/date-picker-internals.ts

@@ -1,4 +1,6 @@
-import type { KeyboardEvent, RefObject } from 'react';
+import { createElement } from 'react';
+import type { KeyboardEvent, ReactElement, RefObject } from 'react';
+import { Input } from '@wix/design-system';
 import type { DatePicker, InputProps } from '@wix/design-system';
 
 /**
@@ -28,6 +30,8 @@ type DatePickerWithInternals = DatePicker & {
 // `onChange` and `onKeyDown` as DOM event handlers, so it can't hold these.
 type DateInputHandlers = {
   onChange: (change: { dateVal: Date }) => void;
+  onClear: NonNullable<DatePicker['props']['onClear']>;
+  customInput: ReactElement;
   onKeyDown: (event: KeyboardEvent, date: Date | null) => void;
 };
 
@@ -69,13 +73,17 @@ export const onSameDayCalendarPick = (
 const isValidDate = (date: Date | null): date is Date =>
   date !== null && !isNaN(date.getTime());
 
-// WDS parses empty input text as today. These `inputProps` handlers report an
-// emptied input through `onEmpty` and Enter on it through `onEmptyEnter`
-// instead, send typed dates to `onType` when it is given (the picker's
-// `onChange` otherwise), and Enter on a typed date to `onEnter`. An event
-// without its callback goes to the picker as before. Calendar picks don't go
-// through them.
-// WDS thread: https://wix.slack.com/archives/C39FTGUBZ/p1790691851370229
+// WDS shows a clear button whenever onClear is set, including when it is
+// used only to receive empty-input events. Keep the button opt-in for cells.
+const DatePickerInput = ({ clearButton, onClear, ...props }: InputProps) =>
+  createElement(Input, {
+    ...props,
+    clearButton,
+    onClear: clearButton ? onClear : undefined,
+  });
+
+// DateInput reports typed empty values through onClear in newer WDS versions.
+// Keep onChange's empty guard for consumers using older WDS versions.
 export const typedDateInputProps = ({
   picker,
   input,
@@ -98,6 +106,14 @@ export const typedDateInputProps = ({
     closeDatePickerCalendar(picker.current);
   };
   const handlers: DateInputHandlers = {
+    customInput: createElement(DatePickerInput),
+    onClear: (event) => {
+      if (onEmpty && event.type === 'change') {
+        onEmpty();
+        return;
+      }
+      picker.current?.props.onClear?.(event);
+    },
     onChange: (change) => {
       if (onEmpty && isEmpty()) {
         onEmpty();

package/src/components/delete-dialog/delete-dialog.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "deletedialog644217855";
+var _namespace_ = "deletedialog1855184990";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"deletedialog644217855__root","layout":"deletedialog644217855__layout"};
+export var classes = {"root":"deletedialog1855184990__root","layout":"deletedialog1855184990__layout"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/document/form-document-field.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "formdocumentfield600942549";
+var _namespace_ = "formdocumentfield627803899";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"formdocumentfield600942549__root","viewWrapper":"formdocumentfield600942549__viewWrapper","textWidth":"formdocumentfield600942549__textWidth","documentLoader":"formdocumentfield600942549__documentLoader","addDocument":"formdocumentfield600942549__addDocument","addItemWrapper":"formdocumentfield600942549__addItemWrapper"};
+export var classes = {"root":"formdocumentfield627803899__root","viewWrapper":"formdocumentfield627803899__viewWrapper","textWidth":"formdocumentfield627803899__textWidth","documentLoader":"formdocumentfield627803899__documentLoader","addDocument":"formdocumentfield627803899__addDocument","addItemWrapper":"formdocumentfield627803899__addItemWrapper"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/exclamation/exclamation.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "exclamation297875390";
+var _namespace_ = "exclamation3475387339";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"exclamation297875390__root","exclamation":"exclamation297875390__exclamation","actions":"exclamation297875390__actions","action":"exclamation297875390__action"};
+export var classes = {"root":"exclamation3475387339__root","exclamation":"exclamation3475387339__exclamation","actions":"exclamation3475387339__actions","action":"exclamation3475387339__action"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/field-validation-settings/field-validation-settings-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "fieldvalidationsettingsinput3420616655";
+var _namespace_ = "fieldvalidationsettingsinput1248219727";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"fieldvalidationsettingsinput3420616655__root","specificValuesInput":"fieldvalidationsettingsinput3420616655__specificValuesInput"};
+export var classes = {"root":"fieldvalidationsettingsinput1248219727__root","specificValuesInput":"fieldvalidationsettingsinput1248219727__specificValuesInput"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/highlighted-text/highlighted-text.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "highlightedtext956603166";
+var _namespace_ = "highlightedtext2620701715";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,8 +13,8 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"highlightedtext956603166__root","substring":"highlightedtext956603166__substring"};
-export var keyframes = {"highlighted":"highlightedtext956603166__highlighted","highlighted-match":"highlightedtext956603166__highlighted-match"}; 
+export var classes = {"root":"highlightedtext2620701715__root","substring":"highlightedtext2620701715__substring"};
+export var keyframes = {"highlighted":"highlightedtext2620701715__highlighted","highlighted-match":"highlightedtext2620701715__highlighted-match"}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 

package/src/components/image/thumbnail-replace-overlay.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "thumbnailreplaceoverlay3606587190";
+var _namespace_ = "thumbnailreplaceoverlay1352123798";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"thumbnailreplaceoverlay3606587190__root","icon":"thumbnailreplaceoverlay3606587190__icon"};
+export var classes = {"root":"thumbnailreplaceoverlay1352123798__root","icon":"thumbnailreplaceoverlay1352123798__icon"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-control/cell-media-edit-shell.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellmediaeditshell1208112184";
+var _namespace_ = "cellmediaeditshell2355752670";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellmediaeditshell1208112184__root"};
+export var classes = {"root":"cellmediaeditshell2355752670__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-control/paste-url-button.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "pasteurlbutton3361801639";
+var _namespace_ = "pasteurlbutton3327095583";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"pasteurlbutton3361801639__root","iconButtonTooltip":"pasteurlbutton3361801639__iconButtonTooltip","iconButton":"pasteurlbutton3361801639__iconButton"};
+export var classes = {"root":"pasteurlbutton3327095583__root","iconButtonTooltip":"pasteurlbutton3327095583__iconButtonTooltip","iconButton":"pasteurlbutton3327095583__iconButton"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-gallery/form-media-gallery-field.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "formmediagalleryfield167056594";
+var _namespace_ = "formmediagalleryfield1913190078";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"formmediagalleryfield167056594__root","container":"formmediagalleryfield167056594__container","viewBox":"formmediagalleryfield167056594__viewBox","addItemWrapper":"formmediagalleryfield167056594__addItemWrapper","addItem":"formmediagalleryfield167056594__addItem","overlay":"formmediagalleryfield167056594__overlay","image":"formmediagalleryfield167056594__image","previewImage":"formmediagalleryfield167056594__previewImage","previewVideo":"formmediagalleryfield167056594__previewVideo"};
+export var classes = {"root":"formmediagalleryfield1913190078__root","container":"formmediagalleryfield1913190078__container","viewBox":"formmediagalleryfield1913190078__viewBox","addItemWrapper":"formmediagalleryfield1913190078__addItemWrapper","addItem":"formmediagalleryfield1913190078__addItem","overlay":"formmediagalleryfield1913190078__overlay","image":"formmediagalleryfield1913190078__image","previewImage":"formmediagalleryfield1913190078__previewImage","previewVideo":"formmediagalleryfield1913190078__previewVideo"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-image/media-image.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "mediaimage3684956147";
+var _namespace_ = "mediaimage3055775166";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,12 +13,12 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"mediaimage3684956147__root"};
+export var classes = {"root":"mediaimage3055775166__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {"wds-color-red-200":"--wds-color-red-200","wsr-color-R20":"--wsr-color-R20","wds-color-black-550":"--wds-color-black-550","wsr-color-D55":"--wsr-color-D55","from":"--mediaimage3684956147-from","to":"--mediaimage3684956147-to"}; 
+export var vars = {"wds-color-red-200":"--wds-color-red-200","wsr-color-R20":"--wsr-color-R20","wds-color-black-550":"--wds-color-black-550","wsr-color-D55":"--wsr-color-D55","from":"--mediaimage3055775166-from","to":"--mediaimage3055775166-to"}; 
 
 
 

package/src/components/media-image/overlays/overlay.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "overlay2682897818";
+var _namespace_ = "overlay3480378917";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"overlay2682897818__root","iconOverlay":"overlay2682897818__iconOverlay"};
+export var classes = {"root":"overlay3480378917__root","iconOverlay":"overlay3480378917__iconOverlay"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/media-tag/web-media-tag/media-tag.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "mediatag175843951";
+var _namespace_ = "mediatag2220604844";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"mediatag175843951__root"};
+export var classes = {"root":"mediatag2220604844__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/multi-document/cell-multi-document-edit.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellmultidocumentedit2956366936";
+var _namespace_ = "cellmultidocumentedit1430636138";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellmultidocumentedit2956366936__root","chipTrigger":"cellmultidocumentedit2956366936__chipTrigger"};
+export var classes = {"root":"cellmultidocumentedit1430636138__root","chipTrigger":"cellmultidocumentedit1430636138__chipTrigger"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/multi-document/multi-document-input/form-multi-document.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../stylable-esm-runtime.js"
 
 
 
-var _namespace_ = "formmultidocument3508158227";
+var _namespace_ = "formmultidocument20977685";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"formmultidocument3508158227__root","viewRoot":"formmultidocument3508158227__viewRoot","singleViewWrapper":"formmultidocument3508158227__singleViewWrapper","addDocumentButton":"formmultidocument3508158227__addDocumentButton"};
+export var classes = {"root":"formmultidocument20977685__root","viewRoot":"formmultidocument20977685__viewRoot","singleViewWrapper":"formmultidocument20977685__singleViewWrapper","addDocumentButton":"formmultidocument20977685__addDocumentButton"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/reference/cell-multi-reference-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellmultireferenceinput1231369098";
+var _namespace_ = "cellmultireferenceinput120257027";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellmultireferenceinput1231369098__root"};
+export var classes = {"root":"cellmultireferenceinput120257027__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/reference/cell-reference-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "cellreferenceinput3745983882";
+var _namespace_ = "cellreferenceinput2523903401";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"cellreferenceinput3745983882__root","autocomplete":"cellreferenceinput3745983882__autocomplete"};
+export var classes = {"root":"cellreferenceinput2523903401__root","autocomplete":"cellreferenceinput2523903401__autocomplete"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/default-value-input/rich-content-default-value-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentdefaultvalueinput235055491";
+var _namespace_ = "richcontentdefaultvalueinput623308326";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentdefaultvalueinput235055491__root","richContentEditorContainer":"richcontentdefaultvalueinput235055491__richContentEditorContainer","editor":"richcontentdefaultvalueinput235055491__editor"};
+export var classes = {"root":"richcontentdefaultvalueinput623308326__root","richContentEditorContainer":"richcontentdefaultvalueinput623308326__richContentEditorContainer","editor":"richcontentdefaultvalueinput623308326__editor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/form-input/rich-content-form-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentforminput2080328703";
+var _namespace_ = "richcontentforminput3167814478";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentforminput2080328703__root","editor":"richcontentforminput2080328703__editor"};
+export var classes = {"root":"richcontentforminput3167814478__root","editor":"richcontentforminput3167814478__editor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/form-read-only-input/rich-content-form-read-only-input.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentformreadonlyinput2764620063";
+var _namespace_ = "richcontentformreadonlyinput2535068086";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentformreadonlyinput2764620063__root"};
+export var classes = {"root":"richcontentformreadonlyinput2535068086__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-common/fullscreen-modal/fullscreen-modal.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "fullscreenmodal2520154404";
+var _namespace_ = "fullscreenmodal401561617";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"fullscreenmodal2520154404__root","modalContent":"fullscreenmodal2520154404__modalContent"};
+export var classes = {"root":"fullscreenmodal401561617__root","modalContent":"fullscreenmodal401561617__modalContent"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-common/publish-loader/publish-loader.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "publishloader101836242";
+var _namespace_ = "publishloader352336245";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"publishloader101836242__root","publishLoader":"publishloader101836242__publishLoader"};
+export var classes = {"root":"publishloader352336245__root","publishLoader":"publishloader352336245__publishLoader"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-common/toggle-fullscreen-button/toggle-fullscreen-button.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "togglefullscreenbutton1200396578";
+var _namespace_ = "togglefullscreenbutton3212433365";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"togglefullscreenbutton1200396578__root"};
+export var classes = {"root":"togglefullscreenbutton3212433365__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-editor/rich-content-editor.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontenteditor2848990366";
+var _namespace_ = "richcontenteditor4157874540";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontenteditor2848990366__root","toolbarContainer":"richcontenteditor2848990366__toolbarContainer","footerToolbarContainer":"richcontenteditor2848990366__footerToolbarContainer","toolbarAndFullScreenButtonWrapper":"richcontenteditor2848990366__toolbarAndFullScreenButtonWrapper","editor":"richcontenteditor2848990366__editor","modalEditor":"richcontenteditor2848990366__modalEditor"};
+export var classes = {"root":"richcontenteditor4157874540__root","toolbarContainer":"richcontenteditor4157874540__toolbarContainer","footerToolbarContainer":"richcontenteditor4157874540__footerToolbarContainer","toolbarAndFullScreenButtonWrapper":"richcontenteditor4157874540__toolbarAndFullScreenButtonWrapper","editor":"richcontenteditor4157874540__editor","modalEditor":"richcontenteditor4157874540__modalEditor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-editor/rich-content-toolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontenttoolbar1754261476";
+var _namespace_ = "richcontenttoolbar3455448276";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontenttoolbar1754261476__root","toolbar":"richcontenttoolbar1754261476__toolbar","toolbarButton":"richcontenttoolbar1754261476__toolbarButton","separator":"richcontenttoolbar1754261476__separator"};
+export var classes = {"root":"richcontenttoolbar3455448276__root","toolbar":"richcontenttoolbar3455448276__toolbar","toolbarButton":"richcontenttoolbar3455448276__toolbarButton","separator":"richcontenttoolbar3455448276__separator"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-content/rich-content-input/rich-content-viewer/rich-content-viewer.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richcontentviewer557136884";
+var _namespace_ = "richcontentviewer1023980608";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richcontentviewer557136884__root","viewer":"richcontentviewer557136884__viewer","modalViewer":"richcontentviewer557136884__modalViewer"};
+export var classes = {"root":"richcontentviewer1023980608__root","viewer":"richcontentviewer1023980608__viewer","modalViewer":"richcontentviewer1023980608__modalViewer"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-text/rich-text-input/rich-text-editor/rich-editor.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richeditor1640050632";
+var _namespace_ = "richeditor2930640007";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richeditor1640050632__root","editor":"richeditor1640050632__editor","header-one":"richeditor1640050632__header-one","header-two":"richeditor1640050632__header-two","header-three":"richeditor1640050632__header-three","header-four":"richeditor1640050632__header-four","header-five":"richeditor1640050632__header-five","header-six":"richeditor1640050632__header-six","paragraph-one":"richeditor1640050632__paragraph-one","unstyled":"richeditor1640050632__unstyled","paragraph-three":"richeditor1640050632__paragraph-three","align-left":"richeditor1640050632__align-left","align-right":"richeditor1640050632__align-right","align-center":"richeditor1640050632__align-center","align-justify":"richeditor1640050632__align-justify","withMargin":"richeditor1640050632__withMargin","dir-rtl":"richeditor1640050632__dir-rtl"};
+export var classes = {"root":"richeditor2930640007__root","editor":"richeditor2930640007__editor","header-one":"richeditor2930640007__header-one","header-two":"richeditor2930640007__header-two","header-three":"richeditor2930640007__header-three","header-four":"richeditor2930640007__header-four","header-five":"richeditor2930640007__header-five","header-six":"richeditor2930640007__header-six","paragraph-one":"richeditor2930640007__paragraph-one","unstyled":"richeditor2930640007__unstyled","paragraph-three":"richeditor2930640007__paragraph-three","align-left":"richeditor2930640007__align-left","align-right":"richeditor2930640007__align-right","align-center":"richeditor2930640007__align-center","align-justify":"richeditor2930640007__align-justify","withMargin":"richeditor2930640007__withMargin","dir-rtl":"richeditor2930640007__dir-rtl"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-text/rich-text-input/rich-text-editor/rich-text-editor.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../stylable-esm-runtime.
 
 
 
-var _namespace_ = "richtexteditor170303648";
+var _namespace_ = "richtexteditor2715691568";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"richtexteditor170303648__root","nativeInput":"richtexteditor170303648__nativeInput","editor":"richtexteditor170303648__editor"};
+export var classes = {"root":"richtexteditor2715691568__root","nativeInput":"richtexteditor2715691568__nativeInput","editor":"richtexteditor2715691568__editor"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/rich-text/rich-text-input/rich-text-editor/toolbar/toolbar.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../../../../stylable-esm-runti
 
 
 
-var _namespace_ = "toolbar2427989604";
+var _namespace_ = "toolbar4183030958";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"toolbar2427989604__root","item":"toolbar2427989604__item","separator":"toolbar2427989604__separator","clearFormatting":"toolbar2427989604__clearFormatting","fullScreen":"toolbar2427989604__fullScreen","dropdownItemContent":"toolbar2427989604__dropdownItemContent","dropdownItemTitle":"toolbar2427989604__dropdownItemTitle","dropdownItemSubtitle":"toolbar2427989604__dropdownItemSubtitle","dropdownHeaderOne":"toolbar2427989604__dropdownHeaderOne","dropdownHeaderTwo":"toolbar2427989604__dropdownHeaderTwo","dropdownHeaderThree":"toolbar2427989604__dropdownHeaderThree","dropdownHeaderFour":"toolbar2427989604__dropdownHeaderFour","dropdownHeaderFive":"toolbar2427989604__dropdownHeaderFive","dropdownHeaderSix":"toolbar2427989604__dropdownHeaderSix","dropdownParagraphOne":"toolbar2427989604__dropdownParagraphOne","dropdownNormalText":"toolbar2427989604__dropdownNormalText","dropdownParagraphThree":"toolbar2427989604__dropdownParagraphThree"};
+export var classes = {"root":"toolbar4183030958__root","item":"toolbar4183030958__item","separator":"toolbar4183030958__separator","clearFormatting":"toolbar4183030958__clearFormatting","fullScreen":"toolbar4183030958__fullScreen","dropdownItemContent":"toolbar4183030958__dropdownItemContent","dropdownItemTitle":"toolbar4183030958__dropdownItemTitle","dropdownItemSubtitle":"toolbar4183030958__dropdownItemSubtitle","dropdownHeaderOne":"toolbar4183030958__dropdownHeaderOne","dropdownHeaderTwo":"toolbar4183030958__dropdownHeaderTwo","dropdownHeaderThree":"toolbar4183030958__dropdownHeaderThree","dropdownHeaderFour":"toolbar4183030958__dropdownHeaderFour","dropdownHeaderFive":"toolbar4183030958__dropdownHeaderFive","dropdownHeaderSix":"toolbar4183030958__dropdownHeaderSix","dropdownParagraphOne":"toolbar4183030958__dropdownParagraphOne","dropdownNormalText":"toolbar4183030958__dropdownNormalText","dropdownParagraphThree":"toolbar4183030958__dropdownParagraphThree"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/src/components/text/text-view.st.css.ts

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "textview1239472612";
+var _namespace_ = "textview173077726";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style: import("@stylable/runtime").STFunction = _style_;
 export var st: import("@stylable/runtime").STFunction = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"textview1239472612__root","textView":"textview1239472612__textView"};
+export var classes = {"root":"textview173077726__root","textView":"textview173077726__textView"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};