@elliemae/ds-icons 3.0.0-next.7 → 3.0.0-next.70

package/dist/esm/utils/SvgIcon.js

@@ -1,4 +1,6 @@
 var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __propIsEnum = Object.prototype.propertyIsEnumerable;
@@ -14,6 +16,7 @@ var __spreadValues = (a, b) => {
     }
   return a;
 };
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 var __objRest = (source, exclude) => {
   var target = {};
   for (var prop in source)
@@ -27,71 +30,63 @@ var __objRest = (source, exclude) => {
   return target;
 };
 import * as React from "react";
-import React2 from "react";
-import { PropTypes, describe } from "@elliemae/ds-props-helpers";
+import React2, { useMemo } from "react";
+import { th } from "@elliemae/ds-system";
+import { describe, useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-utilities";
 import { convertPropToCssClassName } from "@elliemae/ds-classnames";
+import { propTypes } from "./react-desc-prop-types";
+import { StyledSvg, StyledWrapper } from "./styled";
 const renderPaths = (paths) => paths.map((p, i) => /* @__PURE__ */ React2.createElement("path", {
   key: i,
   d: p
 }));
-const SvgIcon = (_a) => {
-  var _b = _a, {
-    containerProps = {},
-    size,
-    color,
-    className = "",
-    component: Component = "span",
-    viewBox = "0 0 24 24",
-    paths,
-    fill,
-    innerRef
-  } = _b, rest = __objRest(_b, [
-    "containerProps",
-    "size",
-    "color",
-    "className",
-    "component",
-    "viewBox",
-    "paths",
-    "fill",
-    "innerRef"
-  ]);
+const SvgIcon = (props) => {
+  const { size, innerRef, containerProps, paths, fill, viewBox, children, component } = props;
+  const _a = useGetGlobalAttributes(props), { className, width, height, style, color } = _a, restGlobals = __objRest(_a, ["className", "width", "height", "style", "color"]);
+  const defaultWidth = ((width || height) && parseInt(width || height, 10)) ?? 16;
+  const defaultHeight = ((height || width) && parseInt(height || width, 10)) ?? 16;
+  const xstyledProps = useGetXstyledProps(props);
   const { cssClassName } = convertPropToCssClassName("icon", className, {
     size,
     color
   });
-  return /* @__PURE__ */ React2.createElement(Component, __spreadValues(__spreadValues({
+  const finalColor = useMemo(() => {
+    if (!fill && !color)
+      return void 0;
+    let themeColor = "";
+    if (fill)
+      return fill;
+    if (!color)
+      return themeColor;
+    if (color[0] === "brand-primary")
+      themeColor = `brand-${color[1]}`;
+    else if (color[0] === "neutral" && color[1].toString() === "0")
+      themeColor = `neutral-000`;
+    else if (color[0] === "neutral" && color[1].toString() === "900")
+      themeColor = `neutral-800`;
+    else
+      themeColor = `${color[0]}-${color[1]}`;
+    return th.color(themeColor);
+  }, [color, fill]);
+  return /* @__PURE__ */ React2.createElement(StyledWrapper, __spreadProps(__spreadValues(__spreadValues(__spreadValues({
+    as: component,
     ref: innerRef,
     className: cssClassName
-  }, rest), containerProps), /* @__PURE__ */ React2.createElement("svg", {
-    fill,
-    viewBox
-  }, renderPaths(paths)));
-};
-const iconProps = {
-  containerProps: PropTypes.object.description("set of properties attached to the main container"),
-  size: PropTypes.oneOf(["xxs", "xs", "s", "m", "l", "xl", "xxl"]).description("size of the icon"),
-  color: PropTypes.oneOfType([
-    PropTypes.tuple([PropTypes.oneOf(["neutral"]), PropTypes.oneOf(["900"])]),
-    PropTypes.tuple([PropTypes.oneOf(["neutral"]), PropTypes.oneOf(["500"])]),
-    PropTypes.tuple([PropTypes.oneOf(["neutral"]), PropTypes.oneOf(["0"])]),
-    PropTypes.tuple([PropTypes.oneOf(["danger"]), PropTypes.oneOf(["900"])]),
-    PropTypes.tuple([PropTypes.oneOf(["warning"]), PropTypes.oneOf(["600"])]),
-    PropTypes.tuple([PropTypes.oneOf(["warning"]), PropTypes.oneOf(["900"])]),
-    PropTypes.tuple([PropTypes.oneOf(["success"]), PropTypes.oneOf(["900"])]),
-    PropTypes.tuple([PropTypes.oneOf(["brand-primary"]), PropTypes.oneOf(["600"])])
-  ]).description("icon color"),
-  className: PropTypes.string.description("html class attribute"),
-  component: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).description("containers element"),
-  viewBox: PropTypes.string.description("view box"),
-  paths: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]).description(""),
-  fill: PropTypes.string.description("fill attribute"),
-  innerRef: PropTypes.object.description("inner ref"),
-  title: PropTypes.object.description("Adds a title html element to the svg.")
+  }, restGlobals), containerProps), xstyledProps), {
+    style,
+    height: !size ? defaultHeight : void 0,
+    width: !size ? defaultWidth : void 0,
+    svgColor: finalColor
+  }), /* @__PURE__ */ React2.createElement(StyledSvg, {
+    viewBox,
+    width: !size ? defaultWidth : void 0,
+    height: !size ? defaultHeight : void 0
+  }, paths ? renderPaths(paths) : children));
 };
-SvgIcon.propTypes = iconProps;
+SvgIcon.propTypes = propTypes;
+SvgIcon.displayName = "SvgIcon";
 const IconWithSchema = describe(SvgIcon);
