@elliemae/ds-pills-v2 3.51.0-next.8 → 3.51.0-rc.0

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 (42) hide show
  1. package/dist/cjs/DSPillDefinitions.js +2 -2
  2. package/dist/cjs/DSPillDefinitions.js.map +1 -1
  3. package/dist/cjs/components/Pill.js +1 -0
  4. package/dist/cjs/components/Pill.js.map +2 -2
  5. package/dist/cjs/components/styled.js +18 -7
  6. package/dist/cjs/components/styled.js.map +2 -2
  7. package/dist/cjs/components/types/LabelOnlyPill.js +62 -0
  8. package/dist/cjs/components/types/LabelOnlyPill.js.map +7 -0
  9. package/dist/cjs/components/types/MenuButtonPill.js +2 -2
  10. package/dist/cjs/components/types/MenuButtonPill.js.map +1 -1
  11. package/dist/cjs/components/types/ValuePill.js +5 -2
  12. package/dist/cjs/components/types/ValuePill.js.map +2 -2
  13. package/dist/cjs/components/types/index.js +2 -0
  14. package/dist/cjs/components/types/index.js.map +2 -2
  15. package/dist/cjs/react-desc-prop-types.js +15 -1
  16. package/dist/cjs/react-desc-prop-types.js.map +2 -2
  17. package/dist/cjs/typescript-testing/typescript-pills-v2-valid.js +11 -1
  18. package/dist/cjs/typescript-testing/typescript-pills-v2-valid.js.map +2 -2
  19. package/dist/esm/DSPillDefinitions.js +2 -2
  20. package/dist/esm/DSPillDefinitions.js.map +1 -1
  21. package/dist/esm/components/Pill.js +2 -0
  22. package/dist/esm/components/Pill.js.map +2 -2
  23. package/dist/esm/components/styled.js +18 -7
  24. package/dist/esm/components/styled.js.map +2 -2
  25. package/dist/esm/components/types/LabelOnlyPill.js +32 -0
  26. package/dist/esm/components/types/LabelOnlyPill.js.map +7 -0
  27. package/dist/esm/components/types/MenuButtonPill.js +2 -2
  28. package/dist/esm/components/types/MenuButtonPill.js.map +1 -1
  29. package/dist/esm/components/types/ValuePill.js +5 -2
  30. package/dist/esm/components/types/ValuePill.js.map +2 -2
  31. package/dist/esm/components/types/index.js +2 -0
  32. package/dist/esm/components/types/index.js.map +2 -2
  33. package/dist/esm/react-desc-prop-types.js +15 -1
  34. package/dist/esm/react-desc-prop-types.js.map +2 -2
  35. package/dist/esm/typescript-testing/typescript-pills-v2-valid.js +11 -1
  36. package/dist/esm/typescript-testing/typescript-pills-v2-valid.js.map +2 -2
  37. package/dist/types/DSPillDefinitions.d.ts +2 -2
  38. package/dist/types/components/styled.d.ts +8 -0
  39. package/dist/types/components/types/LabelOnlyPill.d.ts +3 -0
  40. package/dist/types/components/types/index.d.ts +1 -0
  41. package/dist/types/react-desc-prop-types.d.ts +3 -1
  42. package/package.json +15 -15
@@ -14,7 +14,8 @@ const testOptionalProps = {
14
14
  },
15
15
  onActivateItem: () => {
16
16
  }
17
- }
17
+ },
18
+ trailingComma: true
18
19
  };
