@elliemae/ds-square-indicator 2.3.1 → 3.0.0-alpha.3

package/cjs/DSSquareIndicator.js

@@ -1,169 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _jsx2 = require('@babel/runtime/helpers/jsx');
-var react = require('react');
-var dsGrid = require('@elliemae/ds-grid');
-var dsTooltip = require('@elliemae/ds-tooltip');
-var dsPropsHelpers = require('@elliemae/ds-props-helpers');
-var uid = require('uid');
-var reactDescPropTypes = require('./react-desc-prop-types.js');
-var styled = require('./styled.js');
-var constants = require('./constants.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _jsx2__default = /*#__PURE__*/_interopDefaultLegacy(_jsx2);
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const DSSquareIndicator = props => {
-  const propsWithDefault = dsPropsHelpers.useMemoMergePropsWithDefault(props, reactDescPropTypes.defaultProps);
-  const globalAttributes = dsPropsHelpers.useGetGlobalAttributes(propsWithDefault);
-  const {
-    size,
-    color,
-    text,
-    showText,
-    withTooltip,
-    tooltipStartPlacementPreference,
-    __duration
-  } = propsWithDefault;
-  const Wrapper = react.useMemo(() => withTooltip ? dsTooltip.DSTooltipV3 : _ref => {
-    let {
-      children
-    } = _ref;
-    return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
-      children: children
-    });
-  }, [withTooltip]);
-  const uniqueId = react.useMemo(() => uid.uid(16), []);
-  const paddedCoordinate = react.useMemo(() => "calc(100% - ".concat(constants.sizeToWeight[size], ")"), [size]);
-  const hexColor = react.useMemo(() => constants.colorToHex[color], [color]);
-  return /*#__PURE__*/jsxRuntime.jsx(dsGrid.Grid, _objectSpread(_objectSpread({
-    gutter: "xs",
-    justifyContent: "center",
-    role: "status"
-  }, globalAttributes), {}, {
-    children: /*#__PURE__*/_jsx2__default["default"](Wrapper, {
-      text: text,
-      textAlign: "center",
-      startPlacementPreference: tooltipStartPlacementPreference
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("svg", {
-      width: constants.sizeToPx[size],
-      height: constants.sizeToPx[size],
-      style: {
-        display: 'block',
-        margin: 'auto'
-      }
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("defs", {}, void 0, /*#__PURE__*/_jsx2__default["default"]("linearGradient", {
-      id: "".concat(uniqueId, "-lg1"),
-      x1: "0",
-      y1: "0",
-      x2: "0",
-      y2: "100%"
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "20%",
-      stopColor: "".concat(hexColor, "FF")
-    }), /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "80%",
-      stopColor: "".concat(hexColor, "00")
-    })), /*#__PURE__*/_jsx2__default["default"]("linearGradient", {
-      id: "".concat(uniqueId, "-lg2"),
-      x1: "0",
-      y1: "0",
-      x2: "100%",
-      y2: "0"
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "10%",
-      stopColor: "".concat(hexColor, "00")
-    }), /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "50%",
-      stopColor: "".concat(hexColor, "FF")
-    })), /*#__PURE__*/_jsx2__default["default"]("linearGradient", {
-      id: "".concat(uniqueId, "-lg3"),
-      x1: "0",
-      y1: "0",
-      x2: "0",
-      y2: "100%"
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "10%",
-      stopColor: "".concat(hexColor, "00")
-    }), /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "50%",
-      stopColor: "".concat(hexColor, "FF")
-    })), /*#__PURE__*/_jsx2__default["default"]("linearGradient", {
-      id: "".concat(uniqueId, "-lg4"),
-      x1: "0",
-      y1: "0",
-      x2: "100%",
-      y2: "0"
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "50%",
-      stopColor: "".concat(hexColor, "FF")
-    }), /*#__PURE__*/_jsx2__default["default"]("stop", {
-      offset: "90%",
-      stopColor: "".concat(hexColor, "00")
-    })), /*#__PURE__*/_jsx2__default["default"]("clipPath", {
-      id: "".concat(uniqueId, "-lcp1")
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("rect", {
-      x: constants.sizeToWeight[size],
-      y: 0,
-      width: "100%",
-      height: constants.sizeToWeight[size]
-    })), /*#__PURE__*/_jsx2__default["default"]("clipPath", {
-      id: "".concat(uniqueId, "-lcp2")
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("rect", {
-      x: paddedCoordinate,
-      y: constants.sizeToWeight[size],
-      width: constants.sizeToWeight[size],
-      height: "100%"
-    })), /*#__PURE__*/_jsx2__default["default"]("clipPath", {
-      id: "".concat(uniqueId, "-lcp3")
-    }, void 0, /*#__PURE__*/_jsx2__default["default"]("rect", {
-      x: 0,
-      y: paddedCoordinate,
-      width: paddedCoordinate,
-      height: constants.sizeToWeight[size]
-    }))), /*#__PURE__*/_jsx2__default["default"](styled.StyledLineLeft, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg1)")
-    }), /*#__PURE__*/_jsx2__default["default"](styled.StyledLineTop, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg2)"),
-      clipPath: "url(#".concat(uniqueId, "-lcp1)")
-    }), /*#__PURE__*/_jsx2__default["default"](styled.StyledLineRight, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg3)"),
-      clipPath: "url(#".concat(uniqueId, "-lcp2)")
-    }), /*#__PURE__*/_jsx2__default["default"](styled.StyledLineBottom, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg4)"),
-      clipPath: "url(#".concat(uniqueId, "-lcp3)")
-    })), text !== '' && showText && /*#__PURE__*/_jsx2__default["default"]("span", {
-      style: {
-        color: constants.colorToHex[color],
-        fontSize: constants.sizeToTextSize[size]
-      }
-    }, void 0, text))
-  }));
-};
-const DSSquareIndicatorWithSchema = dsPropsHelpers.describe(DSSquareIndicator);
-DSSquareIndicatorWithSchema.propTypes = reactDescPropTypes.SquareIndicatorPropTypes;
-
-exports.DSSquareIndicator = DSSquareIndicator;
-exports.DSSquareIndicatorWithSchema = DSSquareIndicatorWithSchema;