-IconWithSchema.propTypes = iconProps;
+IconWithSchema.propTypes = propTypes;
 var SvgIcon_default = SvgIcon;
 export {
   IconWithSchema,

package/dist/esm/utils/SvgIcon.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/SvgIcon.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-array-index-key */\nimport React, { WeakValidationMap } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\n\nconst renderPaths = (paths) => paths.map((p, i) => <path key={i} d={p} />);\n\nexport type SvgIconSizeType = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n\nexport type SvgIconColorType =\n  | ['neutral', '900']\n  | ['neutral', '500']\n  | ['neutral', '0']\n  | ['danger', '900']\n  | ['warning', '600']\n  | ['success', '900']\n  | ['brand-primary', '600'];\n\nexport interface SvgIconPropType {\n  containerProps: Record<any, any>;\n  size: SvgIconSizeType;\n  color: SvgIconColorType;\n  className: string;\n  component: React.ComponentType | 'span';\n  viewBox: string;\n  paths: any;\n  fill: any;\n  innerRef: any;\n}\n\nexport type SvgIconType = React.ComponentType<SvgIconPropType>;\n\nconst SvgIcon: React.ComponentType<SvgIconPropType> = ({\n  containerProps = {},\n  size,\n  color,\n  className = '',\n  component: Component = 'span',\n  viewBox = '0 0 24 24',\n  paths,\n  fill,\n  innerRef,\n  ...rest\n}) => {\n  const { cssClassName } = convertPropToCssClassName('icon', className, {\n    size,\n    color,\n  });\n  return (\n    <Component ref={innerRef} className={cssClassName} {...rest} {...containerProps}>\n      <svg fill={fill} viewBox={viewBox}>\n        {renderPaths(paths)}\n      </svg>\n    </Component>\n  );\n};\n\nconst iconProps = {\n  containerProps: PropTypes.object.description('set of properties attached to the main container'),\n  size: PropTypes.oneOf(['xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl']).description('size of the icon'),\n  color: PropTypes.oneOfType([\n    PropTypes.tuple([PropTypes.oneOf(['neutral']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['neutral']), PropTypes.oneOf(['500'])]),\n    PropTypes.tuple([PropTypes.oneOf(['neutral']), PropTypes.oneOf(['0'])]),\n    PropTypes.tuple([PropTypes.oneOf(['danger']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['warning']), PropTypes.oneOf(['600'])]),\n    PropTypes.tuple([PropTypes.oneOf(['warning']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['success']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['brand-primary']), PropTypes.oneOf(['600'])]),\n  ]).description('icon color'),\n  className: PropTypes.string.description('html class attribute'),\n  component: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).description('containers element'),\n  viewBox: PropTypes.string.description('view box'),\n  paths: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]).description(''),\n  fill: PropTypes.string.description('fill attribute'),\n  innerRef: PropTypes.object.description('inner ref'),\n  title: PropTypes.object.description('Adds a title html element to the svg.'),\n} as WeakValidationMap<unknown>;\n\nSvgIcon.propTypes = iconProps;\n\nconst IconWithSchema = describe(SvgIcon);\nIconWithSchema.propTypes = iconProps;\n\nexport { IconWithSchema, SvgIcon };\nexport default SvgIcon;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACCA;AACA;AACA;AAEA,MAAM,cAAc,CAAC,UAAU,MAAM,IAAI,CAAC,GAAG,MAAM,qCAAC,QAAD;AAAA,EAAM,KAAK;AAAA,EAAG,GAAG;AAAA;AA2BpE,MAAM,UAAgD,CAAC,OAWjD;AAXiD,eACrD;AAAA,qBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ,WAAW,YAAY;AAAA,IACvB,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,MATqD,IAUlD,iBAVkD,IAUlD;AAAA,IATH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,EAAE,iBAAiB,0BAA0B,QAAQ,WAAW;AAAA,IACpE;AAAA,IACA;AAAA;AAEF,SACE,qCAAC,WAAD;AAAA,IAAW,KAAK;AAAA,IAAU,WAAW;AAAA,KAAkB,OAAU,iBAC/D,qCAAC,OAAD;AAAA,IAAK;AAAA,IAAY;AAAA,KACd,YAAY;AAAA;AAMrB,MAAM,YAAY;AAAA,EAChB,gBAAgB,UAAU,OAAO,YAAY;AAAA,EAC7C,MAAM,UAAU,MAAM,CAAC,OAAO,MAAM,KAAK,KAAK,KAAK,MAAM,QAAQ,YAAY;AAAA,EAC7E,OAAO,UAAU,UAAU;AAAA,IACzB,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,aAAa,UAAU,MAAM,CAAC;AAAA,IAChE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,aAAa,UAAU,MAAM,CAAC;AAAA,IAChE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,aAAa,UAAU,MAAM,CAAC;AAAA,IAChE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,YAAY,UAAU,MAAM,CAAC;AAAA,IAC/D,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,aAAa,UAAU,MAAM,CAAC;AAAA,IAChE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,aAAa,UAAU,MAAM,CAAC;AAAA,IAChE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,aAAa,UAAU,MAAM,CAAC;AAAA,IAChE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,mBAAmB,UAAU,MAAM,CAAC;AAAA,KACrE,YAAY;AAAA,EACf,WAAW,UAAU,OAAO,YAAY;AAAA,EACxC,WAAW,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,OAAO,YAAY;AAAA,EAC/E,SAAS,UAAU,OAAO,YAAY;AAAA,EACtC,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,UAAU,YAAY;AAAA,EAChG,MAAM,UAAU,OAAO,YAAY;AAAA,EACnC,UAAU,UAAU,OAAO,YAAY;AAAA,EACvC,OAAO,UAAU,OAAO,YAAY;AAAA;AAGtC,QAAQ,YAAY;AAEpB,MAAM,iBAAiB,SAAS;AAChC,eAAe,YAAY;AAG3B,IAAO,kBAAQ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable complexity */\n/* eslint-disable react/no-array-index-key */\nimport React, { useMemo, WeakValidationMap } from 'react';\nimport { th } from '@elliemae/ds-system';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-utilities';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport { propTypes, SvgIconT } from './react-desc-prop-types';\nimport { StyledSvg, StyledWrapper } from './styled';\nconst renderPaths = (paths: string[]) => paths.map((p, i) => <path key={i} d={p} />);\n\nconst SvgIcon: React.ComponentType<SvgIconT.Props> = (props) => {\n  const { size, innerRef, containerProps, paths, fill, viewBox, children, component } = props;\n\n  const { className, width, height, style, color, ...restGlobals } = useGetGlobalAttributes(props);\n\n  const defaultWidth = ((width || height) && parseInt(width || height, 10)) ?? 16;\n  const defaultHeight = ((height || width) && parseInt(height || width, 10)) ?? 16;\n  const xstyledProps = useGetXstyledProps(props);\n  const { cssClassName } = convertPropToCssClassName('icon', className, {\n    size,\n    color,\n  });\n\n  const finalColor = useMemo(() => {\n    if (!fill && !color) return undefined;\n    let themeColor = '';\n    if (fill) return fill;\n    if (!color) return themeColor;\n    if (color[0] === 'brand-primary') themeColor = `brand-${color[1]}`;\n    else if (color[0] === 'neutral' && color[1].toString() === '0') themeColor = `neutral-000`;\n    else if (color[0] === 'neutral' && color[1].toString() === '900') themeColor = `neutral-800`;\n    else themeColor = `${color[0]}-${color[1]}`;\n\n    return th.color(themeColor);\n  }, [color, fill]);\n\n  return (\n    <StyledWrapper\n      as={component}\n      ref={innerRef}\n      className={cssClassName}\n      {...restGlobals}\n      {...containerProps}\n      {...xstyledProps}\n      style={style}\n      height={!size ? defaultHeight : undefined}\n      width={!size ? defaultWidth : undefined}\n      svgColor={finalColor}\n    >\n      <StyledSvg viewBox={viewBox} width={!size ? defaultWidth : undefined} height={!size ? defaultHeight : undefined}>\n        {paths ? renderPaths(paths) : children}\n      </StyledSvg>\n    </StyledWrapper>\n  );\n};\n\nSvgIcon.propTypes = propTypes;\nSvgIcon.displayName = 'SvgIcon';\nconst IconWithSchema = describe(SvgIcon);\nIconWithSchema.propTypes = propTypes as WeakValidationMap<unknown>;\n\nexport { IconWithSchema, SvgIcon };\nexport default SvgIcon;\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACEA;AACA;AACA;AACA;AACA;AACA;AACA,MAAM,cAAc,CAAC,UAAoB,MAAM,IAAI,CAAC,GAAG,MAAM,qCAAC;AAAA,EAAK,KAAK;AAAA,EAAG,GAAG;AAAA,CAAG,CAAE;AAEnF,MAAM,UAA+C,CAAC,UAAU;AAC9D,QAAM,EAAE,MAAM,UAAU,gBAAgB,OAAO,MAAM,SAAS,UAAU,cAAc;AAEtF,QAAmE,4BAAuB,KAAK,GAAvF,aAAW,OAAO,QAAQ,OAAO,UAA0B,IAAhB,wBAAgB,IAAhB,CAA3C,aAAW,SAAO,UAAQ,SAAO;AAEzC,QAAM,eAAiB,WAAS,WAAW,SAAS,SAAS,QAAQ,EAAE,MAAM;AAC7E,QAAM,gBAAkB,YAAU,UAAU,SAAS,UAAU,OAAO,EAAE,MAAM;AAC9E,QAAM,eAAe,mBAAmB,KAAK;AAC7C,QAAM,EAAE,iBAAiB,0BAA0B,QAAQ,WAAW;AAAA,IACpE;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI,CAAC,QAAQ,CAAC;AAAO,aAAO;AAC5B,QAAI,aAAa;AACjB,QAAI;AAAM,aAAO;AACjB,QAAI,CAAC;AAAO,aAAO;AACnB,QAAI,MAAM,OAAO;AAAiB,mBAAa,SAAS,MAAM;AAAA,aACrD,MAAM,OAAO,aAAa,MAAM,GAAG,SAAS,MAAM;AAAK,mBAAa;AAAA,aACpE,MAAM,OAAO,aAAa,MAAM,GAAG,SAAS,MAAM;AAAO,mBAAa;AAAA;AAC1E,mBAAa,GAAG,MAAM,MAAM,MAAM;AAEvC,WAAO,GAAG,MAAM,UAAU;AAAA,EAC5B,GAAG,CAAC,OAAO,IAAI,CAAC;AAEhB,SACE,qCAAC;AAAA,IACC,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,WAAW;AAAA,KACP,cACA,iBACA,eANL;AAAA,IAOC;AAAA,IACA,QAAQ,CAAC,OAAO,gBAAgB;AAAA,IAChC,OAAO,CAAC,OAAO,eAAe;AAAA,IAC9B,UAAU;AAAA,MAEV,qCAAC;AAAA,IAAU;AAAA,IAAkB,OAAO,CAAC,OAAO,eAAe;AAAA,IAAW,QAAQ,CAAC,OAAO,gBAAgB;AAAA,KACnG,QAAQ,YAAY,KAAK,IAAI,QAChC,CACF;AAEJ;AAEA,QAAQ,YAAY;AACpB,QAAQ,cAAc;AACtB,MAAM,iBAAiB,SAAS,OAAO;AACvC,eAAe,YAAY;AAG3B,IAAO,kBAAQ;",
   "names": []
 }