19
20
  const testPartialDefaults = {
20
21
  innerRef: () => null,
@@ -44,6 +45,7 @@ const testCompleteDefaults = {
44
45
  innerRef: () => null,
45
46
  disabled: false,
46
47
  applyAriaDisabled: false,
48
+ readOnly: false,
47
49
  hasError: false,
48
50
  ariaLabel: "",
49
51
  size: "m",
@@ -85,6 +87,7 @@ const testExplicitDefinition = {
85
87
  innerRef: () => null,
86
88
  disabled: false,
87
89
  applyAriaDisabled: false,
90
+ readOnly: false,
88
91
  hasError: false,
89
92
  ariaLabel: "",
90
93
  size: "m",
@@ -103,6 +106,7 @@ const testExplicitDefinition = {
103
106
  isSkeleton: false,
104
107
  isOpened: false
105
108
  },
109
+ trailingComma: false,
106
110
  onDropdownClick: () => null,
107
111
  tabIndex: 0
108
112
  };
@@ -113,6 +117,7 @@ const testInferedTypeCompatibility = {
113
117
  innerRef: () => null,
114
118
  disabled: false,
115
119
  applyAriaDisabled: false,
120
+ readOnly: false,
116
121
  hasError: false,
117
122
  ariaLabel: "",
118
123
  size: "m",
@@ -131,6 +136,7 @@ const testInferedTypeCompatibility = {
131
136
  isSkeleton: false,
132
137
  isOpened: false
133
138
  },
139
+ trailingComma: false,
134
140
  onDropdownClick: () => null,
135
141
  tabIndex: 0
136
142
  };
@@ -141,6 +147,7 @@ const testDefinitionAsConst = {
141
147
  innerRef: () => null,
142
148
  disabled: false,
143
149
  applyAriaDisabled: false,
150
+ readOnly: false,
144
151
  hasError: false,
145
152
  ariaLabel: "",
146
153
  size: "m",
@@ -159,6 +166,7 @@ const testDefinitionAsConst = {
159
166
  isSkeleton: false,
160
167
  isOpened: false
161
168
  },
169
+ trailingComma: false,
162
170
  onDropdownClick: () => null,
163
171
  tabIndex: 0
164
172
  };
@@ -175,6 +183,7 @@ const ExampleUsageComponent = () => /* @__PURE__ */ jsxs(Fragment, { children: [
175
183
  innerRef: () => null,
176
184
  disabled: false,
177
185
  applyAriaDisabled: false,
186
+ readOnly: false,
178
187
  hasError: false,
179
188
  ariaLabel: "",
180
189
  size: "m",
@@ -192,6 +201,7 @@ const ExampleUsageComponent = () => /* @__PURE__ */ jsxs(Fragment, { children: [
192
201
  isSkeleton: false,
193
202
  isOpened: false
194
203
  },
204
+ trailingComma: false,
195
205
  onDropdownClick: () => null,
196
206
  tabIndex: 0,
197
207
  children: "Button Label"
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/typescript-testing/typescript-pills-v2-valid.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSPillV2 } from '../index.js';\nimport type { DSPillT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSPillT.Props;\ntype ComponentPropsInternals = DSPillT.InternalProps;\ntype ComponentPropsDefaultProps = DSPillT.DefaultProps;\ntype ComponentPropsOptionalProps = DSPillT.OptionalProps;\ntype ComponentPropsRequiredProps = DSPillT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n type: 'value',\n label: 'label',\n};\nconst testOptionalProps: Required<ComponentPropsOptionalProps> = {\n inputId: 'dsId',\n menuButtonProps: {\n options: [],\n selectedItems: [],\n onItemSelected: () => {},\n onActivateItem: () => {},\n },\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n ariaLabel: '',\n size: 'm',\n tooltipValue: '',\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n inputWidth: 72,\n onDropdownClick: () => null,\n tabIndex: 0,\n};\n\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\n\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n IconLeft: () => null,\n IconRight: () => null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n onDropdownClick: () => null,\n tabIndex: 0,\n applyTooltipOverflowWrap: false,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\n\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n type: 'value',\n label: 'label',\n inputId: 'dsId',\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n onDropdownClick: () => null,\n tabIndex: 0,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n type: 'value',\n label: 'label',\n inputId: 'dsId',\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n onDropdownClick: () => null,\n tabIndex: 0,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n type: 'value',\n label: 'label',\n inputId: 'dsId',\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n onDropdownClick: () => null,\n tabIndex: 0,\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <DSPillV2 {...testExplicitDefinition} />\n <DSPillV2 {...testInferedTypeCompatibility} />\n <DSPillV2 {...testDefinitionAsConst} />\n {/* works with inline values */}\n <DSPillV2\n type=\"value\"\n label=\"label\"\n inputId=\"dsId\"\n innerRef={() => null}\n disabled={false}\n applyAriaDisabled={false}\n hasError={false}\n ariaLabel=\"\"\n size=\"m\"\n labelTruncated\n tooltipValue=\"\"\n iconLeft={null}\n iconRight={null}\n onRemove={() => null}\n inputPlaceholder=\"\"\n onInputChange={() => null}\n onInputClear={() => null}\n inputWidth={72}\n // inputRender={() => <input type=\"text\"></input>}\n dropdownProps={{\n options: [],\n isSkeleton: false,\n isOpened: false,\n }}\n onDropdownClick={() => null}\n tabIndex={0}\n >\n Button Label\n </DSPillV2>\n </>\n);\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable @typescript-eslint/no-unused-vars, no-unused-vars */\nimport { DSPillV2 } from '../index.js';\nimport type { DSPillT } from '../index.js';\n\n// test we expose the namespace and the namespace follows our deliverable conventions\ntype ComponentPropsForApp = DSPillT.Props;\ntype ComponentPropsInternals = DSPillT.InternalProps;\ntype ComponentPropsDefaultProps = DSPillT.DefaultProps;\ntype ComponentPropsOptionalProps = DSPillT.OptionalProps;\ntype ComponentPropsRequiredProps = DSPillT.RequiredProps;\n\nconst testRequiredProps: ComponentPropsRequiredProps = {\n type: 'value',\n label: 'label',\n};\nconst testOptionalProps: Required<ComponentPropsOptionalProps> = {\n inputId: 'dsId',\n menuButtonProps: {\n options: [],\n selectedItems: [],\n onItemSelected: () => {},\n onActivateItem: () => {},\n },\n trailingComma: true,\n};\n\n// difference Props and InternalProps is that InternalProps has all the default props filled in\n// Props allows for partial defaults\nconst testPartialDefaults: Partial<ComponentPropsDefaultProps> = {\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n ariaLabel: '',\n size: 'm',\n tooltipValue: '',\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n inputWidth: 72,\n onDropdownClick: () => null,\n tabIndex: 0,\n};\n\nconst testProps: ComponentPropsForApp = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n};\n\nconst testPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testPartialDefaults,\n} as ComponentPropsForApp;\n\n// InternalProps requires all defaults to be filled in\nconst testCompleteDefaults: Required<ComponentPropsDefaultProps> = {\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n readOnly: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n IconLeft: () => null,\n IconRight: () => null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n onDropdownClick: () => null,\n tabIndex: 0,\n applyTooltipOverflowWrap: false,\n};\n\nconst testInternalProps: ComponentPropsInternals = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n};\n\nconst testInternalPropsAsSyntax = {\n ...testRequiredProps,\n ...testOptionalProps,\n ...testCompleteDefaults,\n} as ComponentPropsInternals;\n\n// using the explicit type definition, if there is an error, it will be marked on the key that is wrong\nconst testExplicitDefinition: ComponentPropsForApp = {\n type: 'value',\n label: 'label',\n inputId: 'dsId',\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n readOnly: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n trailingComma: false,\n onDropdownClick: () => null,\n tabIndex: 0,\n};\n\n// using the \"as\" syntax, if there is an error, it will be marking the whole object as wrong because it is not compatible with the type\nconst testInferedTypeCompatibility = {\n type: 'value',\n label: 'label',\n inputId: 'dsId',\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n readOnly: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n trailingComma: false,\n onDropdownClick: () => null,\n tabIndex: 0,\n} as ComponentPropsForApp;\n\nconst testDefinitionAsConst = {\n type: 'value',\n label: 'label',\n inputId: 'dsId',\n innerRef: () => null,\n disabled: false,\n applyAriaDisabled: false,\n readOnly: false,\n hasError: false,\n ariaLabel: '',\n size: 'm',\n labelTruncated: true,\n tooltipValue: '',\n iconLeft: null,\n iconRight: null,\n onRemove: () => null,\n inputPlaceholder: '',\n onInputChange: () => null,\n onInputClear: () => null,\n inputWidth: 72,\n inputRender: () => <input type=\"text\"></input>,\n dropdownProps: {\n options: [],\n isSkeleton: false,\n isOpened: false,\n },\n trailingComma: false,\n onDropdownClick: () => null,\n tabIndex: 0,\n} as const;\n\nconst ExampleUsageComponent = () => (\n <>\n {/* works with explicitly casted props, all syntaxes */}\n <DSPillV2 {...testExplicitDefinition} />\n <DSPillV2 {...testInferedTypeCompatibility} />\n <DSPillV2 {...testDefinitionAsConst} />\n {/* works with inline values */}\n <DSPillV2\n type=\"value\"\n label=\"label\"\n inputId=\"dsId\"\n innerRef={() => null}\n disabled={false}\n applyAriaDisabled={false}\n readOnly={false}\n hasError={false}\n ariaLabel=\"\"\n size=\"m\"\n labelTruncated\n tooltipValue=\"\"\n iconLeft={null}\n iconRight={null}\n onRemove={() => null}\n inputPlaceholder=\"\"\n onInputChange={() => null}\n onInputClear={() => null}\n inputWidth={72}\n // inputRender={() => <input type=\"text\"></input>}\n dropdownProps={{\n options: [],\n isSkeleton: false,\n isOpened: false,\n }}\n trailingComma={false}\n onDropdownClick={() => null}\n tabIndex={0}\n >\n Button Label\n </DSPillV2>\n </>\n);\n"],
5
+ "mappings": "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",
6
6
  "names": []
7
7
  }
@@ -1,3 +1,3 @@
1
1
  export declare const DSPillName = "DSPill";
2
- export declare const DSPillButtonName = "DSPillButton";
3
- export declare const DSPillGroupName = "DSPillGroup";
2
+ export declare const DSPillButtonName = "DSPillbutton";
3
+ export declare const DSPillGroupName = "DSPillgroup";
@@ -7,6 +7,7 @@ export declare const borderOutside: ({ color, size, zIndex, borderRadius, }: {
7
7
  }) => import("styled-components").FlattenInterpolation<import("styled-components").ThemedStyledProps<{
8
8
  disabled?: boolean | undefined;
9
9
  applyAriaDisabled?: boolean | undefined;
10
+ readOnly?: boolean | undefined;
10
11
  }, import("@xstyled/styled-components").Theme>>;
11
12
  interface InputPillWrapperProps {
12
13
  value: string;
@@ -19,6 +20,13 @@ interface InputPillWrapperProps {
19
20
  export declare const StyledLabelPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, {
20
21
  pillSize: 'm' | 's';
21
22
  hasIcon: boolean;
23
+ applyAriaDisabled?: boolean | undefined;
24
+ readOnly?: boolean | undefined;
25
+ } & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
26
+ export declare const StyledLabelOnlyPillWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>, import("@elliemae/ds-system").Theme, {
27
+ pillSize: 'm' | 's';
28
+ hasIcon: boolean;
29
+ applyAriaDisabled?: boolean | undefined;
22
30
  } & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid").DSGridT.Props & import("react").RefAttributes<HTMLDivElement>>>, never>;
23
31
  type StyledValuePillWrapperPropsT = {
24
32
  pillSize: 'm' | 's';
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ import type { DSPillT } from '../../react-desc-prop-types.js';
3
+ export declare const LabelOnlyPill: React.NamedExoticComponent<DSPillT.InternalProps>;
@@ -1,6 +1,7 @@
1
1
  export { DropdownPill } from './DropdownPill.js';
2
2
  export { InputPill } from './InputPill.js';
3
3
  export { LabelPill } from './LabelPill.js';
4
+ export { LabelOnlyPill } from './LabelOnlyPill.js';
4
5
  export { MenuButtonPill } from './MenuButtonPill.js';
5
6
  export { ReadOnlyPill } from './ReadOnlyPill.js';
6
7
  export { RemovablePill } from './RemovablePill.js';
@@ -10,6 +10,7 @@ export declare namespace DSPillT {
10
10
  innerRef: TypescriptHelpersT.AnyRef<HTMLElement>;
11
11
  disabled: boolean;
12
12
  applyAriaDisabled: boolean;
13
+ readOnly: boolean;
13
14
  applyTooltipOverflowWrap: boolean;
14
15
  hasError: boolean;
15
16
  ariaLabel: string;
@@ -37,10 +38,11 @@ export declare namespace DSPillT {
37
38
  interface OptionalProps {
38
39
  inputId?: string;
39
40
  menuButtonProps?: Omit<DSMenuButtonT.Props, 'children'>;
41
+ trailingComma?: boolean;
40
42
  }
41
43
  interface RequiredProps {
42
44
  label: string;
43
- type: 'label' | 'value' | 'input' | 'dropdown' | 'removable' | 'readonly' | 'menubutton';
45
+ type: 'label' | 'labelOnly' | 'value' | 'input' | 'dropdown' | 'removable' | 'readonly' | 'menubutton';
44
46
  }
45
47
  interface Props extends RequiredProps, Partial<DefaultProps>, OptionalProps, Omit<GlobalAttributesT<HTMLButtonElement>, keyof RequiredProps | keyof DefaultProps | keyof OptionalProps | keyof XstyledProps>, XstyledProps {
46
48
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-pills-v2",
3
- "version": "3.51.0-next.8",
3
+ "version": "3.51.0-rc.0",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Pills V2",
6
6
  "files": [
@@ -25,8 +25,8 @@
25
25
  "url": "https://git.elliemae.io/platform-ui/dimsum.git"
26
26
  },
27
27
  "engines": {
28
- "pnpm": ">=6",
29
- "node": ">=16"
28
+ "pnpm": ">=9",
29
+ "node": ">=22"
30
30
  },
31
31
  "author": "ICE MT",
32
32
  "jestSonar": {
@@ -37,23 +37,23 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "uid": "~2.0.1",
40
- "@elliemae/ds-button-v2": "3.51.0-next.8",
41
- "@elliemae/ds-dropdownmenu-v2": "3.51.0-next.8",
42
- "@elliemae/ds-grid": "3.51.0-next.8",
43
- "@elliemae/ds-form": "3.51.0-next.8",
44
- "@elliemae/ds-icons": "3.51.0-next.8",
45
- "@elliemae/ds-system": "3.51.0-next.8",
46
- "@elliemae/ds-menu-button": "3.51.0-next.8",
47
- "@elliemae/ds-props-helpers": "3.51.0-next.8",
48
- "@elliemae/ds-truncated-tooltip-text": "3.51.0-next.8",
49
- "@elliemae/ds-tooltip-v3": "3.51.0-next.8",
50
- "@elliemae/ds-typescript-helpers": "3.51.0-next.8"
40
+ "@elliemae/ds-button-v2": "3.51.0-rc.0",
41
+ "@elliemae/ds-dropdownmenu-v2": "3.51.0-rc.0",
42
+ "@elliemae/ds-form": "3.51.0-rc.0",
43
+ "@elliemae/ds-grid": "3.51.0-rc.0",
44
+ "@elliemae/ds-menu-button": "3.51.0-rc.0",
45
+ "@elliemae/ds-props-helpers": "3.51.0-rc.0",
46
+ "@elliemae/ds-icons": "3.51.0-rc.0",
47
+ "@elliemae/ds-tooltip-v3": "3.51.0-rc.0",
48
+ "@elliemae/ds-system": "3.51.0-rc.0",
49
+ "@elliemae/ds-truncated-tooltip-text": "3.51.0-rc.0",
50
+ "@elliemae/ds-typescript-helpers": "3.51.0-rc.0"
51
51
  },
52
52
  "devDependencies": {
53
53
  "@elliemae/pui-cli": "9.0.0-next.55",
54
54
  "jest": "~29.7.0",
55
55
  "styled-components": "~5.3.9",
56
- "@elliemae/ds-monorepo-devops": "3.51.0-next.8"
56
+ "@elliemae/ds-monorepo-devops": "3.51.0-rc.0"
57
57
  },
58
58
  "peerDependencies": {
59
59
  "lodash": "^4.17.21",