@elliemae/ds-image 3.52.1 → 3.53.0-alpha.2

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 (7) hide show
  1. package/dist/cjs/styled.js +7 -2
  2. package/dist/cjs/styled.js.map +2 -2
  3. package/dist/esm/styled.js +7 -2
  4. package/dist/esm/styled.js.map +2 -2
  5. package/dist/types/config/useImage.d.ts +181 -181
  6. package/dist/types/styled.d.ts +2 -2
  7. package/package.json +6 -5
package/dist/cjs/styled.js CHANGED
@@ -108,6 +108,7 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
108
108
 
109
109
  ${({ size }) => {
110
110
  if (size) return getSize(size);
111
+ return "";
111
112
  }};
112
113
 
113
114
  ${({ width, theme }) => {
@@ -115,7 +116,8 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
115
116
  return `
116
117
  width: ${width};
117
118
  `;
118
- } else if (typeof width === "number") {
119
+ }
120
+ if (typeof width === "number") {
119
121
  return `
120
122
  width: ${width / 16}rem;
121
123
  @media (min-width: ${theme.breakpoints?.small}) {
@@ -123,6 +125,7 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
123
125
  }
124
126
  `;
125
127
  }
128
+ return "";
126
129
  }}
127
130
 
128
131
  ${({ height, theme }) => {
@@ -130,7 +133,8 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
130
133
  return `
131
134
  height: ${height};
132
135
  `;
133
- } else if (typeof height === "number") {
136
+ }
137
+ if (typeof height === "number") {
134
138
  return `
135
139
  height: ${height / 16}rem;
136
140
  @media (min-width: ${theme.breakpoints?.small}) {
@@ -138,6 +142,7 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
138
142
  }
139
143
  `;
140
144
  }
145
+ return "";
141
146
  }}