package/dist/esm/utils/createIcon.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/createIcon.tsx"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/display-name */\nimport React from 'react';\nimport { SvgIcon } from './SvgIcon';\n\nexport const createIcon = ({ containerProps = {}, paths, height, width }) => rest => (\n  <SvgIcon\n    {...rest}\n    {...containerProps}\n    paths={paths}\n    viewBox={`0 0 ${width} ${height}`}\n  />\n);\n\nexport default createIcon;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACCA;AACA;AAEO,MAAM,aAAa,CAAC,EAAE,iBAAiB,IAAI,OAAO,QAAQ,YAAY,UAC3E,qCAAC,SAAD,gDACM,OACA,iBAFN;AAAA,EAGE;AAAA,EACA,SAAS,OAAO,SAAS;AAAA;AAI7B,IAAO,qBAAQ;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;ACCA;AACA;AAEO,MAAM,aAAa,CAAC,EAAE,iBAAiB,CAAC,GAAG,OAAO,QAAQ,YAAY,UAC3E,qCAAC,yDACK,OACA,iBAFL;AAAA,EAGC;AAAA,EACA,SAAS,OAAO,SAAS;AAAA,EAC3B;AAGF,IAAO,qBAAQ;",
   "names": []
 }

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

@@ -0,0 +1,33 @@
+import * as React from "react";
+import { PropTypes } from "@elliemae/ds-utilities";
+const defaultProps = {
+  component: "span",
+  containerProps: {}
+};
+const propTypes = {
+  containerProps: PropTypes.object.description("set of properties attached to the main container"),
+  size: PropTypes.oneOf(["xxs", "xs", "s", "m", "l", "xl", "xxl"]).description("size of the icon"),
+  color: PropTypes.oneOfType([
+    PropTypes.tuple([PropTypes.oneOf(["neutral"]), PropTypes.oneOf(["900"])]),
+    PropTypes.tuple([PropTypes.oneOf(["neutral"]), PropTypes.oneOf(["500"])]),
+    PropTypes.tuple([PropTypes.oneOf(["neutral"]), PropTypes.oneOf(["0"])]),
+    PropTypes.tuple([PropTypes.oneOf(["danger"]), PropTypes.oneOf(["900"])]),
+    PropTypes.tuple([PropTypes.oneOf(["warning"]), PropTypes.oneOf(["600"])]),
+    PropTypes.tuple([PropTypes.oneOf(["warning"]), PropTypes.oneOf(["900"])]),
+    PropTypes.tuple([PropTypes.oneOf(["success"]), PropTypes.oneOf(["900"])]),
+    PropTypes.tuple([PropTypes.oneOf(["brand-primary"]), PropTypes.oneOf(["600"])]),
+    PropTypes.tuple([PropTypes.oneOf(["brand-primary"]), PropTypes.oneOf(["700"])])
+  ]).description("icon color"),
+  className: PropTypes.string.description("html class attribute"),
+  component: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).description("containers element"),
+  viewBox: PropTypes.string.description("view box"),
+  paths: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]).description(""),
+  fill: PropTypes.string.description("fill attribute"),
+  innerRef: PropTypes.object.description("inner ref"),
+  title: PropTypes.object.description("Adds a title html element to the svg.")
+};
+export {
+  defaultProps,
+  propTypes
+};
+//# sourceMappingURL=react-desc-prop-types.js.map

