@elliemae/ds-icons 3.16.0-next.1 → 3.16.0-next.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/utils/SvgIcon.js +4 -4
- package/dist/cjs/utils/SvgIcon.js.map +2 -2
- package/dist/cjs/utils/react-desc-prop-types.js +22 -22
- package/dist/cjs/utils/react-desc-prop-types.js.map +2 -2
- package/dist/esm/utils/SvgIcon.js +1 -1
- package/dist/esm/utils/SvgIcon.js.map +1 -1
- package/dist/esm/utils/react-desc-prop-types.js +1 -1
- package/dist/esm/utils/react-desc-prop-types.js.map +1 -1
- package/dist/types/utils/SvgIcon.d.ts +1 -1
- package/package.json +6 -5
|
@@ -32,14 +32,14 @@ module.exports = __toCommonJS(SvgIcon_exports);
|
|
|
32
32
|
var React = __toESM(require("react"));
|
|
33
33
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
34
34
|
var import_react = require("react");
|
|
35
|
-
var
|
|
35
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
36
36
|
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
37
37
|
var import_react_desc_prop_types = require("./react-desc-prop-types");
|
|
38
38
|
var import_styled = require("./styled");
|
|
39
39
|
const renderPaths = (paths) => paths.map((p, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: p }, i));
|
|
40
40
|
const SvgIcon = (props) => {
|
|
41
41
|
const { color, size, innerRef, containerProps, paths, fill, viewBox, children, component } = props;
|
|
42
|
-
const { className, width, height, style, title, ...restGlobals } = (0,
|
|
42
|
+
const { className, width, height, style, title, ...restGlobals } = (0, import_ds_props_helpers.useGetGlobalAttributes)(props);
|
|
43
43
|
const defaultWidth = (0, import_react.useMemo)(() => {
|
|
44
44
|
if (String(width).includes("rem"))
|
|
45
45
|
return width;
|
|
@@ -62,7 +62,7 @@ const SvgIcon = (props) => {
|
|
|
62
62
|
return parseInt(width.toString(), 10);
|
|
63
63
|
return 16;
|
|
64
64
|
}, [width, height]);
|
|
65
|
-
const xstyledProps = (0,
|
|
65
|
+
const xstyledProps = (0, import_ds_props_helpers.useGetXstyledProps)(props);
|
|
66
66
|
const { cssClassName } = (0, import_ds_classnames.convertPropToCssClassName)("icon", className, {
|
|
67
67
|
size,
|
|
68
68
|
color
|
|
@@ -113,7 +113,7 @@ const SvgIcon = (props) => {
|
|
|
113
113
|
};
|
|
114
114
|
SvgIcon.propTypes = import_react_desc_prop_types.propTypes;
|
|
115
115
|
SvgIcon.displayName = "SvgIcon";
|
|
116
|
-
const IconWithSchema = (0,
|
|
116
|
+
const IconWithSchema = (0, import_ds_props_helpers.describe)(SvgIcon);
|
|
117
117
|
IconWithSchema.propTypes = import_react_desc_prop_types.propTypes;
|
|
118
118
|
var SvgIcon_default = SvgIcon;
|
|
119
119
|
//# sourceMappingURL=SvgIcon.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/utils/SvgIcon.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/no-array-index-key */\nimport React, { useMemo } from 'react';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADQsC;AAP7D,mBAA+B;AAC/B,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/no-array-index-key */\nimport React, { useMemo } from 'react';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport type { SvgIconT } from './react-desc-prop-types';\nimport { propTypes } from './react-desc-prop-types';\nimport { StyledSvg, StyledWrapper } from './styled';\n\nconst renderPaths = (paths: string[]) => paths.map((p, i) => <path key={i} d={p} />);\n\nconst SvgIcon: React.ComponentType<SvgIconT.Props> = (props) => {\n const { color, size, innerRef, containerProps, paths, fill, viewBox, children, component } = props;\n\n const { className, width, height, style, title, ...restGlobals } = useGetGlobalAttributes(props);\n\n const defaultWidth = useMemo(() => {\n if (String(width).includes('rem')) return width;\n if (String(height).includes('rem')) return height;\n if (width) return parseInt(width.toString(), 10);\n if (height) return parseInt(height.toString(), 10);\n\n return 16;\n }, [width, height]);\n\n const defaultHeight = useMemo(() => {\n if (String(height).includes('rem')) return height;\n if (String(width).includes('rem')) return width;\n if (height) return parseInt(height.toString(), 10);\n if (width) return parseInt(width.toString(), 10);\n return 16;\n }, [width, height]);\n\n const xstyledProps = useGetXstyledProps(props);\n\n const { cssClassName } = convertPropToCssClassName('icon', className, {\n size,\n color,\n });\n\n const finalColor = useMemo(() => {\n if (fill) return fill;\n if (!color) return undefined;\n if (!Array.isArray(color)) return color;\n if (color[0] === 'brand-primary') return `brand-${color[1]}`;\n if (color[0] === 'neutral' && color[1].toString() === '0') return `neutral-000`;\n if (color[0] === 'neutral' && color[1].toString() === '900') return `neutral-800`;\n return `${color[0]}-${color[1]}`;\n }, [color, fill]);\n\n return (\n <StyledWrapper\n as={component}\n ref={innerRef}\n className={cssClassName}\n aria-hidden={title !== undefined ? false : true}\n title={title}\n {...restGlobals}\n {...containerProps}\n {...xstyledProps}\n style={style}\n height={!size ? defaultHeight : undefined}\n width={!size ? defaultWidth : undefined}\n size={size}\n svgColor={finalColor}\n >\n <StyledSvg\n size={size}\n viewBox={viewBox}\n width={!size ? defaultWidth : undefined}\n height={!size ? defaultHeight : undefined}\n >\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;\n\nexport { IconWithSchema, SvgIcon };\nexport default SvgIcon;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADQsC;AAP7D,mBAA+B;AAC/B,8BAAqE;AACrE,2BAA0C;AAE1C,mCAA0B;AAC1B,oBAAyC;AAEzC,MAAM,cAAc,CAAC,UAAoB,MAAM,IAAI,CAAC,GAAG,MAAM,4CAAC,UAAa,GAAG,KAAN,CAAS,CAAE;AAEnF,MAAM,UAA+C,CAAC,UAAU;AAC9D,QAAM,EAAE,OAAO,MAAM,UAAU,gBAAgB,OAAO,MAAM,SAAS,UAAU,UAAU,IAAI;AAE7F,QAAM,EAAE,WAAW,OAAO,QAAQ,OAAO,UAAU,YAAY,QAAI,gDAAuB,KAAK;AAE/F,QAAM,mBAAe,sBAAQ,MAAM;AACjC,QAAI,OAAO,KAAK,EAAE,SAAS,KAAK;AAAG,aAAO;AAC1C,QAAI,OAAO,MAAM,EAAE,SAAS,KAAK;AAAG,aAAO;AAC3C,QAAI;AAAO,aAAO,SAAS,MAAM,SAAS,GAAG,EAAE;AAC/C,QAAI;AAAQ,aAAO,SAAS,OAAO,SAAS,GAAG,EAAE;AAEjD,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,MAAM,CAAC;AAElB,QAAM,oBAAgB,sBAAQ,MAAM;AAClC,QAAI,OAAO,MAAM,EAAE,SAAS,KAAK;AAAG,aAAO;AAC3C,QAAI,OAAO,KAAK,EAAE,SAAS,KAAK;AAAG,aAAO;AAC1C,QAAI;AAAQ,aAAO,SAAS,OAAO,SAAS,GAAG,EAAE;AACjD,QAAI;AAAO,aAAO,SAAS,MAAM,SAAS,GAAG,EAAE;AAC/C,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,MAAM,CAAC;AAElB,QAAM,mBAAe,4CAAmB,KAAK;AAE7C,QAAM,EAAE,aAAa,QAAI,gDAA0B,QAAQ,WAAW;AAAA,IACpE;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,iBAAa,sBAAQ,MAAM;AAC/B,QAAI;AAAM,aAAO;AACjB,QAAI,CAAC;AAAO,aAAO;AACnB,QAAI,CAAC,MAAM,QAAQ,KAAK;AAAG,aAAO;AAClC,QAAI,MAAM,OAAO;AAAiB,aAAO,SAAS,MAAM;AACxD,QAAI,MAAM,OAAO,aAAa,MAAM,GAAG,SAAS,MAAM;AAAK,aAAO;AAClE,QAAI,MAAM,OAAO,aAAa,MAAM,GAAG,SAAS,MAAM;AAAO,aAAO;AACpE,WAAO,GAAG,MAAM,MAAM,MAAM;AAAA,EAC9B,GAAG,CAAC,OAAO,IAAI,CAAC;AAEhB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,WAAW;AAAA,MACX,eAAa,UAAU,SAAY,QAAQ;AAAA,MAC3C;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA,QAAQ,CAAC,OAAO,gBAAgB;AAAA,MAChC,OAAO,CAAC,OAAO,eAAe;AAAA,MAC9B;AAAA,MACA,UAAU;AAAA,MAEV;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,OAAO,CAAC,OAAO,eAAe;AAAA,UAC9B,QAAQ,CAAC,OAAO,gBAAgB;AAAA,UAE/B,kBAAQ,YAAY,KAAK,IAAI;AAAA;AAAA,MAChC;AAAA;AAAA,EACF;AAEJ;AAEA,QAAQ,YAAY;AACpB,QAAQ,cAAc;AACtB,MAAM,qBAAiB,kCAAS,OAAO;AACvC,eAAe,YAAY;AAG3B,IAAO,kBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -29,33 +29,33 @@ __export(react_desc_prop_types_exports, {
|
|
|
29
29
|
});
|
|
30
30
|
module.exports = __toCommonJS(react_desc_prop_types_exports);
|
|
31
31
|
var React = __toESM(require("react"));
|
|
32
|
-
var
|
|
32
|
+
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
33
33
|
const defaultProps = {
|
|
34
34
|
component: "span",
|
|
35
35
|
containerProps: {}
|
|
36
36
|
};
|
|
37
37
|
const propTypes = {
|
|
38
|
-
containerProps:
|
|
39
|
-
size:
|
|
40
|
-
color:
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
38
|
+
containerProps: import_ds_props_helpers.PropTypes.object.description("set of properties attached to the main container"),
|
|
39
|
+
size: import_ds_props_helpers.PropTypes.oneOf(["xxs", "xs", "s", "m", "l", "xl", "xxl"]).description("size of the icon"),
|
|
40
|
+
color: import_ds_props_helpers.PropTypes.oneOfType([
|
|
41
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["neutral"]), import_ds_props_helpers.PropTypes.oneOf(["900"])]),
|
|
42
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["neutral"]), import_ds_props_helpers.PropTypes.oneOf(["500"])]),
|
|
43
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["neutral"]), import_ds_props_helpers.PropTypes.oneOf(["400"])]),
|
|
44
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["neutral"]), import_ds_props_helpers.PropTypes.oneOf(["0"])]),
|
|
45
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["danger"]), import_ds_props_helpers.PropTypes.oneOf(["900"])]),
|
|
46
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["warning"]), import_ds_props_helpers.PropTypes.oneOf(["600"])]),
|
|
47
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["warning"]), import_ds_props_helpers.PropTypes.oneOf(["900"])]),
|
|
48
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["success"]), import_ds_props_helpers.PropTypes.oneOf(["900"])]),
|
|
49
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["brand-primary"]), import_ds_props_helpers.PropTypes.oneOf(["600"])]),
|
|
50
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["brand-primary"]), import_ds_props_helpers.PropTypes.oneOf(["800"])]),
|
|
51
|
+
import_ds_props_helpers.PropTypes.tuple([import_ds_props_helpers.PropTypes.oneOf(["brand-primary"]), import_ds_props_helpers.PropTypes.oneOf(["700"])])
|
|
52
52
|
]).description("icon color"),
|
|
53
|
-
className:
|
|
54
|
-
component:
|
|
55
|
-
viewBox:
|
|
56
|
-
paths:
|
|
57
|
-
fill:
|
|
58
|
-
innerRef:
|
|
59
|
-
title:
|
|
53
|
+
className: import_ds_props_helpers.PropTypes.string.description("html class attribute"),
|
|
54
|
+
component: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.string, import_ds_props_helpers.PropTypes.node]).description("containers element"),
|
|
55
|
+
viewBox: import_ds_props_helpers.PropTypes.string.description("view box"),
|
|
56
|
+
paths: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.string, import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.string)]).description(""),
|
|
57
|
+
fill: import_ds_props_helpers.PropTypes.string.description("fill attribute"),
|
|
58
|
+
innerRef: import_ds_props_helpers.PropTypes.object.description("inner ref"),
|
|
59
|
+
title: import_ds_props_helpers.PropTypes.string.description("Adds a title html element to the svg.")
|
|
60
60
|
};
|
|
61
61
|
//# sourceMappingURL=react-desc-prop-types.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/utils/react-desc-prop-types.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { PropTypes } from '@elliemae/ds-
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,
|
|
4
|
+
"sourcesContent": ["import { PropTypes } from '@elliemae/ds-props-helpers';\nimport type { WeakValidationMap } from 'react';\nexport declare namespace SvgIconT {\n export type SizeType = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n\n export type ColorType =\n | ['neutral', '900' | '500' | '400' | '0']\n | ['danger', '900']\n | ['warning', '600' | '900']\n | ['success', '900']\n | ['brand-primary', '600' | '700' | '800'];\n\n export interface Props {\n component?: React.ComponentType | 'span';\n children?: React.ReactNode;\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 | string;\n height?: number | string;\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(['400'])]),\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(['800'])]),\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.string.description('Adds a title html element to the svg.'),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA0B;AA2BnB,MAAM,eAAwC;AAAA,EACnD,WAAW;AAAA,EACX,gBAAgB,CAAC;AACnB;AAEO,MAAM,YAAY;AAAA,EACvB,gBAAgB,kCAAU,OAAO,YAAY,kDAAkD;AAAA,EAC/F,MAAM,kCAAU,MAAM,CAAC,OAAO,MAAM,KAAK,KAAK,KAAK,MAAM,KAAK,CAAC,EAAE,YAAY,kBAAkB;AAAA,EAC/F,OAAO,kCAAU,UAAU;AAAA,IACzB,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,SAAS,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,SAAS,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,SAAS,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,SAAS,CAAC,GAAG,kCAAU,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC;AAAA,IACtE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,QAAQ,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACvE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,SAAS,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,SAAS,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,SAAS,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IACxE,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,eAAe,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IAC9E,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,eAAe,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,IAC9E,kCAAU,MAAM,CAAC,kCAAU,MAAM,CAAC,eAAe,CAAC,GAAG,kCAAU,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,EAChF,CAAC,EAAE,YAAY,YAAY;AAAA,EAC3B,WAAW,kCAAU,OAAO,YAAY,sBAAsB;AAAA,EAC9D,WAAW,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,IAAI,CAAC,EAAE,YAAY,oBAAoB;AAAA,EACnG,SAAS,kCAAU,OAAO,YAAY,UAAU;AAAA,EAChD,OAAO,kCAAU,UAAU,CAAC,kCAAU,QAAQ,kCAAU,QAAQ,kCAAU,MAAM,CAAC,CAAC,EAAE,YAAY,EAAE;AAAA,EAClG,MAAM,kCAAU,OAAO,YAAY,gBAAgB;AAAA,EACnD,UAAU,kCAAU,OAAO,YAAY,WAAW;AAAA,EAClD,OAAO,kCAAU,OAAO,YAAY,uCAAuC;AAC7E;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
3
|
import { useMemo } from "react";
|
|
4
|
-
import { describe, useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-
|
|
4
|
+
import { describe, useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-props-helpers";
|
|
5
5
|
import { convertPropToCssClassName } from "@elliemae/ds-classnames";
|
|
6
6
|
import { propTypes } from "./react-desc-prop-types";
|
|
7
7
|
import { StyledSvg, StyledWrapper } from "./styled";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/SvgIcon.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-array-index-key */\nimport React, { useMemo } from 'react';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/no-array-index-key */\nimport React, { useMemo } from 'react';\nimport { describe, useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { convertPropToCssClassName } from '@elliemae/ds-classnames';\nimport type { SvgIconT } from './react-desc-prop-types';\nimport { propTypes } from './react-desc-prop-types';\nimport { StyledSvg, StyledWrapper } from './styled';\n\nconst renderPaths = (paths: string[]) => paths.map((p, i) => <path key={i} d={p} />);\n\nconst SvgIcon: React.ComponentType<SvgIconT.Props> = (props) => {\n const { color, size, innerRef, containerProps, paths, fill, viewBox, children, component } = props;\n\n const { className, width, height, style, title, ...restGlobals } = useGetGlobalAttributes(props);\n\n const defaultWidth = useMemo(() => {\n if (String(width).includes('rem')) return width;\n if (String(height).includes('rem')) return height;\n if (width) return parseInt(width.toString(), 10);\n if (height) return parseInt(height.toString(), 10);\n\n return 16;\n }, [width, height]);\n\n const defaultHeight = useMemo(() => {\n if (String(height).includes('rem')) return height;\n if (String(width).includes('rem')) return width;\n if (height) return parseInt(height.toString(), 10);\n if (width) return parseInt(width.toString(), 10);\n return 16;\n }, [width, height]);\n\n const xstyledProps = useGetXstyledProps(props);\n\n const { cssClassName } = convertPropToCssClassName('icon', className, {\n size,\n color,\n });\n\n const finalColor = useMemo(() => {\n if (fill) return fill;\n if (!color) return undefined;\n if (!Array.isArray(color)) return color;\n if (color[0] === 'brand-primary') return `brand-${color[1]}`;\n if (color[0] === 'neutral' && color[1].toString() === '0') return `neutral-000`;\n if (color[0] === 'neutral' && color[1].toString() === '900') return `neutral-800`;\n return `${color[0]}-${color[1]}`;\n }, [color, fill]);\n\n return (\n <StyledWrapper\n as={component}\n ref={innerRef}\n className={cssClassName}\n aria-hidden={title !== undefined ? false : true}\n title={title}\n {...restGlobals}\n {...containerProps}\n {...xstyledProps}\n style={style}\n height={!size ? defaultHeight : undefined}\n width={!size ? defaultWidth : undefined}\n size={size}\n svgColor={finalColor}\n >\n <StyledSvg\n size={size}\n viewBox={viewBox}\n width={!size ? defaultWidth : undefined}\n height={!size ? defaultHeight : undefined}\n >\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;\n\nexport { IconWithSchema, SvgIcon };\nexport default SvgIcon;\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACQsC;AAP7D,SAAgB,eAAe;AAC/B,SAAS,UAAU,wBAAwB,0BAA0B;AACrE,SAAS,iCAAiC;AAE1C,SAAS,iBAAiB;AAC1B,SAAS,WAAW,qBAAqB;AAEzC,MAAM,cAAc,CAAC,UAAoB,MAAM,IAAI,CAAC,GAAG,MAAM,oBAAC,UAAa,GAAG,KAAN,CAAS,CAAE;AAEnF,MAAM,UAA+C,CAAC,UAAU;AAC9D,QAAM,EAAE,OAAO,MAAM,UAAU,gBAAgB,OAAO,MAAM,SAAS,UAAU,UAAU,IAAI;AAE7F,QAAM,EAAE,WAAW,OAAO,QAAQ,OAAO,UAAU,YAAY,IAAI,uBAAuB,KAAK;AAE/F,QAAM,eAAe,QAAQ,MAAM;AACjC,QAAI,OAAO,KAAK,EAAE,SAAS,KAAK;AAAG,aAAO;AAC1C,QAAI,OAAO,MAAM,EAAE,SAAS,KAAK;AAAG,aAAO;AAC3C,QAAI;AAAO,aAAO,SAAS,MAAM,SAAS,GAAG,EAAE;AAC/C,QAAI;AAAQ,aAAO,SAAS,OAAO,SAAS,GAAG,EAAE;AAEjD,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,MAAM,CAAC;AAElB,QAAM,gBAAgB,QAAQ,MAAM;AAClC,QAAI,OAAO,MAAM,EAAE,SAAS,KAAK;AAAG,aAAO;AAC3C,QAAI,OAAO,KAAK,EAAE,SAAS,KAAK;AAAG,aAAO;AAC1C,QAAI;AAAQ,aAAO,SAAS,OAAO,SAAS,GAAG,EAAE;AACjD,QAAI;AAAO,aAAO,SAAS,MAAM,SAAS,GAAG,EAAE;AAC/C,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,MAAM,CAAC;AAElB,QAAM,eAAe,mBAAmB,KAAK;AAE7C,QAAM,EAAE,aAAa,IAAI,0BAA0B,QAAQ,WAAW;AAAA,IACpE;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,aAAa,QAAQ,MAAM;AAC/B,QAAI;AAAM,aAAO;AACjB,QAAI,CAAC;AAAO,aAAO;AACnB,QAAI,CAAC,MAAM,QAAQ,KAAK;AAAG,aAAO;AAClC,QAAI,MAAM,OAAO;AAAiB,aAAO,SAAS,MAAM;AACxD,QAAI,MAAM,OAAO,aAAa,MAAM,GAAG,SAAS,MAAM;AAAK,aAAO;AAClE,QAAI,MAAM,OAAO,aAAa,MAAM,GAAG,SAAS,MAAM;AAAO,aAAO;AACpE,WAAO,GAAG,MAAM,MAAM,MAAM;AAAA,EAC9B,GAAG,CAAC,OAAO,IAAI,CAAC;AAEhB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAI;AAAA,MACJ,KAAK;AAAA,MACL,WAAW;AAAA,MACX,eAAa,UAAU,SAAY,QAAQ;AAAA,MAC3C;AAAA,MACC,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA,QAAQ,CAAC,OAAO,gBAAgB;AAAA,MAChC,OAAO,CAAC,OAAO,eAAe;AAAA,MAC9B;AAAA,MACA,UAAU;AAAA,MAEV;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,OAAO,CAAC,OAAO,eAAe;AAAA,UAC9B,QAAQ,CAAC,OAAO,gBAAgB;AAAA,UAE/B,kBAAQ,YAAY,KAAK,IAAI;AAAA;AAAA,MAChC;AAAA;AAAA,EACF;AAEJ;AAEA,QAAQ,YAAY;AACpB,QAAQ,cAAc;AACtB,MAAM,iBAAiB,SAAS,OAAO;AACvC,eAAe,YAAY;AAG3B,IAAO,kBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/utils/react-desc-prop-types.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from '@elliemae/ds-props-helpers';\nimport type { WeakValidationMap } from 'react';\nexport declare namespace SvgIconT {\n export type SizeType = 'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl';\n\n export type ColorType =\n | ['neutral', '900' | '500' | '400' | '0']\n | ['danger', '900']\n | ['warning', '600' | '900']\n | ['success', '900']\n | ['brand-primary', '600' | '700' | '800'];\n\n export interface Props {\n component?: React.ComponentType | 'span';\n children?: React.ReactNode;\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 | string;\n height?: number | string;\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(['400'])]),\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(['800'])]),\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.string.description('Adds a title html element to the svg.'),\n} as WeakValidationMap<unknown>;\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,iBAAiB;AA2BnB,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,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,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;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import type { SvgIconT } from './react-desc-prop-types';
|
|
3
3
|
declare const SvgIcon: React.ComponentType<SvgIconT.Props>;
|
|
4
|
-
declare const IconWithSchema: import("@elliemae/ds-
|
|
4
|
+
declare const IconWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").DocumentedReactComponent<SvgIconT.Props>;
|
|
5
5
|
export { IconWithSchema, SvgIcon };
|
|
6
6
|
export default SvgIcon;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-icons",
|
|
3
|
-
"version": "3.16.0-next.
|
|
3
|
+
"version": "3.16.0-next.3",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Icons",
|
|
6
6
|
"files": [
|
|
@@ -1571,9 +1571,10 @@
|
|
|
1571
1571
|
"indent": 4
|
|
1572
1572
|
},
|
|
1573
1573
|
"dependencies": {
|
|
1574
|
-
"@elliemae/ds-classnames": "3.16.0-next.
|
|
1575
|
-
"@elliemae/ds-
|
|
1576
|
-
"@elliemae/ds-system": "3.16.0-next.
|
|
1574
|
+
"@elliemae/ds-classnames": "3.16.0-next.3",
|
|
1575
|
+
"@elliemae/ds-props-helpers": "3.16.0-next.3",
|
|
1576
|
+
"@elliemae/ds-system": "3.16.0-next.3",
|
|
1577
|
+
"@elliemae/ds-utilities": "3.16.0-next.3"
|
|
1577
1578
|
},
|
|
1578
1579
|
"devDependencies": {
|
|
1579
1580
|
"styled-components": "~5.3.6"
|
|
@@ -1592,7 +1593,7 @@
|
|
|
1592
1593
|
"dts": "node ../../scripts/dts.mjs",
|
|
1593
1594
|
"dts:withdeps": "pnpm --filter {.}... dts",
|
|
1594
1595
|
"build": "cross-env NODE_ENV=production node ../../scripts/build/build.mjs",
|
|
1595
|
-
"dev:build": "pnpm --filter {.}... build
|
|
1596
|
+
"dev:build": "pnpm --filter {.}... build",
|
|
1596
1597
|
"dev:install": "pnpm --filter {.}... i --no-lockfile && pnpm run dev:build",
|
|
1597
1598
|
"checkDeps": "npx -yes ../ds-codemods check-missing-packages --projectFolderPath=\"./\" --ignorePackagesGlobPattern=\"\" --ignoreFilesGlobPattern=\"**/test-ables/*,**/tests/*\""
|
|
1598
1599
|
}
|