@orca-fe/pocket/lib/icon-button/demo/DemoBasic.js

UI components by orca-team

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
require("antd/lib/space/style");
var _space = _interopRequireDefault(require("antd/lib/space"));
var _react = _interopRequireDefault(require("react"));
var _ = require("../..");
var _icons = require("@ant-design/icons");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
 * title: Default usage
 * desc:
 *
 * title.zh-CN: 基础用法
 * desc.zh-CN:
 */

var Demo = function Demo() {
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      children: "\u7ED3\u5408 @ant-design/icons \u4F7F\u7528"
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_space.default, {
      style: {
        padding: 4
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.FileOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SettingOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.CaretLeftFilled, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ReloadOutlined, {})
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      children: "Dark \u6A21\u5F0F"
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_space.default, {
      style: {
        backgroundColor: '#333',
        padding: 4
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        theme: "dark",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.FileOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        theme: "dark",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SettingOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        theme: "dark",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.CaretLeftFilled, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        theme: "dark",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ReloadOutlined, {})
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      children: "\u5927\u5C3A\u5BF8"
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_space.default, {
      style: {
        padding: 4
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "large",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.FileOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "large",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SettingOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "large",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.CaretLeftFilled, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "large",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ReloadOutlined, {})
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      children: "\u5C0F\u5C3A\u5BF8"
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_space.default, {
      style: {
        padding: 4
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.FileOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SettingOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.CaretLeftFilled, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ReloadOutlined, {})
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("br", {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      children: "\u8D85\u5C0F\u5C3A\u5BF8"
    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_space.default, {
      style: {
        padding: 4
      },
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "x-small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.FileOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "x-small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SettingOutlined, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "x-small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.CaretLeftFilled, {})
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_.IconButton, {
        size: "x-small",
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.ReloadOutlined, {})
      })]
    })]
  });
};
var _default = exports.default = Demo;