package/dist/esm/utils/react-desc-prop-types.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/react-desc-prop-types.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-utilities';\nexport declare namespace SvgIconT {\n  export type SizeType = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n\n  export type ColorType =\n    | ['neutral', '900']\n    | ['neutral', '500']\n    | ['neutral', '0']\n    | ['danger', '900']\n    | ['warning', '600']\n    | ['success', '900']\n    | ['brand-primary', '600'];\n\n  export interface Props {\n    component: React.ComponentType | 'span';\n    viewBox: string;\n    containerProps: object;\n    size?: SvgIconT.SizeType;\n    color?: SvgIconT.ColorType;\n    paths?: string[];\n    fill?: string;\n    innerRef?: React.MutableRefObject<HTMLElement>;\n    width?: number;\n    height?: number;\n  }\n}\n\nexport const defaultProps: Partial<SvgIconT.Props> = {\n  component: 'span',\n  containerProps: {},\n};\n\nexport const propTypes = {\n  containerProps: PropTypes.object.description('set of properties attached to the main container'),\n  size: PropTypes.oneOf(['xxs', 'xs', 's', 'm', 'l', 'xl', 'xxl']).description('size of the icon'),\n  color: PropTypes.oneOfType([\n    PropTypes.tuple([PropTypes.oneOf(['neutral']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['neutral']), PropTypes.oneOf(['500'])]),\n    PropTypes.tuple([PropTypes.oneOf(['neutral']), PropTypes.oneOf(['0'])]),\n    PropTypes.tuple([PropTypes.oneOf(['danger']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['warning']), PropTypes.oneOf(['600'])]),\n    PropTypes.tuple([PropTypes.oneOf(['warning']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['success']), PropTypes.oneOf(['900'])]),\n    PropTypes.tuple([PropTypes.oneOf(['brand-primary']), PropTypes.oneOf(['600'])]),\n    PropTypes.tuple([PropTypes.oneOf(['brand-primary']), PropTypes.oneOf(['700'])]),\n  ]).description('icon color'),\n  className: PropTypes.string.description('html class attribute'),\n  component: PropTypes.oneOfType([PropTypes.string, PropTypes.node]).description('containers element'),\n  viewBox: PropTypes.string.description('view box'),\n  paths: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]).description(''),\n  fill: PropTypes.string.description('fill attribute'),\n  innerRef: PropTypes.object.description('inner ref'),\n  title: PropTypes.object.description('Adds a title html element to the svg.'),\n};\n"],
+  "mappings": "AAAA;ACAA;AA2BO,MAAM,eAAwC;AAAA,EACnD,WAAW;AAAA,EACX,gBAAgB,CAAC;AACnB;AAEO,MAAM,YAAY;AAAA,EACvB,gBAAgB,UAAU,OAAO,YAAY,kDAAkD;AAAA,EAC/F,MAAM,UAAU,MAAM,CAAC,OAAO,MAAM,KAAK,KAAK,KAAK,MAAM,KAAK,CAAC,EAAE,YAAY,kBAAkB;AAAA,EAC/F,OAAO,UAAU,UAAU;AAAA,IACzB,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,SAAS,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,SAAS,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,SAAS,CAAC,GAAG,UAAU,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;AAAA,IACtE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,QAAQ,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACvE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,SAAS,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,SAAS,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,SAAS,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,eAAe,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IAC9E,UAAU,MAAM,CAAC,UAAU,MAAM,CAAC,eAAe,CAAC,GAAG,UAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,EAChF,CAAC,EAAE,YAAY,YAAY;AAAA,EAC3B,WAAW,UAAU,OAAO,YAAY,sBAAsB;AAAA,EAC9D,WAAW,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,IAAI,CAAC,EAAE,YAAY,oBAAoB;AAAA,EACnG,SAAS,UAAU,OAAO,YAAY,UAAU;AAAA,EAChD,OAAO,UAAU,UAAU,CAAC,UAAU,QAAQ,UAAU,QAAQ,UAAU,MAAM,CAAC,CAAC,EAAE,YAAY,EAAE;AAAA,EAClG,MAAM,UAAU,OAAO,YAAY,gBAAgB;AAAA,EACnD,UAAU,UAAU,OAAO,YAAY,WAAW;AAAA,EAClD,OAAO,UAAU,OAAO,YAAY,uCAAuC;AAC7E;",
+  "names": []
+}

