yootd 0.0.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,43 @@
+# yotd
+
+[![NPM version](https://img.shields.io/npm/v/yotd.svg?style=flat)](https://npmjs.org/package/yotd)
+[![NPM downloads](http://img.shields.io/npm/dm/yotd.svg?style=flat)](https://npmjs.org/package/yotd)
+
+A react library developed with dumi
+
+## Usage
+
+TODO
+
+## Options
+
+TODO
+
+## Development
+
+```bash
+# install dependencies
+$ pnpm install
+
+# develop library by docs demo
+$ pnpm start
+
+# build library source code
+$ pnpm run build
+
+# build library source code in watch mode
+$ pnpm run build:watch
+
+# build docs
+$ pnpm run docs:build
+
+# Locally preview the production build.
+$ pnpm run docs:preview
+
+# check your project for potential problems
+$ pnpm run doctor
+```
+
+## LICENSE
+
+MIT

package/dist/Preview/components/icons/AdaptIcon.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ISvgIconProps } from "../../../utils/types";
+export declare const AdaptIcon: FC<ISvgIconProps>;

package/dist/Preview/components/icons/AdaptIcon.js

@@ -0,0 +1,60 @@
+var _excluded = ["style", "className"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { forwardRef } from 'react';
+export var AdaptIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var style = _ref.style,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    ref: ref,
+    style: style,
+    className: className
+  }, rest, {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }), /*#__PURE__*/React.createElement("g", {
+    id: "\xE6\x94\xBE\xE5\xA4\xA7"
+  }, /*#__PURE__*/React.createElement("rect", {
+    id: "rect-stroke",
+    x: "0.5",
+    y: "2.5",
+    width: "15",
+    height: "11",
+    rx: "0.5",
+    stroke: "black",
+    strokeOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("path", {
+    id: "Union",
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M2.5 4C2.22386 4 2 4.22386 2 4.5V6.5C2 6.77614 2.22386 7 2.5 7C2.77614 7 3 6.77614 3 6.5V5L4.5 5C4.77614 5 5 4.77614 5 4.5C5 4.22386 4.77614 4 4.5 4H2.5Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("path", {
+    id: "Union_2",
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M2.5 12C2.22386 12 2 11.7761 2 11.5V9.5C2 9.22386 2.22386 9 2.5 9C2.77614 9 3 9.22386 3 9.5V11L4.5 11C4.77614 11 5 11.2239 5 11.5C5 11.7761 4.77614 12 4.5 12H2.5Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("path", {
+    id: "Union_3",
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M13.5 4C13.7761 4 14 4.22386 14 4.5V6.5C14 6.77614 13.7761 7 13.5 7C13.2239 7 13 6.77614 13 6.5V5L11.5 5C11.2239 5 11 4.77614 11 4.5C11 4.22386 11.2239 4 11.5 4H13.5Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("path", {
+    id: "Union_4",
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M13.5 12C13.7761 12 14 11.7761 14 11.5V9.5C14 9.22386 13.7761 9 13.5 9C13.2239 9 13 9.22386 13 9.5V11L11.5 11C11.2239 11 11 11.2239 11 11.5C11 11.7761 11.2239 12 11.5 12H13.5Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  })));
+});

package/dist/Preview/components/icons/MagnifyIcon.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ISvgIconProps } from "../../../utils/types";
+export declare const MagnifyIcon: FC<ISvgIconProps>;

package/dist/Preview/components/icons/MagnifyIcon.js

@@ -0,0 +1,40 @@
+var _excluded = ["style", "className"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { forwardRef } from 'react';
+export var MagnifyIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var style = _ref.style,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    ref: ref,
+    style: style,
+    className: className
+  }, rest, {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }), /*#__PURE__*/React.createElement("g", {
+    id: "\xE6\x94\xBE\xE5\xA4\xA7",
+    clipPath: "url(#clip0_628_30973)"
+  }, /*#__PURE__*/React.createElement("path", {
+    id: "Vector",
+    d: "M11.9247 10.982L15.3327 14.3906L14.39 15.3333L10.9814 11.9253C9.8553 12.8383 8.44906 13.3356 6.99935 13.3333C5.74674 13.3333 4.52225 12.9619 3.48074 12.2659C2.43923 11.57 1.62747 10.5809 1.14811 9.42362C0.66876 8.26636 0.543339 6.99294 0.787712 5.76439C1.03208 4.53584 1.63528 3.40735 2.52101 2.52162C3.40674 1.63589 4.53523 1.0327 5.76378 0.788322C6.99233 0.543949 8.26575 0.66937 9.42301 1.14873C10.5803 1.62808 11.5694 2.43984 12.2653 3.48135C12.9612 4.52286 13.3327 5.74735 13.3327 6.99996C13.335 8.44967 12.8377 9.85591 11.9247 10.982ZM6.99935 12C8.32543 12 9.5972 11.4732 10.5349 10.5355C11.4726 9.59781 11.9994 8.32604 11.9994 6.99996C11.9994 5.67388 11.4726 4.40211 10.5349 3.46443C9.5972 2.52675 8.32543 1.99996 6.99935 1.99996C5.67327 1.99996 4.4015 2.52675 3.46382 3.46443C2.52614 4.40211 1.99935 5.67388 1.99935 6.99996C1.99935 8.32604 2.52614 9.59781 3.46382 10.5355C4.4015 11.4732 5.67327 12 6.99935 12Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("path", {
+    id: "Vector_2",
+    d: "M7.66732 6.33337H9.66732V7.66671H7.66732V9.66671H6.33398V7.66671H4.33398V6.33337H6.33398V4.33337H7.66732V6.33337Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "clip0_628_30973"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "16",
+    height: "16",
+    fill: "white"
+  }))));
+});

package/dist/Preview/components/icons/ResetIcon.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ISvgIconProps } from "../../../utils/types";
+export declare const ResetIcon: FC<ISvgIconProps>;

