@emeraldemperaur/vector-sigma 1.4.47 → 1.4.48

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 (4) hide show
  1. package/lib/index.cjs +12 -8
  2. package/lib/index.esm.js +12 -8
  3. package/lib/types/components/image/image.d.ts +0 -2
  4. package/package.json +1 -1
package/lib/index.cjs CHANGED
@@ -32044,26 +32044,30 @@ const getStyles = (design, layout) => {
32044
32044
  border: '1px solid var(--gray-6)',
32045
32045
  };
32046
32046
  }
32047
- return Object.assign(Object.assign({ borderRadius }, visualStyles), { position: 'relative', overflow: 'hidden', display: 'block' });
32047
+ return Object.assign(Object.assign({ borderRadius }, visualStyles), { overflow: 'hidden', display: 'block' });
32048
32048
  };
32049
- const ImageOutput = ({ id, src, alt = "Image", design = 'outline', layout = 'normal', aspectratio = 16 / 9, height, width = '100%', className, style, onClick, }) => {
32049
+ const ImageOutput = ({ id, src, alt = "Image", design = 'outline', layout = 'normal', aspectratio, height, width = '100%', className, style, onClick, }) => {
32050
32050
  const containerStyles = getStyles(design, layout);
32051
32051
  const iconColor = design === 'neumorphic' ? '#555' : 'var(--gray-9)';
32052
- const content = (React.createElement(p$8, { className: className, style: Object.assign(Object.assign(Object.assign({}, containerStyles), { width: '100%', height: height || '100%' }), style), onClick: onClick }, src ? (React.createElement("img", { id: String(id), src: src, alt: alt, style: {
32052
+ const content = (React.createElement(p$8, { className: className, style: Object.assign(Object.assign(Object.assign({}, containerStyles), { width: '100%', maxWidth: 500, maxHeight: 500, height: height || 'auto' }), style), onClick: onClick }, src ? (React.createElement("img", { id: String(id), src: src, alt: alt, style: {
32053
32053
  width: '100%',
32054
- height: '100%',
32055
- objectFit: 'cover',
32054
+ maxHeight: 500,
32055
+ height: height ? '100%' : 'auto',
32056
+ objectFit: 'contain',
32056
32057
  display: 'block',
32057
32058
  } })) : (React.createElement(p$5, { align: "center", justify: "center", style: {
32058
32059
  width: '100%',
32059
- height: '100%',
32060
+ height: height || '150px',
32060
32061
  backgroundColor: design === 'neumorphic' ? 'transparent' : 'var(--gray-3)',
32061
- minHeight: height || '100%',
32062
32062
  } },
32063
32063
  React.createElement(p$5, { direction: "column", align: "center", gap: "2" },
32064
32064
  React.createElement(Icon, { name: 'image', width: "32", height: "32", color: iconColor, style: { opacity: 0.5 } }),
32065
32065
  React.createElement(p$d, { size: "1", color: "gray" }, "No Image"))))));
32066
- return (React.createElement(p$8, { style: { width, maxWidth: 500, maxHeight: 500 } }, height ? (content) : (React.createElement(i$9, { ratio: aspectratio }, content))));
32066
+ if (aspectratio && !height) {
32067
+ return (React.createElement(p$8, { style: { width, maxWidth: 500 } },
32068
+ React.createElement(i$9, { ratio: aspectratio }, content)));
32069
+ }
32070
+ return (React.createElement(p$8, { style: { width, maxWidth: 500 } }, content));
32067
32071
  };
32068
32072
 
32069
32073
  const Input$1 = (_a) => {
package/lib/index.esm.js CHANGED
@@ -32023,26 +32023,30 @@ const getStyles = (design, layout) => {
32023
32023
  border: '1px solid var(--gray-6)',
32024
32024
  };
32025
32025
  }
32026
- return Object.assign(Object.assign({ borderRadius }, visualStyles), { position: 'relative', overflow: 'hidden', display: 'block' });
32026
+ return Object.assign(Object.assign({ borderRadius }, visualStyles), { overflow: 'hidden', display: 'block' });
32027
32027
  };
32028
- const ImageOutput = ({ id, src, alt = "Image", design = 'outline', layout = 'normal', aspectratio = 16 / 9, height, width = '100%', className, style, onClick, }) => {
32028
+ const ImageOutput = ({ id, src, alt = "Image", design = 'outline', layout = 'normal', aspectratio, height, width = '100%', className, style, onClick, }) => {
32029
32029
  const containerStyles = getStyles(design, layout);
32030
32030
  const iconColor = design === 'neumorphic' ? '#555' : 'var(--gray-9)';
32031
- const content = (React__default.createElement(p$8, { className: className, style: Object.assign(Object.assign(Object.assign({}, containerStyles), { width: '100%', height: height || '100%' }), style), onClick: onClick }, src ? (React__default.createElement("img", { id: String(id), src: src, alt: alt, style: {
32031
+ const content = (React__default.createElement(p$8, { className: className, style: Object.assign(Object.assign(Object.assign({}, containerStyles), { width: '100%', maxWidth: 500, maxHeight: 500, height: height || 'auto' }), style), onClick: onClick }, src ? (React__default.createElement("img", { id: String(id), src: src, alt: alt, style: {
32032
32032
  width: '100%',
32033
- height: '100%',
32034
- objectFit: 'cover',
32033
+ maxHeight: 500,
32034
+ height: height ? '100%' : 'auto',
32035
+ objectFit: 'contain',
32035
32036
  display: 'block',
32036
32037
  } })) : (React__default.createElement(p$5, { align: "center", justify: "center", style: {
32037
32038
  width: '100%',
32038
- height: '100%',
32039
+ height: height || '150px',
32039
32040
  backgroundColor: design === 'neumorphic' ? 'transparent' : 'var(--gray-3)',
32040
- minHeight: height || '100%',
32041
32041
  } },
32042
32042
  React__default.createElement(p$5, { direction: "column", align: "center", gap: "2" },
32043
32043
  React__default.createElement(Icon, { name: 'image', width: "32", height: "32", color: iconColor, style: { opacity: 0.5 } }),
32044
32044
  React__default.createElement(p$d, { size: "1", color: "gray" }, "No Image"))))));
32045
- return (React__default.createElement(p$8, { style: { width, maxWidth: 500, maxHeight: 500 } }, height ? (content) : (React__default.createElement(i$9, { ratio: aspectratio }, content))));
32045
+ if (aspectratio && !height) {
32046
+ return (React__default.createElement(p$8, { style: { width, maxWidth: 500 } },
32047
+ React__default.createElement(i$9, { ratio: aspectratio }, content)));
32048
+ }
32049
+ return (React__default.createElement(p$8, { style: { width, maxWidth: 500 } }, content));
32046
32050
  };
32047
32051
 
32048
32052
  const Input$1 = (_a) => {
package/lib/types/components/image/image.d.ts CHANGED
@@ -38,8 +38,6 @@ export interface ImageDisplayProps {
38
38
  layout?: ImageLayout & {};
39
39
  /**
40
40
  * * The aspect ratio of the ImageOutput component.
41
- * Default: 16 / 9
42
- * Variants: 16 / 9, 4 / 3, 1.
43
41
  * * @example
44
42
  * aspectratio={ 16 / 9 || 4 / 3 }
45
43
  */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@emeraldemperaur/vector-sigma",
3
- "version": "1.4.47",
3
+ "version": "1.4.48",
4
4
  "description": "Dynamic Form Orchestrator: NPM Package",
5
5
  "repository": {
6
6
  "type": "git",