package/dist/esm/utils/styled.js

@@ -0,0 +1,95 @@
+import * as React from "react";
+import { styled, css } from "@elliemae/ds-system";
+import { DSIconName, DSIconSlots } from "./theming";
+const displaySizes = css`
+  display: inline-flex;
+  vertical-align: middle;
+`;
+const xxlSizes = css`
+  width: 64px;
+  height: 64px;
+`;
+const xlSizes = css`
+  width: 48px;
+  height: 48px;
+`;
+const lSizes = css`
+  width: 32px;
+  height: 32px;
+`;
+const mSizes = css`
+  width: 24px;
+  height: 24px;
+`;
+const sSizes = css`
+  width: 16px;
+  height: 16px;
+`;
+const xsSizes = css`
+  width: 8px;
+  height: 8px;
+`;
+const xxsSizes = css`
+  width: 4px;
+  height: 4px;
+`;
+const standarSizes = css`
+  ${sSizes}
+`;
+const svgColorCss = css`
+  fill: ${({ svgColor }) => svgColor} !important;
+`;
+const getSize = (size) => {
+  if (size === "xxl")
+    return xxlSizes;
+  if (size === "xl")
+    return xlSizes;
+  if (size === "l")
+    return lSizes;
+  if (size === "m")
+    return mSizes;
+  if (size === "s")
+    return sSizes;
+  if (size === "xs")
+    return xsSizes;
+  if (size === "xxs")
+    return xxsSizes;
+  return standarSizes;
+};
+const StyledSvg = styled("svg", {
+  name: DSIconName,
+  slot: DSIconSlots.SVG
+})``;
+const StyledWrapper = styled("span", {
+  name: DSIconName,
+  slot: DSIconSlots.ICON_WRAPPER
+})`
+  ${({ size, width, height }) => !width && !height && getSize(size)}
+  ${({ width }) => {
+  if (width)
+    return `width: ${width}px;`;
+}}
+  ${({ height }) => {
+  if (height)
+    return `height: ${height}px;`;
+}}
+  ${displaySizes}
+
+  &.em-ds-icon svg {
+    ${({ size, width, height }) => !width && !height && getSize(size)}
+    ${({ width }) => {
+  if (width)
+    return `width: ${width}px;`;
+}}
+    ${({ height }) => {
+  if (height)
+    return `height: ${height}px;`;
+}}
+    ${({ svgColor }) => svgColor && svgColorCss}
+  }
+`;
+export {
+  StyledSvg,
+  StyledWrapper
+};
+//# sourceMappingURL=styled.js.map

