@elliemae/ds-image 3.55.0-next.6 → 3.55.0-next.7
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 +7 -2
- package/dist/cjs/styled.js.map +2 -2
- package/dist/esm/styled.js +7 -2
- package/dist/esm/styled.js.map +2 -2
- package/dist/types/styled.d.ts +1 -1
- package/package.json +5 -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
|
-
}
|
|
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
|
-
}
|
|
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';\
|
|
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 { 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
|
-
}
|
|
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
|
-
}
|
|
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';\
|
|
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 { 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/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
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.55.0-next.
|
|
3
|
+
"version": "3.55.0-next.7",
|
|
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.55.0-next.
|
|
41
|
-
"@elliemae/ds-system": "3.55.0-next.
|
|
40
|
+
"@elliemae/ds-props-helpers": "3.55.0-next.7",
|
|
41
|
+
"@elliemae/ds-system": "3.55.0-next.7"
|
|
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.55.0-next.
|
|
47
|
-
"@elliemae/ds-test-utils": "3.55.0-next.
|
|
46
|
+
"@elliemae/ds-monorepo-devops": "3.55.0-next.7",
|
|
47
|
+
"@elliemae/ds-test-utils": "3.55.0-next.7"
|
|
48
48
|
},
|
|
49
49
|
"peerDependencies": {
|
|
50
50
|
"react": "^18.3.1",
|