@necto/image 1.0.1

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";var t,e=Object.defineProperty,i=Object.getOwnPropertyDescriptor,r=Object.getOwnPropertyNames,o=Object.prototype.hasOwnProperty,n={};((t,i)=>{for(var r in i)e(t,r,{get:i[r],enumerable:!0})})(n,{getImageSizes:()=>d,getImageStyle:()=>u,inferDimensions:()=>h,parseDimension:()=>s,transformProps:()=>g}),module.exports=(t=n,((t,n,a,c)=>{if(n&&"object"==typeof n||"function"==typeof n)for(let u of r(n))o.call(t,u)||u===a||e(t,u,{get:()=>n[u],enumerable:!(c=i(n,u))||c.enumerable});return t})(e({},"__esModule",{value:!0}),t));var a=require("@necto/dom"),c=require("@necto/url");function u({width:t,height:e,aspectRatio:i,layout:r,objectFit:o,background:n}){const u={};return o&&(u["object-fit"]=o),(0,c.isUrl)(n)?(u["background-image"]=`url(${n})`,u["background-size"]="cover",u["background-repeat"]="no-repeat"):n&&(u.background=n),"fixed"===r?(void 0!==t&&(u.width=(0,a.toPx)(t)),void 0!==e&&(u.height=(0,a.toPx)(e))):"constrained"===r?(u.width="100%",void 0!==t&&(u["max-width"]=(0,a.toPx)(t)),void 0!==e&&(u["max-height"]=(0,a.toPx)(e)),i&&(u["aspect-ratio"]=String(i))):"fullWidth"===r&&(u.width="100%",void 0!==e&&(u.height=(0,a.toPx)(e)),i&&(u["aspect-ratio"]=String(i))),Object.keys(u).length>0?u:void 0}function d(t,e){if(t&&e)switch(e){case"constrained":return`(min-width: ${t}px) ${t}px, 100vw`;case"fixed":return`${t}px`;case"fullWidth":return"100vw";default:return}}function s(t){if(void 0===t)return;if("number"==typeof t)return t;const e=Number.parseInt(t,10);return Number.isNaN(e)?void 0:e}function h(t){let e=s(t.width),i=s(t.height);return t.aspectRatio&&(e&&!i?i=Math.round(e/t.aspectRatio):i&&!e&&(e=Math.round(i*t.aspectRatio))),{width:e,height:i}}function g(t){const{src:e,width:i,height:r,aspectRatio:o,layout:n,priority:a=!1,background:c,objectFit:d,unstyled:s=!1}=t,h={src:e,loading:a?"eager":"lazy",decoding:a?"sync":"async",fetchpriority:a?"high":void 0};if(!s){const t=u({width:i,height:r,aspectRatio:o,layout:n,objectFit:d,background:c});t&&(h.style=t)}return"fixed"===n&&(h.width=i,h.height=r),h}

package/dist/index.d.cts

@@ -0,0 +1,98 @@
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** CSS properties object */
+type CSSProperties = Record<string, string>;
+/** Options for generating image styles */
+interface StyleOptions {
+    width?: number | string;
+    height?: number | string;
+    aspectRatio?: number;
+    layout?: ImageLayout;
+    objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+    background?: string;
+}
+type ImageStyleProps = StyleOptions;
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** HTML image element attributes (output of transform) */
+interface ImageAttributes {
+    src?: string;
+    srcset?: string;
+    sizes?: string;
+    width?: number | string;
+    height?: number | string;
+    alt?: string;
+    loading?: 'lazy' | 'eager';
+    decoding?: 'sync' | 'async' | 'auto';
+    fetchpriority?: 'high' | 'low' | 'auto';
+    style?: CSSProperties;
+}
+/** Image layout mode */
+type ImageLayout = 'fixed' | 'constrained' | 'fullWidth';
+/** CSS object-fit mode */
+type ObjectFit = 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+/** Options for the transform function */
+interface TransformOptions {
+    src: string;
+    width?: number | string;
+    height?: number | string;
+    aspectRatio?: number;
+    layout?: ImageLayout;
+    priority?: boolean;
+    background?: string;
+    objectFit?: ObjectFit;
+    unstyled?: boolean;
+}
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** Generates CSS styles for an image based on layout */
+declare function getImageStyle({ width, height, aspectRatio, layout, objectFit, background }: StyleOptions): CSSProperties | undefined;
+/** Generates the HTML sizes attribute for responsive images */
+declare function getImageSizes(width?: number, layout?: ImageLayout): string | undefined;
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/** Parses a dimension value to a number */
+declare function parseDimension(value: number | string | undefined): number | undefined;
+/** Infers width/height from props and aspect ratio */
+declare function inferDimensions(props: {
+    width?: number | string;
+    height?: number | string;
+    aspectRatio?: number;
+}): {
+    width?: number;
+    height?: number;
+};
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** Transforms image props into img element attributes */
+declare function transformProps(props: TransformOptions): ImageAttributes;
+
+export { type CSSProperties, type ImageAttributes, type ImageLayout, type ImageStyleProps, type ObjectFit, type StyleOptions, type TransformOptions, getImageSizes, getImageStyle, inferDimensions, parseDimension, transformProps };

