@elliemae/ds-ribbon 3.80.0-next.10 → 3.80.0-next.13

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.
Files changed (10) hide show
  1. package/dist/cjs/parts/DSRibbonCard/PureLabelPlace.js +16 -12
  2. package/dist/cjs/parts/DSRibbonCard/PureLabelPlace.js.map +2 -2
  3. package/dist/cjs/parts/DSRibbonCard/config/useRibbonCard.js +5 -1
  4. package/dist/cjs/parts/DSRibbonCard/config/useRibbonCard.js.map +2 -2
  5. package/dist/esm/parts/DSRibbonCard/PureLabelPlace.js +17 -13
  6. package/dist/esm/parts/DSRibbonCard/PureLabelPlace.js.map +2 -2
  7. package/dist/esm/parts/DSRibbonCard/config/useRibbonCard.js +5 -1
  8. package/dist/esm/parts/DSRibbonCard/config/useRibbonCard.js.map +2 -2
  9. package/dist/types/parts/DSRibbonCard/config/useRibbonCard.d.ts +2 -4
  10. package/package.json +6 -6
package/dist/cjs/parts/DSRibbonCard/PureLabelPlace.js CHANGED
@@ -45,17 +45,21 @@ const PureLabelPlace = ({
45
45
  getOwnerProps
46
46
  }) => {
47
47
  const getOwnerPropsArguments = import_react.default.useCallback(() => ({}), []);
48
- return icon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
49
- import_styled.StyledBlockIcon,
50
- {
51
- error,
52
- info,
53
- success,
54
- warning,
55
- getOwnerProps,
56
- getOwnerPropsArguments,
57
- children: icon
58
- }
59
- ) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledBlockLabel, { getOwnerProps, getOwnerPropsArguments, children: label });
48
+ const showLabel = !icon || Boolean(label);
49
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
50
+ icon ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
51
+ import_styled.StyledBlockIcon,
52
+ {
53
+ error,
54
+ info,
55
+ success,
56
+ warning,
57
+ getOwnerProps,
58
+ getOwnerPropsArguments,
59
+ children: icon
60
+ }
61
+ ) : null,
62
+ showLabel ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledBlockLabel, { getOwnerProps, getOwnerPropsArguments, children: label }) : null
63
+ ] });
60
64
  };
61
65
  //# sourceMappingURL=PureLabelPlace.js.map