142
147
  `;
143
148
  //# sourceMappingURL=styled.js.map
package/dist/cjs/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["import type { FlattenInterpolation, Theme } from '@elliemae/ds-system';\nimport { xStyledCommonProps, css, styled, th } from '@elliemae/ds-system';\nimport type { DSImageT } from './react-desc-prop-types.js';\nimport { DSImageName, IMAGE_SLOTS } from './constants/index.js';\nimport type { XstyledProps } from '@elliemae/ds-props-helpers';\n\nconst xxlSizes = css`\n width: 4rem;\n height: 4rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 4.923rem;\n height: 4.923rem;\n }\n`;\n\nconst xlSizes = css`\n width: 3rem;\n height: 3rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 3.692rem;\n height: 3.692rem;\n }\n`;\n\nconst lSizes = css`\n width: 2rem;\n height: 2rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 2.462rem;\n height: 2.462rem;\n }\n`;\n\nconst mSizes = css`\n width: 1.5rem;\n height: 1.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.846rem;\n height: 1.846rem;\n }\n`;\n\nconst sSizes = css`\n width: 1rem;\n height: 1rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.231rem;\n height: 1.231rem;\n }\n`;\n\nconst xsSizes = css`\n width: 0.5rem;\n height: 0.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.615rem;\n height: 0.615rem;\n }\n`;\n\nconst xxsSizes = css`\n width: 0.25rem;\n height: 0.25rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.308rem;\n height: 0.308rem;\n }\n`;\n\nconst standarSizes = css`\n ${sSizes}\n`;\n\nconst getSize = (\n size: DSImageT.SizeType | undefined,\n): FlattenInterpolation<{\n theme: Theme;\n}> => {\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 StyledWrapper = styled('img', { name: DSImageName, slot: IMAGE_SLOTS.ROOT })<\n { size?: DSImageT.SizeType } & XstyledProps\n>`\n ${xStyledCommonProps}\n\n ${({ size }) => {\n if (size) return getSize(size);\n }};\n\n ${({ width, theme }) => {\n if (typeof width === 'string') {\n return `\n width: ${width};\n `;\n } else if (typeof width === 'number') {\n return `\n width: ${width / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n width: ${width / 13}rem;\n }\n `;\n }\n }}\n\n ${({ height, theme }) => {\n if (typeof height === 'string') {\n return `\n height: ${height};\n `;\n } else if (typeof height === 'number') {\n return `\n height: ${height / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n height: ${height / 13}rem;\n }\n `;\n }\n }}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAoD;AAEpD,uBAAyC;AAGzC,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,eAAe;AAAA,IACjB,MAAM;AAAA;AAGV,MAAM,UAAU,CACd,SAGI;AACJ,MAAI,SAAS,MAAO,QAAO;AAC3B,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,MAAO,QAAO;AAC3B,SAAO;AACT;AAEO,MAAM,oBAAgB,yBAAO,OAAO,EAAE,MAAM,8BAAa,MAAM,6BAAY,KAAK,CAAC;AAAA,IAGpF,mCAAkB;AAAA;AAAA,IAElB,CAAC,EAAE,KAAK,MAAM;AACd,MAAI,KAAM,QAAO,QAAQ,IAAI;AAC/B,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,OAAO,MAAM,MAAM;AACtB,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,iBACI,KAAK;AAAA;AAAA,EAElB,WAAW,OAAO,UAAU,UAAU;AACpC,WAAO;AAAA,iBACI,QAAQ,EAAE;AAAA,6BACE,MAAM,aAAa,KAAK;AAAA,mBAClC,QAAQ,EAAE;AAAA;AAAA;AAAA,EAGzB;AACF,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,QAAQ,MAAM,MAAM;AACvB,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,kBACK,MAAM;AAAA;AAAA,EAEpB,WAAW,OAAO,WAAW,UAAU;AACrC,WAAO;AAAA,kBACK,SAAS,EAAE;AAAA,6BACA,MAAM,aAAa,KAAK;AAAA,oBACjC,SAAS,EAAE;AAAA;AAAA;AAAA,EAG3B;AACF,CAAC;AAAA;",
4
+ "sourcesContent": ["import type { FlattenInterpolation, Theme } from '@elliemae/ds-system';\nimport { xStyledCommonProps, css, styled, th } from '@elliemae/ds-system';\nimport type { XstyledProps } from '@elliemae/ds-props-helpers';\nimport type { DSImageT } from './react-desc-prop-types.js';\nimport { DSImageName, IMAGE_SLOTS } from './constants/index.js';\n\nconst xxlSizes = css`\n width: 4rem;\n height: 4rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 4.923rem;\n height: 4.923rem;\n }\n`;\n\nconst xlSizes = css`\n width: 3rem;\n height: 3rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 3.692rem;\n height: 3.692rem;\n }\n`;\n\nconst lSizes = css`\n width: 2rem;\n height: 2rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 2.462rem;\n height: 2.462rem;\n }\n`;\n\nconst mSizes = css`\n width: 1.5rem;\n height: 1.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.846rem;\n height: 1.846rem;\n }\n`;\n\nconst sSizes = css`\n width: 1rem;\n height: 1rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.231rem;\n height: 1.231rem;\n }\n`;\n\nconst xsSizes = css`\n width: 0.5rem;\n height: 0.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.615rem;\n height: 0.615rem;\n }\n`;\n\nconst xxsSizes = css`\n width: 0.25rem;\n height: 0.25rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.308rem;\n height: 0.308rem;\n }\n`;\n\nconst standarSizes = css`\n ${sSizes}\n`;\n\nconst getSize = (\n size: DSImageT.SizeType | undefined,\n): FlattenInterpolation<{\n theme: Theme;\n}> => {\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 StyledWrapper = styled('img', { name: DSImageName, slot: IMAGE_SLOTS.ROOT })<\n { size?: DSImageT.SizeType } & XstyledProps\n>`\n ${xStyledCommonProps}\n\n ${({ size }) => {\n if (size) return getSize(size);\n return '';\n }};\n\n ${({ width, theme }) => {\n if (typeof width === 'string') {\n return `\n width: ${width};\n `;\n }\n if (typeof width === 'number') {\n return `\n width: ${width / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n width: ${width / 13}rem;\n }\n `;\n }\n return '';\n }}\n\n ${({ height, theme }) => {\n if (typeof height === 'string') {\n return `\n height: ${height};\n `;\n }\n if (typeof height === 'number') {\n return `\n height: ${height / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n height: ${height / 13}rem;\n }\n `;\n }\n return '';\n }}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAoD;AAGpD,uBAAyC;AAEzC,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,oBAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,eAAe;AAAA,IACjB,MAAM;AAAA;AAGV,MAAM,UAAU,CACd,SAGI;AACJ,MAAI,SAAS,MAAO,QAAO;AAC3B,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,MAAO,QAAO;AAC3B,SAAO;AACT;AAEO,MAAM,oBAAgB,yBAAO,OAAO,EAAE,MAAM,8BAAa,MAAM,6BAAY,KAAK,CAAC;AAAA,IAGpF,mCAAkB;AAAA;AAAA,IAElB,CAAC,EAAE,KAAK,MAAM;AACd,MAAI,KAAM,QAAO,QAAQ,IAAI;AAC7B,SAAO;AACT,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,OAAO,MAAM,MAAM;AACtB,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,iBACI,KAAK;AAAA;AAAA,EAElB;AACA,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,iBACI,QAAQ,EAAE;AAAA,6BACE,MAAM,aAAa,KAAK;AAAA,mBAClC,QAAQ,EAAE;AAAA;AAAA;AAAA,EAGzB;AACA,SAAO;AACT,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,QAAQ,MAAM,MAAM;AACvB,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,kBACK,MAAM;AAAA;AAAA,EAEpB;AACA,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,kBACK,SAAS,EAAE;AAAA,6BACA,MAAM,aAAa,KAAK;AAAA,oBACjC,SAAS,EAAE;AAAA;AAAA;AAAA,EAG3B;AACA,SAAO;AACT,CAAC;AAAA;",
6
6
  "names": []
7
7
  }
package/dist/esm/styled.js CHANGED
@@ -75,6 +75,7 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
75
75
 
76
76
  ${({ size }) => {
77
77
  if (size) return getSize(size);
78
+ return "";
78
79
  }};
79
80
 
80
81
  ${({ width, theme }) => {
@@ -82,7 +83,8 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
82
83
  return `
83
84
  width: ${width};
84
85
  `;
85
- } else if (typeof width === "number") {
86
+ }
87
+ if (typeof width === "number") {
86
88
  return `
87
89
  width: ${width / 16}rem;
88
90
  @media (min-width: ${theme.breakpoints?.small}) {
@@ -90,6 +92,7 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
90
92
  }
91
93
  `;
92
94
  }
95
+ return "";
93
96
  }}
94
97
 