package/dist/Preview/components/icons/ResetIcon.js

@@ -0,0 +1,66 @@
+var _excluded = ["style", "className"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { forwardRef } from 'react';
+export var ResetIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var style = _ref.style,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    ref: ref,
+    style: style,
+    className: className
+  }, rest, {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }), /*#__PURE__*/React.createElement("g", {
+    id: "\xE6\x94\xBE\xE5\xA4\xA7"
+  }, /*#__PURE__*/React.createElement("rect", {
+    id: "rect-stroke",
+    x: "0.5",
+    y: "2.5",
+    width: "15",
+    height: "11",
+    rx: "0.5",
+    stroke: "black",
+    strokeOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("rect", {
+    id: "reset-icon-rect",
+    x: "4",
+    y: "5",
+    width: "1",
+    height: "6",
+    rx: "0.5",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("rect", {
+    id: "reset-icon-rect",
+    x: "11",
+    y: "5",
+    width: "1",
+    height: "6",
+    rx: "0.5",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("rect", {
+    id: "reset-icon-rect",
+    width: "1",
+    height: "1",
+    rx: "0.5",
+    transform: "matrix(1 0 0 -1 7 10)",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("rect", {
+    id: "reset-icon-rect",
+    width: "1",
+    height: "1",
+    rx: "0.5",
+    transform: "matrix(-4.37114e-08 1 1 4.37114e-08 7 6)",
+    fill: "black",
+    fillOpacity: "0.85"
+  })));
+});

package/dist/Preview/components/icons/ShrinkIcon.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+import { ISvgIconProps } from "../../../utils/types";
+export declare const ShrinkIcon: FC<ISvgIconProps>;

package/dist/Preview/components/icons/ShrinkIcon.js

@@ -0,0 +1,40 @@
+var _excluded = ["style", "className"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { forwardRef } from 'react';
+export var ShrinkIcon = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var style = _ref.style,
+    className = _ref.className,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    ref: ref,
+    style: style,
+    className: className
+  }, rest, {
+    width: "16",
+    height: "16",
+    viewBox: "0 0 16 16",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }), /*#__PURE__*/React.createElement("g", {
+    id: "\xE7\xBC\xA9\xE5\xB0\x8F",
+    clipPath: "url(#clip0_628_30970)"
+  }, /*#__PURE__*/React.createElement("path", {
+    id: "Vector",
+    d: "M11.9247 10.982L15.3327 14.3906L14.39 15.3333L10.9814 11.9253C9.8553 12.8383 8.44906 13.3356 6.99935 13.3333C5.74674 13.3333 4.52225 12.9619 3.48074 12.2659C2.43923 11.57 1.62747 10.5809 1.14811 9.42362C0.66876 8.26636 0.543339 6.99294 0.787712 5.76439C1.03208 4.53584 1.63528 3.40735 2.52101 2.52162C3.40674 1.63589 4.53523 1.0327 5.76378 0.788322C6.99233 0.543949 8.26575 0.66937 9.42301 1.14873C10.5803 1.62808 11.5694 2.43984 12.2653 3.48135C12.9612 4.52286 13.3327 5.74735 13.3327 6.99996C13.335 8.44967 12.8377 9.85591 11.9247 10.982ZM6.99935 12C8.32543 12 9.5972 11.4732 10.5349 10.5355C11.4726 9.59781 11.9994 8.32604 11.9994 6.99996C11.9994 5.67388 11.4726 4.40211 10.5349 3.46443C9.5972 2.52675 8.32543 1.99996 6.99935 1.99996C5.67327 1.99996 4.4015 2.52675 3.46382 3.46443C2.52614 4.40211 1.99935 5.67388 1.99935 6.99996C1.99935 8.32604 2.52614 9.59781 3.46382 10.5355C4.4015 11.4732 5.67327 12 6.99935 12Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  }), /*#__PURE__*/React.createElement("path", {
+    id: "Vector_2",
+    d: "M4.33398 7.99996V6.66663H9.66732V7.99996H4.33398Z",
+    fill: "black",
+    fillOpacity: "0.85"
+  })), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
+    id: "clip0_628_30970"
+  }, /*#__PURE__*/React.createElement("rect", {
+    width: "16",
+    height: "16",
+    fill: "white"
+  }))));
+});

