@opensumi/ide-components 1.1.4-next-1641353261.0

package/lib/badge/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './styles.less';
+export declare const Badge: React.FC<{} & React.HTMLAttributes<HTMLSpanElement>>;
+//# sourceMappingURL=index.d.ts.map

package/lib/badge/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/badge/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,eAAe,CAAC;AAEvB,eAAO,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAItE,CAAC"}

package/lib/badge/index.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Badge = void 0;
+const tslib_1 = require("tslib");
+const react_1 = (0, tslib_1.__importDefault)(require("react"));
+const classnames_1 = (0, tslib_1.__importDefault)(require("classnames"));
+require("./styles.less");
+const Badge = (_a) => {
+    var { className, children } = _a, restProps = (0, tslib_1.__rest)(_a, ["className", "children"]);
+    return (react_1.default.createElement("span", Object.assign({ className: (0, classnames_1.default)('kt-badge', className) }, restProps), children));
+};
+exports.Badge = Badge;
+//# sourceMappingURL=index.js.map

package/lib/badge/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/badge/index.tsx"],"names":[],"mappings":";;;;AAAA,+DAA0B;AAC1B,yEAA6B;AAE7B,yBAAuB;AAEhB,MAAM,KAAK,GAAyD,CAAC,EAAqC,EAAE,EAAE;QAAzC,EAAE,SAAS,EAAE,QAAQ,OAAgB,EAAX,SAAS,2BAAnC,yBAAqC,CAAF;IAAO,OAAA,CACpH,sDAAM,SAAS,EAAE,IAAA,oBAAG,EAAC,UAAU,EAAE,SAAS,CAAC,IAAM,SAAS,GACvD,QAAQ,CACJ,CACR,CAAA;CAAA,CAAC;AAJW,QAAA,KAAK,SAIhB"}

package/lib/badge/styles.less

@@ -0,0 +1,17 @@
+.kt-badge {
+  background-color: var(--badge-background);
+  color: var(--badge-foreground);
+  border: 1px solid var(--kt-badge-border);
+  height: 18px;
+  line-height: 18px;
+  border-radius: 18px;
+  font-size: 12px;
+  font-weight: 400;
+  text-align: center;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  padding: 0 5px;
+  min-width: 18px;
+}

package/lib/button/index.d.ts

@@ -0,0 +1,54 @@
+import React from 'react';
+import './style.less';
+import { DefaultIconKeys } from '../icon';
+export declare type ButtonType = 'primary' | 'secondary' | 'ghost' | 'danger' | 'link' | 'icon' | 'default';
+export declare type ButtonHTMLType = 'submit' | 'button' | 'reset';
+export declare type ButtonSize = 'large' | 'default' | 'small';
+interface IButtonBasicProps<T> {
+    type?: ButtonType;
+    iconClass?: string;
+    icon?: DefaultIconKeys | T;
+    className?: string;
+    loading?: boolean;
+    ghost?: boolean;
+    size?: ButtonSize;
+    disabled?: boolean;
+    block?: boolean;
+}
+interface MoreActionProps {
+    more?: boolean;
+    moreIconClass?: string;
+    menu?: React.ReactNode;
+    onVisibleChange?: (visible: boolean) => void;
+}
+export declare type ButtonProps<T> = {
+    htmlType?: ButtonHTMLType;
+    onClick?: React.MouseEventHandler<HTMLElement>;
+} & IButtonBasicProps<T> & MoreActionProps & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'type' | 'onClick'>;
+/**
+ * @example
+ * ```ts
+ * <Button type='primary' | 'secondary' | 'ghost' | 'danger' | 'link' | 'icon'>click</Button>
+ * // icon
+ * <Button type='primary' icon='share'>click</Button>
+ *
+ * // or
+ * <Button type='primary' iconClass=`${customPrefix} iconkey`>click</Button>
+ *
+ * // size
+ * <Button size='large' | 'default' | 'small' type='primary' iconClass=`${customPrefix} iconkey`>click</Button>
+ *
+ * // more 点击后展开一个 dropdown
+ * <Button more menu={(<div>
+ *  <p>item1</p>
+ *  <p>item1</p>
+ *  </div>)}>click</Button>
+ *
+ * // 使用自定义 icon
+ * <Button<'icon1' | 'icon2'> icon='icon1' type='icon' />
+ * <Button<'icon1' | 'icon2'> iconClass=`${customPrefix} icon1` type='icon' />
+ * ```
+ */
+export declare const Button: React.MemoExoticComponent<(<T extends string>({ children, loading, className, type, htmlType, size, ghost, onClick, disabled, block, iconClass, icon, more, moreIconClass, menu, title, onVisibleChange, ...otherProps }: ButtonProps<T>) => React.ReactElement<ButtonProps<T>, string | React.JSXElementConstructor<any>>)>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/lib/button/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/button/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,cAAc,CAAC;AACtB,OAAO,EAAwB,eAAe,EAAE,MAAM,SAAS,CAAC;AAEhE,oBAAY,UAAU,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC;AAEpG,oBAAY,cAAc,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE3D,oBAAY,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;AAEvD,UAAU,iBAAiB,CAAC,CAAC;IAC3B,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,eAAe,GAAG,CAAC,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,UAAU,eAAe;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAED,oBAAY,WAAW,CAAC,CAAC,IAAI;IAC3B,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,WAAW,CAAC,CAAC;CAChD,GAAG,iBAAiB,CAAC,CAAC,CAAC,GACtB,eAAe,GACf,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC,CAAC;AAmB1E;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,eAAO,MAAM,MAAM,8TAsFlB,CAAC"}

