shineout 3.7.0-beta.18 → 3.7.0-beta.19

package/cjs/index.d.ts

@@ -34,6 +34,7 @@ export { default as Radio } from './radio';
 export { default as Rate } from './rate';
 export { default as Rule } from './rule';
 export { default as Select } from './select';
+export { default as Skeleton } from './skeleton';
 export { default as Slider } from './slider';
 export { default as Spin } from './spin';
 export { default as Steps } from './steps';

package/cjs/index.js

@@ -42,6 +42,7 @@ var _exportNames = {
   Rate: true,
   Rule: true,
   Select: true,
+  Skeleton: true,
   Slider: true,
   Spin: true,
   Steps: true,
@@ -298,6 +299,12 @@ Object.defineProperty(exports, "SheetsRegistry", {
     return _shineoutStyle.SheetsRegistry;
   }
 });
+Object.defineProperty(exports, "Skeleton", {
+  enumerable: true,
+  get: function get() {
+    return _skeleton.default;
+  }
+});
 Object.defineProperty(exports, "Slider", {
   enumerable: true,
   get: function get() {
@@ -475,6 +482,7 @@ var _radio = _interopRequireDefault(require("./radio"));
 var _rate = _interopRequireDefault(require("./rate"));
 var _rule = _interopRequireDefault(require("./rule"));
 var _select = _interopRequireDefault(require("./select"));
+var _skeleton = _interopRequireDefault(require("./skeleton"));
 var _slider = _interopRequireDefault(require("./slider"));
 var _spin = _interopRequireDefault(require("./spin"));
 var _steps = _interopRequireDefault(require("./steps"));
@@ -514,5 +522,5 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 // 此文件由脚本自动生成，请勿直接修改。
 // This file was generated automatically by a script. Please do not modify it directly.
 var _default = exports.default = {
-  version: '3.7.0-beta.18'
+  version: '3.7.0-beta.19'
 };

package/cjs/skeleton/index.d.ts

@@ -0,0 +1,7 @@
+import Skeleton from './skeleton';
+type RefSkeleton = typeof Skeleton;
+export interface SkeletonComponent extends RefSkeleton {
+    displayName: string;
+}
+declare const SkeletonComp: SkeletonComponent;
+export default SkeletonComp;

package/cjs/skeleton/index.js

@@ -0,0 +1,12 @@
+"use strict";
+"use client";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _skeleton = _interopRequireDefault(require("./skeleton"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var SkeletonComp = _skeleton.default;
+SkeletonComp.displayName = 'ShineoutSkeleton';
+var _default = exports.default = SkeletonComp;

package/cjs/skeleton/interface.d.ts

@@ -0,0 +1 @@
+export type { SkeletonProps as Props } from './skeleton.type';

package/cjs/skeleton/interface.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/cjs/skeleton/skeleton.d.ts

@@ -0,0 +1,3 @@
+import { SkeletonProps } from './skeleton.type';
+declare const _default: (props: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/cjs/skeleton/skeleton.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _base = require("@sheinx/base");
+var _shineoutStyle = require("@sheinx/shineout-style");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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); }
+var jssStyle = {
+  skeleton: _shineoutStyle.useSkeletonStyle
+};
+var _default = exports.default = function _default(props) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.Skeleton, _objectSpread({
+    jssStyle: jssStyle
+  }, props));
+};

package/cjs/skeleton/skeleton.type.d.ts

@@ -0,0 +1,5 @@
+import { SkeletonProps as UnStyledSkeletonProps } from '@sheinx/base';
+/**
+ * @title Skeleton
+ */
+export type SkeletonProps = Omit<UnStyledSkeletonProps, 'jssStyle'>;

package/cjs/skeleton/skeleton.type.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/cjs/type.d.ts

@@ -34,6 +34,7 @@ export * as Radio from './radio/interface';
 export * as Rate from './rate/interface';
 export * as Rule from './rule/interface';
 export * as Select from './select/interface';
+export * as Skeleton from './skeleton/interface';
 export * as Slider from './slider/interface';
 export * as Spin from './spin/interface';
 export * as Steps from './steps/interface';

package/cjs/type.js

@@ -4,7 +4,7 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Upload = exports.TreeSelect = exports.Tree = exports.Transfer = exports.Tooltip = exports.Textarea = exports.Tag = exports.Tabs = exports.Table = exports.Switch = exports.Sticky = exports.Steps = exports.Spin = exports.Slider = exports.Select = exports.Rule = exports.Rate = exports.Radio = exports.Progress = exports.Popover = exports.Pagination = exports.Modal = exports.Message = exports.Menu = exports.List = exports.Link = exports.Input = exports.Image = exports.Icon = exports.Grid = exports.Gap = exports.Form = exports.Empty = exports.EditableArea = exports.Dropdown = exports.Drawer = exports.Divider = exports.Descriptions = exports.DatePicker = exports.Collapse = exports.Checkbox = exports.Cascader = exports.Carousel = exports.CardGroup = exports.Card = exports.Button = exports.Breadcrumb = exports.Badge = exports.Avatar = exports.Alert = void 0;
+exports.Upload = exports.TreeSelect = exports.Tree = exports.Transfer = exports.Tooltip = exports.Textarea = exports.Tag = exports.Tabs = exports.Table = exports.Switch = exports.Sticky = exports.Steps = exports.Spin = exports.Slider = exports.Skeleton = exports.Select = exports.Rule = exports.Rate = exports.Radio = exports.Progress = exports.Popover = exports.Pagination = exports.Modal = exports.Message = exports.Menu = exports.List = exports.Link = exports.Input = exports.Image = exports.Icon = exports.Grid = exports.Gap = exports.Form = exports.Empty = exports.EditableArea = exports.Dropdown = exports.Drawer = exports.Divider = exports.Descriptions = exports.DatePicker = exports.Collapse = exports.Checkbox = exports.Cascader = exports.Carousel = exports.CardGroup = exports.Card = exports.Button = exports.Breadcrumb = exports.Badge = exports.Avatar = exports.Alert = void 0;
 var _Alert = _interopRequireWildcard(require("./alert/interface"));
 exports.Alert = _Alert;
 var _Avatar = _interopRequireWildcard(require("./avatar/interface"));
@@ -77,6 +77,8 @@ var _Rule = _interopRequireWildcard(require("./rule/interface"));
 exports.Rule = _Rule;
 var _Select = _interopRequireWildcard(require("./select/interface"));
 exports.Select = _Select;
+var _Skeleton = _interopRequireWildcard(require("./skeleton/interface"));
+exports.Skeleton = _Skeleton;
 var _Slider = _interopRequireWildcard(require("./slider/interface"));
 exports.Slider = _Slider;
 var _Spin = _interopRequireWildcard(require("./spin/interface"));

package/dist/shineout.js

@@ -261,6 +261,13 @@ return /******/ (function() { // webpackBootstrap
 
 
 
+/***/ }),
+
+/***/ 6599:
+/***/ (function() {
+
+
+
 /***/ }),
 
 /***/ 5864:
@@ -6445,6 +6452,7 @@ __webpack_require__.d(__webpack_exports__, {
   Rule: function() { return /* reexport */ Rule; },
   Select: function() { return /* reexport */ src_select_0; },
   SheetsRegistry: function() { return /* reexport */ SheetsRegistry; },
+  Skeleton: function() { return /* reexport */ src_skeleton_0; },
   Slider: function() { return /* reexport */ src_slider_0; },
   Spin: function() { return /* reexport */ src_spin_0; },
   Steps: function() { return /* reexport */ src_steps_0; },
@@ -6723,6 +6731,7 @@ __webpack_require__.d(src_type_namespaceObject, {
   Rate: function() { return rate_interface; },
   Rule: function() { return rule_interface; },
   Select: function() { return select_interface; },
+  Skeleton: function() { return skeleton_interface; },
   Slider: function() { return slider_interface; },
   Spin: function() { return spin_interface; },
   Steps: function() { return steps_interface; },
@@ -12217,7 +12226,7 @@ var handleStyle = function handleStyle(style) {
 };
 /* harmony default export */ var jss_style_handleStyle = (handleStyle);
 ;// CONCATENATED MODULE: ../shineout-style/src/version.ts
-/* harmony default export */ var version = ('3.7.0-beta.18');
+/* harmony default export */ var version = ('3.7.0-beta.19');
 ;// CONCATENATED MODULE: ../shineout-style/src/jss-style/index.tsx
 
 
@@ -14423,6 +14432,24 @@ var selectTokens = {
 
 
 /* harmony default export */ var src_select = (tokenToVars(select_select, token));
+;// CONCATENATED MODULE: ../theme/src/skeleton/skeleton.ts
+// 此文件由脚本自动生成，请勿直接修改。
+// This file was generated automatically by a script. Please do not modify it directly.
+
+var skeletonTokens = {
+  skeletonMargin: 'Spacing-12',
+  skeletonHeight: 'Size-8',
+  skeletonBackgroundColor: 'Neutral-fill-2',
+  skeletonBackgroundRadius: 'Radius-default',
+  skeletonAnimationFromColor: 'Neutral-fill-2',
+  skeletonAnimationToColor: 'Neutral-fill-3'
+};
+/* harmony default export */ var skeleton = (skeletonTokens);
+;// CONCATENATED MODULE: ../theme/src/skeleton/index.ts
+
+
+
+/* harmony default export */ var src_skeleton = (tokenToVars(skeleton, token));
 ;// CONCATENATED MODULE: ../theme/src/slider/slider.ts
 // 此文件由脚本自动生成，请勿直接修改。
 // This file was generated automatically by a script. Please do not modify it directly.
@@ -15425,8 +15452,9 @@ var uploadTokens = {
 
 
 
-var src_Tokens = objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()({}, token_token), src_alert), src_avatar), src_badge), src_breadcrumb), src_button), src_card), src_card_group), src_carousel), src_cascader), src_checkbox), src_collapse), src_common), src_date_picker), src_descriptions), src_divider), src_dropdown), src_editable_area), src_empty), src_form), src_icon), src_image), src_input), src_link), src_list), src_menu), src_message), src_modal), src_pagination), src_popover), src_progress), src_radio), src_rate), src_select), src_slider), src_spin), src_steps), src_sticky), src_switch), src_table), src_tabs), src_tag), src_textarea), src_tooltip), src_transfer), src_tree), src_tree_select), src_upload);
-var ComponentTokenMap = objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()({}, src_alert_alert), avatar), badge), breadcrumb), button_button), card), card_group), carousel), cascader), checkbox_checkbox), collapse), common_common), date_picker), descriptions), divider), dropdown), editable_area), empty), form_form), icon_icon), image_image), input), link_link), list), menu), message), modal), pagination), popover), progress), radio_radio), rate), select_select), slider), spin), steps), sticky), switch_switch), table), tabs), tag), textarea_textarea), tooltip), transfer), tree), tree_select), upload);
+
+var src_Tokens = objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()({}, token_token), src_alert), src_avatar), src_badge), src_breadcrumb), src_button), src_card), src_card_group), src_carousel), src_cascader), src_checkbox), src_collapse), src_common), src_date_picker), src_descriptions), src_divider), src_dropdown), src_editable_area), src_empty), src_form), src_icon), src_image), src_input), src_link), src_list), src_menu), src_message), src_modal), src_pagination), src_popover), src_progress), src_radio), src_rate), src_select), src_skeleton), src_slider), src_spin), src_steps), src_sticky), src_switch), src_table), src_tabs), src_tag), src_textarea), src_tooltip), src_transfer), src_tree), src_tree_select), src_upload);
+var ComponentTokenMap = objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()(objectSpread2_default()({}, src_alert_alert), avatar), badge), breadcrumb), button_button), card), card_group), carousel), cascader), checkbox_checkbox), collapse), common_common), date_picker), descriptions), divider), dropdown), editable_area), empty), form_form), icon_icon), image_image), input), link_link), list), menu), message), modal), pagination), popover), progress), radio_radio), rate), select_select), skeleton), slider), spin), steps), sticky), switch_switch), table), tabs), tag), textarea_textarea), tooltip), transfer), tree), tree_select), upload);
 
 
 