package/dist/esm/utils/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/styled.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { styled, css } from '@elliemae/ds-system';\nimport { DSIconName, DSIconSlots } from './theming';\n\ninterface StyledWrapperPropsT {\n  size: string;\n  svgColor: string[];\n  width: string;\n  height: string;\n}\n\nconst displaySizes = css`\n  display: inline-flex;\n  vertical-align: middle;\n`;\nconst xxlSizes = css`\n  width: 64px;\n  height: 64px;\n`;\n\nconst xlSizes = css`\n  width: 48px;\n  height: 48px;\n`;\n\nconst lSizes = css`\n  width: 32px;\n  height: 32px;\n`;\n\nconst mSizes = css`\n  width: 24px;\n  height: 24px;\n`;\n\nconst sSizes = css`\n  width: 16px;\n  height: 16px;\n`;\n\nconst xsSizes = css`\n  width: 8px;\n  height: 8px;\n`;\n\nconst xxsSizes = css`\n  width: 4px;\n  height: 4px;\n`;\n\nconst standarSizes = css`\n  ${sSizes}\n`;\n\nconst svgColorCss = css`\n  fill: ${({ svgColor }) => svgColor} !important;\n`;\n\nconst getSize = (size: string) => {\n  if (size === 'xxl') return xxlSizes;\n  if (size === 'xl') return xlSizes;\n  if (size === 'l') return lSizes;\n  if (size === 'm') return mSizes;\n  if (size === 's') return sSizes;\n  if (size === 'xs') return xsSizes;\n  if (size === 'xxs') return xxsSizes;\n  return standarSizes;\n};\n\nexport const StyledSvg = styled('svg', {\n  name: DSIconName,\n  slot: DSIconSlots.SVG,\n})``;\n\nexport const StyledWrapper = styled('span', {\n  name: DSIconName,\n  slot: DSIconSlots.ICON_WRAPPER,\n})<StyledWrapperPropsT>`\n  ${({ size, width, height }) => !width && !height && getSize(size)}\n  ${({ width }) => {\n    if (width) return `width: ${width}px;`;\n  }}\n  ${({ height }) => {\n    if (height) return `height: ${height}px;`;\n  }}\n  ${displaySizes}\n\n  &.em-ds-icon svg {\n    ${({ size, width, height }) => !width && !height && getSize(size)}\n    ${({ width }) => {\n      if (width) return `width: ${width}px;`;\n    }}\n    ${({ height }) => {\n      if (height) return `height: ${height}px;`;\n    }}\n    ${({ svgColor }) => svgColor && svgColorCss}\n  }\n`;\n"],
+  "mappings": "AAAA;ACAA;AACA;AASA,MAAM,eAAe;AAAA;AAAA;AAAA;AAIrB,MAAM,WAAW;AAAA;AAAA;AAAA;AAKjB,MAAM,UAAU;AAAA;AAAA;AAAA;AAKhB,MAAM,SAAS;AAAA;AAAA;AAAA;AAKf,MAAM,SAAS;AAAA;AAAA;AAAA;AAKf,MAAM,SAAS;AAAA;AAAA;AAAA;AAKf,MAAM,UAAU;AAAA;AAAA;AAAA;AAKhB,MAAM,WAAW;AAAA;AAAA;AAAA;AAKjB,MAAM,eAAe;AAAA,IACjB;AAAA;AAGJ,MAAM,cAAc;AAAA,UACV,CAAC,EAAE,eAAe;AAAA;AAG5B,MAAM,UAAU,CAAC,SAAiB;AAChC,MAAI,SAAS;AAAO,WAAO;AAC3B,MAAI,SAAS;AAAM,WAAO;AAC1B,MAAI,SAAS;AAAK,WAAO;AACzB,MAAI,SAAS;AAAK,WAAO;AACzB,MAAI,SAAS;AAAK,WAAO;AACzB,MAAI,SAAS;AAAM,WAAO;AAC1B,MAAI,SAAS;AAAO,WAAO;AAC3B,SAAO;AACT;AAEO,MAAM,YAAY,OAAO,OAAO;AAAA,EACrC,MAAM;AAAA,EACN,MAAM,YAAY;AACpB,CAAC;AAEM,MAAM,gBAAgB,OAAO,QAAQ;AAAA,EAC1C,MAAM;AAAA,EACN,MAAM,YAAY;AACpB,CAAC;AAAA,IACG,CAAC,EAAE,MAAM,OAAO,aAAa,CAAC,SAAS,CAAC,UAAU,QAAQ,IAAI;AAAA,IAC9D,CAAC,EAAE,YAAY;AACf,MAAI;AAAO,WAAO,UAAU;AAC9B;AAAA,IACE,CAAC,EAAE,aAAa;AAChB,MAAI;AAAQ,WAAO,WAAW;AAChC;AAAA,IACE;AAAA;AAAA;AAAA,MAGE,CAAC,EAAE,MAAM,OAAO,aAAa,CAAC,SAAS,CAAC,UAAU,QAAQ,IAAI;AAAA,MAC9D,CAAC,EAAE,YAAY;AACf,MAAI;AAAO,WAAO,UAAU;AAC9B;AAAA,MACE,CAAC,EAAE,aAAa;AAChB,MAAI;AAAQ,WAAO,WAAW;AAChC;AAAA,MACE,CAAC,EAAE,eAAe,YAAY;AAAA;AAAA;",
+  "names": []
+}

package/dist/esm/utils/theming.js

@@ -0,0 +1,11 @@
+import * as React from "react";
+const DSIconName = "ds-icon";
+const DSIconSlots = {
+  ICON_WRAPPER: "root",
+  SVG: "svg"
+};
+export {
+  DSIconName,
+  DSIconSlots
+};
+//# sourceMappingURL=theming.js.map

package/dist/esm/utils/theming.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/theming.ts"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSIconName = 'ds-icon';\n\nexport const DSIconSlots = {\n  ICON_WRAPPER: 'root',\n  SVG: 'svg',\n};\n"],
+  "mappings": "AAAA;ACAO,MAAM,aAAa;AAEnB,MAAM,cAAc;AAAA,EACzB,cAAc;AAAA,EACd,KAAK;AACP;",
+  "names": []
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-icons",
-  "version": "3.0.0-next.7",
+  "version": "3.0.0-next.70",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Icons",
   "files": [
@@ -1570,21 +1570,21 @@
     "reportFile": "tests.xml",
     "indent": 4
   },
