@wix/patterns-fields 1.123.0 → 1.125.0

package/dist/cjs/components/media-gallery/media-preview-modal.js

@@ -27,6 +27,7 @@ const MediaPreviewModal = ({
   return /*#__PURE__*/_react.default.createElement(_designSystem.Modal, {
     isOpen: true,
     screen: "full",
+    onRequestClose: onClose,
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
@@ -142,6 +143,7 @@ const MediaPreviewLayout = ({
           columnNumber: 27
         }
       }),
+      dataHook: "preview-modal-replace-button",
       onClick: onReplace,
       disabled: readOnly,
       __self: void 0,
@@ -155,7 +157,7 @@ const MediaPreviewLayout = ({
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 153,
+        lineNumber: 154,
         columnNumber: 13
       }
     }, /*#__PURE__*/_react.default.createElement(_designSystem.Tooltip, {
@@ -163,7 +165,7 @@ const MediaPreviewLayout = ({
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 154,
+        lineNumber: 155,
         columnNumber: 15
       }
     }, /*#__PURE__*/_react.default.createElement(_designSystem.IconButton, {
@@ -175,14 +177,14 @@ const MediaPreviewLayout = ({
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 155,
+        lineNumber: 156,
         columnNumber: 17
       }
     }, /*#__PURE__*/_react.default.createElement(_lazy.Delete, {
       __self: void 0,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 162,
+        lineNumber: 163,
         columnNumber: 19
       }
     }))))),
@@ -199,7 +201,7 @@ const MediaPreviewLayout = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 172,
+      lineNumber: 173,
       columnNumber: 9
     }
   })));