package/cjs/constants.js

@@ -1,37 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const sizeToPx = {
-  xs: '16px',
-  s: '24px',
-  m: '32px',
-  l: '48px',
-  xl: '56px',
-  xxl: '64px'
-};
-const sizeToWeight = {
-  xs: '3px',
-  s: '3px',
-  m: '3px',
-  l: '4px',
-  xl: '5px',
-  xxl: '6px'
-};
-const colorToHex = {
-  light: '#FFFFFF',
-  dark: '#0F364A'
-};
-const sizeToTextSize = {
-  xs: '12px',
-  s: '12px',
-  m: '12px',
-  l: '13px',
-  xl: '14px',
-  xxl: '16px'
-};
-
-exports.colorToHex = colorToHex;
-exports.sizeToPx = sizeToPx;
-exports.sizeToTextSize = sizeToTextSize;
-exports.sizeToWeight = sizeToWeight;

package/cjs/index.js

@@ -1,10 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var DSSquareIndicator = require('./DSSquareIndicator.js');
-
-
-
-exports.DSSquareIndicator = DSSquareIndicator.DSSquareIndicator;
-exports.DSSquareIndicatorWithSchema = DSSquareIndicator.DSSquareIndicatorWithSchema;

package/cjs/react-desc-prop-types.js

@@ -1,39 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var dsPropsHelpers = require('@elliemae/ds-props-helpers');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const SquareIndicatorPropTypes = _objectSpread(_objectSpread({}, dsPropsHelpers.globalAttributesPropTypes), {}, {
-  size: dsPropsHelpers.PropTypes.oneOf(['xs', 's', 'm', 'l', 'xl', 'xxl']).description('Size of the indicator').defaultValue('m'),
-  color: dsPropsHelpers.PropTypes.oneOf(['light', 'dark']).description('Color mode for the indicator').defaultValue('dark'),
-  text: dsPropsHelpers.PropTypes.string.description('Optional text to show under the indicator').defaultValue(''),
-  showText: dsPropsHelpers.PropTypes.bool.description('Whether to show the optional text or not').defaultValue(true),
-  withTooltip: dsPropsHelpers.PropTypes.bool.description('Whether to include a tooltip that shows the optional text on hover').defaultValue(false),
-  tooltipStartPlacementPreference: dsPropsHelpers.PropTypes.oneOf(['top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start']).description('start placement preference for the tooltip').defaultValue('center')
-});
-const defaultProps = {
-  size: 'm',
-  color: 'dark',
-  text: '',
-  showText: true,
-  withTooltip: false,
-  tooltipStartPlacementPreference: 'bottom',
-  __duration: 2.5
-};
-
-exports.SquareIndicatorPropTypes = SquareIndicatorPropTypes;
-exports.defaultProps = defaultProps;

