@nutui/nutui-react 2.7.0 → 3.0.0-beta.1

package/dist/es/packages/cascader/types.d.ts

@@ -0,0 +1,33 @@
+export interface CascaderPane {
+    nodes: [];
+    selectedNode: CascaderOption | null;
+    paneKey: string;
+}
+export interface CascaderOption {
+    text?: string;
+    value?: number | string;
+    paneKey?: string;
+    disabled?: boolean;
+    children?: CascaderOption[];
+    leaf?: boolean;
+    level?: number;
+    loading?: boolean;
+    root?: boolean;
+}
+export interface CascaderConfig {
+    value?: string;
+    text?: string;
+    children?: string;
+}
+export type CascaderValue = Exclude<CascaderOption['value'], undefined>[];
+export interface CascaderOptionKey {
+    textKey: string;
+    valueKey: string;
+    childrenKey: string;
+}
+export interface CascaderFormat {
+    topId?: string | number | null;
+    idKey?: string;
+    pidKey?: string;
+    sortKey?: string;
+}

package/dist/es/packages/cascader/types.js

@@ -0,0 +1 @@
+export { };

package/dist/es/packages/cascader/utils.d.ts

@@ -0,0 +1,15 @@
+import { CascaderOption, CascaderConfig, CascaderFormat, CascaderValue } from './types';
+export declare const formatTree: (tree: CascaderOption[], parent: CascaderOption | null, config: CascaderConfig) => CascaderOption[];
+export declare const eachTree: (tree: CascaderOption[], cb: (node: CascaderOption) => unknown) => void;
+export declare const convertListToOptions: (list: CascaderOption[], options: CascaderFormat) => CascaderOption[];
+declare class Tree {
+    nodes: CascaderOption[];
+    readonly config: CascaderConfig;
+    constructor(nodes: CascaderOption[], config?: CascaderConfig);
+    updateChildren(nodes: CascaderOption[], parent: CascaderOption | null): void;
+    getNodeByValue(value: CascaderOption['value']): CascaderOption | void;
+    getPathNodesByValue(value: CascaderValue): CascaderOption[];
+    isLeaf: (node: CascaderOption, lazy: boolean) => boolean;
+    hasChildren: (node: CascaderOption, lazy: boolean) => boolean;
+}
+export default Tree;

package/dist/es/packages/cascader/utils.js