package/dist/Preview/components/preview/phone.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactNode } from 'react';
+import './phone.scss';
+export default function Phone({ data }: {
+    data: {
+        value: ReactNode;
+    };
+}): React.JSX.Element;

package/dist/Preview/components/preview/phone.js

@@ -0,0 +1,10 @@
+import React from 'react';
+import { useBem } from "../../../hooks/useBem";
+import "./phone.scss";
+export default function Phone(_ref) {
+  var data = _ref.data;
+  var mb = useBem('preview-phone');
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(mb)
+  }, data === null || data === void 0 ? void 0 : data.value);
+}

package/dist/Preview/components/preview/phone.scss

@@ -0,0 +1,8 @@
+.yot-preview-phone {
+  width: 398px;
+  height: 829px;
+  background-image: url('../../assets/phonebg.png');
+  background-size: 100% 100%;
+  padding: 96px 36px 20px 36px;
+  box-sizing: border-box;
+}

package/dist/Preview/components/preview/web.d.ts

@@ -0,0 +1,6 @@
+import React, { ReactNode } from 'react';
+export default function Web({ data }: {
+    data: {
+        value: ReactNode;
+    };
+}): React.JSX.Element;

package/dist/Preview/components/preview/web.js

@@ -0,0 +1,10 @@
+import React from 'react';
+export default function Web(_ref) {
+  var data = _ref.data;
+  return /*#__PURE__*/React.createElement("div", {
+    style: {
+      width: '100%',
+      height: '100%'
+    }
+  }, data === null || data === void 0 ? void 0 : data.value);
+}

package/dist/Preview/components/reactflow/Controls.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { ControlsProps } from "../../types/type";
+import '../../index.scss';
+declare const Controls: FC<ControlsProps>;
+export default Controls;

package/dist/Preview/components/reactflow/Controls.js

