@mw-kit/mw-ui 1.8.7 → 1.8.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { ColorOptions } from '../../theme/interfaces';
|
|
2
|
-
export type Types = 'default' | 'info' | 'danger' | 'success' | 'warning';
|
|
2
|
+
export type Types = 'default' | 'info' | 'danger' | 'success' | 'warning' | 'temporary';
|
|
3
3
|
export type Sizes = 'mini' | 'medium' | 'small';
|
|
4
4
|
export interface IndicatorProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
5
5
|
size: Sizes;
|
|
@@ -1,3 +1,5 @@
|
|
|
1
1
|
import type { StyledProgressBarProps } from './interfaces';
|
|
2
|
-
export declare const Container: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").
|
|
2
|
+
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>, {
|
|
3
|
+
$disabled: boolean;
|
|
4
|
+
}>> & string;
|
|
3
5
|
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
CHANGED
|
@@ -931,7 +931,7 @@ interface TimeProps extends Omit<InputProps$1, 'type' | 'mask'> {
|
|
|
931
931
|
value: string;
|
|
932
932
|
}
|
|
933
933
|
|
|
934
|
-
type Types = 'default' | 'info' | 'danger' | 'success' | 'warning';
|
|
934
|
+
type Types = 'default' | 'info' | 'danger' | 'success' | 'warning' | 'temporary';
|
|
935
935
|
type Sizes = 'mini' | 'medium' | 'small';
|
|
936
936
|
interface IndicatorProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
937
937
|
size: Sizes;
|
|
@@ -1501,7 +1501,7 @@ declare const Placeholder: (props: PlaceholderProps) => react_jsx_runtime.JSX.El
|
|
|
1501
1501
|
|
|
1502
1502
|
interface ProgressBarProps {
|
|
1503
1503
|
type: 'default' | 'info' | 'danger' | 'success' | 'warning';
|
|
1504
|
-
value:
|
|
1504
|
+
value: number | null;
|
|
1505
1505
|
}
|
|
1506
1506
|
|
|
1507
1507
|
declare const ProgressBar: ({ type, value, ...props }: ProgressBarProps) => react_jsx_runtime.JSX.Element;
|
package/dist/index.js
CHANGED
|
@@ -9065,7 +9065,8 @@ var types = {
|
|
|
9065
9065
|
info: "blue",
|
|
9066
9066
|
danger: "warningRed",
|
|
9067
9067
|
success: "green",
|
|
9068
|
-
warning: "warningYellow"
|
|
9068
|
+
warning: "warningYellow",
|
|
9069
|
+
temporary: "purple"
|
|
9069
9070
|
};
|
|
9070
9071
|
|
|
9071
9072
|
// src/components/Indicator/styles.ts
|
|
@@ -16858,51 +16859,51 @@ var Container25 = import_styled_components71.default.div`
|
|
|
16858
16859
|
display: flex;
|
|
16859
16860
|
flex-direction: row;
|
|
16860
16861
|
align-items: center;
|
|
16862
|
+
opacity: ${({ $disabled: disabled }) => disabled ? 0.5 : 1};
|
|
16863
|
+
width: 100%;
|
|
16861
16864
|
|
|
16862
|
-
span {
|
|
16865
|
+
> span {
|
|
16863
16866
|
display: inline-block;
|
|
16864
16867
|
margin-left: 7px;
|
|
16865
16868
|
color: #000000cc;
|
|
16866
16869
|
}
|
|
16867
16870
|
`;
|
|
16868
16871
|
var Progress = import_styled_components71.default.div`
|
|
16869
|
-
width:
|
|
16872
|
+
width: 100%;
|
|
16870
16873
|
height: 12px;
|
|
16871
16874
|
border: 1px solid #e4e4e4;
|
|
16872
|
-
div {
|
|
16873
|
-
width: ${({ $value: value }) => `${value}%`};
|
|
16874
|
-
max-width: 64px;
|
|
16875
|
-
height: 100%;
|
|
16876
|
-
${({ theme: theme4, $type: type }) => type === "default" && import_styled_components71.css`
|
|
16877
|
-
background-color: ${theme4.colors.warningGray};
|
|
16878
|
-
`}
|
|
16879
16875
|
|
|
16880
|
-
|
|
16881
|
-
|
|
16882
|
-
|
|
16876
|
+
> span {
|
|
16877
|
+
content: '';
|
|
16878
|
+
display: flex;
|
|
16883
16879
|
|
|
16884
|
-
|
|
16885
|
-
background-color: ${theme4.colors.warningRed};
|
|
16886
|
-
`}
|
|
16880
|
+
height: 100%;
|
|
16887
16881
|
|
|
16888
|
-
|
|
16889
|
-
|
|
16890
|
-
|
|
16882
|
+
transition-property: width background-color;
|
|
16883
|
+
transition-duration: 0.25s;
|
|
16884
|
+
transition-timing-function: ease-in-out;
|
|
16891
16885
|
|
|
16892
|
-
${({ theme: theme4, $type: type }) =>
|
|
16893
|
-
|
|
16894
|
-
|
|
16886
|
+
background-color: ${({ theme: theme4, $type: type }) => {
|
|
16887
|
+
const colors2 = {
|
|
16888
|
+
default: "warningGray",
|
|
16889
|
+
info: "blue",
|
|
16890
|
+
danger: "warningRed",
|
|
16891
|
+
success: "green",
|
|
16892
|
+
warning: "warningYellow"
|
|
16893
|
+
};
|
|
16894
|
+
return theme4.colors[colors2[type]];
|
|
16895
|
+
}};
|
|
16895
16896
|
}
|
|
16896
16897
|
`;
|
|
16897
16898
|
|
|
16898
16899
|
// src/components/ProgressBar/index.tsx
|
|
16899
16900
|
var import_jsx_runtime359 = require("react/jsx-runtime");
|
|
16900
16901
|
var ProgressBar = ({ type, value, ...props }) => {
|
|
16901
|
-
return /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)(Container25, { children: [
|
|
16902
|
-
/* @__PURE__ */ (0, import_jsx_runtime359.jsx)(Progress, { ...props, $type: type,
|
|
16902
|
+
return /* @__PURE__ */ (0, import_jsx_runtime359.jsxs)(Container25, { $disabled: value === null, children: [
|
|
16903
|
+
/* @__PURE__ */ (0, import_jsx_runtime359.jsx)(Progress, { ...props, $type: type, children: /* @__PURE__ */ (0, import_jsx_runtime359.jsx)("span", { style: { width: `${value || 0}%` } }) }),
|
|
16903
16904
|
/* @__PURE__ */ (0, import_jsx_runtime359.jsxs)("span", { children: [
|
|
16904
16905
|
" ",
|
|
16905
|
-
value
|
|
16906
|
+
value === null ? "-" : value,
|
|
16906
16907
|
"%"
|
|
16907
16908
|
] })
|
|
16908
16909
|
] });
|
|
@@ -17137,10 +17138,7 @@ var Close2 = (props) => {
|
|
|
17137
17138
|
if (!await onClose(index, options[index], event)) {
|
|
17138
17139
|
return;
|
|
17139
17140
|
}
|
|
17140
|
-
const newactive =
|
|
17141
|
-
if (index < active) return active - 1;
|
|
17142
|
-
return active > 0 ? active - 1 : active;
|
|
17143
|
-
})();
|
|
17141
|
+
const newactive = index < active || !newOptions[active] ? active - 1 : active;
|
|
17144
17142
|
setActive(newactive, newOptions[newactive].data);
|
|
17145
17143
|
setOptions(newOptions);
|
|
17146
17144
|
},
|
package/dist/index.mjs
CHANGED
|
@@ -9008,7 +9008,8 @@ var types = {
|
|
|
9008
9008
|
info: "blue",
|
|
9009
9009
|
danger: "warningRed",
|
|
9010
9010
|
success: "green",
|
|
9011
|
-
warning: "warningYellow"
|
|
9011
|
+
warning: "warningYellow",
|
|
9012
|
+
temporary: "purple"
|
|
9012
9013
|
};
|
|
9013
9014
|
|
|
9014
9015
|
// src/components/Indicator/styles.ts
|
|
@@ -16796,56 +16797,56 @@ var Placeholder = (props) => {
|
|
|
16796
16797
|
var Placeholder_default = Placeholder;
|
|
16797
16798
|
|
|
16798
16799
|
// src/components/ProgressBar/styles.ts
|
|
16799
|
-
import styled68
|
|
16800
|
+
import styled68 from "styled-components";
|
|
16800
16801
|
var Container25 = styled68.div`
|
|
16801
16802
|
display: flex;
|
|
16802
16803
|
flex-direction: row;
|
|
16803
16804
|
align-items: center;
|
|
16805
|
+
opacity: ${({ $disabled: disabled }) => disabled ? 0.5 : 1};
|
|
16806
|
+
width: 100%;
|
|
16804
16807
|
|
|
16805
|
-
span {
|
|
16808
|
+
> span {
|
|
16806
16809
|
display: inline-block;
|
|
16807
16810
|
margin-left: 7px;
|
|
16808
16811
|
color: #000000cc;
|
|
16809
16812
|
}
|
|
16810
16813
|
`;
|
|
16811
16814
|
var Progress = styled68.div`
|
|
16812
|
-
width:
|
|
16815
|
+
width: 100%;
|
|
16813
16816
|
height: 12px;
|
|
16814
16817
|
border: 1px solid #e4e4e4;
|
|
16815
|
-
div {
|
|
16816
|
-
width: ${({ $value: value }) => `${value}%`};
|
|
16817
|
-
max-width: 64px;
|
|
16818
|
-
height: 100%;
|
|
16819
|
-
${({ theme: theme4, $type: type }) => type === "default" && css48`
|
|
16820
|
-
background-color: ${theme4.colors.warningGray};
|
|
16821
|
-
`}
|
|
16822
16818
|
|
|
16823
|
-
|
|
16824
|
-
|
|
16825
|
-
|
|
16819
|
+
> span {
|
|
16820
|
+
content: '';
|
|
16821
|
+
display: flex;
|
|
16826
16822
|
|
|
16827
|
-
|
|
16828
|
-
background-color: ${theme4.colors.warningRed};
|
|
16829
|
-
`}
|
|
16823
|
+
height: 100%;
|
|
16830
16824
|
|
|
16831
|
-
|
|
16832
|
-
|
|
16833
|
-
|
|
16825
|
+
transition-property: width background-color;
|
|
16826
|
+
transition-duration: 0.25s;
|
|
16827
|
+
transition-timing-function: ease-in-out;
|
|
16834
16828
|
|
|
16835
|
-
${({ theme: theme4, $type: type }) =>
|
|
16836
|
-
|
|
16837
|
-
|
|
16829
|
+
background-color: ${({ theme: theme4, $type: type }) => {
|
|
16830
|
+
const colors2 = {
|
|
16831
|
+
default: "warningGray",
|
|
16832
|
+
info: "blue",
|
|
16833
|
+
danger: "warningRed",
|
|
16834
|
+
success: "green",
|
|
16835
|
+
warning: "warningYellow"
|
|
16836
|
+
};
|
|
16837
|
+
return theme4.colors[colors2[type]];
|
|
16838
|
+
}};
|
|
16838
16839
|
}
|
|
16839
16840
|
`;
|
|
16840
16841
|
|
|
16841
16842
|
// src/components/ProgressBar/index.tsx
|
|
16842
16843
|
import { jsx as jsx359, jsxs as jsxs180 } from "react/jsx-runtime";
|
|
16843
16844
|
var ProgressBar = ({ type, value, ...props }) => {
|
|
16844
|
-
return /* @__PURE__ */ jsxs180(Container25, { children: [
|
|
16845
|
-
/* @__PURE__ */ jsx359(Progress, { ...props, $type: type,
|
|
16845
|
+
return /* @__PURE__ */ jsxs180(Container25, { $disabled: value === null, children: [
|
|
16846
|
+
/* @__PURE__ */ jsx359(Progress, { ...props, $type: type, children: /* @__PURE__ */ jsx359("span", { style: { width: `${value || 0}%` } }) }),
|
|
16846
16847
|
/* @__PURE__ */ jsxs180("span", { children: [
|
|
16847
16848
|
" ",
|
|
16848
|
-
value
|
|
16849
|
+
value === null ? "-" : value,
|
|
16849
16850
|
"%"
|
|
16850
16851
|
] })
|
|
16851
16852
|
] });
|
|
@@ -16909,7 +16910,7 @@ var ScrollButton = (props) => {
|
|
|
16909
16910
|
var ScrollButton_default = ScrollButton;
|
|
16910
16911
|
|
|
16911
16912
|
// src/components/Tabs/components/ScrollButtons/styled.ts
|
|
16912
|
-
import styled70, { css as
|
|
16913
|
+
import styled70, { css as css48 } from "styled-components";
|
|
16913
16914
|
var Container27 = styled70.div`
|
|
16914
16915
|
overflow-x: auto;
|
|
16915
16916
|
scrollbar-width: thin;
|
|
@@ -16925,7 +16926,7 @@ var Container27 = styled70.div`
|
|
|
16925
16926
|
display: none; /* Chrome, Safari, Opera */
|
|
16926
16927
|
}
|
|
16927
16928
|
|
|
16928
|
-
${({ theme: theme4, $internal: internal }) => internal &&
|
|
16929
|
+
${({ theme: theme4, $internal: internal }) => internal && css48`
|
|
16929
16930
|
gap: ${theme4.spacings.s6};
|
|
16930
16931
|
`}
|
|
16931
16932
|
`;
|
|
@@ -17080,10 +17081,7 @@ var Close2 = (props) => {
|
|
|
17080
17081
|
if (!await onClose(index, options[index], event)) {
|
|
17081
17082
|
return;
|
|
17082
17083
|
}
|
|
17083
|
-
const newactive =
|
|
17084
|
-
if (index < active) return active - 1;
|
|
17085
|
-
return active > 0 ? active - 1 : active;
|
|
17086
|
-
})();
|
|
17084
|
+
const newactive = index < active || !newOptions[active] ? active - 1 : active;
|
|
17087
17085
|
setActive(newactive, newOptions[newactive].data);
|
|
17088
17086
|
setOptions(newOptions);
|
|
17089
17087
|
},
|
|
@@ -17107,7 +17105,7 @@ var Close_default = Close2;
|
|
|
17107
17105
|
import { useState as useState25 } from "react";
|
|
17108
17106
|
|
|
17109
17107
|
// src/components/Tabs/components/TabItem/components/LabelItem/styled.ts
|
|
17110
|
-
import styled72, { css as
|
|
17108
|
+
import styled72, { css as css49 } from "styled-components";
|
|
17111
17109
|
var StyledTab = styled72.div`
|
|
17112
17110
|
position: relative;
|
|
17113
17111
|
flex: 1;
|
|
@@ -17141,7 +17139,7 @@ var StyledTab = styled72.div`
|
|
|
17141
17139
|
transition: --color 0.5s, --bgColor 0.5s;
|
|
17142
17140
|
}
|
|
17143
17141
|
|
|
17144
|
-
${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal &&
|
|
17142
|
+
${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal && css49`
|
|
17145
17143
|
&::before {
|
|
17146
17144
|
content: '';
|
|
17147
17145
|
position: absolute;
|
|
@@ -17263,7 +17261,7 @@ var TabItem = (props) => {
|
|
|
17263
17261
|
var TabItem_default = TabItem;
|
|
17264
17262
|
|
|
17265
17263
|
// src/components/Tabs/styled.ts
|
|
17266
|
-
import styled74, { css as
|
|
17264
|
+
import styled74, { css as css50 } from "styled-components";
|
|
17267
17265
|
var delimiters = {
|
|
17268
17266
|
blue: ["blue"],
|
|
17269
17267
|
grey: ["warningGray"]
|
|
@@ -17284,7 +17282,7 @@ var Tabs = styled74.div`
|
|
|
17284
17282
|
bottom: "s4",
|
|
17285
17283
|
left: "0"
|
|
17286
17284
|
}).split(" ");
|
|
17287
|
-
return
|
|
17285
|
+
return css50`
|
|
17288
17286
|
margin: ${top} 0 ${bottom} 0;
|
|
17289
17287
|
padding: 0 ${right} 0 ${left};
|
|
17290
17288
|
`;
|
|
@@ -17292,7 +17290,7 @@ var Tabs = styled74.div`
|
|
|
17292
17290
|
|
|
17293
17291
|
${({ theme: theme4, $internal: internal, $delimiter: delimiter }) => {
|
|
17294
17292
|
const border = delimiter === "none" ? "none" : internal ? `1px solid ${theme4.getColor(...delimiters[delimiter || "grey"])}` : `2px solid ${theme4.getColor(...delimiters[delimiter || "blue"])}`;
|
|
17295
|
-
return
|
|
17293
|
+
return css50`
|
|
17296
17294
|
border-bottom: ${border};
|
|
17297
17295
|
+ ${ComponentContainer} {
|
|
17298
17296
|
border: 1px solid ${theme4.getColor(...delimiters.grey)};
|
|
@@ -17448,7 +17446,7 @@ var TextArea = ({
|
|
|
17448
17446
|
var TextArea_default = TextArea;
|
|
17449
17447
|
|
|
17450
17448
|
// src/components/Toast/styles.ts
|
|
17451
|
-
import styled76, { css as
|
|
17449
|
+
import styled76, { css as css51 } from "styled-components";
|
|
17452
17450
|
var Container30 = styled76.div`
|
|
17453
17451
|
border-radius: 4px;
|
|
17454
17452
|
width: ${({ $size: size3 }) => size3 === "large" ? "837px" : "460px"};
|
|
@@ -17456,7 +17454,7 @@ var Container30 = styled76.div`
|
|
|
17456
17454
|
border: 1px solid transparent;
|
|
17457
17455
|
position: relative;
|
|
17458
17456
|
|
|
17459
|
-
${({ $color: color }) => color === "success" &&
|
|
17457
|
+
${({ $color: color }) => color === "success" && css51`
|
|
17460
17458
|
background-color: #fcfff5;
|
|
17461
17459
|
opacity: 1;
|
|
17462
17460
|
border-color: #a8c599;
|
|
@@ -17468,7 +17466,7 @@ var Container30 = styled76.div`
|
|
|
17468
17466
|
}
|
|
17469
17467
|
`}
|
|
17470
17468
|
|
|
17471
|
-
${({ $color: color }) => color === "error" &&
|
|
17469
|
+
${({ $color: color }) => color === "error" && css51`
|
|
17472
17470
|
background-color: #fff6f6;
|
|
17473
17471
|
opacity: 1;
|
|
17474
17472
|
border-color: #973937;
|
|
@@ -17480,7 +17478,7 @@ var Container30 = styled76.div`
|
|
|
17480
17478
|
}
|
|
17481
17479
|
`}
|
|
17482
17480
|
|
|
17483
|
-
${({ $color: color }) => color === "warning" &&
|
|
17481
|
+
${({ $color: color }) => color === "warning" && css51`
|
|
17484
17482
|
background-color: #fffaf3;
|
|
17485
17483
|
opacity: 1;
|
|
17486
17484
|
border-color: #ccbea0;
|