+  "scripts": {
+    "test": "node ../../scripts/testing/test.mjs",
+    "lint": "node ../../scripts/lint.mjs",
+    "dts": "node ../../scripts/dts.mjs",
+    "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
+    "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch"
+  },
   "dependencies": {
-    "@elliemae/ds-classnames": "3.0.0-next.7",
-    "@elliemae/ds-props-helpers": "3.0.0-next.7",
+    "@elliemae/ds-classnames": "workspace:*",
+    "@elliemae/ds-utilities": "workspace:*",
     "react-desc": "~4.1.3"
   },
   "peerDependencies": {
     "lodash": "^4.17.21",
     "react": "~17.0.2",
     "react-dom": "^17.0.2"
-  },
-  "scripts": {
-    "test": "node ../../scripts/testing/test.mjs",
-    "lint": "node ../../scripts/lint.mjs",
-    "dts": "node ../../scripts/dts.mjs",
-    "build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
-    "dev": "cross-env NODE_ENV=development node ../../scripts/build/build.mjs --watch"
   }
-}
+}

package/dist/cjs/MenuPickeSmall.js

@@ -1,103 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __reExport = (target, module2, copyDefault, desc) => {
-  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
-    for (let key of __getOwnPropNames(module2))
-      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
-        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
-  }
-  return target;
-};
-var __toESM = (module2, isNodeMode) => {
-  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
-};
-var __toCommonJS = /* @__PURE__ */ ((cache) => {
-  return (module2, temp) => {
-    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
-  };
-})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
-var MenuPickeSmall_exports = {};
-__export(MenuPickeSmall_exports, {
-  default: () => MenuPickeSmall_default
-});
-var React = __toESM(require("react"));
-var import_react = __toESM(require("react"));
-var import_ds_classnames = require("@elliemae/ds-classnames");
-function SvgIcon(props) {
-  const _a = props, { containerProps = {}, size, color, className = "", style = {}, innerRef } = _a, rest = __objRest(_a, ["containerProps", "size", "color", "className", "style", "innerRef"]);
-  const fill = color || props.fill || void 0;
-  const width = !size && !props.width ? 24 : props.width;
-  const height = !size && !props.height ? 24 : props.height;
-  const { cssClassName } = (0, import_ds_classnames.convertPropToCssClassName)("icon", className, {
-    size,
-    color
-  });
-  return /* @__PURE__ */ import_react.default.createElement("span", __spreadProps(__spreadValues(__spreadValues({
-    ref: innerRef,
-    className: cssClassName
-  }, rest), containerProps), {
-    style: __spreadValues({
-      width,
-      height
-    }, style)
-  }), /* @__PURE__ */ import_react.default.createElement("svg", {
-    width: width && String(width),
-    height: height && String(height),
-    style: {
-      width,
-      height
-    },
-    fill,
-    viewBox: "0 0 24 24"
-  }, /* @__PURE__ */ import_react.default.createElement("g", {
-    stroke: "none",
-    strokeWidth: "1",
-    fillRule: "evenodd"
-  }, /* @__PURE__ */ import_react.default.createElement("g", {
-    fill,
-    fillRule: "nonzero"
-  }, /* @__PURE__ */ import_react.default.createElement("path", {
-    d: "M7.2 8H4.8c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8z"
-  })))));
-}
-var MenuPickeSmall_default = SvgIcon;
-module.exports = __toCommonJS(MenuPickeSmall_exports);
-//# sourceMappingURL=MenuPickeSmall.js.map