@@ -0,0 +1,154 @@
+import { _ as _class_call_check } from "@swc/helpers/_/_class_call_check";
+import { _ as _create_class } from "@swc/helpers/_/_create_class";
+import { _ as _define_property } from "@swc/helpers/_/_define_property";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import { _ as _to_property_key } from "@swc/helpers/_/_to_property_key";
+export var formatTree = function(tree, parent, config) {
+    return tree.map(function(node) {
+        var tmp = config.value, valueKey = tmp === void 0 ? 'value' : tmp, tmp1 = config.text, textKey = tmp1 === void 0 ? 'text' : tmp1, tmp2 = config.children, childrenKey = tmp2 === void 0 ? 'children' : tmp2;
+        var value = node[valueKey], text = node[textKey], children = node[childrenKey], others = _object_without_properties(node, [
+            valueKey,
+            textKey,
+            childrenKey
+        ].map(_to_property_key));
+        var newNode = _object_spread_props(_object_spread({
+            loading: false
+        }, others), {
+            level: parent ? (parent && parent.level || 0) + 1 : 0,
+            value: value,
+            text: text,
+            children: children,
+            _parent: parent
+        });
+        if (newNode.children && newNode.children.length) {
+            newNode.children = formatTree(newNode.children, newNode, config);
+        }
+        return newNode;
+    });
+};
+export var eachTree = function(tree, cb) {
+    var i = 0;
+    var node;
+    while(node = tree[i++]){
+        if (cb(node) === true) {
+            break;
+        }
+        if (node.children && node.children.length) {
+            eachTree(node.children, cb);
+        }
+    }
+};
+var defaultConvertConfig = {
+    topId: null,
+    idKey: 'id',
+    pidKey: 'pid',
+    sortKey: ''
+};
+export var convertListToOptions = function(list, options) {
+    var mergedOptions = _object_spread({}, defaultConvertConfig, options || {});
+    var topId = mergedOptions.topId, idKey = mergedOptions.idKey, pidKey = mergedOptions.pidKey, sortKey = mergedOptions.sortKey;
+    var result = [];
+    var map = {};
+    list.forEach(function(node) {
+        node = _object_spread({}, node);
+        var id = node[idKey], pid = node[pidKey];
+        var children = map[pid] = map[pid] || [];
+        if (!result.length && pid === topId) {
+            result = children;
+        }
+        children.push(node);
+        node.children = map[id] || (map[id] = []);
+    });
+    if (sortKey) {
+        Object.keys(map).forEach(function(i) {
+            if (map[i].length > 1) {
+                map[i].sort(function(a, b) {
+                    return a[sortKey] - b[sortKey];
+                });
+            }
+        });
+    }
+    map = null;
+    return result;
+};
+var Tree = /*#__PURE__*/ function() {
+    "use strict";
+    function Tree(nodes, config) {
+        var _this = this;
+        _class_call_check(this, Tree);
+        _define_property(this, "nodes", void 0);
+        _define_property(this, "config", void 0);
+        // eslint-disable-next-line class-methods-use-this
+        _define_property(this, "isLeaf", function(node, lazy) {
+            var leaf = node.leaf, children = node.children;
+            var hasChildren = Array.isArray(children) && Boolean(children.length);
+            return leaf || !hasChildren && !lazy;
+        });
+        _define_property(this, "hasChildren", function(node, lazy) {
+            var isLeaf = _this.isLeaf(node, lazy);
+            if (isLeaf) {
+                return false;
+            }
+            var children = node.children;
+            return Array.isArray(children) && Boolean(children.length);
+        });
+        this.config = _object_spread({
+            value: 'value',
+            text: 'text',
+            children: 'children'
+        }, config || {});
+        this.nodes = formatTree(nodes, null, this.config);
+    }
+    _create_class(Tree, [
+        {
+            key: "updateChildren",
+            value: function updateChildren(nodes, parent) {
+                if (!parent) {
+                    this.nodes = formatTree(nodes, null, this.config);
+                } else {
+                    parent.children = formatTree(nodes, parent, this.config);
+                }
+            }
+        },
+        {
+            // for test
+            key: "getNodeByValue",
+            value: function getNodeByValue(value) {
+                var foundNode;
+                eachTree(this.nodes, function(node) {
+                    if (node.value === value) {
+                        foundNode = node;
+                        return true;
+                    }
+                    return null;
+                });
+                return foundNode;
+            }
+        },
+        {
+            key: "getPathNodesByValue",
+            value: function getPathNodesByValue(value) {
+                if (!value.length) {
+                    return [];
+                }
+                var pathNodes = [];
+                var currentNodes = this.nodes;
+                while(currentNodes && currentNodes.length){
+                    var foundNode = currentNodes.find(function(node) {
+                        return node.value === value[node.level];
+                    });
+                    if (!foundNode) {
+                        break;
+                    }
+                    pathNodes.push(foundNode);
+                    currentNodes = foundNode.children;
+                }
+                return pathNodes;
+            }
+        }
+    ]);
+    return Tree;
+}();
+export default Tree;

package/dist/es/packages/cell/cell.d.ts

@@ -0,0 +1,16 @@
+import React, { FunctionComponent, ReactNode } from 'react';
+import { BasicComponent } from "../../utils/typings";
+import CellGroup from "../cellgroup";
+export interface CellProps extends BasicComponent {
+    title: ReactNode;
+    description: ReactNode;
+    extra: ReactNode;
+    radius: string | number;
+    align: 'flex-start' | 'center' | 'flex-end';
+    clickable: boolean;
+    isLast: boolean;
+    onClick: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
+}
+export declare const Cell: FunctionComponent<Partial<CellProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'title'>> & {
+    Group: typeof CellGroup;
+};