package/lib/button/index.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Button = void 0;
+const tslib_1 = require("tslib");
+const react_1 = (0, tslib_1.__importDefault)(require("react"));
+const dropdown_1 = require("../dropdown");
+const classnames_1 = (0, tslib_1.__importDefault)(require("classnames"));
+require("./style.less");
+const icon_1 = require("../icon");
+const LoadingCircle = () => (react_1.default.createElement("svg", { viewBox: '0 0 1024 1024', focusable: 'false', className: 'kt-button-anticon-spin', "data-icon": 'loading', width: '1em', height: '1em', fill: 'currentColor', "aria-hidden": 'true' },
+    react_1.default.createElement("path", { d: 'M988 548c-19.9 0-36-16.1-36-36 0-59.4-11.6-117-34.6-171.3a440.45 440.45 0 0 0-94.3-139.9 437.71 437.71 0 0 0-139.9-94.3C629 83.6 571.4 72 512 72c-19.9 0-36-16.1-36-36s16.1-36 36-36c69.1 0 136.2 13.5 199.3 40.3C772.3 66 827 103 874 150c47 47 83.9 101.8 109.7 162.7 26.7 63.1 40.2 130.2 40.2 199.3.1 19.9-16 36-35.9 36z' })));
+function noop() { }
+/**
+ * @example
+ * ```ts
+ * <Button type='primary' | 'secondary' | 'ghost' | 'danger' | 'link' | 'icon'>click</Button>
+ * // icon
+ * <Button type='primary' icon='share'>click</Button>
+ *
+ * // or
+ * <Button type='primary' iconClass=`${customPrefix} iconkey`>click</Button>
+ *
+ * // size
+ * <Button size='large' | 'default' | 'small' type='primary' iconClass=`${customPrefix} iconkey`>click</Button>
+ *
+ * // more 点击后展开一个 dropdown
+ * <Button more menu={(<div>
+ *  <p>item1</p>
+ *  <p>item1</p>
+ *  </div>)}>click</Button>
+ *
+ * // 使用自定义 icon
+ * <Button<'icon1' | 'icon2'> icon='icon1' type='icon' />
+ * <Button<'icon1' | 'icon2'> iconClass=`${customPrefix} icon1` type='icon' />
+ * ```
+ */
+exports.Button = react_1.default.memo((_a) => {
+    var { children, loading, className, type = 'primary', htmlType, size, ghost = false, onClick, disabled, block, iconClass, icon, more, moreIconClass, menu, title, onVisibleChange } = _a, otherProps = (0, tslib_1.__rest)(_a, ["children", "loading", "className", "type", "htmlType", "size", "ghost", "onClick", "disabled", "block", "iconClass", "icon", "more", "moreIconClass", "menu", "title", "onVisibleChange"]);
+    const classes = (0, classnames_1.default)('kt-button', className, {
+        [`kt-${type}-button-loading`]: loading,
+        [`ghost-${type}-button`]: ghost && !loading && type !== 'link',
+        [`${type}-button`]: type,
+        [`${size}-button-size`]: size,
+        ['ghost-button']: ghost && type !== 'link',
+        ['block-button']: block,
+    });
+    const iconClesses = (0, classnames_1.default)(className, {
+        ['kt-clickable-icon']: !!onClick,
+    });
+    if (type === 'icon') {
+        return (react_1.default.createElement(icon_1.Icon, Object.assign({ tooltip: title, disabled: disabled, icon: icon, onClick: loading || disabled ? noop : onClick, className: iconClesses, iconClass: iconClass }, otherProps)));
+    }
+    const iconNode = iconClass ? react_1.default.createElement(icon_1.Icon, { iconClass: iconClass, disabled: disabled }) : null;
+    if (more) {
+        return (react_1.default.createElement(dropdown_1.Dropdown, { className: 'kt-menu', overlay: menu, trigger: ['click'], onVisibleChange: onVisibleChange },
+            react_1.default.createElement("button", Object.assign({}, otherProps, { disabled: disabled, className: classes, type: htmlType, onClick: loading || disabled ? noop : onClick }),
+                loading && type !== 'link' && react_1.default.createElement(LoadingCircle, null),
+                iconNode && iconNode,
+                children,
+                more && (react_1.default.createElement(icon_1.Icon, { iconClass: moreIconClass ? moreIconClass : (0, icon_1.getKaitianIcon)('down'), className: 'kt-button-secondary-more' })))));
+    }
+    return (react_1.default.createElement("button", Object.assign({}, otherProps, { disabled: disabled, className: classes, type: htmlType, onClick: loading || disabled ? noop : onClick }),
+        loading && type !== 'link' && react_1.default.createElement(LoadingCircle, null),
+        iconNode && iconNode,
+        children));
+});
+//# sourceMappingURL=index.js.map

