@websolutespa/bom-mixer-ui 1.8.11 → 1.8.13

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @websolutespa/bom-mixer-ui
 
+## 1.8.13
+
+### Patch Changes
+
+- Modified: Text added letter-spacing, MediaImage
+- Updated dependencies
+- Updated dependencies
+  - @websolutespa/bom-mixer-models@1.8.8
+  - @websolutespa/bom-core@1.8.10
+
+## 1.8.12
+
+### Patch Changes
+
+- Modified: Container
+- Updated dependencies
+  - @websolutespa/bom-core@1.8.9
+
 ## 1.8.11
 
 ### Patch Changes

package/dist/cjs/index.js

@@ -473,9 +473,9 @@ const CssObj = {
   /*
   "fontSizeAdjust": "font-size-adjust",
   "fontStretch": "font-stretch",
-  "fontStyle": "font-style",
   "fontVariant": "font-variant",
   */
+  'fontStyle': 'font-style',
   'fontWeight': 'font-weight',
   'gap': 'gap',
   'grid': 'grid',
@@ -2024,21 +2024,39 @@ const Code = styled__default.default.div`
   ${props => getCssResponsive(props)}
 `;
 
-const ContainerBase = styled__default.default.div`
+const StyledContainer = styled__default.default.div`
   width: 100%;
   margin: 0 auto;
   ${props => getContainer(props)}
   ${props => getCssResponsive(props)}
 `;
+const ContainerBase = /*#__PURE__*/React.forwardRef((_a, ref) => {
+  var {
+      children,
+      as = 'div',
+      className
+    } = _a,
+    props = __rest(_a, ["children", "as", "className"]);
+  return jsxRuntime.jsx(StyledContainer, Object.assign({
+    ref: ref,
+    as: as,
+    className: bomCore.getClassNames('container', className)
+  }, props, {
+    children: children
+  }));
+});
+ContainerBase.displayName = 'ContainerBase';
 const ContainerFluid = /*#__PURE__*/React.forwardRef((_a, ref) => {
   var {
       children,
-      as = 'div'
+      as = 'div',
+      className
     } = _a,
-    props = __rest(_a, ["children", "as"]);
-  return jsxRuntime.jsx(ContainerBase, Object.assign({
+    props = __rest(_a, ["children", "as", "className"]);
+  return jsxRuntime.jsx(StyledContainer, Object.assign({
     ref: ref,
-    as: as
+    as: as,
+    className: bomCore.getClassNames('container-fluid', className)
   }, props, {
     variant: "fluid",
     children: children
@@ -2921,17 +2939,23 @@ const DrawerBase = _a => {
     props = __rest(_a, ["name", "visible", "onClose", "placement", "className", "variant", "variants", "children"]);
   const [drawer, openDrawer, closeDrawer] = bomMixerHooks.useDrawer();
   const onClose = () => {
+    console.log('onClose', name, drawer);
     if (outerOnClose) {
       outerOnClose();
     }
-    closeDrawer();
+    if (drawer === name) {
+      closeDrawer();
+    }
   };
-  React.useEffect(() => {
+  const open = typeof outerVisible === 'undefined' ? drawer === name : outerVisible;
+  /*
+  useEffect(() => {
     if (typeof outerVisible === 'undefined') {
       return;
     }
     outerVisible ? openDrawer(name) : closeDrawer();
   }, [closeDrawer, name, openDrawer, outerVisible]);
+  */
   const classNames = bomCore.getClassNames('drawer', className, placement);
   const globalVariants = useVariants('drawer', drawerVariants);
   variants = variants || globalVariants;
@@ -2942,7 +2966,7 @@ const DrawerBase = _a => {
       variants
     },
     children: jsxRuntime.jsx(AriaKit__namespace.DialogProvider, {
-      open: drawer === name,
+      open: open,
       children: jsxRuntime.jsx(DrawerBaseStyle, Object.assign({
         onClose: () => onClose(),
         className: classNames,
@@ -4721,6 +4745,7 @@ const StyledText$1 = styled__default.default.div`
     ${font.size ? styled.css`font-size: var(--font-${variant}-size, 1rem);` : ''}
     ${font.lineHeight ? styled.css`line-height: var(--font-${variant}-line-height, 1);` : ''}
     ${font.fontWeight ? styled.css`font-weight: var(--font-${variant}-font-weight, inherit);` : ''}
+    ${font.letterSpacing ? styled.css`letter-spacing: var(--font-${variant}-letter-spacing, inherit);` : ''}
   `)};
   ${props => props.gradient ? styled.css`
     display: -webkit-inline-box;
@@ -5161,7 +5186,7 @@ function getImageProps(_a, mediaQuery) {
       src
     } = _a,
     props = __rest(_a, ["src"]);
-  if (IMAGE_STRATEGY === bomCore.ImageStrategy.None || !src || isSVG(src)) {
+  if (IMAGE_STRATEGY === bomCore.ImageStrategy.None || !isValidSrc(src)) {
     return Object.assign({
       src
     }, props);
@@ -5254,7 +5279,7 @@ function getImageSrc(src, width, ratio, focalX, focalY, quality) {
   if (quality === void 0) {
     quality = IMAGE_QUALITY;
   }
-  if (isSVG(src)) {
+  if (!isValidSrc(src)) {
     return src;
   }
   switch (IMAGE_STRATEGY) {
@@ -5305,7 +5330,7 @@ function getImageSrcset(src, sizes, focalX, focalY, quality) {
   if (quality === void 0) {
     quality = IMAGE_QUALITY;
   }
-  if (isSVG(src)) {
+  if (!isValidSrc(src)) {
     return undefined;
   }
   return sizes.length > 1 ? sizes.map(size => getImageSrc(src, size[0], size[2], focalX, focalY, quality) + ` ${size[0]}w`).join(', ') : undefined;
@@ -5313,6 +5338,22 @@ function getImageSrcset(src, sizes, focalX, focalY, quality) {
 function getImageSizes(sizes) {
   return sizes.length > 1 ? sizes.map((size, i) => `${i < sizes.length - 1 ? `(max-width: ${sizes[i + 1][1] - 1}px) ` : ''}${size[0]}px`).join(', ') : undefined;
 }
+function isValidSrc(src) {
+  // undefined
+  if (!src) {
+    return false;
+  }
+  // svg
+  if (isSVG(src)) {
+    return false;
+  }
+  // data image
+  if (src.indexOf('data:') === 0) {
+    return false;
+  }
+  // valid
+  return true;
+}
 function isSVG(src) {
   return src.indexOf('.svg') !== -1;
 }
@@ -12739,6 +12780,7 @@ exports.Section = Section;
 exports.Select = Select;
 exports.SelectLegacy = SelectLegacy;
 exports.Skeleton = Skeleton;
+exports.StyledContainer = StyledContainer;
 exports.Svg = Svg;
 exports.SvgAnimation = SvgAnimation;
 exports.SwiperComponent = SwiperComponent;