@@ -0,0 +1,69 @@
+var _excluded = ["defaultZoom"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { useReactFlow, useViewport } from '@xyflow/react';
+import React, { useEffect } from 'react';
+import { Button, Tooltip } from "../../..";
+import { useBem } from "../../../hooks/useBem";
+import "../../index.scss";
+import { AdaptIcon } from "../icons/AdaptIcon";
+import { MagnifyIcon } from "../icons/MagnifyIcon";
+import { ResetIcon } from "../icons/ResetIcon";
+import { ShrinkIcon } from "../icons/ShrinkIcon";
+// 右下角缩放组件
+var Controls = function Controls(_ref) {
+  var defaultZoom = _ref.defaultZoom,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  var mb = useBem('preview');
+  var cbtn = mb.b('controls');
+  var _useViewport = useViewport(),
+    zoom = _useViewport.zoom;
+  var reactFlow = useReactFlow();
+  var _useReactFlow = useReactFlow(),
+    zoomOut = _useReactFlow.zoomOut,
+    zoomIn = _useReactFlow.zoomIn,
+    fitView = _useReactFlow.fitView;
+  var handleZoomTo = function handleZoomTo() {
+    reactFlow.zoomTo(1);
+  };
+  // 初始化放大
+  useEffect(function () {
+    // 初始化缩放
+    if (defaultZoom != null) {
+      reactFlow.zoomTo(defaultZoom);
+    }
+  }, [defaultZoom]);
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: "".concat(mb.b('controls'))
+  }, rest), /*#__PURE__*/React.createElement(Button, {
+    className: "".concat(cbtn.e('zoom'))
+  }, Math.round(zoom * 100), "%"), /*#__PURE__*/React.createElement(Button, {
+    icon: /*#__PURE__*/React.createElement(ShrinkIcon, null),
+    onClick: function onClick() {
+      return zoomOut();
+    },
+    className: "".concat(cbtn.e('shrink'))
+  }), /*#__PURE__*/React.createElement(Button, {
+    icon: /*#__PURE__*/React.createElement(MagnifyIcon, null),
+    onClick: function onClick() {
+      return zoomIn();
+    },
+    className: "".concat(cbtn.e('magnify'))
+  }), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "\u9002\u5E94\u89C6\u56FE"
+  }, /*#__PURE__*/React.createElement(Button, {
+    icon: /*#__PURE__*/React.createElement(AdaptIcon, null),
+    onClick: function onClick() {
+      return fitView();
+    },
+    className: "".concat(cbtn.e('adapt'))
+  })), /*#__PURE__*/React.createElement(Tooltip, {
+    title: "\u91CD\u7F6E\u89C6\u56FE"
+  }, /*#__PURE__*/React.createElement(Button, {
+    icon: /*#__PURE__*/React.createElement(ResetIcon, null),
+    onClick: handleZoomTo,
+    className: "".concat(cbtn.e('reset'))
+  })));
+};
+export default Controls;

package/dist/Preview/components/reactflow/TopPreview.d.ts

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+import { TopPreviewProps } from "../../types/type";
+import '../../index.scss';
+declare const TopPreview: FC<TopPreviewProps>;
+export default TopPreview;

package/dist/Preview/components/reactflow/TopPreview.js

@@ -0,0 +1,28 @@
+import { Panel } from '@xyflow/react';
+import React from 'react';
+import { Segmented } from "../../..";
+import { useBem } from "../../../hooks/useBem";
+import "../../index.scss";
+// 顶部预览组件
+var TopPreview = function TopPreview(_ref) {
+  var mode = _ref.mode,
+    _onChange = _ref.onChange;
+  var mb = useBem('preview');
+  return /*#__PURE__*/React.createElement(Panel, {
+    className: "".concat(mb.e('pannel')),
+    position: "top-center"
+  }, /*#__PURE__*/React.createElement(Segmented, {
+    options: [{
+      value: 'phone',
+      label: '手机'
+    }, {
+      value: 'web',
+      label: '电脑'
+    }],
+    value: mode,
+    onChange: function onChange(value) {
+      _onChange(value);
+    }
+  }));
+};
+export default TopPreview;

package/dist/Preview/index.d.ts

@@ -0,0 +1,5 @@
+import '@xyflow/react/dist/style.css';
+import { FC } from 'react';
+import './index.scss';
+import { PrevewProps } from './types/type';
+export declare const Preview: FC<PrevewProps>;

package/dist/Preview/index.js