package/dist/cjs/MenuPickeSmall.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../src/MenuPickeSmall.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\n\nfunction SvgIcon(props) {\n  const { containerProps = {}, size, color, className = '', style = {}, innerRef, ...rest } = props;\n  const fill = color || props.fill || undefined;\n  const width = !size && !props.width ? 24 : props.width;\n  const height = !size && !props.height ? 24 : props.height;\n  const { cssClassName } = convertPropToCssClassName('icon', className, {\n    size,\n    color,\n  });\n  return (\n    <span\n      ref={innerRef}\n      className={cssClassName}\n      {...rest}\n      {...containerProps}\n      style={{\n        width,\n        height,\n        ...style,\n      }}\n    >\n      <svg\n        width={width && String(width)}\n        height={height && String(height)}\n        style={{\n          width,\n          height,\n        }}\n        fill={fill}\n        viewBox=\"0 0 24 24\"\n      >\n        <g stroke=\"none\" strokeWidth=\"1\" fillRule=\"evenodd\">\n          <g fill={fill} fillRule=\"nonzero\">\n            <path d=\"M7.2 8H4.8c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8z\"></path>\n          </g>\n        </g>\n      </svg>\n    </span>\n  );\n}\n\nexport default SvgIcon;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAkB;AAClB,2BAA0C;AAE1C,iBAAiB,OAAO;AACtB,QAA4F,YAApF,mBAAiB,IAAI,MAAM,OAAO,YAAY,IAAI,QAAQ,IAAI,aAAsB,IAAT,iBAAS,IAAT,CAA3E,kBAAqB,QAAM,SAAO,aAAgB,SAAY;AACtE,QAAM,OAAO,SAAS,MAAM,QAAQ;AACpC,QAAM,QAAQ,CAAC,QAAQ,CAAC,MAAM,QAAQ,KAAK,MAAM;AACjD,QAAM,SAAS,CAAC,QAAQ,CAAC,MAAM,SAAS,KAAK,MAAM;AACnD,QAAM,EAAE,iBAAiB,oDAA0B,QAAQ,WAAW;AAAA,IACpE;AAAA,IACA;AAAA;AAEF,SACE,mDAAC,QAAD;AAAA,IACE,KAAK;AAAA,IACL,WAAW;AAAA,KACP,OACA,iBAJN;AAAA,IAKE,OAAO;AAAA,MACL;AAAA,MACA;AAAA,OACG;AAAA,MAGL,mDAAC,OAAD;AAAA,IACE,OAAO,SAAS,OAAO;AAAA,IACvB,QAAQ,UAAU,OAAO;AAAA,IACzB,OAAO;AAAA,MACL;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA,SAAQ;AAAA,KAER,mDAAC,KAAD;AAAA,IAAG,QAAO;AAAA,IAAO,aAAY;AAAA,IAAI,UAAS;AAAA,KACxC,mDAAC,KAAD;AAAA,IAAG;AAAA,IAAY,UAAS;AAAA,KACtB,mDAAC,QAAD;AAAA,IAAM,GAAE;AAAA;AAAA;AAQpB,IAAO,yBAAQ;",
-  "names": []
-}

package/dist/esm/MenuPickeSmall.js

@@ -1,76 +0,0 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-import * as React from "react";
-import React2 from "react";
-import { convertPropToCssClassName } from "@elliemae/ds-classnames";
-function SvgIcon(props) {
-  const _a = props, { containerProps = {}, size, color, className = "", style = {}, innerRef } = _a, rest = __objRest(_a, ["containerProps", "size", "color", "className", "style", "innerRef"]);
-  const fill = color || props.fill || void 0;
-  const width = !size && !props.width ? 24 : props.width;
-  const height = !size && !props.height ? 24 : props.height;
-  const { cssClassName } = convertPropToCssClassName("icon", className, {
-    size,
-    color
-  });
-  return /* @__PURE__ */ React2.createElement("span", __spreadProps(__spreadValues(__spreadValues({
-    ref: innerRef,
-    className: cssClassName
-  }, rest), containerProps), {
-    style: __spreadValues({
-      width,
-      height
-    }, style)
-  }), /* @__PURE__ */ React2.createElement("svg", {
-    width: width && String(width),
-    height: height && String(height),
-    style: {
-      width,
-      height
-    },
-    fill,
-    viewBox: "0 0 24 24"
-  }, /* @__PURE__ */ React2.createElement("g", {
-    stroke: "none",
-    strokeWidth: "1",
-    fillRule: "evenodd"
-  }, /* @__PURE__ */ React2.createElement("g", {
-    fill,
-    fillRule: "nonzero"
-  }, /* @__PURE__ */ React2.createElement("path", {
-    d: "M7.2 8H4.8c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8z"
-  })))));
-}
-var MenuPickeSmall_default = SvgIcon;
-export {
-  MenuPickeSmall_default as default
-};
-//# sourceMappingURL=MenuPickeSmall.js.map

package/dist/esm/MenuPickeSmall.js.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/MenuPickeSmall.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/prop-types */\nimport React from 'react';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\n\nfunction SvgIcon(props) {\n  const { containerProps = {}, size, color, className = '', style = {}, innerRef, ...rest } = props;\n  const fill = color || props.fill || undefined;\n  const width = !size && !props.width ? 24 : props.width;\n  const height = !size && !props.height ? 24 : props.height;\n  const { cssClassName } = convertPropToCssClassName('icon', className, {\n    size,\n    color,\n  });\n  return (\n    <span\n      ref={innerRef}\n      className={cssClassName}\n      {...rest}\n      {...containerProps}\n      style={{\n        width,\n        height,\n        ...style,\n      }}\n    >\n      <svg\n        width={width && String(width)}\n        height={height && String(height)}\n        style={{\n          width,\n          height,\n        }}\n        fill={fill}\n        viewBox=\"0 0 24 24\"\n      >\n        <g stroke=\"none\" strokeWidth=\"1\" fillRule=\"evenodd\">\n          <g fill={fill} fillRule=\"nonzero\">\n            <path d=\"M7.2 8H4.8c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8V4.8c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm-12 6H4.8c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8zm6 0h-2.4c-.44 0-.8-.36-.8-.8v-2.4c0-.44.36-.8.8-.8h2.4c.44 0 .8.36.8.8v2.4c0 .44-.36.8-.8.8z\"></path>\n          </g>\n        </g>\n      </svg>\n    </span>\n  );\n}\n\nexport default SvgIcon;\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;ACCA;AACA;AAEA,iBAAiB,OAAO;AACtB,QAA4F,YAApF,mBAAiB,IAAI,MAAM,OAAO,YAAY,IAAI,QAAQ,IAAI,aAAsB,IAAT,iBAAS,IAAT,CAA3E,kBAAqB,QAAM,SAAO,aAAgB,SAAY;AACtE,QAAM,OAAO,SAAS,MAAM,QAAQ;AACpC,QAAM,QAAQ,CAAC,QAAQ,CAAC,MAAM,QAAQ,KAAK,MAAM;AACjD,QAAM,SAAS,CAAC,QAAQ,CAAC,MAAM,SAAS,KAAK,MAAM;AACnD,QAAM,EAAE,iBAAiB,0BAA0B,QAAQ,WAAW;AAAA,IACpE;AAAA,IACA;AAAA;AAEF,SACE,qCAAC,QAAD;AAAA,IACE,KAAK;AAAA,IACL,WAAW;AAAA,KACP,OACA,iBAJN;AAAA,IAKE,OAAO;AAAA,MACL;AAAA,MACA;AAAA,OACG;AAAA,MAGL,qCAAC,OAAD;AAAA,IACE,OAAO,SAAS,OAAO;AAAA,IACvB,QAAQ,UAAU,OAAO;AAAA,IACzB,OAAO;AAAA,MACL;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA,SAAQ;AAAA,KAER,qCAAC,KAAD;AAAA,IAAG,QAAO;AAAA,IAAO,aAAY;AAAA,IAAI,UAAS;AAAA,KACxC,qCAAC,KAAD;AAAA,IAAG;AAAA,IAAY,UAAS;AAAA,KACtB,qCAAC,QAAD;AAAA,IAAM,GAAE;AAAA;AAAA;AAQpB,IAAO,yBAAQ;",
-  "names": []
-}