package/dist/es/packages/cell/cell.js

@@ -0,0 +1,73 @@
+import { _ as _define_property } from "@swc/helpers/_/_define_property";
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import React, { useContext } from "react";
+import classNames from "classnames";
+import { ComponentDefaults } from "../../utils/typings";
+import CellGroup from "../cellgroup";
+import CellGroupContext from "../cellgroup/context";
+import { useRtl } from "../configprovider";
+var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
+    title: null,
+    description: null,
+    extra: null,
+    radius: '6px',
+    align: 'flex-start',
+    clickable: false,
+    isLast: false,
+    onClick: function(event) {}
+});
+var classPrefix = 'nut-cell';
+export var Cell = function(props) {
+    var ctx = useContext(CellGroupContext);
+    var _ref = _object_spread({}, defaultProps, props), children = _ref.children, clickable = _ref.clickable, onClick = _ref.onClick, title = _ref.title, description = _ref.description, extra = _ref.extra, radius = _ref.radius, align = _ref.align, isLast = _ref.isLast, className = _ref.className, style = _ref.style, rest = _object_without_properties(_ref, [
+        "children",
+        "clickable",
+        "onClick",
+        "title",
+        "description",
+        "extra",
+        "radius",
+        "align",
+        "isLast",
+        "className",
+        "style"
+    ]);
+    var rtl = useRtl();
+    var handleClick = function(event) {
+        onClick(event);
+    };
+    var baseStyle = _object_spread_props(_object_spread({}, style), {
+        borderRadius: Number.isNaN(Number(radius)) ? String(radius) : "".concat(radius, "px"),
+        alignItems: align
+    });
+    var _obj;
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", _object_spread({
+        className: "".concat(classNames([
+            classPrefix,
+            className,
+            _define_property({}, "".concat(classPrefix, "-group-item"), ctx === null || ctx === void 0 ? void 0 : ctx.group)
+        ], clickable ? "".concat(classPrefix, "-clickable") : '')),
+        onClick: function(event) {
+            return handleClick(event);
+        },
+        style: baseStyle
+    }, rest), children || /*#__PURE__*/ React.createElement(React.Fragment, null, title || description ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-left")
+    }, title ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-title")
+    }, title) : null, description ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-description")
+    }, description) : null) : null, extra ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-extra")
+    }, extra) : null)), (ctx === null || ctx === void 0 ? void 0 : ctx.divider) && !isLast ? /*#__PURE__*/ React.createElement("div", {
+        className: classNames([
+            (_obj = {}, _define_property(_obj, "".concat(classPrefix, "-divider"), true), _define_property(_obj, "".concat(classPrefix, "-divider-rtl"), rtl), _obj)
+        ])
+    }, /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-divider-inner")
+    })) : null);
+};
+Cell.displayName = 'NutCell';
+Cell.Group = CellGroup;

package/dist/es/packages/cell/index.d.ts

@@ -0,0 +1,3 @@
+import { Cell } from './cell';
+export type { CellProps } from './cell';
+export default Cell;

package/dist/es/packages/cell/index.js

@@ -0,0 +1,2 @@
+import { Cell } from "./cell";
+export default Cell;

package/dist/es/packages/cell/style/cell.scss