package/cjs/styled.js

@@ -1,86 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
-var dsSystem = require('@elliemae/ds-system');
-var constants = require('./constants.js');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-const lineLeftAnimation = dsSystem.kfrm(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n    0% {\n        y: 100%;\n        height: 100%;\n    }\n    12.5%, 50% {\n        y: 0;\n        height: 100%;\n    }\n    62.5%, 100% {\n        y: -100%;\n        height: 100%;\n    }\n"])));
-const lineTopAnimation = dsSystem.kfrm(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\n    0% {\n        x: -100%;\n        width: 0%;\n    }\n    25%, 50% {\n        x: -100%;\n        width: 200%;\n    }\n    75%, 100% {\n        x: 100%;\n        width: 200%;\n    }\n"])));
-const lineRightAnimation = dsSystem.kfrm(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default["default"](["\n    0%, 12.5% {\n        y: -100%;\n        height: 0%;\n    }\n    37.5%, 62.5% {\n        y: -100%;\n        height: 200%;\n    }\n    87.5%, 100% {\n        y: 100%;\n        height: 200%;\n    }\n"])));
-const lineBottomAnimation = dsSystem.kfrm(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default["default"](["\n    0%, 25% {\n        x: 200%;\n        width: 200%;\n    }\n    50%, 75% {\n        x: 0%;\n        width: 200%;\n    }\n    100% {\n        x: -200%;\n        width: 200%;\n    }\n"])));
-const StyledLineLeft = /*#__PURE__*/styled__default["default"].rect.withConfig({
-  componentId: "sc-df9quy-0"
-})(["x:0;y:0%;width:", ";height:100%;animation:", " ", "s linear 0s infinite;"], _ref => {
-  let {
-    size
-  } = _ref;
-  return constants.sizeToWeight[size];
-}, lineLeftAnimation, _ref2 => {
-  let {
-    __duration
-  } = _ref2;
-  return __duration;
-});
-const StyledLineTop = /*#__PURE__*/styled__default["default"].rect.withConfig({
-  componentId: "sc-df9quy-1"
-})(["x:-100%;y:0;width:200%;height:", ";animation:", " ", "s linear 0s infinite;"], _ref3 => {
-  let {
-    size
-  } = _ref3;
-  return constants.sizeToWeight[size];
-}, lineTopAnimation, _ref4 => {
-  let {
-    __duration
-  } = _ref4;
-  return __duration;
-});
-const StyledLineRight = /*#__PURE__*/styled__default["default"].rect.withConfig({
-  componentId: "sc-df9quy-2"
-})(["x:calc(100% - ", ");y:-100%;width:", ";height:200%;animation:", " ", "s linear 0s infinite;"], _ref5 => {
-  let {
-    size
-  } = _ref5;
-  return constants.sizeToWeight[size];
-}, _ref6 => {
-  let {
-    size
-  } = _ref6;
-  return constants.sizeToWeight[size];
-}, lineRightAnimation, _ref7 => {
-  let {
-    __duration
-  } = _ref7;
-  return __duration;
-});
-const StyledLineBottom = /*#__PURE__*/styled__default["default"].rect.withConfig({
-  componentId: "sc-df9quy-3"
-})(["x:0%;y:calc(100% - ", ");width:200%;height:", ";animation:", " ", "s linear 0s infinite;"], _ref8 => {
-  let {
-    size
-  } = _ref8;
-  return constants.sizeToWeight[size];
-}, _ref9 => {
-  let {
-    size
-  } = _ref9;
-  return constants.sizeToWeight[size];
-}, lineBottomAnimation, _ref10 => {
-  let {
-    __duration
-  } = _ref10;
-  return __duration;
-});
-
-exports.StyledLineBottom = StyledLineBottom;
-exports.StyledLineLeft = StyledLineLeft;
-exports.StyledLineRight = StyledLineRight;
-exports.StyledLineTop = StyledLineTop;

package/esm/DSSquareIndicator.js