@@ -23596,6 +23624,113 @@ var selectStyle = objectSpread2_default()(objectSpread2_default()({
 var useSelectStyle = styled(src_select_select, 'select');
 
 /* harmony default export */ var shineout_style_src_select = ((/* unused pure expression or super */ null && (useSelectStyle)));
+;// CONCATENATED MODULE: ../shineout-style/src/skeleton/skeleton.ts
+
+// import token from '@sheinx/theme';
+
+
+var skeleton_animation = {
+  '@keyframes skeleton-animation': {
+    '0%': {
+      backgroundPosition: '100% 50%'
+    },
+    '100%': {
+      backgroundPosition: '0 50%'
+    }
+  }
+};
+var skeletonStyle = objectSpread2_default()(objectSpread2_default()({}, skeleton_animation), {}, {
+  rootClass: {},
+  wrapper: {
+    display: 'flex'
+  },
+  animation: {
+    '& $textItem, & $image, & $buttonItem': {
+      background: "linear-gradient(90deg, ".concat(src.skeletonAnimationFromColor, " 25%, ").concat(src.skeletonAnimationToColor, " 37%, ").concat(src.skeletonAnimationFromColor, " 63%)"),
+      backgroundSize: '400% 100%',
+      animation: '$skeleton-animation 1.4s ease infinite'
+    }
+  },
+  content: {
+    flex: 1,
+    minWidth: 0
+  },
+  text: {
+    margin: 0,
+    padding: 0,
+    listStyle: 'none'
+  },
+  textItem: {
+    height: src.skeletonHeight,
+    marginBottom: src.skeletonMargin,
+    backgroundColor: src.skeletonBackgroundColor,
+    borderRadius: src.skeletonBackgroundRadius,
+    '&:last-child': {
+      marginBottom: 0
+    }
+  },
+  image: {
+    width: 48,
+    height: 48,
+    backgroundColor: src.skeletonBackgroundColor
+  },
+  imageLeft: {
+    marginRight: src.skeletonMargin
+  },
+  imageRight: {
+    marginLeft: src.skeletonMargin
+  },
+  imageCircle: {
+    borderRadius: '50%'
+  },
+  imageSquare: {
+    borderRadius: src.skeletonBackgroundRadius
+  },
+  imageSmall: {
+    width: 32,
+    height: 32
+  },
+  imageLarge: {
+    width: 64,
+    height: 64
+  },
+  button: {
+    display: 'flex',
+    '$text + &': {
+      marginTop: src.skeletonMargin
+    }
+  },
+  buttonItem: {
+    width: 80,
+    height: 32,
+    backgroundColor: src.skeletonBackgroundColor,
+    borderRadius: src.skeletonBackgroundRadius,
+    '& + &': {
+      marginLeft: src.skeletonMargin
+    }
+  },
+  buttonLeft: {
+    justifyContent: 'flex-start'
+  },
+  buttonRight: {
+    justifyContent: 'flex-end'
+  },
+  buttonSmall: {
+    width: 64,
+    height: 24
+  },
+  buttonLarge: {
+    width: 96,
+    height: 40
+  }
+});
+/* harmony default export */ var skeleton_skeleton = (skeletonStyle);
+;// CONCATENATED MODULE: ../shineout-style/src/skeleton/index.ts
+
+
+var useSkeletonStyle = styled(skeleton_skeleton, 'skeleton');
+
+/* harmony default export */ var shineout_style_src_skeleton = ((/* unused pure expression or super */ null && (useSkeletonStyle)));
 ;// CONCATENATED MODULE: ../shineout-style/src/slider/slider.ts
 
 var verticalLabelMargin = 4;
@@ -29272,6 +29407,7 @@ var useUploadStyle = styled(upload_upload, 'upload');
 
 
 
+
 
 
 /* harmony default export */ var shineout_style_src = ({});
@@ -59158,6 +59294,164 @@ function select_Select(props) {
 var SelectComp = src_select_select_0;
 SelectComp.displayName = 'ShineoutSelect';
 /* harmony default export */ var src_select_0 = (SelectComp);
+;// CONCATENATED MODULE: ../base/src/skeleton/text.tsx
+
+
+
+function Text(_ref) {
+  var classes = _ref.classes,
+    className = _ref.className,
+    _ref$rows = _ref.rows,
+    rows = _ref$rows === void 0 ? 3 : _ref$rows,
+    width = _ref.width,
+    height = _ref.height,
+    style = _ref.style;
+  var cls = classnames_default()(classes.text, className);
+  var nodes = [];
+  function getTextWidth(index) {
+    if (isArray(width)) {
+      return width[index];
+    }
+    if (rows - 1 === index) {
+      return width;
+    }
+    return undefined;
+  }
+  function getTextHeight(index) {
+    if (isArray(height)) {
+      return height[index];
+    }
+    if (rows - 1 === index) {
+      return height;
+    }
+    return undefined;
+  }
+  for (var i = 0; i < rows; i++) {
+    nodes.push( /*#__PURE__*/(0,jsx_runtime.jsx)("li", {
+      className: classes.textItem,
+      style: {
+        width: getTextWidth(i),
+        height: getTextHeight(i)
+      }
+    }, i));
+  }
+  return /*#__PURE__*/(0,jsx_runtime.jsx)("ul", {
+    className: cls,
+    style: style,
+    children: nodes
+  });
+}
+;// CONCATENATED MODULE: ../base/src/skeleton/image.tsx
+
+
+
+function skeleton_image_Image(_ref) {
+  var classes = _ref.classes,
+    className = _ref.className,
+    size = _ref.size,
+    position = _ref.position,
+    _ref$shape = _ref.shape,
+    shape = _ref$shape === void 0 ? 'circle' : _ref$shape,
+    style = _ref.style;
+  var cls = classnames_default()(classes.image, defineProperty_default()(defineProperty_default()(defineProperty_default()(defineProperty_default()(defineProperty_default()(defineProperty_default()({}, classes.imageLeft, position !== 'right'), classes.imageRight, position === 'right'), classes.imageCircle, shape === 'circle'), classes.imageSquare, shape === 'square'), classes.imageSmall, size === 'small'), classes.imageLarge, size === 'large'), className);
+  return /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+    className: cls,
+    style: style
+  });
+}
+;// CONCATENATED MODULE: ../base/src/skeleton/button.tsx
+
+
+
+function skeleton_button_Button(_ref) {
+  var classes = _ref.classes,
+    className = _ref.className,
+    size = _ref.size,
+    position = _ref.position,
+    _ref$count = _ref.count,
+    count = _ref$count === void 0 ? 1 : _ref$count,
+    style = _ref.style;
+  var cls = classnames_default()(classes.button, defineProperty_default()(defineProperty_default()(defineProperty_default()(defineProperty_default()({}, classes.buttonLeft, position !== 'right'), classes.buttonRight, position === 'right'), classes.buttonSmall, size === 'small'), classes.buttonLarge, size === 'large'), className);
+  var buttons = [];
+  for (var i = 0; i < count; i++) {
+    buttons.push( /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+      className: classes.buttonItem
+    }, i));
+  }
+  return /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
+    className: cls,
+    style: style,
+    children: buttons
+  });
+}
+;// CONCATENATED MODULE: ../base/src/skeleton/skeleton.tsx
+
+
+
+
+
+
+
+
+
+function getComponentProps(prop) {
+  return is_isObject(prop) ? prop : {};
+}
+var Skeleton = function Skeleton(props) {
+  var _jssStyle$skeleton;
+  var animation = props.animation,
+    image = props.image,
+    button = props.button,
+    _props$text = props.text,
+    text = _props$text === void 0 ? true : _props$text,
+    children = props.children,
+    loading = props.loading,
+    jssStyle = props.jssStyle;
+  var classes = jssStyle === null || jssStyle === void 0 || (_jssStyle$skeleton = jssStyle.skeleton) === null || _jssStyle$skeleton === void 0 ? void 0 : _jssStyle$skeleton.call(jssStyle);
+  var rootClass = classnames_default()(classes.rootClass, classes.wrapper, props.className, defineProperty_default()({}, classes.animation, animation));
+  var imageProps = getComponentProps(image);
+  var textProps = getComponentProps(text);
+  var buttonProps = getComponentProps(button);
+  if (loading) {
+    return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
+      className: rootClass,
+      style: props.style,
+      children: [image && imageProps.position !== 'right' && /*#__PURE__*/(0,jsx_runtime.jsx)(skeleton_image_Image, objectSpread2_default()({
+        classes: classes
+      }, imageProps)), /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
+        className: classes.content,
+        children: [text && /*#__PURE__*/(0,jsx_runtime.jsx)(Text, objectSpread2_default()({
+          classes: classes
+        }, textProps)), button && /*#__PURE__*/(0,jsx_runtime.jsx)(skeleton_button_Button, objectSpread2_default()({
+          classes: classes
+        }, buttonProps))]
+      }), image && imageProps.position === 'right' && /*#__PURE__*/(0,jsx_runtime.jsx)(skeleton_image_Image, objectSpread2_default()({
+        classes: classes
+      }, imageProps))]
+    });
+  }
+  return children;
+};
+/* harmony default export */ var src_skeleton_skeleton = (Skeleton);
+;// CONCATENATED MODULE: ./src/skeleton/skeleton.tsx
+
+
+
+
+
+var skeleton_jssStyle = {
+  skeleton: useSkeletonStyle
+};
+/* harmony default export */ var src_skeleton_skeleton_0 = (function (props) {
+  return /*#__PURE__*/(0,jsx_runtime.jsx)(src_skeleton_skeleton, objectSpread2_default()({
+    jssStyle: skeleton_jssStyle
+  }, props));
+});
+;// CONCATENATED MODULE: ./src/skeleton/index.ts
+
+var SkeletonComp = src_skeleton_skeleton_0;
+SkeletonComp.displayName = 'ShineoutSkeleton';
+/* harmony default export */ var src_skeleton_0 = (SkeletonComp);
 ;// CONCATENATED MODULE: ../hooks/src/components/use-slider/use-slider.ts
 
 
@@ -70181,6 +70475,8 @@ var rate_interface = __webpack_require__(4188);
 var rule_interface = __webpack_require__(1645);
 // EXTERNAL MODULE: ./src/select/interface.ts
 var select_interface = __webpack_require__(7640);
+// EXTERNAL MODULE: ./src/skeleton/interface.ts
+var skeleton_interface = __webpack_require__(6599);
 // EXTERNAL MODULE: ./src/slider/interface.ts
 var slider_interface = __webpack_require__(5864);
 // EXTERNAL MODULE: ./src/spin/interface.ts
@@ -70307,6 +70603,8 @@ var upload_interface = __webpack_require__(8821);
 
 
 
+
+
 
 
 
@@ -70370,10 +70668,11 @@ var upload_interface = __webpack_require__(8821);
 
 
 
+
 
 
 /* harmony default export */ var src_0 = ({
-  version: '3.7.0-beta.18'
+  version: '3.7.0-beta.19'
 });
 }();
 /******/ 	return __webpack_exports__;