package/lib/button/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/button/index.tsx"],"names":[],"mappings":"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"}

package/lib/button/style.less

@@ -0,0 +1,251 @@
+.kt-clickable-icon {
+  &:hover {
+    transform: scale(1.2);
+  }
+
+  &:active {
+    transform: scale(1.2);
+  }
+}
+
+.kt-icon-resource::before {
+  display: inherit;
+  background-size: 16px;
+  background-position: center;
+  background-repeat: no-repeat;
+  width: 22px;
+  height: 22px;
+  -webkit-font-smoothing: antialiased;
+  flex-shrink: 0;
+}
+
+.kt-button {
+  border: none;
+  outline: none;
+  cursor: pointer;
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 12px;
+  padding: 0px 12px;
+  height: 28px;
+  line-height: 1;
+  box-sizing: border-box;
+  border-radius: 2px;
+  color: var(--button-foreground);
+  background-color: var(--button-background);
+  transition: all 0.15s;
+
+  &.block-button {
+    width: 100%;
+  }
+
+  & > .kt-button-secondary-more {
+    color: inherit;
+    margin-left: 5px;
+  }
+}
+
+.ghost-button {
+  border-style: solid;
+  border-width: 1px;
+
+  &:disabled {
+    border-color: transparent;
+    border: none;
+  }
+}
+
+@keyframes loadingCircle {
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+.kt-button-anticon-spin {
+  animation: loadingCircle 1s infinite linear;
+  margin-right: 5px;
+}
+
+.default-button {
+  color: var(--kt-defaultButton-foreground);
+  background-color: var(--kt-defaultButton-background);
+
+  &:hover {
+    background-color: var(--kt-defaultButton-hoverBackground);
+  }
+
+  &:active {
+    background-color: var(--kt-defaultButton-clickBackground);
+  }
+}
+
+.primary-button {
+  color: var(--kt-primaryButton-foreground);
+  background-color: var(--kt-primaryButton-background);
+
+  &:hover {
+    background-color: var(--kt-primaryButton-hoverBackground);
+  }
+
+  &:active {
+    background-color: var(--kt-primaryButton-clickBackground);
+  }
+}
+
+.secondary-button {
+  color: var(--kt-secondaryButton-foreground);
+  background-color: var(--kt-secondaryButton-background);
+  border-style: solid;
+  border-width: 1px;
+  border-color: var(--kt-secondaryButton-border);
+
+  &:hover {
+    color: var(--kt-secondaryButton-hoverForeground);
+    background-color: var(--kt-secondaryButton-hoverBackground);
+    border-color: var(--kt-secondaryButton-hoverBorder);
+  }
+
+  &:active {
+    color: var(--kt-secondaryButton-clickForeground);
+    background-color: var(--kt-secondaryButton-clickBackground);
+    border-color: var(--kt-secondaryButton-clickBorder);
+  }
+}
+
+.ghost-secondary-button {
+  color: var(--kt-whiteGhostButton-foreground);
+  background-color: var(--kt-whiteGhostButton-background);
+  border-color: transparent;
+
+  &:hover {
+    color: var(--kt-whiteGhostButton-foreground);
+    background-color: transparent;
+    border-color: var(--kt-whiteGhostButton-border);
+  }
+
+  &:active {
+    color: var(--kt-whiteGhostButton-clickForeground);
+    background-color: transparent;
+    border-color: var(--kt-whiteGhostButton-clickBorder);
+  }
+
+  &:disabled {
+    color: var(--kt-whiteGhostButton-disableForeground);
+    border-color: transparent;
+  }
+}
+
+.link-button {
+  color: var(--kt-linkButton-foreground);
+  background-color: transparent;
+
+  &:hover {
+    color: var(--kt-linkButton-hoverForeground);
+    background-color: transparent;
+    border-color: transparent;
+  }
+
+  &:active {
+    color: var(--kt-linkButton-clickForeground);
+    border-color: transparent;
+    background-color: transparent;
+  }
+
+  &:disabled {
+    color: var(--kt-linkButton-disableForeground);
+    border-color: transparent !important;
+    background-color: transparent !important;
+  }
+}
+
+.ghost-primary-button:disabled {
+  border-color: transparent;
+  background-color: transparent;
+}
+
+.ghost-button:disabled,
+.danger-button:disabled,
+.secondary-button:disabled,
+.primary-button:disabled,
+.ghost-danger-button:disabled,
+.kt-danger-button-loading,
+.kt-primary-button-loading,
+.kt-secondary-button-loading {
+  color: var(--kt-button-disableForeground) !important;
+  border-color: var(--kt-button-disableBorder) !important;
+  background-color: var(--kt-button-disableBackground) !important;
+  border-style: solid;
+  border-width: 1px;
+
+  & > .kt-button-secondary-more {
+    color: var(--kt-button-disableForeground);
+  }
+}
+
+.ghost-primary-button {
+  color: var(--kt-primaryGhostButton-foreground);
+  background-color: var(--kt-primaryGhostButton-background);
+  border-color: transparent;
+
+  &:hover {
+    border-color: var(--kt-primaryGhostButton-border);
+    background-color: transparent;
+  }
+}
+
+.ghost-primary-button:active {
+  color: var(--kt-primaryGhostButton-clickForeground);
+  background-color: var(--kt-primaryGhostButton-clickBackground);
+  border-color: var(--kt-primaryGhostButton-clickBorder);
+}
+
+.danger-button {
+  color: var(--kt-dangerButton-foreground);
+  background-color: var(--kt-dangerButton-background);
+
+  &:hover {
+    background-color: var(--kt-dangerButton-hoverBackground);
+  }
+
+  &:active {
+    background-color: var(--kt-dangerButton-clickBackground);
+  }
+}
+
+.ghost-danger-button {
+  color: var(--kt-dangerGhostButton-foreground);
+  background-color: var(--kt-dangerGhostButton-background);
+  border-color: var(--kt-dangerGhostButton-border);
+
+  &:hover {
+    background-color: transparent;
+    border-color: var(--kt-dangerGhostButton-hoverBorder);
+  }
+
+  &:active {
+    background-color: var(--kt-dangerGhostButton-clickBackground);
+    border-color: var(--kt-dangerGhostButton-clickBorder);
+  }
+}
+
+.large-button-size {
+  padding: 0px 16px;
+  height: 32px;
+  line-height: 32px;
+  font-size: 14px;
+}
+
+.default-button-size {
+  padding: 0px 12px;
+  height: 28px;
+  line-height: 28px;
+  font-size: 12px;
+}
+
+.small-button-size {
+  padding: 0px 8px;
+  height: 22px;
+  line-height: 22px;
+  font-size: 12px;
+}

package/lib/checkbox/index.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import './style.less';
+export declare const CheckBox: React.FC<React.HTMLProps<HTMLInputElement> & {
+    insertClass?: string;
+    label?: string;
+    size?: 'default' | 'large';
+    disabled?: boolean;
+}>;
+//# sourceMappingURL=index.d.ts.map

package/lib/checkbox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/checkbox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,cAAc,CAAC;AAQtB,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAC7B,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,GAAG;IAClC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,CAAC;IAC3B,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAoBF,CAAC"}

package/lib/checkbox/index.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CheckBox = void 0;
+const tslib_1 = require("tslib");
+const react_1 = (0, tslib_1.__importDefault)(require("react"));
+const classnames_1 = (0, tslib_1.__importDefault)(require("classnames"));
+const warning_1 = require("../utils/warning");
+require("./style.less");
+const CheckIconSvg = () => (react_1.default.createElement("svg", { fill: 'currentColor', width: '1em', height: '1em', viewBox: '0 0 1024 1024', xmlns: 'http://www.w3.org/2000/svg' },
+    react_1.default.createElement("path", { d: 'M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474c-6.1-7.7-15.3-12.2-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z' })));
+const CheckBox = (_a) => {
+    var { insertClass, className, label, size = 'default', disabled, checked = false } = _a, restProps = (0, tslib_1.__rest)(_a, ["insertClass", "className", "label", "size", "disabled", "checked"]);
+    (0, warning_1.warning)(!insertClass, '`insertClass` was deprecated, please use `className` instead');
+    const cls = (0, classnames_1.default)('kt-checkbox', insertClass, className, {
+        'kt-checkbox-large': size === 'large',
+        'kt-checkbox-disabled': disabled,
+    });
+    return (react_1.default.createElement("label", { className: cls },
+        react_1.default.createElement("span", { className: 'kt-checkbox-lump' },
+            react_1.default.createElement("input", Object.assign({ type: 'checkbox', disabled: disabled, checked: checked }, restProps)),
+            react_1.default.createElement("span", { className: 'kt-checkbox-icon' },
+                react_1.default.createElement(CheckIconSvg, null))),
+        label || ' '));
+};
+exports.CheckBox = CheckBox;
+exports.CheckBox.displayName = 'KTCheckBox';
+//# sourceMappingURL=index.js.map

package/lib/checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/checkbox/index.tsx"],"names":[],"mappings":";;;;AAAA,+DAA0B;AAC1B,yEAAoC;AACpC,8CAA2C;AAE3C,wBAAsB;AAEtB,MAAM,YAAY,GAAG,GAAG,EAAE,CAAC,CACzB,uCAAK,IAAI,EAAC,cAAc,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,KAAK,EAAC,OAAO,EAAC,eAAe,EAAC,KAAK,EAAC,4BAA4B;IAC1G,wCAAM,CAAC,EAAC,kMAAkM,GAAG,CACzM,CACP,CAAC;AAEK,MAAM,QAAQ,GAOjB,CAAC,EAA4F,EAAE,EAAE;QAAhG,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,GAAG,SAAS,EAAE,QAAQ,EAAE,OAAO,GAAG,KAAK,OAAgB,EAAX,SAAS,2BAA1F,oEAA4F,CAAF;IAC7F,IAAA,iBAAO,EAAC,CAAC,WAAW,EAAE,8DAA8D,CAAC,CAAC;IAEtF,MAAM,GAAG,GAAG,IAAA,oBAAU,EAAC,aAAa,EAAE,WAAW,EAAE,SAAS,EAAE;QAC5D,mBAAmB,EAAE,IAAI,KAAK,OAAO;QACrC,sBAAsB,EAAE,QAAQ;KACjC,CAAC,CAAC;IAEH,OAAO,CACL,yCAAO,SAAS,EAAE,GAAG;QACnB,wCAAM,SAAS,EAAC,kBAAkB;YAChC,uDAAO,IAAI,EAAC,UAAU,EAAC,QAAQ,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,IAAM,SAAS,EAAI;YAC9E,wCAAM,SAAS,EAAC,kBAAkB;gBAChC,8BAAC,YAAY,OAAG,CACX,CACF;QACN,KAAK,IAAI,GAAG,CACP,CACT,CAAC;AACJ,CAAC,CAAC;AA1BW,QAAA,QAAQ,YA0BnB;AAEF,gBAAQ,CAAC,WAAW,GAAG,YAAY,CAAC"}

package/lib/checkbox/style.less

@@ -0,0 +1,80 @@
+@kt-checkbox-default-size: 12px;
+@kt-checkbox-large-size: 14px;
+
+.kt-checkbox {
+  font-size: @kt-checkbox-default-size;
+  display: inline-flex;
+  align-items: center;
+  cursor: pointer;
+
+  &-lump {
+    margin-right: 4px;
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+
+    input {
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+      opacity: 0;
+    }
+
+    input:checked + .kt-checkbox-icon {
+      border-color: var(--kt-checkbox-selectionBackground);
+      background-color: var(--kt-checkbox-selectionBackground);
+      color: var(--kt-checkbox-selectionForeground);
+
+      svg {
+        display: block;
+        transition: all 0.2s;
+      }
+    }
+  }
+
+  &:hover &-icon {
+    border-color: var(--kt-checkbox-hoverBorder);
+    background-color: var(--kt-checkbox-hoverBackground);
+  }
+
+  &-icon {
+    width: @kt-checkbox-default-size;
+    height: @kt-checkbox-default-size;
+    background-color: var(--checkbox-background);
+    border-radius: 2px;
+    border: 1px solid var(--checkbox-border);
+    position: relative;
+
+    svg {
+      display: none;
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 100%;
+      height: 100%;
+    }
+  }
+
+  &-large {
+    font-size: @kt-checkbox-large-size;
+
+    &-icon {
+      width: @kt-checkbox-large-size;
+      height: @kt-checkbox-large-size;
+      margin-right: 8px;
+    }
+  }
+
+  &.kt-checkbox-disabled {
+    // disabled
+    color: var(--kt-checkbox-disableForeground);
+
+    input:checked + .kt-checkbox-icon {
+      background-color: var(--kt-checkbox-disableBackground);
+      color: var(--kt-checkbox-disableForeground);
+      border-color: transparent;
+    }
+  }
+}

package/lib/click-outside/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+export declare const ClickOutside: React.FC<{
+    onOutsideClick: (e: MouseEvent) => void;
+    mouseEvents?: ['click'] | ['contextmenu'] | ['click', 'contextmenu'];
+} & React.HTMLAttributes<HTMLDivElement>>;
+//# sourceMappingURL=index.d.ts.map

package/lib/click-outside/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/click-outside/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CACjC;IACE,cAAc,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAC;IAExC,WAAW,CAAC,EAAE,CAAC,OAAO,CAAC,GAAG,CAAC,aAAa,CAAC,GAAG,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC;CACtE,GAAG,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CA6BzC,CAAC"}

package/lib/click-outside/index.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ClickOutside = void 0;
+const tslib_1 = require("tslib");
+const react_1 = (0, tslib_1.__importDefault)(require("react"));
+const ClickOutside = (_a) => {
+    var { mouseEvents = ['click'], onOutsideClick, children } = _a, restProps = (0, tslib_1.__rest)(_a, ["mouseEvents", "onOutsideClick", "children"]);
+    const $containerEl = react_1.default.useRef(null);
+    const globalClickSpy = react_1.default.useCallback((e) => {
+        if ($containerEl.current && e.target && !$containerEl.current.contains(e.target)) {
+            onOutsideClick(e);
+        }
+    }, [onOutsideClick]);
+    react_1.default.useEffect(() => {
+        mouseEvents.forEach((event) => {
+            window.addEventListener(event, globalClickSpy, true);
+        });
+        return () => {
+            mouseEvents.forEach((event) => {
+                window.removeEventListener(event, globalClickSpy, true);
+            });
+        };
+    }, [mouseEvents]);
+    return (react_1.default.createElement("div", Object.assign({}, restProps, { ref: $containerEl }), children));
+};
+exports.ClickOutside = ClickOutside;
+//# sourceMappingURL=index.js.map

package/lib/click-outside/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/click-outside/index.tsx"],"names":[],"mappings":";;;;AAAA,+DAA0B;AAEnB,MAAM,YAAY,GAMrB,CAAC,EAAmE,EAAE,EAAE;QAAvE,EAAE,WAAW,GAAG,CAAC,OAAO,CAAC,EAAE,cAAc,EAAE,QAAQ,OAAgB,EAAX,SAAS,2BAAjE,6CAAmE,CAAF;IACpE,MAAM,YAAY,GAAG,eAAK,CAAC,MAAM,CAAwB,IAAI,CAAC,CAAC;IAE/D,MAAM,cAAc,GAAG,eAAK,CAAC,WAAW,CACtC,CAAC,CAAa,EAAE,EAAE;QAChB,IAAI,YAAY,CAAC,OAAO,IAAI,CAAC,CAAC,MAAM,IAAI,CAAC,YAAY,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAa,CAAC,EAAE;YACvF,cAAc,CAAC,CAAC,CAAC,CAAC;SACnB;IACH,CAAC,EACD,CAAC,cAAc,CAAC,CACjB,CAAC;IAEF,eAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACnB,WAAW,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;YAC5B,MAAM,CAAC,gBAAgB,CAAC,KAAK,EAAE,cAAc,EAAE,IAAI,CAAC,CAAC;QACvD,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,EAAE;YACV,WAAW,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;gBAC5B,MAAM,CAAC,mBAAmB,CAAC,KAAK,EAAE,cAAc,EAAE,IAAI,CAAC,CAAC;YAC1D,CAAC,CAAC,CAAC;QACL,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC;IAElB,OAAO,CACL,uDAAS,SAAS,IAAE,GAAG,EAAE,YAAY,KAClC,QAAQ,CACL,CACP,CAAC;AACJ,CAAC,CAAC;AAlCW,QAAA,YAAY,gBAkCvB"}

package/lib/common.d.ts

@@ -0,0 +1,7 @@
+export declare enum MessageType {
+    Error = 0,
+    Warning = 1,
+    Info = 2,
+    Empty = 3
+}
+//# sourceMappingURL=common.d.ts.map

package/lib/common.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../src/common.ts"],"names":[],"mappings":"AAAA,oBAAY,WAAW;IACrB,KAAK,IAAA;IACL,OAAO,IAAA;IACP,IAAI,IAAA;IACJ,KAAK,IAAA;CACN"}

package/lib/common.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MessageType = void 0;
+var MessageType;
+(function (MessageType) {
+    MessageType[MessageType["Error"] = 0] = "Error";
+    MessageType[MessageType["Warning"] = 1] = "Warning";
+    MessageType[MessageType["Info"] = 2] = "Info";
+    MessageType[MessageType["Empty"] = 3] = "Empty";
+})(MessageType = exports.MessageType || (exports.MessageType = {}));
+//# sourceMappingURL=common.js.map

package/lib/common.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"common.js","sourceRoot":"","sources":["../src/common.ts"],"names":[],"mappings":";;;AAAA,IAAY,WAKX;AALD,WAAY,WAAW;IACrB,+CAAK,CAAA;IACL,mDAAO,CAAA;IACP,6CAAI,CAAA;IACJ,+CAAK,CAAA;AACP,CAAC,EALW,WAAW,GAAX,mBAAW,KAAX,mBAAW,QAKtB"}