@@ -1,159 +0,0 @@
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _jsx2 from '@babel/runtime/helpers/esm/jsx';
-import { useMemo } from 'react';
-import { Grid } from '@elliemae/ds-grid';
-import { DSTooltipV3 } from '@elliemae/ds-tooltip';
-import { describe, useMemoMergePropsWithDefault, useGetGlobalAttributes } from '@elliemae/ds-props-helpers';
-import { uid } from 'uid';
-import { SquareIndicatorPropTypes, defaultProps } from './react-desc-prop-types.js';
-import { StyledLineLeft, StyledLineTop, StyledLineRight, StyledLineBottom } from './styled.js';
-import { sizeToWeight, colorToHex, sizeToPx, sizeToTextSize } from './constants.js';
-import { jsx, Fragment } from 'react/jsx-runtime';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const DSSquareIndicator = props => {
-  const propsWithDefault = useMemoMergePropsWithDefault(props, defaultProps);
-  const globalAttributes = useGetGlobalAttributes(propsWithDefault);
-  const {
-    size,
-    color,
-    text,
-    showText,
-    withTooltip,
-    tooltipStartPlacementPreference,
-    __duration
-  } = propsWithDefault;
-  const Wrapper = useMemo(() => withTooltip ? DSTooltipV3 : _ref => {
-    let {
-      children
-    } = _ref;
-    return /*#__PURE__*/jsx(Fragment, {
-      children: children
-    });
-  }, [withTooltip]);
-  const uniqueId = useMemo(() => uid(16), []);
-  const paddedCoordinate = useMemo(() => "calc(100% - ".concat(sizeToWeight[size], ")"), [size]);
-  const hexColor = useMemo(() => colorToHex[color], [color]);
-  return /*#__PURE__*/jsx(Grid, _objectSpread(_objectSpread({
-    gutter: "xs",
-    justifyContent: "center",
-    role: "status"
-  }, globalAttributes), {}, {
-    children: /*#__PURE__*/_jsx2(Wrapper, {
-      text: text,
-      textAlign: "center",
-      startPlacementPreference: tooltipStartPlacementPreference
-    }, void 0, /*#__PURE__*/_jsx2("svg", {
-      width: sizeToPx[size],
-      height: sizeToPx[size],
-      style: {
-        display: 'block',
-        margin: 'auto'
-      }
-    }, void 0, /*#__PURE__*/_jsx2("defs", {}, void 0, /*#__PURE__*/_jsx2("linearGradient", {
-      id: "".concat(uniqueId, "-lg1"),
-      x1: "0",
-      y1: "0",
-      x2: "0",
-      y2: "100%"
-    }, void 0, /*#__PURE__*/_jsx2("stop", {
-      offset: "20%",
-      stopColor: "".concat(hexColor, "FF")
-    }), /*#__PURE__*/_jsx2("stop", {
-      offset: "80%",
-      stopColor: "".concat(hexColor, "00")
-    })), /*#__PURE__*/_jsx2("linearGradient", {
-      id: "".concat(uniqueId, "-lg2"),
-      x1: "0",
-      y1: "0",
-      x2: "100%",
-      y2: "0"
-    }, void 0, /*#__PURE__*/_jsx2("stop", {
-      offset: "10%",
-      stopColor: "".concat(hexColor, "00")
-    }), /*#__PURE__*/_jsx2("stop", {
-      offset: "50%",
-      stopColor: "".concat(hexColor, "FF")
-    })), /*#__PURE__*/_jsx2("linearGradient", {
-      id: "".concat(uniqueId, "-lg3"),
-      x1: "0",
-      y1: "0",
-      x2: "0",
-      y2: "100%"
-    }, void 0, /*#__PURE__*/_jsx2("stop", {
-      offset: "10%",
-      stopColor: "".concat(hexColor, "00")
-    }), /*#__PURE__*/_jsx2("stop", {
-      offset: "50%",
-      stopColor: "".concat(hexColor, "FF")
-    })), /*#__PURE__*/_jsx2("linearGradient", {
-      id: "".concat(uniqueId, "-lg4"),
-      x1: "0",
-      y1: "0",
-      x2: "100%",
-      y2: "0"
-    }, void 0, /*#__PURE__*/_jsx2("stop", {
-      offset: "50%",
-      stopColor: "".concat(hexColor, "FF")
-    }), /*#__PURE__*/_jsx2("stop", {
-      offset: "90%",
-      stopColor: "".concat(hexColor, "00")
-    })), /*#__PURE__*/_jsx2("clipPath", {
-      id: "".concat(uniqueId, "-lcp1")
-    }, void 0, /*#__PURE__*/_jsx2("rect", {
-      x: sizeToWeight[size],
-      y: 0,
-      width: "100%",
-      height: sizeToWeight[size]
-    })), /*#__PURE__*/_jsx2("clipPath", {
-      id: "".concat(uniqueId, "-lcp2")
-    }, void 0, /*#__PURE__*/_jsx2("rect", {
-      x: paddedCoordinate,
-      y: sizeToWeight[size],
-      width: sizeToWeight[size],
-      height: "100%"
-    })), /*#__PURE__*/_jsx2("clipPath", {
-      id: "".concat(uniqueId, "-lcp3")
-    }, void 0, /*#__PURE__*/_jsx2("rect", {
-      x: 0,
-      y: paddedCoordinate,
-      width: paddedCoordinate,
-      height: sizeToWeight[size]
-    }))), /*#__PURE__*/_jsx2(StyledLineLeft, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg1)")
-    }), /*#__PURE__*/_jsx2(StyledLineTop, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg2)"),
-      clipPath: "url(#".concat(uniqueId, "-lcp1)")
-    }), /*#__PURE__*/_jsx2(StyledLineRight, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg3)"),
-      clipPath: "url(#".concat(uniqueId, "-lcp2)")
-    }), /*#__PURE__*/_jsx2(StyledLineBottom, {
-      size: size,
-      __duration: __duration,
-      fill: "url(#".concat(uniqueId, "-lg4)"),
-      clipPath: "url(#".concat(uniqueId, "-lcp3)")
-    })), text !== '' && showText && /*#__PURE__*/_jsx2("span", {
-      style: {
-        color: colorToHex[color],
-        fontSize: sizeToTextSize[size]
-      }
-    }, void 0, text))
-  }));
-};
-const DSSquareIndicatorWithSchema = describe(DSSquareIndicator);
-DSSquareIndicatorWithSchema.propTypes = SquareIndicatorPropTypes;
-
-export { DSSquareIndicator, DSSquareIndicatorWithSchema };