package/dist/index.d.ts

@@ -0,0 +1,98 @@
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** CSS properties object */
+type CSSProperties = Record<string, string>;
+/** Options for generating image styles */
+interface StyleOptions {
+    width?: number | string;
+    height?: number | string;
+    aspectRatio?: number;
+    layout?: ImageLayout;
+    objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+    background?: string;
+}
+type ImageStyleProps = StyleOptions;
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** HTML image element attributes (output of transform) */
+interface ImageAttributes {
+    src?: string;
+    srcset?: string;
+    sizes?: string;
+    width?: number | string;
+    height?: number | string;
+    alt?: string;
+    loading?: 'lazy' | 'eager';
+    decoding?: 'sync' | 'async' | 'auto';
+    fetchpriority?: 'high' | 'low' | 'auto';
+    style?: CSSProperties;
+}
+/** Image layout mode */
+type ImageLayout = 'fixed' | 'constrained' | 'fullWidth';
+/** CSS object-fit mode */
+type ObjectFit = 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
+/** Options for the transform function */
+interface TransformOptions {
+    src: string;
+    width?: number | string;
+    height?: number | string;
+    aspectRatio?: number;
+    layout?: ImageLayout;
+    priority?: boolean;
+    background?: string;
+    objectFit?: ObjectFit;
+    unstyled?: boolean;
+}
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** Generates CSS styles for an image based on layout */
+declare function getImageStyle({ width, height, aspectRatio, layout, objectFit, background }: StyleOptions): CSSProperties | undefined;
+/** Generates the HTML sizes attribute for responsive images */
+declare function getImageSizes(width?: number, layout?: ImageLayout): string | undefined;
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/** Parses a dimension value to a number */
+declare function parseDimension(value: number | string | undefined): number | undefined;
+/** Infers width/height from props and aspect ratio */
+declare function inferDimensions(props: {
+    width?: number | string;
+    height?: number | string;
+    aspectRatio?: number;
+}): {
+    width?: number;
+    height?: number;
+};
+
+/**
+ * Copyright (c) Corinvo, LLC. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+/** Transforms image props into img element attributes */
+declare function transformProps(props: TransformOptions): ImageAttributes;
+
+export { type CSSProperties, type ImageAttributes, type ImageLayout, type ImageStyleProps, type ObjectFit, type StyleOptions, type TransformOptions, getImageSizes, getImageStyle, inferDimensions, parseDimension, transformProps };

package/dist/index.mjs

@@ -0,0 +1 @@
+import{toPx as t}from"@necto/dom";import{isUrl as i}from"@necto/url";function e({width:e,height:o,aspectRatio:r,layout:n,objectFit:a,background:c}){const d={};return a&&(d["object-fit"]=a),i(c)?(d["background-image"]=`url(${c})`,d["background-size"]="cover",d["background-repeat"]="no-repeat"):c&&(d.background=c),"fixed"===n?(void 0!==e&&(d.width=t(e)),void 0!==o&&(d.height=t(o))):"constrained"===n?(d.width="100%",void 0!==e&&(d["max-width"]=t(e)),void 0!==o&&(d["max-height"]=t(o)),r&&(d["aspect-ratio"]=String(r))):"fullWidth"===n&&(d.width="100%",void 0!==o&&(d.height=t(o)),r&&(d["aspect-ratio"]=String(r))),Object.keys(d).length>0?d:void 0}function o(t,i){if(t&&i)switch(i){case"constrained":return`(min-width: ${t}px) ${t}px, 100vw`;case"fixed":return`${t}px`;case"fullWidth":return"100vw";default:return}}function r(t){if(void 0===t)return;if("number"==typeof t)return t;const i=Number.parseInt(t,10);return Number.isNaN(i)?void 0:i}function n(t){let i=r(t.width),e=r(t.height);return t.aspectRatio&&(i&&!e?e=Math.round(i/t.aspectRatio):e&&!i&&(i=Math.round(e*t.aspectRatio))),{width:i,height:e}}function a(t){const{src:i,width:o,height:r,aspectRatio:n,layout:a,priority:c=!1,background:d,objectFit:h,unstyled:u=!1}=t,s={src:i,loading:c?"eager":"lazy",decoding:c?"sync":"async",fetchpriority:c?"high":void 0};if(!u){const t=e({width:o,height:r,aspectRatio:n,layout:a,objectFit:h,background:d});t&&(s.style=t)}return"fixed"===a&&(s.width=o,s.height=r),s}export{o as getImageSizes,e as getImageStyle,n as inferDimensions,r as parseDimension,a as transformProps};

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@necto/image",
+  "version": "1.0.1",
+  "description": "Framework-agnostic image transformation utilities for CDN providers",
+  "scripts": {
+    "build": "tsup --minify terser"
+  },
+  "author": "Corinvo OSS Team",
+  "license": "MIT",
+  "dependencies": {
+    "@necto/dom": "workspace:*",
+    "@necto/url": "workspace:*"
+  },
+  "devDependencies": {
+    "@types/node": "^22.14.1",
+    "tsup": "^8.4.0"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    }
+  }
+}