@elliemae/ds-image 3.55.0-next.9 → 3.56.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/cjs/styled.js
CHANGED
|
@@ -108,7 +108,6 @@ 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 "";
|
|
112
111
|
}};
|
|
113
112
|
|
|
114
113
|
${({ width, theme }) => {
|
|
@@ -116,8 +115,7 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
|
|
|
116
115
|
return `
|
|
117
116
|
width: ${width};
|
|
118
117
|
`;
|
|
119
|
-
}
|
|
120
|
-
if (typeof width === "number") {
|
|
118
|
+
} else if (typeof width === "number") {
|
|
121
119
|
return `
|
|
122
120
|
width: ${width / 16}rem;
|
|
123
121
|
@media (min-width: ${theme.breakpoints?.small}) {
|
|
@@ -125,7 +123,6 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
|
|
|
125
123
|
}
|
|
126
124
|
`;
|
|
127
125
|
}
|
|
128
|
-
return "";
|
|
129
126
|
}}
|
|
130
127
|
|
|
131
128
|
${({ height, theme }) => {
|
|
@@ -133,8 +130,7 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
|
|
|
133
130
|
return `
|
|
134
131
|
height: ${height};
|
|
135
132
|
`;
|
|
136
|
-
}
|
|
137
|
-
if (typeof height === "number") {
|
|
133
|
+
} else if (typeof height === "number") {
|
|
138
134
|
return `
|
|
139
135
|
height: ${height / 16}rem;
|
|
140
136
|
@media (min-width: ${theme.breakpoints?.small}) {
|
|
@@ -142,7 +138,6 @@ const StyledWrapper = (0, import_ds_system.styled)("img", { name: import_constan
|
|
|
142
138
|
}
|
|
143
139
|
`;
|
|
144
140
|
}
|
|
145
|
-
return "";
|
|
146
141
|
}}
|
|
147
142
|
`;
|
|
148
143
|
//# 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 {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAAoD;
|
|
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;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styled.js
CHANGED
|
@@ -75,7 +75,6 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
|
|
|
75
75
|
|
|
76
76
|
${({ size }) => {
|
|
77
77
|
if (size) return getSize(size);
|
|
78
|
-
return "";
|
|
79
78
|
}};
|
|
80
79
|
|
|
81
80
|
${({ width, theme }) => {
|
|
@@ -83,8 +82,7 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
|
|
|
83
82
|
return `
|
|
84
83
|
width: ${width};
|
|
85
84
|
`;
|
|
86
|
-
}
|
|
87
|
-
if (typeof width === "number") {
|
|
85
|
+
} else if (typeof width === "number") {
|
|
88
86
|
return `
|
|
89
87
|
width: ${width / 16}rem;
|
|
90
88
|
@media (min-width: ${theme.breakpoints?.small}) {
|
|
@@ -92,7 +90,6 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
|
|
|
92
90
|
}
|
|
93
91
|
`;
|
|
94
92
|
}
|
|
95
|
-
return "";
|
|
96
93
|
}}
|
|
97
94
|
|
|
98
95
|
${({ height, theme }) => {
|
|
@@ -100,8 +97,7 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
|
|
|
100
97
|
return `
|
|
101
98
|
height: ${height};
|
|
102
99
|
`;
|
|
103
|
-
}
|
|
104
|
-
if (typeof height === "number") {
|
|
100
|
+
} else if (typeof height === "number") {
|
|
105
101
|
return `
|
|
106
102
|
height: ${height / 16}rem;
|
|
107
103
|
@media (min-width: ${theme.breakpoints?.small}) {
|
|
@@ -109,7 +105,6 @@ const StyledWrapper = styled("img", { name: DSImageName, slot: IMAGE_SLOTS.ROOT
|
|
|
109
105
|
}
|
|
110
106
|
`;
|
|
111
107
|
}
|
|
112
|
-
return "";
|
|
113
108
|
}}
|
|
114
109
|
`;
|
|
115
110
|
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 {
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,oBAAoB,KAAK,QAAQ,UAAU;
|
|
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;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -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.
|
|
87
|
+
onBeforeInput?: React.FormEventHandler<Element> | undefined;
|
|
88
88
|
onBeforeInputCapture?: React.FormEventHandler<Element> | undefined;
|
|
89
89
|
onInput?: React.FormEventHandler<Element> | undefined;
|
|
90
90
|
onInputCapture?: React.FormEventHandler<Element> | undefined;
|
package/dist/types/styled.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { Theme } from '@elliemae/ds-system';
|
|
2
|
-
import type { XstyledProps } from '@elliemae/ds-props-helpers';
|
|
3
2
|
import type { DSImageT } from './react-desc-prop-types.js';
|
|
3
|
+
import type { XstyledProps } from '@elliemae/ds-props-helpers';
|
|
4
4
|
export declare const StyledWrapper: import("styled-components").StyledComponent<"img", Theme, {
|
|
5
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.
|
|
3
|
+
"version": "3.56.0-rc.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Image",
|
|
6
6
|
"files": [
|
|
@@ -37,14 +37,14 @@
|
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@xstyled/system": "~3.7.3",
|
|
40
|
-
"@elliemae/ds-props-helpers": "3.
|
|
41
|
-
"@elliemae/ds-system": "3.
|
|
40
|
+
"@elliemae/ds-props-helpers": "3.56.0-rc.1",
|
|
41
|
+
"@elliemae/ds-system": "3.56.0-rc.1"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"@elliemae/pui-cli": "9.0.0-next.65",
|
|
45
45
|
"jest": "~29.7.0",
|
|
46
|
-
"@elliemae/ds-monorepo-devops": "3.
|
|
47
|
-
"@elliemae/ds-test-utils": "3.
|
|
46
|
+
"@elliemae/ds-monorepo-devops": "3.56.0-rc.1",
|
|
47
|
+
"@elliemae/ds-test-utils": "3.56.0-rc.1"
|
|
48
48
|
},
|
|
49
49
|
"peerDependencies": {
|
|
50
50
|
"react": "^18.3.1",
|