package/esm/constants.js

@@ -1,30 +0,0 @@
-const sizeToPx = {
-  xs: '16px',
-  s: '24px',
-  m: '32px',
-  l: '48px',
-  xl: '56px',
-  xxl: '64px'
-};
-const sizeToWeight = {
-  xs: '3px',
-  s: '3px',
-  m: '3px',
-  l: '4px',
-  xl: '5px',
-  xxl: '6px'
-};
-const colorToHex = {
-  light: '#FFFFFF',
-  dark: '#0F364A'
-};
-const sizeToTextSize = {
-  xs: '12px',
-  s: '12px',
-  m: '12px',
-  l: '13px',
-  xl: '14px',
-  xxl: '16px'
-};
-
-export { colorToHex, sizeToPx, sizeToTextSize, sizeToWeight };

package/esm/index.js

@@ -1 +0,0 @@
-export { DSSquareIndicator, DSSquareIndicatorWithSchema } from './DSSquareIndicator.js';

package/esm/react-desc-prop-types.js

@@ -1,30 +0,0 @@
-import 'core-js/modules/esnext.async-iterator.filter.js';
-import 'core-js/modules/esnext.iterator.constructor.js';
-import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import { PropTypes, globalAttributesPropTypes } from '@elliemae/ds-props-helpers';
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-const SquareIndicatorPropTypes = _objectSpread(_objectSpread({}, globalAttributesPropTypes), {}, {
-  size: PropTypes.oneOf(['xs', 's', 'm', 'l', 'xl', 'xxl']).description('Size of the indicator').defaultValue('m'),
-  color: PropTypes.oneOf(['light', 'dark']).description('Color mode for the indicator').defaultValue('dark'),
-  text: PropTypes.string.description('Optional text to show under the indicator').defaultValue(''),
-  showText: PropTypes.bool.description('Whether to show the optional text or not').defaultValue(true),
-  withTooltip: PropTypes.bool.description('Whether to include a tooltip that shows the optional text on hover').defaultValue(false),
-  tooltipStartPlacementPreference: PropTypes.oneOf(['top-start', 'top', 'top-end', 'right-start', 'right', 'right-end', 'bottom-end', 'bottom', 'bottom-start', 'left-end', 'left', 'left-start']).description('start placement preference for the tooltip').defaultValue('center')
-});
-const defaultProps = {
-  size: 'm',
-  color: 'dark',
-  text: '',
-  showText: true,
-  withTooltip: false,
-  tooltipStartPlacementPreference: 'bottom',
-  __duration: 2.5
-};
-
-export { SquareIndicatorPropTypes, defaultProps };

