@mw-kit/mw-ui 1.8.6 → 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

@@ -30,7 +30,7 @@ type MappedTransitions<P extends string> = {
     };
 };
 
-declare const theme: {
+declare const theme$1: {
     readonly button: {
         readonly sizes: {
             tiny: {
@@ -91,7 +91,7 @@ interface ThemeInterface {
     isDarkColor: (color: ColorOptions, ifDark?: ColorOptions, ifLight?: ColorOptions) => ColorOptions;
     spacings: typeof spacings;
     typographies: typeof typographies;
-    components: typeof theme;
+    components: typeof theme$1;
 }
 
 declare const colors: {
@@ -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;
@@ -1553,8 +1553,9 @@ interface ZoomProps {
 
 declare const Zoom: (props: ZoomProps) => react_jsx_runtime.JSX.Element;
 
+declare const theme: ThemeInterface;
 declare const ThemeProvider: (props: {
     children: JSX.Element | string | (JSX.Element | string)[];
 }) => react_jsx_runtime.JSX.Element;
 
-export { AbsoluteContainer as MwAbsoluteContainer, AppliedFilters as MwAppliedFilters, Button as MwButton, Calendar as MwCalendar, Card as MwCard, EllipsisContainer as MwEllipsisContainer, Filters as MwFilters, Form as MwForm, Grid as MwGrid, Icon as MwIcon, Indicator as MwIndicator, Input as MwInput, Link as MwLink, Loader as MwLoader, Menu as MwMenu, Modal as MwModal, Placeholder as MwPlaceholder, ProgressBar as MwProgressBar, ScrollContainer as MwScrollContainer, Tabs as MwTabs, TextArea as MwTextArea, Toast as MwToast, Transition as MwTransition, Zoom as MwZoom, ThemeProvider, useTransition as useMwTransition };
+export { AbsoluteContainer as MwAbsoluteContainer, AppliedFilters as MwAppliedFilters, Button as MwButton, Calendar as MwCalendar, Card as MwCard, EllipsisContainer as MwEllipsisContainer, Filters as MwFilters, Form as MwForm, Grid as MwGrid, Icon as MwIcon, Indicator as MwIndicator, Input as MwInput, Link as MwLink, Loader as MwLoader, Menu as MwMenu, Modal as MwModal, Placeholder as MwPlaceholder, ProgressBar as MwProgressBar, ScrollContainer as MwScrollContainer, Tabs as MwTabs, TextArea as MwTextArea, Toast as MwToast, Transition as MwTransition, Zoom as MwZoom, ThemeProvider, theme, useTransition as useMwTransition };

package/dist/index.d.ts

@@ -1,2 +1,2 @@
 export * from './components';
-export { default as ThemeProvider } from './theme';
+export { theme, default as ThemeProvider } from './theme';

package/dist/index.js

@@ -55,6 +55,7 @@ __export(index_exports, {
   MwTransition: () => Transition_default2,
   MwZoom: () => Zoom_default,
   ThemeProvider: () => theme_default3,
+  theme: () => theme3,
   useMwTransition: () => useTransition_default
 });
 module.exports = __toCommonJS(index_exports);
@@ -16857,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,
       "%"
     ] })
   ] });
@@ -17136,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);
     },
@@ -17744,5 +17742,6 @@ var Zoom_default = Zoom;
   MwTransition,
   MwZoom,
   ThemeProvider,
+  theme,
   useMwTransition
 });

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;
@@ -17687,5 +17684,6 @@ export {
   Transition_default2 as MwTransition,
   Zoom_default as MwZoom,
   theme_default3 as ThemeProvider,
+  theme3 as theme,
   useTransition_default as useMwTransition
 };

package/package.json

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