@@ -0,0 +1,94 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { Background, ReactFlow } from '@xyflow/react';
+import '@xyflow/react/dist/style.css';
+import React, { useEffect, useState } from 'react';
+import { useBem } from "../hooks/useBem";
+import Phone from "./components/preview/phone";
+import Web from "./components/preview/web";
+import Controls from "./components/reactflow/Controls";
+import TopPreview from "./components/reactflow/TopPreview";
+import "./index.scss";
+export var Preview = function Preview(_ref) {
+  var _ref$controls = _ref.controls,
+    controls = _ref$controls === void 0 ? true : _ref$controls,
+    defaultZoom = _ref.defaultZoom,
+    minZoom = _ref.minZoom,
+    maxZoom = _ref.maxZoom,
+    panOnDrag = _ref.panOnDrag,
+    zoomOnScroll = _ref.zoomOnScroll,
+    content = _ref.content,
+    _ref$modes = _ref.modes,
+    modes = _ref$modes === void 0 ? ['phone', 'web'] : _ref$modes,
+    _ref$width = _ref.width,
+    width = _ref$width === void 0 ? '50vw' : _ref$width,
+    _ref$height = _ref.height,
+    height = _ref$height === void 0 ? '50vh' : _ref$height,
+    style = _ref.style;
+  var mb = useBem('preview');
+  var nodeTypes = {
+    phone: Phone,
+    web: Web
+  };
+  var _useState = useState('phone'),
+    _useState2 = _slicedToArray(_useState, 2),
+    mode = _useState2[0],
+    setMode = _useState2[1];
+  // 切换预览组件
+  var changeMode = function changeMode(value) {
+    setMode(value);
+  };
+  // 预览模式初始值
+  useEffect(function () {
+    setMode(modes === null || modes === void 0 ? void 0 : modes[0]);
+  }, [modes]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "".concat(mb),
+    style: _objectSpread(_objectSpread({}, style), {}, {
+      width: width,
+      height: height
+    })
+  }, /*#__PURE__*/React.createElement(ReactFlow, {
+    nodeTypes: nodeTypes,
+    nodes: [{
+      id: "preview-".concat(mode),
+      type: mode,
+      data: {
+        value: content
+      },
+      draggable: false,
+      connectable: false,
+      position: {
+        x: 0,
+        y: 0
+      }
+    }],
+    maxZoom: maxZoom,
+    minZoom: minZoom,
+    panOnDrag: panOnDrag,
+    zoomOnScroll: zoomOnScroll,
+    fitView: true,
+    preventScrolling: false
+  }, controls && /*#__PURE__*/React.createElement(Controls, {
+    defaultZoom: defaultZoom
+  }), /*#__PURE__*/React.createElement(Background, {
+    gap: 12,
+    size: 1,
+    style: {
+      backgroundColor: '#F1F1F1'
+    }
+  }), (modes === null || modes === void 0 ? void 0 : modes.length) > 1 && /*#__PURE__*/React.createElement(TopPreview, {
+    mode: mode,
+    onChange: changeMode
+  })));
+};

package/dist/Preview/index.scss

@@ -0,0 +1,35 @@
+.yot-preview {
+  &-controls {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    z-index: 100;
+    position: absolute;
+    bottom: 10px;
+    right: 10px;
+    background-color: #ffffff;
+    border-radius: 8px;
+    box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.16);
+    .ant-btn.css-var-yotd.ant-btn-default.ant-btn-color-default.ant-btn-variant-outlined {
+      background-color: transparent;
+      border: none;
+      &:hover .ant-btn-icon svg path {
+        fill: var(--ant-color-primary);
+      }
+      &:hover .ant-btn-icon svg #rect-stroke {
+        stroke: var(--ant-color-primary);
+      }
+      &:hover .ant-btn-icon svg #reset-icon-rect {
+        fill: var(--ant-color-primary);
+      }
+    }
+    &--zoom {
+      width: 64px;
+      background-color: transparent;
+      border: none;
+    }
+  }
+  .react-flow__panel.center {
+    transform: translateX(-63%);
+  }
+}

package/dist/Preview/types/type.d.ts

@@ -0,0 +1,21 @@
+export interface PrevewProps {
+  controls?: boolean; // 是否显示右下角的放大缩小组件
+  defaultZoom?: number; // 初始化放大倍数
+  maxZoom?: number; // 最大放大倍数
+  minZoom?: number; // 最小放大倍数
+  panOnDrag?: boolean; // 是否可以拖拽
+  zoomOnScroll?: boolean; // 是否可以滚动
+  modes?: ['phone', 'web'] | ['phone'] | ['web']; // 预览模式
+  content?: ReactNode; // 数据
+  width?: number | string; // 宽度
+  height?: number | string; // 高度
+  style?: React.CSSProperties; // 样式
+}
+
+export interface TopPreviewProps {
+  mode: string;
+  onChange: (value: string) => void;
+}
+export interface ControlsProps {
+  defaultZoom?: number; // 初始化放大倍数
+}

package/dist/affix/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+export type { AffixProps, AffixRef } from 'antd/es/affix';
+export declare const Affix: import("react").ForwardRefExoticComponent<import("antd").AffixProps & import("react").RefAttributes<import("antd").AffixRef>>;

package/dist/affix/index.js

@@ -0,0 +1,2 @@
+import { Affix as AntAffix } from 'antd';
+export var Affix = AntAffix;

package/dist/alert/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+export type { AlertProps } from 'antd/es/alert';
+export declare const Alert: import("react").ForwardRefExoticComponent<import("antd").AlertProps & import("react").RefAttributes<import("antd/es/alert/Alert").AlertRef>> & {
+    ErrorBoundary: typeof import("antd/es/alert/ErrorBoundary").default;
+};

package/dist/alert/index.js

@@ -0,0 +1,2 @@
+import { Alert as AntAlert } from 'antd';
+export var Alert = AntAlert;