@@ -220,7 +222,7 @@ const MediaPreviewItem = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 191,
+      lineNumber: 192,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement(_designSystem.Loader, {
@@ -228,7 +230,7 @@ const MediaPreviewItem = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 192,
+      lineNumber: 193,
       columnNumber: 11
     }
   })), (0, _autoFieldTypes.isMediaVideoURI)(src) ? /*#__PURE__*/_react.default.createElement("video", {
@@ -245,7 +247,7 @@ const MediaPreviewItem = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 196,
+      lineNumber: 197,
       columnNumber: 9
     }
   }, /*#__PURE__*/_react.default.createElement("source", {
@@ -253,7 +255,7 @@ const MediaPreviewItem = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 206,
+      lineNumber: 207,
       columnNumber: 11
     }
   })) : /*#__PURE__*/_react.default.createElement(_designSystem.Image, {
@@ -266,7 +268,7 @@ const MediaPreviewItem = ({
     __self: void 0,
     __source: {
       fileName: _jsxFileName,
-      lineNumber: 209,
+      lineNumber: 210,
       columnNumber: 9
     }
   }));

package/dist/cjs/components/media-gallery/media-preview-modal.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_designSystem","_lazy","_autoFieldTypes","_hooks","_formMediaGalleryFieldStCss","_utils","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","MediaPreviewModal","isOpen","onClose","value","onRequestMedia","onClearMedia","onDownloadMedia","textKeys","readOnly","createElement","Modal","screen","__self","__source","fileName","lineNumber","columnNumber","MediaPreviewLayout","src","onDownload","onClear","onReplace","exports","useTranslations","sources","useMemo","Array","isArray","current","setCurrent","useState","title","getMediaTitle","handleDownload","useCallback","length","prevButtonProps","tooltipText","onClick","prevIndex","nextButtonProps","nextIndex","handleClear","ModalPreviewLayout","actions","Box","verticalAlign","marginRight","TextButton","size","skin","prefixIcon","DownloadImport","download","Button","priority","Replace","disabled","replace","Tooltip","content","delete","IconButton","Delete","map","mediaSrc","MediaPreviewItem","key","loading","setLoading","useEffect","onLoad","previewURL","mediaURItoImageURL","window","innerWidth","Fragment","align","width","height","Loader","isMediaVideoURI","style","display","poster","onLoadedData","controls","className","classes","previewVideo","autoPlay","loop","muted","convertMediaURIToPreviewVideoURL","Image","previewImage"],"sources":["../../../../src/components/media-gallery/media-preview-modal.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState, useEffect } from 'react';\nimport type { NextButtonProps, PrevButtonProps } from '@wix/design-system';\nimport {\n  Box,\n  Button,\n  IconButton,\n  Image,\n  Loader,\n  Modal,\n  ModalPreviewLayout,\n  TextButton,\n  Tooltip,\n} from '@wix/design-system';\nimport {\n  Replace,\n  DownloadImport as Download,\n  Delete,\n} from '@wix/wix-ui-icons-common/lazy';\nimport {\n  getMediaTitle,\n  isMediaVideoURI,\n  mediaURItoImageURL,\n} from '../../auto-field-types';\nimport { useTranslations } from '../../hooks';\nimport type { TranslationsKeys } from '../../services/translations';\n\nimport { classes } from './form-media-gallery-field.st.css.js';\nimport { convertMediaURIToPreviewVideoURL } from './media-gallery-dialog/utils';\n\nexport interface MediaPreviewLayoutTextKeys {\n  replace: TranslationsKeys;\n  download: TranslationsKeys;\n  delete: TranslationsKeys;\n}\n\nexport interface MediaPreviewProps {\n  isOpen: boolean;\n  onClose: () => void;\n  onRequestMedia: () => void;\n  onClearMedia?: () => void;\n  onDownloadMedia: (value?: string) => void;\n  textKeys: MediaPreviewLayoutTextKeys;\n  value?: string | string[];\n  readOnly?: boolean;\n}\n\nexport const MediaPreviewModal: React.FC<MediaPreviewProps> = ({\n  isOpen,\n  onClose,\n  value,\n  onRequestMedia,\n  onClearMedia,\n  onDownloadMedia,\n  textKeys,\n  readOnly,\n}) => {\n  if (!isOpen || !value) {\n    return null;\n  }\n\n  return (\n    <Modal isOpen screen=\"full\">\n      <MediaPreviewLayout\n        src={value}\n        onClose={onClose}\n        textKeys={textKeys}\n        onDownload={onDownloadMedia}\n        onClear={onClearMedia}\n        onReplace={onRequestMedia}\n        readOnly={readOnly}\n      />\n    </Modal>\n  );\n};\n\ninterface MediaPreviewLayoutProps {\n  src: string[] | string;\n  onClose: () => void;\n  textKeys: MediaPreviewLayoutTextKeys;\n  onReplace?: () => void;\n  onClear?: () => void;\n  onDownload?: (src?: string) => void;\n  readOnly?: boolean;\n}\n\nconst MediaPreviewLayout: React.FC<MediaPreviewLayoutProps> = ({\n  src,\n  onClose,\n  textKeys,\n  onDownload,\n  onReplace,\n  onClear,\n  readOnly,\n}) => {\n  const { t } = useTranslations();\n  const sources = useMemo(() => (Array.isArray(src) ? src : [src]), [src]);\n  const [current, setCurrent] = useState(sources[0]);\n  const title = getMediaTitle(current);\n\n  const handleDownload = useCallback(() => {\n    if (sources.length > 1) {\n      onDownload?.(current);\n    } else {\n      onDownload?.();\n    }\n  }, [sources, onDownload, current]);\n\n  const prevButtonProps = {\n    tooltipText: t('CMS.mediaGallery.preview.previousItem'),\n    onClick: (prevIndex: number) => setCurrent(sources[prevIndex]),\n  } as PrevButtonProps;\n\n  const nextButtonProps = {\n    tooltipText: t('CMS.mediaGallery.preview.nextItem'),\n    onClick: (nextIndex: number) => setCurrent(sources[nextIndex]),\n  } as NextButtonProps;\n\n  const handleClear = useCallback(() => {\n    onClear?.();\n    onClose();\n  }, [onClear, onClose]);\n\n  return (\n    <ModalPreviewLayout\n      title={title}\n      prevButtonProps={prevButtonProps}\n      nextButtonProps={nextButtonProps}\n      actions={\n        <Box verticalAlign=\"middle\">\n          <Box marginRight={2}>\n            <TextButton\n              size=\"small\"\n              skin=\"light\"\n              prefixIcon={<Download />}\n              onClick={handleDownload}\n            >\n              {t(textKeys.download)}\n            </TextButton>\n          </Box>\n          <Box marginRight={2}>\n            <Button\n              priority=\"secondary\"\n              size=\"small\"\n              skin=\"light\"\n              prefixIcon={<Replace />}\n              onClick={onReplace}\n              disabled={readOnly}\n            >\n              {t(textKeys.replace)}\n            </Button>\n          </Box>\n          {onClear && (\n            <Box marginRight={2}>\n              <Tooltip content={t(textKeys.delete)}>\n                <IconButton\n                  priority=\"secondary\"\n                  size=\"small\"\n                  skin=\"light\"\n                  onClick={handleClear}\n                  disabled={readOnly}\n                >\n                  <Delete />\n                </IconButton>\n              </Tooltip>\n            </Box>\n          )}\n        </Box>\n      }\n      onClose={onClose}\n    >\n      {sources.map((mediaSrc: string, i) => (\n        <MediaPreviewItem key={i} src={mediaSrc} />\n      ))}\n    </ModalPreviewLayout>\n  );\n};\n\nconst MediaPreviewItem: React.FC<{ src: string }> = ({ src }) => {\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => setLoading(true), [src]);\n  const onLoad = useCallback(() => setLoading(false), []);\n\n  if (!src) return null;\n\n  const previewURL = mediaURItoImageURL(src, window.innerWidth);\n\n  return (\n    <>\n      {loading && (\n        <Box align=\"center\" verticalAlign=\"middle\" width=\"100%\" height=\"100%\">\n          <Loader size=\"small\" />\n        </Box>\n      )}\n      {isMediaVideoURI(src) ? (\n        <video\n          style={{ display: loading ? 'none' : 'initial' }}\n          poster={previewURL}\n          onLoadedData={onLoad}\n          controls\n          className={classes.previewVideo}\n          autoPlay\n          loop\n          muted\n        >\n          <source src={convertMediaURIToPreviewVideoURL(src)} />\n        </video>\n      ) : (\n        <Image\n          style={{ display: loading ? 'none' : 'initial' }}\n          className={classes.previewImage}\n          onLoad={onLoad}\n          src={previewURL}\n        />\n      )}\n    </>\n  );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireWildcard","require","_designSystem","_lazy","_autoFieldTypes","_hooks","_formMediaGalleryFieldStCss","_utils","_jsxFileName","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","MediaPreviewModal","isOpen","onClose","value","onRequestMedia","onClearMedia","onDownloadMedia","textKeys","readOnly","createElement","Modal","screen","onRequestClose","__self","__source","fileName","lineNumber","columnNumber","MediaPreviewLayout","src","onDownload","onClear","onReplace","exports","useTranslations","sources","useMemo","Array","isArray","current","setCurrent","useState","title","getMediaTitle","handleDownload","useCallback","length","prevButtonProps","tooltipText","onClick","prevIndex","nextButtonProps","nextIndex","handleClear","ModalPreviewLayout","actions","Box","verticalAlign","marginRight","TextButton","size","skin","prefixIcon","DownloadImport","download","Button","priority","Replace","dataHook","disabled","replace","Tooltip","content","delete","IconButton","Delete","map","mediaSrc","MediaPreviewItem","key","loading","setLoading","useEffect","onLoad","previewURL","mediaURItoImageURL","window","innerWidth","Fragment","align","width","height","Loader","isMediaVideoURI","style","display","poster","onLoadedData","controls","className","classes","previewVideo","autoPlay","loop","muted","convertMediaURIToPreviewVideoURL","Image","previewImage"],"sources":["../../../../src/components/media-gallery/media-preview-modal.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState, useEffect } from 'react';\nimport type { NextButtonProps, PrevButtonProps } from '@wix/design-system';\nimport {\n  Box,\n  Button,\n  IconButton,\n  Image,\n  Loader,\n  Modal,\n  ModalPreviewLayout,\n  TextButton,\n  Tooltip,\n} from '@wix/design-system';\nimport {\n  Replace,\n  DownloadImport as Download,\n  Delete,\n} from '@wix/wix-ui-icons-common/lazy';\nimport {\n  getMediaTitle,\n  isMediaVideoURI,\n  mediaURItoImageURL,\n} from '../../auto-field-types';\nimport { useTranslations } from '../../hooks';\nimport type { TranslationsKeys } from '../../services/translations';\n\nimport { classes } from './form-media-gallery-field.st.css.js';\nimport { convertMediaURIToPreviewVideoURL } from './media-gallery-dialog/utils';\n\nexport interface MediaPreviewLayoutTextKeys {\n  replace: TranslationsKeys;\n  download: TranslationsKeys;\n  delete: TranslationsKeys;\n}\n\nexport interface MediaPreviewProps {\n  isOpen: boolean;\n  onClose: () => void;\n  onRequestMedia: () => void;\n  onClearMedia?: () => void;\n  onDownloadMedia: (value?: string) => void;\n  textKeys: MediaPreviewLayoutTextKeys;\n  value?: string | string[];\n  readOnly?: boolean;\n}\n\nexport const MediaPreviewModal: React.FC<MediaPreviewProps> = ({\n  isOpen,\n  onClose,\n  value,\n  onRequestMedia,\n  onClearMedia,\n  onDownloadMedia,\n  textKeys,\n  readOnly,\n}) => {\n  if (!isOpen || !value) {\n    return null;\n  }\n\n  return (\n    <Modal isOpen screen=\"full\" onRequestClose={onClose}>\n      <MediaPreviewLayout\n        src={value}\n        onClose={onClose}\n        textKeys={textKeys}\n        onDownload={onDownloadMedia}\n        onClear={onClearMedia}\n        onReplace={onRequestMedia}\n        readOnly={readOnly}\n      />\n    </Modal>\n  );\n};\n\ninterface MediaPreviewLayoutProps {\n  src: string[] | string;\n  onClose: () => void;\n  textKeys: MediaPreviewLayoutTextKeys;\n  onReplace?: () => void;\n  onClear?: () => void;\n  onDownload?: (src?: string) => void;\n  readOnly?: boolean;\n}\n\nconst MediaPreviewLayout: React.FC<MediaPreviewLayoutProps> = ({\n  src,\n  onClose,\n  textKeys,\n  onDownload,\n  onReplace,\n  onClear,\n  readOnly,\n}) => {\n  const { t } = useTranslations();\n  const sources = useMemo(() => (Array.isArray(src) ? src : [src]), [src]);\n  const [current, setCurrent] = useState(sources[0]);\n  const title = getMediaTitle(current);\n\n  const handleDownload = useCallback(() => {\n    if (sources.length > 1) {\n      onDownload?.(current);\n    } else {\n      onDownload?.();\n    }\n  }, [sources, onDownload, current]);\n\n  const prevButtonProps = {\n    tooltipText: t('CMS.mediaGallery.preview.previousItem'),\n    onClick: (prevIndex: number) => setCurrent(sources[prevIndex]),\n  } as PrevButtonProps;\n\n  const nextButtonProps = {\n    tooltipText: t('CMS.mediaGallery.preview.nextItem'),\n    onClick: (nextIndex: number) => setCurrent(sources[nextIndex]),\n  } as NextButtonProps;\n\n  const handleClear = useCallback(() => {\n    onClear?.();\n    onClose();\n  }, [onClear, onClose]);\n\n  return (\n    <ModalPreviewLayout\n      title={title}\n      prevButtonProps={prevButtonProps}\n      nextButtonProps={nextButtonProps}\n      actions={\n        <Box verticalAlign=\"middle\">\n          <Box marginRight={2}>\n            <TextButton\n              size=\"small\"\n              skin=\"light\"\n              prefixIcon={<Download />}\n              onClick={handleDownload}\n            >\n              {t(textKeys.download)}\n            </TextButton>\n          </Box>\n          <Box marginRight={2}>\n            <Button\n              priority=\"secondary\"\n              size=\"small\"\n              skin=\"light\"\n              prefixIcon={<Replace />}\n              dataHook=\"preview-modal-replace-button\"\n              onClick={onReplace}\n              disabled={readOnly}\n            >\n              {t(textKeys.replace)}\n            </Button>\n          </Box>\n          {onClear && (\n            <Box marginRight={2}>\n              <Tooltip content={t(textKeys.delete)}>\n                <IconButton\n                  priority=\"secondary\"\n                  size=\"small\"\n                  skin=\"light\"\n                  onClick={handleClear}\n                  disabled={readOnly}\n                >\n                  <Delete />\n                </IconButton>\n              </Tooltip>\n            </Box>\n          )}\n        </Box>\n      }\n      onClose={onClose}\n    >\n      {sources.map((mediaSrc: string, i) => (\n        <MediaPreviewItem key={i} src={mediaSrc} />\n      ))}\n    </ModalPreviewLayout>\n  );\n};\n\nconst MediaPreviewItem: React.FC<{ src: string }> = ({ src }) => {\n  const [loading, setLoading] = useState(true);\n\n  useEffect(() => setLoading(true), [src]);\n  const onLoad = useCallback(() => setLoading(false), []);\n\n  if (!src) return null;\n\n  const previewURL = mediaURItoImageURL(src, window.innerWidth);\n\n  return (\n    <>\n      {loading && (\n        <Box align=\"center\" verticalAlign=\"middle\" width=\"100%\" height=\"100%\">\n          <Loader size=\"small\" />\n        </Box>\n      )}\n      {isMediaVideoURI(src) ? (\n        <video\n          style={{ display: loading ? 'none' : 'initial' }}\n          poster={previewURL}\n          onLoadedData={onLoad}\n          controls\n          className={classes.previewVideo}\n          autoPlay\n          loop\n          muted\n        >\n          <source src={convertMediaURIToPreviewVideoURL(src)} />\n        </video>\n      ) : (\n        <Image\n          style={{ display: loading ? 'none' : 'initial' }}\n          className={classes.previewImage}\n          onLoad={onLoad}\n          src={previewURL}\n        />\n      )}\n    </>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/media-image/media-image.st.css.js

@@ -5,14 +5,14 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "mediaimage59134252";
+var _namespace_ = "mediaimage3563739252";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "mediaimage59134252__root"
+  "root": "mediaimage3563739252__root"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};
@@ -23,7 +23,7 @@ var vars = exports.vars = {
   "wsr-color-R20": "--wsr-color-R20",
   "wds-color-black-550": "--wds-color-black-550",
   "wsr-color-D55": "--wsr-color-D55",
-  "from": "--mediaimage59134252-from",
-  "to": "--mediaimage59134252-to"
+  "from": "--mediaimage3563739252-from",
+  "to": "--mediaimage3563739252-to"
 };
 //# sourceMappingURL=media-image.st.css.js.map

package/dist/cjs/components/media-image/media-image.st.css.js.map

@@ -1 +1 @@
-{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/media-image/media-image.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"mediaimage59134252\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"mediaimage59134252__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport 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\":\"--mediaimage59134252-from\",\"to\":\"--mediaimage59134252-to\"}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,oBAAoB;AACtC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAA0B,CAAC;AACjD,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG;EAAC,mBAAmB,EAAC,qBAAqB;EAAC,eAAe,EAAC,iBAAiB;EAAC,qBAAqB,EAAC,uBAAuB;EAAC,eAAe,EAAC,iBAAiB;EAAC,MAAM,EAAC,2BAA2B;EAAC,IAAI,EAAC;AAAyB,CAAC","ignoreList":[]}
+{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../src/components/media-image/media-image.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"mediaimage3563739252\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"mediaimage3563739252__root\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {}; \nexport 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\":\"--mediaimage3563739252-from\",\"to\":\"--mediaimage3563739252-to\"}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,sBAAsB;AACxC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC;AAA4B,CAAC;AACnD,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG;EAAC,mBAAmB,EAAC,qBAAqB;EAAC,eAAe,EAAC,iBAAiB;EAAC,qBAAqB,EAAC,uBAAuB;EAAC,eAAe,EAAC,iBAAiB;EAAC,MAAM,EAAC,6BAA6B;EAAC,IAAI,EAAC;AAA2B,CAAC","ignoreList":[]}

package/dist/cjs/components/media-image/overlays/overlay.st.css.js

@@ -5,15 +5,15 @@ exports.vars = exports.style = exports.stVars = exports.st = exports.namespace =
 var _stylableEsmRuntime = require("../../../stylable-esm-runtime.js");
 // @ts-nocheck
 
-var _namespace_ = "overlay279034460";
+var _namespace_ = "overlay1797606365";
 var _style_ = _stylableEsmRuntime.classesRuntime.bind(null, _namespace_);
 var cssStates = exports.cssStates = _stylableEsmRuntime.statesRuntime.bind(null, _namespace_);
 var style = exports.style = _style_;
 var st = exports.st = _style_;
 var namespace = exports.namespace = _namespace_;
 var classes = exports.classes = {
-  "root": "overlay279034460__root",
-  "iconOverlay": "overlay279034460__iconOverlay"
+  "root": "overlay1797606365__root",
+  "iconOverlay": "overlay1797606365__iconOverlay"
 };
 var keyframes = exports.keyframes = {};
 var layers = exports.layers = {};

package/dist/cjs/components/media-image/overlays/overlay.st.css.js.map

@@ -1 +1 @@
-{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../../src/components/media-image/overlays/overlay.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"overlay279034460\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"overlay279034460__root\",\"iconOverlay\":\"overlay279034460__iconOverlay\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {\"iconShadow\":\"drop-shadow(0 1px 1px rgba(22, 45, 61, 0.6))\"}; \nexport var vars = {\"wds-color-white\":\"--wds-color-white\",\"wsr-color-D80\":\"--wsr-color-D80\"}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,kBAAkB;AACpC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,wBAAwB;EAAC,aAAa,EAAC;AAA+B,CAAC;AAC7F,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG;EAAC,YAAY,EAAC;AAA8C,CAAC;AAC1E,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG;EAAC,iBAAiB,EAAC,mBAAmB;EAAC,eAAe,EAAC;AAAiB,CAAC","ignoreList":[]}
+{"version":3,"names":["_stylableEsmRuntime","require","_namespace_","_style_","classesRuntime","bind","cssStates","exports","statesRuntime","style","st","namespace","classes","keyframes","layers","containers","stVars","vars"],"sources":["../../../../../src/components/media-image/overlays/overlay.st.css.ts"],"sourcesContent":["// @ts-nocheck\n\n\nimport { classesRuntime, statesRuntime } from \"../../../stylable-esm-runtime.js\";\n\n\n\nvar _namespace_ = \"overlay1797606365\";\nvar _style_ = classesRuntime.bind(null, _namespace_);\n\nexport var cssStates = statesRuntime.bind(null, _namespace_);\nexport var style: import(\"@stylable/runtime\").STFunction = _style_;\nexport var st: import(\"@stylable/runtime\").STFunction = _style_;\n\nexport var namespace = _namespace_;\nexport var classes = {\"root\":\"overlay1797606365__root\",\"iconOverlay\":\"overlay1797606365__iconOverlay\"};\nexport var keyframes = {}; \nexport var layers = {};\nexport var containers = {};\nexport var stVars = {\"iconShadow\":\"drop-shadow(0 1px 1px rgba(22, 45, 61, 0.6))\"}; \nexport var vars = {\"wds-color-white\":\"--wds-color-white\",\"wsr-color-D80\":\"--wsr-color-D80\"}; \n\n\n\n\n"],"mappings":";;;;AAGA,IAAAA,mBAAA,GAAAC,OAAA;AAHA;;AAOA,IAAIC,WAAW,GAAG,mBAAmB;AACrC,IAAIC,OAAO,GAAGC,kCAAc,CAACC,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AAE7C,IAAII,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAGE,iCAAa,CAACH,IAAI,CAAC,IAAI,EAAEH,WAAW,CAAC;AACrD,IAAIO,KAA6C,GAAAF,OAAA,CAAAE,KAAA,GAAGN,OAAO;AAC3D,IAAIO,EAA0C,GAAAH,OAAA,CAAAG,EAAA,GAAGP,OAAO;AAExD,IAAIQ,SAAS,GAAAJ,OAAA,CAAAI,SAAA,GAAGT,WAAW;AAC3B,IAAIU,OAAO,GAAAL,OAAA,CAAAK,OAAA,GAAG;EAAC,MAAM,EAAC,yBAAyB;EAAC,aAAa,EAAC;AAAgC,CAAC;AAC/F,IAAIC,SAAS,GAAAN,OAAA,CAAAM,SAAA,GAAG,CAAC,CAAC;AAClB,IAAIC,MAAM,GAAAP,OAAA,CAAAO,MAAA,GAAG,CAAC,CAAC;AACf,IAAIC,UAAU,GAAAR,OAAA,CAAAQ,UAAA,GAAG,CAAC,CAAC;AACnB,IAAIC,MAAM,GAAAT,OAAA,CAAAS,MAAA,GAAG;EAAC,YAAY,EAAC;AAA8C,CAAC;AAC1E,IAAIC,IAAI,GAAAV,OAAA,CAAAU,IAAA,GAAG;EAAC,iBAAiB,EAAC,mBAAmB;EAAC,eAAe,EAAC;AAAiB,CAAC","ignoreList":[]}