package/lib/dialog/index.d.ts

@@ -0,0 +1,26 @@
+import React from 'react';
+import { IOverlayProps } from '../overlay';
+import { MessageType } from '../common';
+import './styles.less';
+export declare type ModalType = 'basic' | 'confirm' | 'info';
+export interface IconDesc {
+    color: string;
+    className: string;
+}
+declare type getContainerFunc = () => HTMLElement;
+export interface IDialogProps extends IOverlayProps {
+    messageType?: MessageType;
+    type?: ModalType;
+    icon?: IconDesc;
+    message: string | React.ReactNode;
+    buttons: JSX.Element[] | JSX.Element;
+    closable?: boolean;
+    onOk?: () => void;
+    onCancel?: () => void;
+    okText?: string;
+    cancelText?: string;
+    getContainer?: string | HTMLElement | getContainerFunc | false | null;
+}
+export declare const Dialog: React.FC<IDialogProps>;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/lib/dialog/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/dialog/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAW,aAAa,EAAE,MAAM,YAAY,CAAC;AAIpD,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AACxC,OAAO,eAAe,CAAC;AAEvB,oBAAY,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,CAAC;AAErD,MAAM,WAAW,QAAQ;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;CACnB;AAED,OAAO,MAAM,gBAAgB,GAAG,MAAM,WAAW,CAAC;AAElD,MAAM,WAAW,YAAa,SAAQ,aAAa;IACjD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAClC,OAAO,EAAE,GAAG,CAAC,OAAO,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,IAAI,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,gBAAgB,GAAG,KAAK,GAAG,IAAI,CAAC;CACvE;AAaD,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA8DzC,CAAC"}