@@ -0,0 +1,89 @@
+.nut-cell {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+  line-height: $cell-line-height;
+  padding: $cell-padding;
+  background-color: $cell-background-color;
+  border-radius: $cell-border-radius;
+  box-shadow: $cell-box-shadow;
+  font-size: $cell-title-font-size;
+  color: $cell-title-color;
+  margin-bottom: 10px;
+  box-sizing: border-box;
+
+  &-group-item {
+    border-radius: 0;
+    box-shadow: 0 0 transparent;
+    margin: 0;
+  }
+
+  &-left {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    flex: 1;
+  }
+
+  &-title,
+  &-description,
+  &-extra {
+    line-height: $cell-line-height;
+  }
+
+  &-description {
+    font-size: $cell-description-font-size;
+    color: $cell-description-color;
+  }
+
+  &-extra {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-end;
+    align-items: center;
+    flex: 1;
+    flex-shrink: 0;
+    min-width: 0;
+    word-break: break-all;
+    font-size: $cell-extra-font-size;
+    color: $cell-extra-color;
+  }
+  &:active::before {
+    opacity: 0.1;
+  }
+  &-clickable {
+    cursor: pointer;
+    &::before {
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      width: 100%;
+      height: 100%;
+      background-color: $black;
+      border: inherit;
+      border-color: $black;
+      border-radius: inherit;
+      transform: translate(-50%, -50%);
+      opacity: 0;
+      content: ' ';
+    }
+  }
+
+  &-divider {
+    display: flex;
+    min-height: 1px;
+    padding-left: $cell-divider-left;
+    padding-right: $cell-divider-right;
+    &-inner {
+      display: flex;
+      height: 1px;
+      width: 100%;
+      border-top: $cell-divider-border-bottom;
+    }
+    &-rtl {
+      padding-left: $cell-divider-right;
+      padding-right: $cell-divider-left;
+    }
+  }
+}

package/dist/es/packages/cell/style/css.js

@@ -0,0 +1 @@
+import './style.css'

package/dist/es/packages/cell/style/index.js

@@ -0,0 +1,2 @@
+import '../../cellgroup/style';
+import './cell.scss';

package/dist/es/packages/cell/style/style.css