package/esm/styled.js

@@ -1,74 +0,0 @@
-import _taggedTemplateLiteral from '@babel/runtime/helpers/esm/taggedTemplateLiteral';
-import styled from 'styled-components';
-import { kfrm } from '@elliemae/ds-system';
-import { sizeToWeight } from './constants.js';
-
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
-const lineLeftAnimation = kfrm(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    0% {\n        y: 100%;\n        height: 100%;\n    }\n    12.5%, 50% {\n        y: 0;\n        height: 100%;\n    }\n    62.5%, 100% {\n        y: -100%;\n        height: 100%;\n    }\n"])));
-const lineTopAnimation = kfrm(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    0% {\n        x: -100%;\n        width: 0%;\n    }\n    25%, 50% {\n        x: -100%;\n        width: 200%;\n    }\n    75%, 100% {\n        x: 100%;\n        width: 200%;\n    }\n"])));
-const lineRightAnimation = kfrm(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    0%, 12.5% {\n        y: -100%;\n        height: 0%;\n    }\n    37.5%, 62.5% {\n        y: -100%;\n        height: 200%;\n    }\n    87.5%, 100% {\n        y: 100%;\n        height: 200%;\n    }\n"])));
-const lineBottomAnimation = kfrm(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    0%, 25% {\n        x: 200%;\n        width: 200%;\n    }\n    50%, 75% {\n        x: 0%;\n        width: 200%;\n    }\n    100% {\n        x: -200%;\n        width: 200%;\n    }\n"])));
-const StyledLineLeft = /*#__PURE__*/styled.rect.withConfig({
-  componentId: "sc-df9quy-0"
-})(["x:0;y:0%;width:", ";height:100%;animation:", " ", "s linear 0s infinite;"], _ref => {
-  let {
-    size
-  } = _ref;
-  return sizeToWeight[size];
-}, lineLeftAnimation, _ref2 => {
-  let {
-    __duration
-  } = _ref2;
-  return __duration;
-});
-const StyledLineTop = /*#__PURE__*/styled.rect.withConfig({
-  componentId: "sc-df9quy-1"
-})(["x:-100%;y:0;width:200%;height:", ";animation:", " ", "s linear 0s infinite;"], _ref3 => {
-  let {
-    size
-  } = _ref3;
-  return sizeToWeight[size];
-}, lineTopAnimation, _ref4 => {
-  let {
-    __duration
-  } = _ref4;
-  return __duration;
-});
-const StyledLineRight = /*#__PURE__*/styled.rect.withConfig({
-  componentId: "sc-df9quy-2"
-})(["x:calc(100% - ", ");y:-100%;width:", ";height:200%;animation:", " ", "s linear 0s infinite;"], _ref5 => {
-  let {
-    size
-  } = _ref5;
-  return sizeToWeight[size];
-}, _ref6 => {
-  let {
-    size
-  } = _ref6;
-  return sizeToWeight[size];
-}, lineRightAnimation, _ref7 => {
-  let {
-    __duration
-  } = _ref7;
-  return __duration;
-});
-const StyledLineBottom = /*#__PURE__*/styled.rect.withConfig({
-  componentId: "sc-df9quy-3"
-})(["x:0%;y:calc(100% - ", ");width:200%;height:", ";animation:", " ", "s linear 0s infinite;"], _ref8 => {
-  let {
-    size
-  } = _ref8;
-  return sizeToWeight[size];
-}, _ref9 => {
-  let {
-    size
-  } = _ref9;
-  return sizeToWeight[size];
-}, lineBottomAnimation, _ref10 => {
-  let {
-    __duration
-  } = _ref10;
-  return __duration;
-});
-
-export { StyledLineBottom, StyledLineLeft, StyledLineRight, StyledLineTop };

package/types/DSSquareIndicator.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import { DSSquareIndicatorT } from './react-desc-prop-types';
-export declare const DSSquareIndicator: React.ComponentType<DSSquareIndicatorT.Props>;
-export declare const DSSquareIndicatorWithSchema: import("@elliemae/ds-props-helpers/types/propTypes/types").DocumentedReactComponent<DSSquareIndicatorT.Props>;