@websolutespa/bom-mixer-ui 1.5.5 → 1.5.7

package/CHANGELOG.md

@@ -1,176 +1,193 @@
-# @websolutespa/bom-mixer-ui
-
-## 1.5.5
-
-### Patch Changes
-
-- Added: ErrorHandler, Reversable
-- Modified: pickChild, IFeatureType
-- Updated dependencies
-  - @websolutespa/bom-mixer-models@1.5.4
-  - @websolutespa/bom-mixer-hooks@1.4.2
-  - @websolutespa/bom-mixer-store@1.4.3
-  - @websolutespa/bom-core@0.6.5
-
-## 1.5.4
-
-### Patch Changes
-
-- Modified: Meta
-- Updated dependencies
-  - @websolutespa/bom-mixer-models@1.5.4
-  - @websolutespa/bom-mixer-store@1.4.3
-
-## 1.5.3
-
-### Patch Changes
-
-- Modified: Pagination
-
-## 1.5.2
-
-### Patch Changes
-
-- Modified: AccordionGroup, Media, Meta, Pagination, PopoverCollections, Popover, Tabs, utils
-- Updated dependencies
-  - @websolutespa/bom-mixer-models@1.5.2
-  - @websolutespa/bom-mixer-hooks@1.4.1
-  - @websolutespa/bom-core@0.6.2
-
-## 1.5.1
-
-### Patch Changes
-
-- Added: default href to Link
-
-## 1.5.0
-
-### Minor Changes
-
-- Modified LazyLoader
-
-## 1.4.0
-
-### Minor Changes
-
-- Added: Main
-- Modified: Pagination
-
-## 1.3.0
-
-### Minor Changes
-
-- Added: accessibility
-- Modified: IThemeForm, form fields, LazyComponents, Media
-
-## 1.2.2
-
-### Patch Changes
-
-- Modified: MediaImage
-
-## 1.2.1
-
-### Patch Changes
-
-- Added: LayoutDefault
-- Modified: GlobalStyle, toKebabCase
-
-## 1.2.0
-
-### Minor Changes
-
-- Fixing: circular references
-- Added: Link wrapper for next/link
-- Updating: next 13
-
-## 1.1.0
-
-### Minor Changes
-
-- Modified: useApi
-
-## 1.0.1
-
-### Patch Changes
-
-- Fixing: types
-
-## 1.0.0
-
-### Minor Changes
-
-- Added: useFormTester
-
-## 0.5.1
-
-### Patch Changes
-
-- Fixing: useVariant
-
-## 0.5.0
-
-### Minor Changes
-
-- Modified: ui variants Forms, theme.json
-
-## 0.4.3
-
-### Patch Changes
-
-- Modified: Text added getFontVariantResponsive
-
-## 0.4.2
-
-### Patch Changes
-
-- Modified: ui variants Grid, Container, Text
-
-## 0.4.1
-
-### Patch Changes
-
-- Added: source files
-
-## 0.4.0
-
-### Minor Changes
-
-- Added: splat routes
-- Added: variants
-
-## 0.3.0
-
-### Minor Changes
-
-- Added: @websolutespa/bom-core
-
-## 0.2.0
-
-### Minor Changes
-
-- Modified: ITheme, LazyLoader
-
-## 0.1.0
-
-### Minor Changes
-
-- mock refactor
-
-## 0.0.3
-
-### Patch Changes
-
-- Modified: assets
-
-## 0.0.2
-
-### Patch Changes
-
-- Modified: assets
-
-## 0.0.1
-
-### Patch Changes
-
-- Added: first release
+# @websolutespa/bom-mixer-ui
+
+## 1.5.7
+
+### Patch Changes
+
+- Modified: Media added muted video caption support
+- Updated dependencies
+  - @websolutespa/bom-mixer-models@1.5.10
+
+## 1.5.6
+
+### Patch Changes
+
+- Modified: PaginationItem, Text
+- Fixing: MediaItem
+- Updated dependencies
+  - @websolutespa/bom-mixer-models@1.5.9
+
+## 1.5.5
+
+### Patch Changes
+
+- Added: ErrorHandler, Reversable
+- Modified: pickChild, IFeatureType
+- Updated dependencies
+  - @websolutespa/bom-mixer-models@1.5.4
+  - @websolutespa/bom-mixer-hooks@1.4.2
+  - @websolutespa/bom-mixer-store@1.4.3
+  - @websolutespa/bom-core@0.6.5
+
+## 1.5.4
+
+### Patch Changes
+
+- Modified: Meta
+- Updated dependencies
+  - @websolutespa/bom-mixer-models@1.5.4
+  - @websolutespa/bom-mixer-store@1.4.3
+
+## 1.5.3
+
+### Patch Changes
+
+- Modified: Pagination
+
+## 1.5.2
+
+### Patch Changes
+
+- Modified: AccordionGroup, Media, Meta, Pagination, PopoverCollections, Popover, Tabs, utils
+- Updated dependencies
+  - @websolutespa/bom-mixer-models@1.5.2
+  - @websolutespa/bom-mixer-hooks@1.4.1
+  - @websolutespa/bom-core@0.6.2
+
+## 1.5.1
+
+### Patch Changes
+
+- Added: default href to Link
+
+## 1.5.0
+
+### Minor Changes
+
+- Modified LazyLoader
+
+## 1.4.0
+
+### Minor Changes
+
+- Added: Main
+- Modified: Pagination
+
+## 1.3.0
+
+### Minor Changes
+
+- Added: accessibility
+- Modified: IThemeForm, form fields, LazyComponents, Media
+
+## 1.2.2
+
+### Patch Changes
+
+- Modified: MediaImage
+
+## 1.2.1
+
+### Patch Changes
+
+- Added: LayoutDefault
+- Modified: GlobalStyle, toKebabCase
+
+## 1.2.0
+
+### Minor Changes
+
+- Fixing: circular references
+- Added: Link wrapper for next/link
+- Updating: next 13
+
+## 1.1.0
+
+### Minor Changes
+
+- Modified: useApi
+
+## 1.0.1
+
+### Patch Changes
+
+- Fixing: types
+
+## 1.0.0
+
+### Minor Changes
+
+- Added: useFormTester
+
+## 0.5.1
+
+### Patch Changes
+
+- Fixing: useVariant
+
+## 0.5.0
+
+### Minor Changes
+
+- Modified: ui variants Forms, theme.json
+
+## 0.4.3
+
+### Patch Changes
+
+- Modified: Text added getFontVariantResponsive
+
+## 0.4.2
+
+### Patch Changes
+
+- Modified: ui variants Grid, Container, Text
+
+## 0.4.1
+
+### Patch Changes
+
+- Added: source files
+
+## 0.4.0
+
+### Minor Changes
+
+- Added: splat routes
+- Added: variants
+
+## 0.3.0
+
+### Minor Changes
+
+- Added: @websolutespa/bom-core
+
+## 0.2.0
+
+### Minor Changes
+
+- Modified: ITheme, LazyLoader
+
+## 0.1.0
+
+### Minor Changes
+
+- mock refactor
+
+## 0.0.3
+
+### Patch Changes
+
+- Modified: assets
+
+## 0.0.2
+
+### Patch Changes
+
+- Modified: assets
+
+## 0.0.1
+
+### Patch Changes
+
+- Added: first release