@@ -0,0 +1,109 @@
+.nut-cell-group {
+  display: block;
+}
+.nut-cell-group-title {
+  display: inherit;
+  padding: var(--nutui-cell-group-title-padding, 0 10px);
+  color: var(--nutui-cell-group-title-color, var(--nutui-color-title, #1a1a1a));
+  font-size: var(--nutui-cell-group-title-font-size, var(--nutui-font-size-base, 14px));
+  line-height: var(--nutui-cell-group-title-line-height, 20px);
+  margin-top: 30px;
+  margin-bottom: 10px;
+}
+.nut-cell-group-description {
+  display: inherit;
+  padding: var(--nutui-cell-group-description-padding, 0 10px);
+  color: var(--nutui-cell-group-description-color, var(--nutui-color-text, #505259));
+  font-size: var(--nutui-cell-group-description-font-size, var(--nutui-font-size-s, 12px));
+  line-height: var(--nutui-cell-group-description-line-height, 16px);
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+.nut-cell-group-wrap {
+  border-radius: var(--nutui-cell-border-radius, 6px);
+  overflow: hidden;
+  background-color: var(--nutui-cell-group-background-color, var(--nutui-color-background-overlay, #ffffff));
+  margin-bottom: var(--nutui-cell-group-wrap-margin, 10px);
+}
+
+.nut-cell {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+  line-height: var(--nutui-cell-line-height, 20px);
+  padding: var(--nutui-cell-padding, 13px 16px);
+  background-color: var(--nutui-cell-background-color, var(--nutui-color-background-overlay, #ffffff));
+  border-radius: var(--nutui-cell-border-radius, 6px);
+  box-shadow: var(--nutui-cell-box-shadow, 0px 1px 7px 0px rgb(237, 238, 241));
+  font-size: var(--nutui-cell-title-font-size, var(--nutui-font-size-base, 14px));
+  color: var(--nutui-cell-title-color, var(--nutui-color-title, #1a1a1a));
+  margin-bottom: 10px;
+  box-sizing: border-box;
+}
+.nut-cell-group-item {
+  border-radius: 0;
+  box-shadow: 0 0 transparent;
+  margin: 0;
+}
+.nut-cell-left {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  flex: 1;
+}
+.nut-cell-title, .nut-cell-description, .nut-cell-extra {
+  line-height: var(--nutui-cell-line-height, 20px);
+}
+.nut-cell-description {
+  font-size: var(--nutui-cell-description-font-size, var(--nutui-font-size-s, 12px));
+  color: var(--nutui-cell-description-color, var(--nutui-color-text, #505259));
+}
+.nut-cell-extra {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-end;
+  align-items: center;
+  flex: 1;
+  flex-shrink: 0;
+  min-width: 0;
+  word-break: break-all;
+  font-size: var(--nutui-cell-extra-font-size, var(--nutui-font-size-base, 14px));
+  color: var(--nutui-cell-extra-color, var(--nutui-color-text, #505259));
+}
+.nut-cell:active::before {
+  opacity: 0.1;
+}
+.nut-cell-clickable {
+  cursor: pointer;
+}
+.nut-cell-clickable::before {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 100%;
+  height: 100%;
+  background-color: var(--nutui-color-title, #1a1a1a);
+  border: inherit;
+  border-color: var(--nutui-color-title, #1a1a1a);
+  border-radius: inherit;
+  transform: translate(-50%, -50%);
+  opacity: 0;
+  content: " ";
+}
+.nut-cell-divider {
+  display: flex;
+  min-height: 1px;
+  padding-left: var(--nutui-cell-divider-left, 16px);
+  padding-right: var(--nutui-cell-divider-right, 16px);
+}
+.nut-cell-divider-inner {
+  display: flex;
+  height: 1px;
+  width: 100%;
+  border-top: var(--nutui-cell-divider-border-bottom, 1px solid var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
+}
+.nut-cell-divider-rtl {
+  padding-left: var(--nutui-cell-divider-right, 16px);
+  padding-right: var(--nutui-cell-divider-left, 16px);
+}

package/dist/es/packages/cellgroup/cellgroup.d.ts

@@ -0,0 +1,9 @@
+import { FunctionComponent, ReactNode } from 'react';
+import { BasicComponent } from "../../utils/typings";
+export interface CellGroupProps extends BasicComponent {
+    title: ReactNode;
+    description: ReactNode;
+    children?: ReactNode;
+    divider: boolean;
+}
+export declare const CellGroup: FunctionComponent<Partial<CellGroupProps>>;

package/dist/es/packages/cellgroup/cellgroup.js

@@ -0,0 +1,43 @@
+import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
+import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
+import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
+import React from "react";
+import classNames from "classnames";
+import { ComponentDefaults } from "../../utils/typings";
+import CellGroupContext from "./context";
+var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
+    title: '',
+    description: '',
+    divider: true
+});
+var classPrefix = 'nut-cell-group';
+export var CellGroup = function(props) {
+    var _ref = _object_spread({}, defaultProps, props), children = _ref.children, className = _ref.className, title = _ref.title, description = _ref.description, divider = _ref.divider, rest = _object_without_properties(_ref, [
+        "children",
+        "className",
+        "title",
+        "description",
+        "divider"
+    ]);
+    return /*#__PURE__*/ React.createElement("div", _object_spread({
+        className: classNames(classPrefix, className)
+    }, rest), title ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-title")
+    }, title) : null, description ? /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-description")
+    }, description) : null, /*#__PURE__*/ React.createElement("div", {
+        className: "".concat(classPrefix, "-wrap ").concat(divider ? "".concat(classPrefix, "-wrap-divider") : '')
+    }, /*#__PURE__*/ React.createElement(CellGroupContext.Provider, {
+        value: {
+            divider: divider,
+            group: true
+        }
+    }, React.Children.map(children, function(child, index) {
+        var _child_type;
+        // @ts-ignore
+        return (child === null || child === void 0 ? void 0 : (_child_type = child.type) === null || _child_type === void 0 ? void 0 : _child_type.displayName) === 'NutCell' ? /*#__PURE__*/ React.cloneElement(child, {
+            isLast: index === React.Children.count(children) - 1
+        }) : child;
+    }))));
+};
+CellGroup.displayName = 'NutCellGroup';

package/dist/es/packages/cellgroup/context.d.ts

@@ -0,0 +1,5 @@
+declare const CellGroupContext: import("react").Context<{
+    divider: boolean;
+    group: boolean;
+} | null>;
+export default CellGroupContext;

package/dist/es/packages/cellgroup/context.js

@@ -0,0 +1,3 @@
+import { createContext } from "react";
+var CellGroupContext = createContext(null);
+export default CellGroupContext;

package/dist/es/packages/cellgroup/index.d.ts

@@ -0,0 +1,2 @@
+import { CellGroup } from './cellgroup';
+export default CellGroup;

package/dist/es/packages/cellgroup/index.js

@@ -0,0 +1,2 @@
+import { CellGroup } from "./cellgroup";
+export default CellGroup;

package/dist/es/packages/cellgroup/style/cellgroup.scss

@@ -0,0 +1,30 @@
+.nut-cell-group {
+  display: block;
+
+  &-title {
+    display: inherit;
+    padding: $cell-group-title-padding;
+    color: $cell-group-title-color;
+    font-size: $cell-group-title-font-size;
+    line-height: $cell-group-title-line-height;
+    margin-top: 30px;
+    margin-bottom: 10px;
+  }
+
+  &-description {
+    display: inherit;
+    padding: $cell-group-description-padding;
+    color: $cell-group-description-color;
+    font-size: $cell-group-description-font-size;
+    line-height: $cell-group-description-line-height;
+    margin-top: 10px;
+    margin-bottom: 10px;
+  }
+
+  &-wrap {
+    border-radius: $cell-border-radius;
+    overflow: hidden;
+    background-color: $cell-group-background-color;
+    margin-bottom: $cell-group-wrap-margin;
+  }
+}

package/dist/es/packages/cellgroup/style/css.js

@@ -0,0 +1 @@
+import './style.css'

package/dist/es/packages/cellgroup/style/index.js

@@ -0,0 +1 @@
+import './cellgroup.scss';

package/dist/es/packages/cellgroup/style/style.css

@@ -0,0 +1,27 @@
+.nut-cell-group {
+  display: block;
+}
+.nut-cell-group-title {
+  display: inherit;
+  padding: var(--nutui-cell-group-title-padding, 0 10px);
+  color: var(--nutui-cell-group-title-color, var(--nutui-color-title, #1a1a1a));
+  font-size: var(--nutui-cell-group-title-font-size, var(--nutui-font-size-base, 14px));
+  line-height: var(--nutui-cell-group-title-line-height, 20px);
+  margin-top: 30px;
+  margin-bottom: 10px;
+}
+.nut-cell-group-description {
+  display: inherit;
+  padding: var(--nutui-cell-group-description-padding, 0 10px);
+  color: var(--nutui-cell-group-description-color, var(--nutui-color-text, #505259));
+  font-size: var(--nutui-cell-group-description-font-size, var(--nutui-font-size-s, 12px));
+  line-height: var(--nutui-cell-group-description-line-height, 16px);
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+.nut-cell-group-wrap {
+  border-radius: var(--nutui-cell-border-radius, 6px);
+  overflow: hidden;
+  background-color: var(--nutui-cell-group-background-color, var(--nutui-color-background-overlay, #ffffff));
+  margin-bottom: var(--nutui-cell-group-wrap-margin, 10px);
+}

package/dist/es/packages/checkbox/checkbox.d.ts

@@ -0,0 +1,22 @@
+import React, { FunctionComponent, ReactNode } from 'react';
+import CheckboxGroup from "../checkboxgroup";
+import { BasicComponent } from "../../utils/typings";
+import { CheckboxLabelPosition } from "../checkboxgroup/types";
+export type CheckboxShape = 'button' | 'round';
+export interface CheckboxProps extends BasicComponent {
+    checked: boolean;
+    disabled: boolean;
+    defaultChecked: boolean;
+    shape: CheckboxShape;
+    labelPosition: CheckboxLabelPosition;
+    icon: ReactNode;
+    activeIcon: ReactNode;
+    indeterminateIcon: ReactNode;
+    value: string | number;
+    indeterminate: boolean;
+    label: ReactNode;
+    onChange: (value: boolean) => void;
+}
+export declare const Checkbox: FunctionComponent<Partial<CheckboxProps> & Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'>> & {
+    Group: typeof CheckboxGroup;
+};