95
98
  ${({ height, theme }) => {
@@ -97,7 +100,8 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
97
100
  return `
98
101
  height: ${height};
99
102
  `;
100
- } else if (typeof height === "number") {
103
+ }
104
+ if (typeof height === "number") {
101
105
  return `
102
106
  height: ${height / 16}rem;
103
107
  @media (min-width: ${theme.breakpoints?.small}) {
@@ -105,6 +109,7 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
105
109
  }
106
110
  `;
107
111
  }
112
+ return "";
108
113
  }}
109
114
  `;
110
115
  export {
package/dist/esm/styled.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { FlattenInterpolation, Theme } from '@elliemae/ds-system';\nimport { xStyledCommonProps, css, styled, th } from '@elliemae/ds-system';\nimport type { DSImageT } from './react-desc-prop-types.js';\nimport { DSImageName, IMAGE_SLOTS } from './constants/index.js';\nimport type { XstyledProps } from '@elliemae/ds-props-helpers';\n\nconst xxlSizes = css`\n width: 4rem;\n height: 4rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 4.923rem;\n height: 4.923rem;\n }\n`;\n\nconst xlSizes = css`\n width: 3rem;\n height: 3rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 3.692rem;\n height: 3.692rem;\n }\n`;\n\nconst lSizes = css`\n width: 2rem;\n height: 2rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 2.462rem;\n height: 2.462rem;\n }\n`;\n\nconst mSizes = css`\n width: 1.5rem;\n height: 1.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.846rem;\n height: 1.846rem;\n }\n`;\n\nconst sSizes = css`\n width: 1rem;\n height: 1rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.231rem;\n height: 1.231rem;\n }\n`;\n\nconst xsSizes = css`\n width: 0.5rem;\n height: 0.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.615rem;\n height: 0.615rem;\n }\n`;\n\nconst xxsSizes = css`\n width: 0.25rem;\n height: 0.25rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.308rem;\n height: 0.308rem;\n }\n`;\n\nconst standarSizes = css`\n ${sSizes}\n`;\n\nconst getSize = (\n size: DSImageT.SizeType | undefined,\n): FlattenInterpolation<{\n theme: Theme;\n}> => {\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 StyledWrapper = styled('img', { name: DSImageName, slot: IMAGE_SLOTS.ROOT })<\n { size?: DSImageT.SizeType } & XstyledProps\n>`\n ${xStyledCommonProps}\n\n ${({ size }) => {\n if (size) return getSize(size);\n }};\n\n ${({ width, theme }) => {\n if (typeof width === 'string') {\n return `\n width: ${width};\n `;\n } else if (typeof width === 'number') {\n return `\n width: ${width / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n width: ${width / 13}rem;\n }\n `;\n }\n }}\n\n ${({ height, theme }) => {\n if (typeof height === 'string') {\n return `\n height: ${height};\n `;\n } else if (typeof height === 'number') {\n return `\n height: ${height / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n height: ${height / 13}rem;\n }\n `;\n }\n }}\n`;\n"],
5
- "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,oBAAoB,KAAK,QAAQ,UAAU;AAEpD,SAAS,aAAa,mBAAmB;AAGzC,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,eAAe;AAAA,IACjB,MAAM;AAAA;AAGV,MAAM,UAAU,CACd,SAGI;AACJ,MAAI,SAAS,MAAO,QAAO;AAC3B,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,MAAO,QAAO;AAC3B,SAAO;AACT;AAEO,MAAM,gBAAgB,OAAO,OAAO,EAAE,MAAM,aAAa,MAAM,YAAY,KAAK,CAAC;AAAA,IAGpF,kBAAkB;AAAA;AAAA,IAElB,CAAC,EAAE,KAAK,MAAM;AACd,MAAI,KAAM,QAAO,QAAQ,IAAI;AAC/B,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,OAAO,MAAM,MAAM;AACtB,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,iBACI,KAAK;AAAA;AAAA,EAElB,WAAW,OAAO,UAAU,UAAU;AACpC,WAAO;AAAA,iBACI,QAAQ,EAAE;AAAA,6BACE,MAAM,aAAa,KAAK;AAAA,mBAClC,QAAQ,EAAE;AAAA;AAAA;AAAA,EAGzB;AACF,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,QAAQ,MAAM,MAAM;AACvB,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,kBACK,MAAM;AAAA;AAAA,EAEpB,WAAW,OAAO,WAAW,UAAU;AACrC,WAAO;AAAA,kBACK,SAAS,EAAE;AAAA,6BACA,MAAM,aAAa,KAAK;AAAA,oBACjC,SAAS,EAAE;AAAA;AAAA;AAAA,EAG3B;AACF,CAAC;AAAA;",
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type { FlattenInterpolation, Theme } from '@elliemae/ds-system';\nimport { xStyledCommonProps, css, styled, th } from '@elliemae/ds-system';\nimport type { XstyledProps } from '@elliemae/ds-props-helpers';\nimport type { DSImageT } from './react-desc-prop-types.js';\nimport { DSImageName, IMAGE_SLOTS } from './constants/index.js';\n\nconst xxlSizes = css`\n width: 4rem;\n height: 4rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 4.923rem;\n height: 4.923rem;\n }\n`;\n\nconst xlSizes = css`\n width: 3rem;\n height: 3rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 3.692rem;\n height: 3.692rem;\n }\n`;\n\nconst lSizes = css`\n width: 2rem;\n height: 2rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 2.462rem;\n height: 2.462rem;\n }\n`;\n\nconst mSizes = css`\n width: 1.5rem;\n height: 1.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.846rem;\n height: 1.846rem;\n }\n`;\n\nconst sSizes = css`\n width: 1rem;\n height: 1rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 1.231rem;\n height: 1.231rem;\n }\n`;\n\nconst xsSizes = css`\n width: 0.5rem;\n height: 0.5rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.615rem;\n height: 0.615rem;\n }\n`;\n\nconst xxsSizes = css`\n width: 0.25rem;\n height: 0.25rem;\n @media (min-width: ${th.breakpoint('small')}) {\n width: 0.308rem;\n height: 0.308rem;\n }\n`;\n\nconst standarSizes = css`\n ${sSizes}\n`;\n\nconst getSize = (\n size: DSImageT.SizeType | undefined,\n): FlattenInterpolation<{\n theme: Theme;\n}> => {\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 StyledWrapper = styled('img', { name: DSImageName, slot: IMAGE_SLOTS.ROOT })<\n { size?: DSImageT.SizeType } & XstyledProps\n>`\n ${xStyledCommonProps}\n\n ${({ size }) => {\n if (size) return getSize(size);\n return '';\n }};\n\n ${({ width, theme }) => {\n if (typeof width === 'string') {\n return `\n width: ${width};\n `;\n }\n if (typeof width === 'number') {\n return `\n width: ${width / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n width: ${width / 13}rem;\n }\n `;\n }\n return '';\n }}\n\n ${({ height, theme }) => {\n if (typeof height === 'string') {\n return `\n height: ${height};\n `;\n }\n if (typeof height === 'number') {\n return `\n height: ${height / 16}rem;\n @media (min-width: ${theme.breakpoints?.small}) {\n height: ${height / 13}rem;\n }\n `;\n }\n return '';\n }}\n`;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,oBAAoB,KAAK,QAAQ,UAAU;AAGpD,SAAS,aAAa,mBAAmB;AAEzC,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,SAAS;AAAA;AAAA;AAAA,uBAGQ,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,UAAU;AAAA;AAAA;AAAA,uBAGO,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,WAAW;AAAA;AAAA;AAAA,uBAGM,GAAG,WAAW,OAAO,CAAC;AAAA;AAAA;AAAA;AAAA;AAM7C,MAAM,eAAe;AAAA,IACjB,MAAM;AAAA;AAGV,MAAM,UAAU,CACd,SAGI;AACJ,MAAI,SAAS,MAAO,QAAO;AAC3B,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,IAAK,QAAO;AACzB,MAAI,SAAS,KAAM,QAAO;AAC1B,MAAI,SAAS,MAAO,QAAO;AAC3B,SAAO;AACT;AAEO,MAAM,gBAAgB,OAAO,OAAO,EAAE,MAAM,aAAa,MAAM,YAAY,KAAK,CAAC;AAAA,IAGpF,kBAAkB;AAAA;AAAA,IAElB,CAAC,EAAE,KAAK,MAAM;AACd,MAAI,KAAM,QAAO,QAAQ,IAAI;AAC7B,SAAO;AACT,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,OAAO,MAAM,MAAM;AACtB,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,iBACI,KAAK;AAAA;AAAA,EAElB;AACA,MAAI,OAAO,UAAU,UAAU;AAC7B,WAAO;AAAA,iBACI,QAAQ,EAAE;AAAA,6BACE,MAAM,aAAa,KAAK;AAAA,mBAClC,QAAQ,EAAE;AAAA;AAAA;AAAA,EAGzB;AACA,SAAO;AACT,CAAC;AAAA;AAAA,IAEC,CAAC,EAAE,QAAQ,MAAM,MAAM;AACvB,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,kBACK,MAAM;AAAA;AAAA,EAEpB;AACA,MAAI,OAAO,WAAW,UAAU;AAC9B,WAAO;AAAA,kBACK,SAAS,EAAE;AAAA,6BACA,MAAM,aAAa,KAAK;AAAA,oBACjC,SAAS,EAAE;AAAA;AAAA;AAAA,EAG3B;AACA,SAAO;AACT,CAAC;AAAA;",
6
6
  "names": []
7
7
  }
package/dist/types/config/useImage.d.ts CHANGED
@@ -10,61 +10,61 @@ export interface ImageCTX {
10
10
  export declare const useImage: (propsFromUser: DSImageT.Props) => {
11
11
  propsWithDefault: DSImageT.InternalProps;
12
12
  globalProps: Partial<Pick<object, "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" | "label" | "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" | "value" | "width" | "wmode" | "wrap"> & Omit<{
13
- form?: string | undefined;
14
- list?: string | undefined;
15
- "aria-activedescendant"?: string | undefined;
13
+ form?: string | undefined | undefined;
14
+ list?: string | undefined | undefined;
15
+ "aria-activedescendant"?: string | undefined | undefined;
16
16
  "aria-atomic"?: (boolean | "true" | "false") | undefined;
17
- "aria-autocomplete"?: "none" | "list" | "inline" | "both" | undefined;
18
- "aria-braillelabel"?: string | undefined;
19
- "aria-brailleroledescription"?: string | undefined;
17
+ "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined | undefined;
18
+ "aria-braillelabel"?: string | undefined | undefined;
19
+ "aria-brailleroledescription"?: string | undefined | undefined;
20
20
  "aria-busy"?: (boolean | "true" | "false") | undefined;
21
- "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
22
- "aria-colcount"?: number | undefined;
23
- "aria-colindex"?: number | undefined;
24
- "aria-colindextext"?: string | undefined;
25
- "aria-colspan"?: number | undefined;
26
- "aria-controls"?: string | undefined;
27
- "aria-current"?: boolean | "true" | "false" | "step" | "page" | "location" | "date" | "time" | undefined;
28
- "aria-describedby"?: string | undefined;
29
- "aria-description"?: string | undefined;
30
- "aria-details"?: string | undefined;
21
+ "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
22
+ "aria-colcount"?: number | undefined | undefined;
23
+ "aria-colindex"?: number | undefined | undefined;
24
+ "aria-colindextext"?: string | undefined | undefined;
25
+ "aria-colspan"?: number | undefined | undefined;
26
+ "aria-controls"?: string | undefined | undefined;
27
+ "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined | undefined;
28
+ "aria-describedby"?: string | undefined | undefined;
29
+ "aria-description"?: string | undefined | undefined;
30
+ "aria-details"?: string | undefined | undefined;
31
31
  "aria-disabled"?: (boolean | "true" | "false") | undefined;
32
- "aria-dropeffect"?: "none" | "link" | "copy" | "execute" | "move" | "popup" | undefined;
33
- "aria-errormessage"?: string | undefined;
32
+ "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
33
+ "aria-errormessage"?: string | undefined | undefined;
34
34
  "aria-expanded"?: (boolean | "true" | "false") | undefined;
35
- "aria-flowto"?: string | undefined;
35
+ "aria-flowto"?: string | undefined | undefined;
36
36
  "aria-grabbed"?: (boolean | "true" | "false") | undefined;
37
- "aria-haspopup"?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
37
+ "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined | undefined;
38
38
  "aria-hidden"?: (boolean | "true" | "false") | undefined;
39
- "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
40
- "aria-keyshortcuts"?: string | undefined;
41
- "aria-label"?: string | undefined;
42
- "aria-labelledby"?: string | undefined;
43
- "aria-level"?: number | undefined;
44
- "aria-live"?: "off" | "assertive" | "polite" | undefined;
39
+ "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined | undefined;
40
+ "aria-keyshortcuts"?: string | undefined | undefined;
41
+ "aria-label"?: string | undefined | undefined;
42
+ "aria-labelledby"?: string | undefined | undefined;
43
+ "aria-level"?: number | undefined | undefined;
44
+ "aria-live"?: "off" | "assertive" | "polite" | undefined | undefined;
45
45
  "aria-modal"?: (boolean | "true" | "false") | undefined;
46
46
  "aria-multiline"?: (boolean | "true" | "false") | undefined;
47
47
  "aria-multiselectable"?: (boolean | "true" | "false") | undefined;
48
- "aria-orientation"?: "horizontal" | "vertical" | undefined;
49
- "aria-owns"?: string | undefined;
50
- "aria-placeholder"?: string | undefined;
51
- "aria-posinset"?: number | undefined;
52
- "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
48
+ "aria-orientation"?: "horizontal" | "vertical" | undefined | undefined;
49
+ "aria-owns"?: string | undefined | undefined;
50
+ "aria-placeholder"?: string | undefined | undefined;
51
+ "aria-posinset"?: number | undefined | undefined;
52
+ "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined | undefined;
53
53
  "aria-readonly"?: (boolean | "true" | "false") | undefined;
54
- "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
54
+ "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
55
55
  "aria-required"?: (boolean | "true" | "false") | undefined;
56
- "aria-roledescription"?: string | undefined;
57
- "aria-rowcount"?: number | undefined;
58
- "aria-rowindex"?: number | undefined;
59
- "aria-rowindextext"?: string | undefined;
60
- "aria-rowspan"?: number | undefined;
56
+ "aria-roledescription"?: string | undefined | undefined;
57
+ "aria-rowcount"?: number | undefined | undefined;
58
+ "aria-rowindex"?: number | undefined | undefined;
59
+ "aria-rowindextext"?: string | undefined | undefined;
60
+ "aria-rowspan"?: number | undefined | undefined;
61
61
  "aria-selected"?: (boolean | "true" | "false") | undefined;
62
- "aria-setsize"?: number | undefined;
63
- "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
64
- "aria-valuemax"?: number | undefined;
65
- "aria-valuemin"?: number | undefined;
66
- "aria-valuenow"?: number | undefined;
67
- "aria-valuetext"?: string | undefined;
62
+ "aria-setsize"?: number | undefined | undefined;
63
+ "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
64
+ "aria-valuemax"?: number | undefined | undefined;
65
+ "aria-valuemin"?: number | undefined | undefined;
66
+ "aria-valuenow"?: number | undefined | undefined;
67
+ "aria-valuetext"?: string | undefined | undefined;
68
68
  children?: React.ReactNode;
69
69
  onCopy?: React.ClipboardEventHandler<Element> | undefined;
70
70
  onCopyCapture?: React.ClipboardEventHandler<Element> | undefined;
@@ -84,7 +84,7 @@ export declare const useImage: (propsFromUser: DSImageT.Props) => {
84
84
  onBlurCapture?: React.FocusEventHandler<Element> | undefined;
85
85
  onChange?: React.FormEventHandler<Element> | undefined;
86
86
  onChangeCapture?: React.FormEventHandler<Element> | undefined;
87
- onBeforeInput?: React.FormEventHandler<Element> | undefined;
87
+ onBeforeInput?: React.InputEventHandler<Element> | undefined;
88
88
  onBeforeInputCapture?: React.FormEventHandler<Element> | undefined;
89
89
  onInput?: React.FormEventHandler<Element> | undefined;
90
90
  onInputCapture?: React.FormEventHandler<Element> | undefined;
@@ -224,156 +224,156 @@ export declare const useImage: (propsFromUser: DSImageT.Props) => {
224
224
  onAnimationIterationCapture?: React.AnimationEventHandler<Element> | undefined;
225
225
  onTransitionEnd?: React.TransitionEventHandler<Element> | undefined;
226
226
  onTransitionEndCapture?: React.TransitionEventHandler<Element> | undefined;
227
- defaultChecked?: boolean | undefined;
227
+ defaultChecked?: boolean | undefined | undefined;
228
228
  defaultValue?: string | number | readonly string[] | undefined;
229
- suppressContentEditableWarning?: boolean | undefined;
230
- suppressHydrationWarning?: boolean | undefined;
231
- accessKey?: string | undefined;
232
- autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | (string & {}) | undefined;
233
- autoFocus?: boolean | undefined;
234
- className?: string | undefined;
229
+ suppressContentEditableWarning?: boolean | undefined | undefined;
230
+ suppressHydrationWarning?: boolean | undefined | undefined;
231
+ accessKey?: string | undefined | undefined;
232
+ autoCapitalize?: "off" | "none" | "on" | "sentences" | "words" | "characters" | undefined | (string & {}) | undefined;
233
+ autoFocus?: boolean | undefined | undefined;
234
+ className?: string | undefined | undefined;
235
235
  contentEditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
236
- contextMenu?: string | undefined;
237
- dir?: string | undefined;
236
+ contextMenu?: string | undefined | undefined;
237
+ dir?: string | undefined | undefined;
238
238
  draggable?: (boolean | "true" | "false") | undefined;
239
- enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined;
240
- hidden?: boolean | undefined;
241
- id?: string | undefined;
242
- lang?: string | undefined;
243
- nonce?: string | undefined;
244
- slot?: string | undefined;
239
+ enterKeyHint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
240
+ hidden?: boolean | undefined | undefined;
241
+ id?: string | undefined | undefined;
242
+ lang?: string | undefined | undefined;
243
+ nonce?: string | undefined | undefined;
244
+ slot?: string | undefined | undefined;
245
245
  spellCheck?: (boolean | "true" | "false") | undefined;
246
246
  style?: React.CSSProperties | undefined;
247
247
  tabIndex?: 0 | -1 | undefined;
248
- title?: string | undefined;
249
- translate?: "yes" | "no" | undefined;
250
- radioGroup?: string | undefined;
248
+ title?: string | undefined | undefined;
249
+ translate?: "yes" | "no" | undefined | undefined;
250
+ radioGroup?: string | undefined | undefined;
251
251
  role?: React.AriaRole | undefined;
252
- about?: string | undefined;
253
- content?: string | undefined;
254
- datatype?: string | undefined;
252
+ about?: string | undefined | undefined;
253
+ content?: string | undefined | undefined;
254
+ datatype?: string | undefined | undefined;
255
255
  inlist?: any;
256
- prefix?: string | undefined;
257
- property?: string | undefined;
258
- rel?: string | undefined;
259
- resource?: string | undefined;
260
- rev?: string | undefined;
261
- typeof?: string | undefined;
262
- vocab?: string | undefined;
263
- autoCorrect?: string | undefined;
264
- autoSave?: string | undefined;
265
- color?: string | undefined;
266
- itemProp?: string | undefined;
267
- itemScope?: boolean | undefined;
268
- itemType?: string | undefined;
269
- itemID?: string | undefined;
270
- itemRef?: string | undefined;
271
- results?: number | undefined;
272
- security?: string | undefined;
273
- unselectable?: "off" | "on" | undefined;
274
- inputMode?: "none" | "search" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | undefined;
275
- is?: string | undefined;
276
- exportparts?: string | undefined;
277
- part?: string | undefined;
278
- accept?: string | undefined;
279
- acceptCharset?: string | undefined;
256
+ prefix?: string | undefined | undefined;
257
+ property?: string | undefined | undefined;
258
+ rel?: string | undefined | undefined;
259
+ resource?: string | undefined | undefined;
260
+ rev?: string | undefined | undefined;
261
+ typeof?: string | undefined | undefined;
262
+ vocab?: string | undefined | undefined;
263
+ autoCorrect?: string | undefined | undefined;
264
+ autoSave?: string | undefined | undefined;
265
+ color?: string | undefined | undefined;
266
+ itemProp?: string | undefined | undefined;
267
+ itemScope?: boolean | undefined | undefined;
268
+ itemType?: string | undefined | undefined;
269
+ itemID?: string | undefined | undefined;
270
+ itemRef?: string | undefined | undefined;
271
+ results?: number | undefined | undefined;
272
+ security?: string | undefined | undefined;
273
+ unselectable?: "on" | "off" | undefined | undefined;
274
+ inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
275
+ is?: string | undefined | undefined;
276
+ exportparts?: string | undefined | undefined;
277
+ part?: string | undefined | undefined;
278
+ accept?: string | undefined | undefined;
279
+ acceptCharset?: string | undefined | undefined;
280
280
  action?: string | undefined;
281
- allowFullScreen?: boolean | undefined;
282
- allowTransparency?: boolean | undefined;
283
- alt?: string | undefined;
284
- async?: boolean | undefined;
285
- autoComplete?: string | undefined;
286
- autoPlay?: boolean | undefined;
287
- capture?: boolean | "user" | "environment" | undefined;
288
- cellPadding?: string | number | undefined;
289
- cellSpacing?: string | number | undefined;
290
- charSet?: string | undefined;
291
- challenge?: string | undefined;
292
- checked?: boolean | undefined;
293
- cite?: string | undefined;
294
- classID?: string | undefined;
295
- cols?: number | undefined;
296
- colSpan?: number | undefined;
297
- controls?: boolean | undefined;
298
- coords?: string | undefined;
281
+ allowFullScreen?: boolean | undefined | undefined;
282
+ allowTransparency?: boolean | undefined | undefined;
283
+ alt?: string | undefined | undefined;
284
+ async?: boolean | undefined | undefined;
285
+ autoComplete?: string | undefined | undefined;
286
+ autoPlay?: boolean | undefined | undefined;
287
+ capture?: boolean | "user" | "environment" | undefined | undefined;
288
+ cellPadding?: number | string | undefined | undefined;
289
+ cellSpacing?: number | string | undefined | undefined;
290
+ charSet?: string | undefined | undefined;
291
+ challenge?: string | undefined | undefined;
292
+ checked?: boolean | undefined | undefined;
293
+ cite?: string | undefined | undefined;
294
+ classID?: string | undefined | undefined;
295
+ cols?: number | undefined | undefined;
296
+ colSpan?: number | undefined | undefined;
297
+ controls?: boolean | undefined | undefined;
298
+ coords?: string | undefined | undefined;
299
299
  crossOrigin?: "" | "anonymous" | "use-credentials" | undefined;
300
- data?: string | undefined;
301
- dateTime?: string | undefined;
302
- default?: boolean | undefined;
303
- defer?: boolean | undefined;
304
- disabled?: boolean | undefined;
300
+ data?: string | undefined | undefined;
301
+ dateTime?: string | undefined | undefined;
302
+ default?: boolean | undefined | undefined;
303
+ defer?: boolean | undefined | undefined;
304
+ disabled?: boolean | undefined | undefined;
305
305
  download?: any;
306
- encType?: string | undefined;
306
+ encType?: string | undefined | undefined;
307
307
  formAction?: string | undefined;
308
- formEncType?: string | undefined;
309
- formMethod?: string | undefined;
310
- formNoValidate?: boolean | undefined;
311
- formTarget?: string | undefined;
312
- frameBorder?: string | number | undefined;
313
- headers?: string | undefined;
314
- height?: string | number | undefined;
315
- high?: number | undefined;
316
- href?: string | undefined;
317
- hrefLang?: string | undefined;
318
- htmlFor?: string | undefined;
319
- httpEquiv?: string | undefined;
320
- integrity?: string | undefined;
321
- keyParams?: string | undefined;
322
- keyType?: string | undefined;
323
- kind?: string | undefined;
324
- label?: string | undefined;
325
- loop?: boolean | undefined;
326
- low?: number | undefined;
327
- manifest?: string | undefined;
328
- marginHeight?: number | undefined;
329
- marginWidth?: number | undefined;
330
- max?: string | number | undefined;
331
- maxLength?: number | undefined;
332
- media?: string | undefined;
333
- mediaGroup?: string | undefined;
334
- method?: string | undefined;
335
- min?: string | number | undefined;
336
- minLength?: number | undefined;
337
- multiple?: boolean | undefined;
338
- muted?: boolean | undefined;
339
- name?: string | undefined;
340
- noValidate?: boolean | undefined;
341
- open?: boolean | undefined;
342
- optimum?: number | undefined;
343
- pattern?: string | undefined;
344
- placeholder?: string | undefined;
345
- playsInline?: boolean | undefined;
346
- poster?: string | undefined;
347
- preload?: string | undefined;
348
- readOnly?: boolean | undefined;
349
- required?: boolean | undefined;
350
- reversed?: boolean | undefined;
351
- rows?: number | undefined;
352
- rowSpan?: number | undefined;
353
- sandbox?: string | undefined;
354
- scope?: string | undefined;
355
- scoped?: boolean | undefined;
356
- scrolling?: string | undefined;
357
- seamless?: boolean | undefined;
358
- selected?: boolean | undefined;
359
- shape?: string | undefined;
360
- size?: number | undefined;
361
- sizes?: string | undefined;
362
- span?: number | undefined;
363
- src?: string | undefined;
364
- srcDoc?: string | undefined;
365
- srcLang?: string | undefined;
366
- srcSet?: string | undefined;
367
- start?: number | undefined;
368
- step?: string | number | undefined;
369
- summary?: string | undefined;
370
- target?: string | undefined;
371
- type?: string | undefined;
372
- useMap?: string | undefined;
308
+ formEncType?: string | undefined | undefined;
309
+ formMethod?: string | undefined | undefined;
310
+ formNoValidate?: boolean | undefined | undefined;
311
+ formTarget?: string | undefined | undefined;
312
+ frameBorder?: number | string | undefined | undefined;
313
+ headers?: string | undefined | undefined;
314
+ height?: number | string | undefined | undefined;
315
+ high?: number | undefined | undefined;
316
+ href?: string | undefined | undefined;
317
+ hrefLang?: string | undefined | undefined;
318
+ htmlFor?: string | undefined | undefined;
319
+ httpEquiv?: string | undefined | undefined;
320
+ integrity?: string | undefined | undefined;
321
+ keyParams?: string | undefined | undefined;
322
+ keyType?: string | undefined | undefined;
323
+ kind?: string | undefined | undefined;
324
+ label?: string | undefined | undefined;
325
+ loop?: boolean | undefined | undefined;
326
+ low?: number | undefined | undefined;
327
+ manifest?: string | undefined | undefined;
328
+ marginHeight?: number | undefined | undefined;
329
+ marginWidth?: number | undefined | undefined;
330
+ max?: number | string | undefined | undefined;
331
+ maxLength?: number | undefined | undefined;
332
+ media?: string | undefined | undefined;
333
+ mediaGroup?: string | undefined | undefined;
334
+ method?: string | undefined | undefined;
335
+ min?: number | string | undefined | undefined;
336
+ minLength?: number | undefined | undefined;
337
+ multiple?: boolean | undefined | undefined;
338
+ muted?: boolean | undefined | undefined;
339
+ name?: string | undefined | undefined;
340
+ noValidate?: boolean | undefined | undefined;
341
+ open?: boolean | undefined | undefined;
342
+ optimum?: number | undefined | undefined;
343
+ pattern?: string | undefined | undefined;
344
+ placeholder?: string | undefined | undefined;
345
+ playsInline?: boolean | undefined | undefined;
346
+ poster?: string | undefined | undefined;
347
+ preload?: string | undefined | undefined;
348
+ readOnly?: boolean | undefined | undefined;
349
+ required?: boolean | undefined | undefined;
350
+ reversed?: boolean | undefined | undefined;
351
+ rows?: number | undefined | undefined;
352
+ rowSpan?: number | undefined | undefined;
353
+ sandbox?: string | undefined | undefined;
354
+ scope?: string | undefined | undefined;
355
+ scoped?: boolean | undefined | undefined;
356
+ scrolling?: string | undefined | undefined;
357
+ seamless?: boolean | undefined | undefined;
358
+ selected?: boolean | undefined | undefined;
359
+ shape?: string | undefined | undefined;
360
+ size?: number | undefined | undefined;
361
+ sizes?: string | undefined | undefined;
362
+ span?: number | undefined | undefined;
363
+ src?: string | undefined | undefined;
364
+ srcDoc?: string | undefined | undefined;
365
+ srcLang?: string | undefined | undefined;
366
+ srcSet?: string | undefined | undefined;
367
+ start?: number | undefined | undefined;
368
+ step?: number | string | undefined | undefined;
369
+ summary?: string | undefined | undefined;
370
+ target?: string | undefined | undefined;
371
+ type?: string | undefined | undefined;
372
+ useMap?: string | undefined | undefined;
373
373
  value?: string | number | readonly string[] | undefined;
374
- width?: string | number | undefined;
375
- wmode?: string | undefined;
376
- wrap?: string | undefined;
374
+ width?: number | string | undefined | undefined;
375
+ wmode?: string | undefined | undefined;
376
+ wrap?: string | undefined | undefined;
377
377
  }, never>>;
378
378
  xstyledProps: import("@elliemae/ds-props-helpers").XstyledProps;
379
379
  };
package/dist/types/styled.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { Theme } from '@elliemae/ds-system';
2
- import type { DSImageT } from './react-desc-prop-types.js';
3
2
  import type { XstyledProps } from '@elliemae/ds-props-helpers';
3
+ import type { DSImageT } from './react-desc-prop-types.js';
4
4
  export declare const StyledWrapper: import("styled-components").StyledComponent<"img", Theme, {
5
- size?: DSImageT.SizeType | undefined;
5
+ size?: DSImageT.SizeType;
6
6
  } & XstyledProps & import("@elliemae/ds-system").OwnerInterface & import("@elliemae/ds-system").InnerRefInterface<"img">, never>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-image",
3
- "version": "3.52.1",
3
+ "version": "3.53.0-alpha.2",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Image",
6
6
  "files": [
@@ -37,13 +37,14 @@
37
37
  },
38
38
  "dependencies": {
39
39
  "@xstyled/system": "~3.7.3",
40
- "@elliemae/ds-props-helpers": "3.52.1",
41
- "@elliemae/ds-system": "3.52.1"
40
+ "@elliemae/ds-props-helpers": "3.53.0-alpha.2",
41
+ "@elliemae/ds-system": "3.53.0-alpha.2"
42
42
  },
43
43
  "devDependencies": {
44
- "@elliemae/pui-cli": "9.0.0-next.63",
44
+ "@elliemae/pui-cli": "9.0.0-next.65",
45
45
  "jest": "~29.7.0",
46
- "@elliemae/ds-monorepo-devops": "3.52.1"
46
+ "@elliemae/ds-monorepo-devops": "3.53.0-alpha.2",
47
+ "@elliemae/ds-test-utils": "3.53.0-alpha.2"
47
48
  },
48
49
  "peerDependencies": {
49
50
  "react": "^18.3.1",