@mw-kit/mw-ui 1.8.7 → 1.8.8

package/dist/components/ProgressBar/interfaces.d.ts

@@ -1,8 +1,7 @@
 export interface ProgressBarProps {
     type: 'default' | 'info' | 'danger' | 'success' | 'warning';
-    value: string;
+    value: number | null;
 }
 export interface StyledProgressBarProps {
     $type: ProgressBarProps['type'];
-    $value: ProgressBarProps['value'];
 }

package/dist/components/ProgressBar/styles.d.ts

@@ -1,3 +1,5 @@
 import type { StyledProgressBarProps } from './interfaces';
-export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $disabled: boolean;
+}>> & string;
 export declare const Progress: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledProgressBarProps>> & string;

package/dist/index.d.mts

@@ -1501,7 +1501,7 @@ declare const Placeholder: (props: PlaceholderProps) => react_jsx_runtime.JSX.El
 
 interface ProgressBarProps {
     type: 'default' | 'info' | 'danger' | 'success' | 'warning';
-    value: string;
+    value: number | null;
 }
 
 declare const ProgressBar: ({ type, value, ...props }: ProgressBarProps) => react_jsx_runtime.JSX.Element;

package/dist/index.js

@@ -16858,51 +16858,51 @@ var Container25 = import_styled_components71.default.div`
   display: flex;
   flex-direction: row;
   align-items: center;
+  opacity: ${({ $disabled: disabled }) => disabled ? 0.5 : 1};
+  width: 100%;
 
-  span {
+  > span {
     display: inline-block;
     margin-left: 7px;
     color: #000000cc;
   }
 `;
 var Progress = import_styled_components71.default.div`
-  width: 64px;
+  width: 100%;
   height: 12px;
   border: 1px solid #e4e4e4;
-  div {
-    width: ${({ $value: value }) => `${value}%`};
-    max-width: 64px;
-    height: 100%;
-    ${({ theme: theme4, $type: type }) => type === "default" && import_styled_components71.css`
-        background-color: ${theme4.colors.warningGray};
-      `}
 
-    ${({ theme: theme4, $type: type }) => type === "info" && import_styled_components71.css`
-        background-color: ${theme4.colors.blue};
-      `}
+  > span {
+    content: '';
+    display: flex;
 
-    ${({ theme: theme4, $type: type }) => type === "danger" && import_styled_components71.css`
-        background-color: ${theme4.colors.warningRed};
-      `}
+    height: 100%;
 
-    ${({ theme: theme4, $type: type }) => type === "success" && import_styled_components71.css`
-        background-color: ${theme4.colors.green};
-      `}
+    transition-property: width background-color;
+    transition-duration: 0.25s;
+    transition-timing-function: ease-in-out;
 
-    ${({ theme: theme4, $type: type }) => type === "warning" && import_styled_components71.css`
-        background-color: ${theme4.colors.warningYellow};
-      `}
+    background-color: ${({ theme: theme4, $type: type }) => {
+  const colors2 = {
+    default: "warningGray",
+    info: "blue",
+    danger: "warningRed",
+    success: "green",
+    warning: "warningYellow"
+  };
+  return theme4.colors[colors2[type]];
+}};
   }
 `;
 
 // src/components/ProgressBar/index.tsx
 var import_jsx_runtime359 = require("react/jsx-runtime");
 var ProgressBar = ({ type, value, ...props }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)(Container25, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime359.jsx)(Progress, { ...props, $type: type, $value: value, children: /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("div", {}) }),
+  return /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)(Container25, { $disabled: value === null, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime359.jsx)(Progress, { ...props, $type: type, children: /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("span", { style: { width: `${value || 0}%` } }) }),
     /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)("span", { children: [
       " ",
-      value || "0",
+      value === null ? "-" : value,
       "%"
     ] })
   ] });