package/dist/cjs/index.js

@@ -3910,27 +3910,27 @@ function hasBackground(props) {
   return hasChildOfType(props.children, Background);
 }
 
-const CssH = styled.css`
+styled.css`
   h1, h2, h3, h4, h5, h6 {
-    color: var(--color-neutral-500);
+    // color: var(--color-neutral-500);
     margin-bottom: 3rem;
   }
   h4 {
     font-size: 1.2em;
   }
 `;
-const CssA = styled.css`
+styled.css`
   a[href] {
     ${CssDefault}
     ${CssButtonNavInverted}
   }
 `;
-const CssP = styled.css`
+styled.css`
   p:not(:last-child) {
     margin-bottom: 1.25em;
   }
 `;
-const CssUl = styled.css`
+styled.css`
   ul {
     list-style: initial;
     margin: 0 0 2em 1.1em;
@@ -3953,12 +3953,14 @@ const StyledText$1 = styled__default.default.div`
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
   ` : ''}
-  ${CssH}
-  ${CssA}
-  ${CssP}
-  ${CssUl}
   ${props => getCssResponsive(props)}
 `;
+/*
+${CssH}
+${CssA}
+${CssP}
+${CssUl}
+*/
 const TextBase = /*#__PURE__*/React.forwardRef((_a, ref) => {
   var {
       children,
@@ -4502,6 +4504,9 @@ const MediaBase = /*#__PURE__*/React.forwardRef((_a, ref) => {
       as = 'div'
     } = _a,
     props = __rest(_a, ["children", "item", "onClick", "className", "eager", "alt", "title", "as"]);
+  const {
+    locale
+  } = bomMixerHooks.useLayout();
   const {
     id,
     open
@@ -4514,6 +4519,7 @@ const MediaBase = /*#__PURE__*/React.forwardRef((_a, ref) => {
     galleryId: id,
     alt,
     title,
+    locale,
     open
   }) : children;
   return jsxRuntime.jsx(StyledMedia$1, Object.assign({
@@ -4528,6 +4534,18 @@ MediaBase.displayName = 'Media';
 const Media = bomCore.withSchema(MediaBase, {
   Info: MediaInfo
 });
+const StyledVideo = styled__default.default('video')`
+  &.video {
+    &--muted {
+      &::cue {
+        background-color: transparent;
+        background-image: none;
+        color: transparent;
+        font-size: 0;
+      }
+    }
+  }
+`;
 function getMediaItems(itemOrItems, options) {
   if (options === void 0) {
     options = {};
@@ -4537,10 +4555,29 @@ function getMediaItems(itemOrItems, options) {
     if (typeof x['media'] === 'object') {
       x = x['media'];
     }
-    if (typeof x.url === 'string') {
-      x.src = x.url;
+    const mediaItem = {
+      type: x.type,
+      src: typeof x.url === 'string' ? x.url : x.src
+    };
+    if (x.abstract) {
+      mediaItem.abstract = x.abstract;
     }
-    return x;
+    if (x.alt) {
+      mediaItem.alt = x.alt;
+    }
+    if (x.height) {
+      mediaItem.height = x.height;
+    }
+    if (x.mimeType) {
+      mediaItem.mimeType = x.mimeType;
+    }
+    if (x.title) {
+      mediaItem.title = x.title;
+    }
+    if (x.width) {
+      mediaItem.width = x.width;
+    }
+    return mediaItem;
   });
   const hasGallery = options.galleryId != null && typeof options.open === 'function';
   const getMediaItemProps = media => {
@@ -4573,16 +4610,22 @@ function getMediaItems(itemOrItems, options) {
     }
     return props;
   };
-  return items.map((media, m) => bomCore.resolveMediaType(media) === 'video' ? jsxRuntime.jsx("video", Object.assign({
+  return items.map((media, m) => bomCore.resolveMediaType(media) === 'video' ? jsxRuntime.jsxs(StyledVideo, Object.assign({
+    className: "video video--muted",
     playsInline: true,
     autoPlay: true,
     muted: true,
     loop: true
   }, getMediaItemProps(media), {
-    children: jsxRuntime.jsx("source", {
+    children: [jsxRuntime.jsx("source", {
       src: media.src,
       type: "video/mp4"
-    })
+    }), options.locale && jsxRuntime.jsx("track", {
+      src: `/captions.vtt?locale=${options.locale}&title=${media.title}`,
+      kind: "captions",
+      srcLang: options.locale,
+      label: "Video Captions"
+    })]
   }), m) : jsxRuntime.jsx(MediaImage, Object.assign({}, media, {
     draggable: false
   }, getMediaItemProps(media)), m));
@@ -5545,7 +5588,7 @@ const StyledPaginationItem$1 = styled__default.default.li`
     outline: none;
     border: none;
     cursor: pointer;
-    color: var(--color-primary-500);
+    color: var(--color-primary-600);
     border-radius: var(--border-radius);
     background-color: var(--color-neutral-100);
     transition: all linear 200ms 0ms;
@@ -5561,7 +5604,7 @@ const StyledPaginationItem$1 = styled__default.default.li`
 
     &.active {
       font-weight: 700;
-      background-color: var(--color-primary-500);
+      background-color: var(--color-primary-600);
       color: var(--color-neutral-100);
       box-shadow: var(--shadow-xs);
     }
@@ -7757,7 +7800,7 @@ const StyledCustomSelect = styled__default.default.div`
 
   .placeholder {
     color: inherit;
-    opacity: 0.3;
+    opacity: 0.5;
   }
 
   .value {