package/dist/cjs/parts/DSRibbonCard/PureLabelPlace.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/parts/DSRibbonCard/PureLabelPlace.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import React from 'react';\nimport type { DSRibbonCardT } from './react-desc-prop-types.js';\nimport { StyledBlockIcon, StyledBlockLabel } from './styled.js';\n\nexport const PureLabelPlace: React.ComponentType<PureLabelPlaceProps> = ({\n icon,\n error,\n info,\n success,\n warning,\n label,\n getOwnerProps,\n}) => {\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n return icon ? (\n <StyledBlockIcon\n error={error}\n info={info}\n success={success}\n warning={warning}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {icon}\n </StyledBlockIcon>\n ) : (\n <StyledBlockLabel getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n {label}\n </StyledBlockLabel>\n );\n};\ntype PureLabelPlaceProps = {\n icon?: DSRibbonCardT.Props['icon'];\n label?: DSRibbonCardT.Props['label'];\n error?: DSRibbonCardT.Props['error'];\n info?: DSRibbonCardT.Props['info'];\n success?: DSRibbonCardT.Props['success'];\n warning?: DSRibbonCardT.Props['warning'];\n getOwnerProps: () => DSRibbonCardT.InternalProps;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADenB;AAfJ,mBAAkB;AAElB,oBAAkD;AAE3C,MAAM,iBAA2D,CAAC;AAAA,EACvE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAC/D,SAAO,OACL;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC;AAAA;AAAA,EACH,IAEA,4CAAC,kCAAiB,eAA8B,wBAC7C,iBACH;AAEJ;",
4
+ "sourcesContent": ["import React from 'react';\nimport type { DSRibbonCardT } from './react-desc-prop-types.js';\nimport { StyledBlockIcon, StyledBlockLabel } from './styled.js';\n\nexport const PureLabelPlace: React.ComponentType<PureLabelPlaceProps> = ({\n icon,\n error,\n info,\n success,\n warning,\n label,\n getOwnerProps,\n}) => {\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n // Without an icon the label block renders as it always has, empty label included \u2014 removing it\n // would take away an element consumers can already select.\n const showLabel = !icon || Boolean(label);\n return (\n <>\n {icon ? (\n <StyledBlockIcon\n error={error}\n info={info}\n success={success}\n warning={warning}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {icon}\n </StyledBlockIcon>\n ) : null}\n {showLabel ? (\n <StyledBlockLabel getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n {label}\n </StyledBlockLabel>\n ) : null}\n </>\n );\n};\ntype PureLabelPlaceProps = {\n icon?: DSRibbonCardT.Props['icon'];\n label?: DSRibbonCardT.Props['label'];\n error?: DSRibbonCardT.Props['error'];\n info?: DSRibbonCardT.Props['info'];\n success?: DSRibbonCardT.Props['success'];\n warning?: DSRibbonCardT.Props['warning'];\n getOwnerProps: () => DSRibbonCardT.InternalProps;\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkBnB;AAlBJ,mBAAkB;AAElB,oBAAkD;AAE3C,MAAM,iBAA2D,CAAC;AAAA,EACvE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,yBAAyB,aAAAA,QAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAG/D,QAAM,YAAY,CAAC,QAAQ,QAAQ,KAAK;AACxC,SACE,4EACG;AAAA,WACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH,IACE;AAAA,IACH,YACC,4CAAC,kCAAiB,eAA8B,wBAC7C,iBACH,IACE;AAAA,KACN;AAEJ;",
6
6
  "names": ["React"]
7
7
  }
package/dist/cjs/parts/DSRibbonCard/config/useRibbonCard.js CHANGED
@@ -40,7 +40,11 @@ var import_useValidateProps = require("./useValidateProps.js");
40
40
  const useRibbonCard = (propsFromUser) => {
41
41
  const propsWithDefault = (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(propsFromUser, import_react_desc_prop_types.defaultProps);
42
42
  (0, import_useValidateProps.useValidateProps)(propsWithDefault, import_react_desc_prop_types.DSRibbonCardPropTypesSchema);
43
- const globalProps = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefault);
43
+ const globalAttributes = (0, import_ds_props_helpers.useGetGlobalAttributes)(propsWithDefault);
44
+ const globalProps = import_react.default.useMemo(() => {
45
+ const { label, value, ...rest } = globalAttributes;
46
+ return rest;
47
+ }, [globalAttributes]);
44
48
  const xstyledProps = (0, import_ds_props_helpers.useGetXstyledProps)(propsWithDefault);
45
49
  const instanceUid = import_react.default.useMemo(() => `ds-ribbon-card-${(0, import_uid.uid)(5)}`, []);
46
50
  return import_react.default.useMemo(
package/dist/cjs/parts/DSRibbonCard/config/useRibbonCard.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../src/parts/DSRibbonCard/config/useRibbonCard.ts", "../../../../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport React from 'react';\nimport { uid } from 'uid';\nimport { type DSRibbonCardT, DSRibbonCardPropTypesSchema, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport const useRibbonCard = (propsFromUser: DSRibbonCardT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSRibbonCardT.InternalProps>(propsFromUser, defaultProps);\n useValidateProps(propsWithDefault, DSRibbonCardPropTypesSchema);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const globalProps = useGetGlobalAttributes<DSRibbonCardT.InternalProps, HTMLDivElement>(propsWithDefault);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const instanceUid = React.useMemo(() => `ds-ribbon-card-${uid(5)}`, []);\n\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n // const eventHandlers = useEventHandlers({ propsWithDefault, instanceUid }); // <-- complex logic should be made atomics this way\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // ...eventHandlers,\n }),\n [\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // eventHandlers,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAyF;AACzF,mBAAkB;AAClB,iBAAoB;AACpB,mCAA8E;AAC9E,8BAAiC;AAE1B,MAAM,gBAAgB,CAAC,kBAAuC;AAInE,QAAM,uBAAmB,sDAA0D,eAAe,yCAAY;AAC9G,gDAAiB,kBAAkB,wDAA2B;AAI9D,QAAM,kBAAc,gDAAoE,gBAAgB;AACxG,QAAM,mBAAe,4CAAmB,gBAAgB;AAMxD,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM,sBAAkB,gBAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAOtE,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport React from 'react';\nimport { uid } from 'uid';\nimport { type DSRibbonCardT, DSRibbonCardPropTypesSchema, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport const useRibbonCard = (propsFromUser: DSRibbonCardT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSRibbonCardT.InternalProps>(propsFromUser, defaultProps);\n useValidateProps(propsWithDefault, DSRibbonCardPropTypesSchema);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const globalAttributes = useGetGlobalAttributes<DSRibbonCardT.InternalProps, HTMLDivElement>(propsWithDefault);\n // `label` and `value` are this card's own API props, rendered as text. Both are also keys in the\n // `globalAttributes` registry the helper matches against, so it forwards them to the div, where\n // neither is valid.\n const globalProps = React.useMemo(() => {\n const { label, value, ...rest } = globalAttributes;\n return rest;\n }, [globalAttributes]);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const instanceUid = React.useMemo(() => `ds-ribbon-card-${uid(5)}`, []);\n\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n // const eventHandlers = useEventHandlers({ propsWithDefault, instanceUid }); // <-- complex logic should be made atomics this way\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // ...eventHandlers,\n }),\n [\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // eventHandlers,\n ],\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAAyF;AACzF,mBAAkB;AAClB,iBAAoB;AACpB,mCAA8E;AAC9E,8BAAiC;AAE1B,MAAM,gBAAgB,CAAC,kBAAuC;AAInE,QAAM,uBAAmB,sDAA0D,eAAe,yCAAY;AAC9G,gDAAiB,kBAAkB,wDAA2B;AAI9D,QAAM,uBAAmB,gDAAoE,gBAAgB;AAI7G,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM;AACtC,UAAM,EAAE,OAAO,OAAO,GAAG,KAAK,IAAI;AAClC,WAAO;AAAA,EACT,GAAG,CAAC,gBAAgB,CAAC;AACrB,QAAM,mBAAe,4CAAmB,gBAAgB;AAMxD,QAAM,cAAc,aAAAA,QAAM,QAAQ,MAAM,sBAAkB,gBAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAOtE,SAAO,aAAAA,QAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,EACF;AACF;",
6
6
  "names": ["React"]
7
7
  }
package/dist/esm/parts/DSRibbonCard/PureLabelPlace.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from "react";
2
- import { jsx } from "react/jsx-runtime";
2
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
3
3
  import React2 from "react";
4
4
  import { StyledBlockIcon, StyledBlockLabel } from "./styled.js";
5
5
  const PureLabelPlace = ({
@@ -12,18 +12,22 @@ const PureLabelPlace = ({
12
12
  getOwnerProps
13
13
  }) => {
14
14
  const getOwnerPropsArguments = React2.useCallback(() => ({}), []);
15
- return icon ? /* @__PURE__ */ jsx(
16
- StyledBlockIcon,
17
- {
18
- error,
19
- info,
20
- success,
21
- warning,
22
- getOwnerProps,
23
- getOwnerPropsArguments,
24
- children: icon
25
- }
26
- ) : /* @__PURE__ */ jsx(StyledBlockLabel, { getOwnerProps, getOwnerPropsArguments, children: label });
15
+ const showLabel = !icon || Boolean(label);
16
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
17
+ icon ? /* @__PURE__ */ jsx(
18
+ StyledBlockIcon,
19
+ {
20
+ error,
21
+ info,
22
+ success,
23
+ warning,
24
+ getOwnerProps,
25
+ getOwnerPropsArguments,
26
+ children: icon
27
+ }
28
+ ) : null,
29
+ showLabel ? /* @__PURE__ */ jsx(StyledBlockLabel, { getOwnerProps, getOwnerPropsArguments, children: label }) : null
30
+ ] });
27
31
  };
28
32
  export {
29
33
  PureLabelPlace
package/dist/esm/parts/DSRibbonCard/PureLabelPlace.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/DSRibbonCard/PureLabelPlace.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { DSRibbonCardT } from './react-desc-prop-types.js';\nimport { StyledBlockIcon, StyledBlockLabel } from './styled.js';\n\nexport const PureLabelPlace: React.ComponentType<PureLabelPlaceProps> = ({\n icon,\n error,\n info,\n success,\n warning,\n label,\n getOwnerProps,\n}) => {\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n return icon ? (\n <StyledBlockIcon\n error={error}\n info={info}\n success={success}\n warning={warning}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {icon}\n </StyledBlockIcon>\n ) : (\n <StyledBlockLabel getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n {label}\n </StyledBlockLabel>\n );\n};\ntype PureLabelPlaceProps = {\n icon?: DSRibbonCardT.Props['icon'];\n label?: DSRibbonCardT.Props['label'];\n error?: DSRibbonCardT.Props['error'];\n info?: DSRibbonCardT.Props['info'];\n success?: DSRibbonCardT.Props['success'];\n warning?: DSRibbonCardT.Props['warning'];\n getOwnerProps: () => DSRibbonCardT.InternalProps;\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACenB;AAfJ,OAAOA,YAAW;AAElB,SAAS,iBAAiB,wBAAwB;AAE3C,MAAM,iBAA2D,CAAC;AAAA,EACvE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,yBAAyBA,OAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAC/D,SAAO,OACL;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC;AAAA;AAAA,EACH,IAEA,oBAAC,oBAAiB,eAA8B,wBAC7C,iBACH;AAEJ;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport type { DSRibbonCardT } from './react-desc-prop-types.js';\nimport { StyledBlockIcon, StyledBlockLabel } from './styled.js';\n\nexport const PureLabelPlace: React.ComponentType<PureLabelPlaceProps> = ({\n icon,\n error,\n info,\n success,\n warning,\n label,\n getOwnerProps,\n}) => {\n const getOwnerPropsArguments = React.useCallback(() => ({}), []);\n // Without an icon the label block renders as it always has, empty label included \u2014 removing it\n // would take away an element consumers can already select.\n const showLabel = !icon || Boolean(label);\n return (\n <>\n {icon ? (\n <StyledBlockIcon\n error={error}\n info={info}\n success={success}\n warning={warning}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {icon}\n </StyledBlockIcon>\n ) : null}\n {showLabel ? (\n <StyledBlockLabel getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n {label}\n </StyledBlockLabel>\n ) : null}\n </>\n );\n};\ntype PureLabelPlaceProps = {\n icon?: DSRibbonCardT.Props['icon'];\n label?: DSRibbonCardT.Props['label'];\n error?: DSRibbonCardT.Props['error'];\n info?: DSRibbonCardT.Props['info'];\n success?: DSRibbonCardT.Props['success'];\n warning?: DSRibbonCardT.Props['warning'];\n getOwnerProps: () => DSRibbonCardT.InternalProps;\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACkBnB,mBAEI,KAFJ;AAlBJ,OAAOA,YAAW;AAElB,SAAS,iBAAiB,wBAAwB;AAE3C,MAAM,iBAA2D,CAAC;AAAA,EACvE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,yBAAyBA,OAAM,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAG/D,QAAM,YAAY,CAAC,QAAQ,QAAQ,KAAK;AACxC,SACE,iCACG;AAAA,WACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH,IACE;AAAA,IACH,YACC,oBAAC,oBAAiB,eAA8B,wBAC7C,iBACH,IACE;AAAA,KACN;AAEJ;",
6
6
  "names": ["React"]
7
7
  }
package/dist/esm/parts/DSRibbonCard/config/useRibbonCard.js CHANGED
@@ -7,7 +7,11 @@ import { useValidateProps } from "./useValidateProps.js";
7
7
  const useRibbonCard = (propsFromUser) => {
8
8
  const propsWithDefault = useMemoMergePropsWithDefault(propsFromUser, defaultProps);
9
9
  useValidateProps(propsWithDefault, DSRibbonCardPropTypesSchema);
10
- const globalProps = useGetGlobalAttributes(propsWithDefault);
10
+ const globalAttributes = useGetGlobalAttributes(propsWithDefault);
11
+ const globalProps = React2.useMemo(() => {
12
+ const { label, value, ...rest } = globalAttributes;
13
+ return rest;
14
+ }, [globalAttributes]);
11
15
  const xstyledProps = useGetXstyledProps(propsWithDefault);
12
16
  const instanceUid = React2.useMemo(() => `ds-ribbon-card-${uid(5)}`, []);
13
17
  return React2.useMemo(
package/dist/esm/parts/DSRibbonCard/config/useRibbonCard.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/parts/DSRibbonCard/config/useRibbonCard.ts"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport React from 'react';\nimport { uid } from 'uid';\nimport { type DSRibbonCardT, DSRibbonCardPropTypesSchema, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport const useRibbonCard = (propsFromUser: DSRibbonCardT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSRibbonCardT.InternalProps>(propsFromUser, defaultProps);\n useValidateProps(propsWithDefault, DSRibbonCardPropTypesSchema);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const globalProps = useGetGlobalAttributes<DSRibbonCardT.InternalProps, HTMLDivElement>(propsWithDefault);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const instanceUid = React.useMemo(() => `ds-ribbon-card-${uid(5)}`, []);\n\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n // const eventHandlers = useEventHandlers({ propsWithDefault, instanceUid }); // <-- complex logic should be made atomics this way\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // ...eventHandlers,\n }),\n [\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // eventHandlers,\n ],\n );\n};\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,wBAAwB,oBAAoB,oCAAoC;AACzF,OAAOA,YAAW;AAClB,SAAS,WAAW;AACpB,SAA6B,6BAA6B,oBAAoB;AAC9E,SAAS,wBAAwB;AAE1B,MAAM,gBAAgB,CAAC,kBAAuC;AAInE,QAAM,mBAAmB,6BAA0D,eAAe,YAAY;AAC9G,mBAAiB,kBAAkB,2BAA2B;AAI9D,QAAM,cAAc,uBAAoE,gBAAgB;AACxG,QAAM,eAAe,mBAAmB,gBAAgB;AAMxD,QAAM,cAAcA,OAAM,QAAQ,MAAM,kBAAkB,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAOtE,SAAOA,OAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useGetGlobalAttributes, useGetXstyledProps, useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport React from 'react';\nimport { uid } from 'uid';\nimport { type DSRibbonCardT, DSRibbonCardPropTypesSchema, defaultProps } from '../react-desc-prop-types.js';\nimport { useValidateProps } from './useValidateProps.js';\n\nexport const useRibbonCard = (propsFromUser: DSRibbonCardT.Props) => {\n // =============================================================================\n // MERGE WITH DEFAULT AND VALIDATE PROPS\n // =============================================================================\n const propsWithDefault = useMemoMergePropsWithDefault<DSRibbonCardT.InternalProps>(propsFromUser, defaultProps);\n useValidateProps(propsWithDefault, DSRibbonCardPropTypesSchema);\n // =============================================================================\n // GLOBAL ATTRIBUTES & XSTYLED PROPS\n // =============================================================================\n const globalAttributes = useGetGlobalAttributes<DSRibbonCardT.InternalProps, HTMLDivElement>(propsWithDefault);\n // `label` and `value` are this card's own API props, rendered as text. Both are also keys in the\n // `globalAttributes` registry the helper matches against, so it forwards them to the div, where\n // neither is valid.\n const globalProps = React.useMemo(() => {\n const { label, value, ...rest } = globalAttributes;\n return rest;\n }, [globalAttributes]);\n const xstyledProps = useGetXstyledProps(propsWithDefault);\n\n // =============================================================================\n // AD HOC PER COMPONENT LOGIC\n // =============================================================================\n // custom code goes here, this is an example\n const instanceUid = React.useMemo(() => `ds-ribbon-card-${uid(5)}`, []);\n\n // =============================================================================\n // HELPERS HOOKS CONFIGS\n // =============================================================================\n // const eventHandlers = useEventHandlers({ propsWithDefault, instanceUid }); // <-- complex logic should be made atomics this way\n\n return React.useMemo(\n () => ({\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // ...eventHandlers,\n }),\n [\n propsWithDefault,\n xstyledProps,\n globalProps,\n instanceUid,\n // eventHandlers,\n ],\n );\n};\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,wBAAwB,oBAAoB,oCAAoC;AACzF,OAAOA,YAAW;AAClB,SAAS,WAAW;AACpB,SAA6B,6BAA6B,oBAAoB;AAC9E,SAAS,wBAAwB;AAE1B,MAAM,gBAAgB,CAAC,kBAAuC;AAInE,QAAM,mBAAmB,6BAA0D,eAAe,YAAY;AAC9G,mBAAiB,kBAAkB,2BAA2B;AAI9D,QAAM,mBAAmB,uBAAoE,gBAAgB;AAI7G,QAAM,cAAcA,OAAM,QAAQ,MAAM;AACtC,UAAM,EAAE,OAAO,OAAO,GAAG,KAAK,IAAI;AAClC,WAAO;AAAA,EACT,GAAG,CAAC,gBAAgB,CAAC;AACrB,QAAM,eAAe,mBAAmB,gBAAgB;AAMxD,QAAM,cAAcA,OAAM,QAAQ,MAAM,kBAAkB,IAAI,CAAC,CAAC,IAAI,CAAC,CAAC;AAOtE,SAAOA,OAAM;AAAA,IACX,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAEF;AAAA,EACF;AACF;",
6
6
  "names": ["React"]
7
7
  }
package/dist/types/parts/DSRibbonCard/config/useRibbonCard.d.ts CHANGED
@@ -3,9 +3,7 @@ import { type DSRibbonCardT } from '../react-desc-prop-types.js';
3
3
  export declare const useRibbonCard: (propsFromUser: DSRibbonCardT.Props) => {
4
4
  propsWithDefault: DSRibbonCardT.InternalProps;
5
5
  xstyledProps: import("@elliemae/ds-props-helpers").XstyledProps;
6
- globalProps: Partial<Pick<object, "label" | "value" | "form" | "list" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-braillelabel" | "aria-brailleroledescription" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colindextext" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-description" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowindextext" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerLeave" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "autoCapitalize" | "autoFocus" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "enterKeyHint" | "hidden" | "id" | "lang" | "nonce" | "slot" | "spellCheck" | "style" | "tabIndex" | "title" | "translate" | "radioGroup" | "role" | "about" | "content" | "datatype" | "inlist" | "prefix" | "property" | "rel" | "resource" | "rev" | "typeof" | "vocab" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "exportparts" | "part" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "async" | "autoComplete" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "cite" | "classID" | "cols" | "colSpan" | "controls" | "coords" | "crossOrigin" | "data" | "dateTime" | "default" | "defer" | "disabled" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "noValidate" | "open" | "optimum" | "pattern" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "size" | "sizes" | "span" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "summary" | "target" | "type" | "useMap" | "width" | "wmode" | "wrap"> & Omit<{
7
- label?: string | undefined | undefined;
8
- value?: string | number | readonly string[] | undefined;
6
+ globalProps: {
9
7
  form?: string | undefined | undefined;
10
8
  list?: string | undefined | undefined;
11
9
  "aria-activedescendant"?: string | undefined | undefined;
@@ -368,6 +366,6 @@ export declare const useRibbonCard: (propsFromUser: DSRibbonCardT.Props) => {
368
366
  width?: number | string | undefined | undefined;
369
367
  wmode?: string | undefined | undefined;
370
368
  wrap?: string | undefined | undefined;
371
- }, never>>;
369
+ };
372
370
  instanceUid: string;
373
371
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-ribbon",
3
- "version": "3.80.0-next.10",
3
+ "version": "3.80.0-next.13",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Ribbon",
6
6
  "files": [
@@ -36,15 +36,15 @@
36
36
  "indent": 4
37
37
  },
38
38
  "dependencies": {
39
- "@elliemae/ds-props-helpers": "3.80.0-next.10",
40
- "@elliemae/ds-system": "3.80.0-next.10"
39
+ "@elliemae/ds-system": "3.80.0-next.13",
40
+ "@elliemae/ds-props-helpers": "3.80.0-next.13"
41
41
  },
42
42
  "devDependencies": {
43
43
  "jest": "^30.0.0",
44
44
  "styled-components": "~5.3.11",
45
- "@elliemae/ds-test-utils": "3.80.0-next.10",
46
- "@elliemae/ds-monorepo-devops": "3.80.0-next.10",
47
- "@elliemae/ds-typescript-helpers": "3.80.0-next.10"
45
+ "@elliemae/ds-monorepo-devops": "3.80.0-next.13",
46
+ "@elliemae/ds-typescript-helpers": "3.80.0-next.13",
47
+ "@elliemae/ds-test-utils": "3.80.0-next.13"
48
48
  },
49
49
  "peerDependencies": {
50
50
  "lodash-es": "^4.18.1",