@@ -17137,10 +17137,7 @@ var Close2 = (props) => {
       if (!await onClose(index, options[index], event)) {
         return;
       }
-      const newactive = (() => {
-        if (index < active) return active - 1;
-        return active > 0 ? active - 1 : active;
-      })();
+      const newactive = index < active || !newOptions[active] ? active - 1 : active;
       setActive(newactive, newOptions[newactive].data);
       setOptions(newOptions);
     },

package/dist/index.mjs

@@ -16796,56 +16796,56 @@ var Placeholder = (props) => {
 var Placeholder_default = Placeholder;
 
 // src/components/ProgressBar/styles.ts
-import styled68, { css as css48 } from "styled-components";
+import styled68 from "styled-components";
 var Container25 = styled68.div`
   display: flex;
   flex-direction: row;
   align-items: center;
+  opacity: ${({ $disabled: disabled }) => disabled ? 0.5 : 1};
+  width: 100%;
 
-  span {
+  > span {
     display: inline-block;
     margin-left: 7px;
     color: #000000cc;
   }
 `;
 var Progress = styled68.div`
-  width: 64px;
+  width: 100%;
   height: 12px;
   border: 1px solid #e4e4e4;
-  div {
-    width: ${({ $value: value }) => `${value}%`};
-    max-width: 64px;
-    height: 100%;
-    ${({ theme: theme4, $type: type }) => type === "default" && css48`
-        background-color: ${theme4.colors.warningGray};
-      `}
 
-    ${({ theme: theme4, $type: type }) => type === "info" && css48`
-        background-color: ${theme4.colors.blue};
-      `}
+  > span {
+    content: '';
+    display: flex;
 
-    ${({ theme: theme4, $type: type }) => type === "danger" && css48`
-        background-color: ${theme4.colors.warningRed};
-      `}
+    height: 100%;
 
-    ${({ theme: theme4, $type: type }) => type === "success" && css48`
-        background-color: ${theme4.colors.green};
-      `}
+    transition-property: width background-color;
+    transition-duration: 0.25s;
+    transition-timing-function: ease-in-out;
 
-    ${({ theme: theme4, $type: type }) => type === "warning" && css48`
-        background-color: ${theme4.colors.warningYellow};
-      `}
+    background-color: ${({ theme: theme4, $type: type }) => {
+  const colors2 = {
+    default: "warningGray",
+    info: "blue",
+    danger: "warningRed",
+    success: "green",
+    warning: "warningYellow"
+  };
+  return theme4.colors[colors2[type]];
+}};
   }
 `;
 
 // src/components/ProgressBar/index.tsx
 import { jsx as jsx359, jsxs as jsxs180 } from "react/jsx-runtime";
 var ProgressBar = ({ type, value, ...props }) => {
-  return /* @__PURE__ */ jsxs180(Container25, { children: [
-    /* @__PURE__ */ jsx359(Progress, { ...props, $type: type, $value: value, children: /* @__PURE__ */ jsx359("div", {}) }),
+  return /* @__PURE__ */ jsxs180(Container25, { $disabled: value === null, children: [
+    /* @__PURE__ */ jsx359(Progress, { ...props, $type: type, children: /* @__PURE__ */ jsx359("span", { style: { width: `${value || 0}%` } }) }),
     /* @__PURE__ */ jsxs180("span", { children: [
       " ",
-      value || "0",
+      value === null ? "-" : value,
       "%"
     ] })
   ] });
@@ -16909,7 +16909,7 @@ var ScrollButton = (props) => {
 var ScrollButton_default = ScrollButton;
 
 // src/components/Tabs/components/ScrollButtons/styled.ts
-import styled70, { css as css49 } from "styled-components";
+import styled70, { css as css48 } from "styled-components";
 var Container27 = styled70.div`
   overflow-x: auto;
   scrollbar-width: thin;
@@ -16925,7 +16925,7 @@ var Container27 = styled70.div`
     display: none; /* Chrome, Safari, Opera */
   }
 
-  ${({ theme: theme4, $internal: internal }) => internal && css49`
+  ${({ theme: theme4, $internal: internal }) => internal && css48`
       gap: ${theme4.spacings.s6};
     `}
 `;
@@ -17080,10 +17080,7 @@ var Close2 = (props) => {
       if (!await onClose(index, options[index], event)) {
         return;
       }
-      const newactive = (() => {
-        if (index < active) return active - 1;
-        return active > 0 ? active - 1 : active;
-      })();
+      const newactive = index < active || !newOptions[active] ? active - 1 : active;
       setActive(newactive, newOptions[newactive].data);
       setOptions(newOptions);
     },
@@ -17107,7 +17104,7 @@ var Close_default = Close2;
 import { useState as useState25 } from "react";
 
 // src/components/Tabs/components/TabItem/components/LabelItem/styled.ts
-import styled72, { css as css50 } from "styled-components";
+import styled72, { css as css49 } from "styled-components";
 var StyledTab = styled72.div`
   position: relative;
   flex: 1;
@@ -17141,7 +17138,7 @@ var StyledTab = styled72.div`
     transition: --color 0.5s, --bgColor 0.5s;
   }
 
-  ${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal && css50`
+  ${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal && css49`
       &::before {
         content: '';
         position: absolute;
@@ -17263,7 +17260,7 @@ var TabItem = (props) => {
 var TabItem_default = TabItem;
 
 // src/components/Tabs/styled.ts
-import styled74, { css as css51 } from "styled-components";
+import styled74, { css as css50 } from "styled-components";
 var delimiters = {
   blue: ["blue"],
   grey: ["warningGray"]
@@ -17284,7 +17281,7 @@ var Tabs = styled74.div`
     bottom: "s4",
     left: "0"
   }).split(" ");
-  return css51`
+  return css50`
       margin: ${top} 0 ${bottom} 0;
       padding: 0 ${right} 0 ${left};
     `;
@@ -17292,7 +17289,7 @@ var Tabs = styled74.div`
 
   ${({ theme: theme4, $internal: internal, $delimiter: delimiter }) => {
   const border = delimiter === "none" ? "none" : internal ? `1px solid ${theme4.getColor(...delimiters[delimiter || "grey"])}` : `2px solid ${theme4.getColor(...delimiters[delimiter || "blue"])}`;
-  return css51`
+  return css50`
       border-bottom: ${border};
       + ${ComponentContainer} {
         border: 1px solid ${theme4.getColor(...delimiters.grey)};
@@ -17448,7 +17445,7 @@ var TextArea = ({
 var TextArea_default = TextArea;
 
 // src/components/Toast/styles.ts
-import styled76, { css as css52 } from "styled-components";
+import styled76, { css as css51 } from "styled-components";
 var Container30 = styled76.div`
   border-radius: 4px;
   width: ${({ $size: size3 }) => size3 === "large" ? "837px" : "460px"};
@@ -17456,7 +17453,7 @@ var Container30 = styled76.div`
   border: 1px solid transparent;
   position: relative;
 
-  ${({ $color: color }) => color === "success" && css52`
+  ${({ $color: color }) => color === "success" && css51`
       background-color: #fcfff5;
       opacity: 1;
       border-color: #a8c599;
@@ -17468,7 +17465,7 @@ var Container30 = styled76.div`
       }
     `}
 
-  ${({ $color: color }) => color === "error" && css52`
+  ${({ $color: color }) => color === "error" && css51`
       background-color: #fff6f6;
       opacity: 1;
       border-color: #973937;
@@ -17480,7 +17477,7 @@ var Container30 = styled76.div`
       }
     `}
 
-  ${({ $color: color }) => color === "warning" && css52`
+  ${({ $color: color }) => color === "warning" && css51`
       background-color: #fffaf3;
       opacity: 1;
       border-color: #ccbea0;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mw-kit/mw-ui",
-  "version": "1.8.7",
+  "version": "1.8.8",
   "description": "Made with create-react-library",
   "author": "fmgusmao",
   "license": "MIT",