@eyesee/ui-components 0.12.0 → 0.14.0

package/dist/components/icons-v2/ArrowsMaximizeIcon.d.ts

@@ -0,0 +1,123 @@
+/**
+ * @callback ArrowsMaximizeIconClickHandler
+ * @returns {void}
+ */
+/**
+ * Shared {@link IconProps} for this icon. All optional.
+ *
+ * @typedef {object} ArrowsMaximizeIconProps
+ *
+ * @property {import('./constants').IconSize} [iconSize='m']
+ *   T-shirt size token. Controls `width`/`height` and stroke width. Default `'m'`.
+ * @property {ArrowsMaximizeIconClickHandler} [onClick=null]
+ *   Click handler. When set the icon is clickable. Default `null`.
+ * @property {string} [fill='none']
+ *   SVG fill colour. Default `'none'`.
+ * @property {string} [strokeColor='currentColor']
+ *   SVG stroke colour. Accepts any valid CSS colour. Default `'currentColor'`.
+ * @property {string} [strokeColorOnHover]
+ *   Stroke colour applied on hover.
+ * @property {string} [fillOnHover]
+ *   Fill colour applied on hover.
+ * @property {boolean} [disabled]
+ *   Applies disabled colour tokens and ignores clicks.
+ * @property {boolean} [animated=false]
+ *   When `true`, applies the spinner animation class. Default `false`.
+ * @property {number} [viewBoxSize]
+ *   Custom viewBox size for icons that are not 32×32. Sets `0 0 {n} {n}`.
+ *
+ * @see {@link IconProps}
+ */
+/**
+ * SVG arrows maximize icon (four arrows pointing outwards to the corners)
+ * used for expand, enlarge, or maximize actions.
+ *
+ * ## Props
+ *
+ * All optional.
+ *
+ * **iconSize** `'s' | 'm' | 'l' | 'xl' | 'xxl' | '4xl'` — default `'m'`
+ * T-shirt size token. Controls `width`/`height` and stroke width.
+ *
+ * **onClick** `() => void` — default `null`
+ * Click handler. When set the icon is clickable.
+ *
+ * **fill** `string` — default `'none'`
+ * SVG fill colour.
+ *
+ * **strokeColor** `string` — default `'currentColor'`
+ * SVG stroke colour. Accepts any valid CSS colour.
+ *
+ * **strokeColorOnHover** `string` — no default
+ * Stroke colour applied on hover.
+ *
+ * **fillOnHover** `string` — no default
+ * Fill colour applied on hover.
+ *
+ * **disabled** `boolean` — no default
+ * Applies disabled colour tokens and ignores clicks.
+ *
+ * **animated** `boolean` — default `false`
+ * When `true`, applies the spinner animation class.
+ *
+ * **viewBoxSize** `number` — no default
+ * Custom viewBox size for icons that are not 32×32. Omit → `0 0 32 32`.
+ *
+ * @param {ArrowsMaximizeIconProps} props
+ * @returns {import('react').ReactElement}
+ *
+ * @example <caption>Playground</caption>
+ * import { ArrowsMaximizeIcon } from '@eyesee/ui-components/icons';
+ *
+ * <ArrowsMaximizeIcon iconSize="m" strokeColor="#333333" fill="none" />
+ *
+ * @example <caption>Gallery</caption>
+ * import { ArrowsMaximizeIcon } from '@eyesee/ui-components/icons';
+ *
+ * <ArrowsMaximizeIcon iconSize="s" strokeColor="#333333" fill="none" />
+ * <ArrowsMaximizeIcon iconSize="m" strokeColor="#333333" fill="none" />
+ * <ArrowsMaximizeIcon iconSize="l" strokeColor="#333333" fill="none" />
+ */
+export const ArrowsMaximizeIcon: (props: IconProps) => import("react").JSX.Element;
+export type ArrowsMaximizeIconClickHandler = () => void;
+/**
+ * Shared {@link IconProps} for this icon. All optional.
+ */
+export type ArrowsMaximizeIconProps = {
+    /**
+     * T-shirt size token. Controls `width`/`height` and stroke width. Default `'m'`.
+     */
+    iconSize?: import("./constants").IconSize;
+    /**
+     * Click handler. When set the icon is clickable. Default `null`.
+     */
+    onClick?: ArrowsMaximizeIconClickHandler;
+    /**
+     * SVG fill colour. Default `'none'`.
+     */
+    fill?: string;
+    /**
+     * SVG stroke colour. Accepts any valid CSS colour. Default `'currentColor'`.
+     */
+    strokeColor?: string;
+    /**
+     * Stroke colour applied on hover.
+     */
+    strokeColorOnHover?: string;
+    /**
+     * Fill colour applied on hover.
+     */
+    fillOnHover?: string;
+    /**
+     * Applies disabled colour tokens and ignores clicks.
+     */
+    disabled?: boolean;
+    /**
+     * When `true`, applies the spinner animation class. Default `false`.
+     */
+    animated?: boolean;
+    /**
+     * Custom viewBox size for icons that are not 32×32. Sets `0 0 {n} {n}`.
+     */
+    viewBoxSize?: number;
+};

package/dist/components/icons-v2/ArrowsMaximizeIcon.js

@@ -0,0 +1,15 @@
+import { jsx as e } from "react/jsx-runtime";
+import { createIcon as t } from "./createIcon.js";
+const i = t(({ strokeColor: o, strokeWidth: r }) => /* @__PURE__ */ e(
+  "path",
+  {
+    d: "M26.6667 10.6667V5.33333H21.3333M26.6667 5.33333L18.6667 13.3333M5.33333 21.3333V26.6667H10.6667M5.33333 26.6667L13.3333 18.6667M26.6667 21.3333V26.6667H21.3333M26.6667 26.6667L18.6667 18.6667M5.33333 10.6667V5.33333H10.6667M5.33333 5.33333L13.3333 13.3333",
+    stroke: o,
+    strokeWidth: r,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }
+));
+export {
+  i as ArrowsMaximizeIcon
+};

package/dist/components/icons-v2/EditImageIcon.d.ts

@@ -0,0 +1,13 @@
+/**
+ * SVG edit image icon.
+ *
+ * @param {object}    props
+ * @param {string}    [props.strokeColor='currentColor'] - SVG stroke colour.
+ *   Accepts any valid CSS colour value.
+ * @param {import('./constants').IconSize} [props.iconSize='m']
+ *   T-shirt size token that controls the rendered `width`/`height` and
+ *   `stroke-width` via {@link iconSizes} and {@link iconStrokeWidths}.
+ * @param {string}    [props.fill='none'] - SVG fill colour.
+ * @returns {JSX.Element}
+ */
+export const EditImageIcon: (props: IconProps) => import("react").JSX.Element;

package/dist/components/icons-v2/EditImageIcon.js

@@ -0,0 +1,15 @@
+import { jsx as r } from "react/jsx-runtime";
+import { createIcon as t } from "./createIcon.js";
+const L = t(({ strokeColor: C, strokeWidth: o }) => /* @__PURE__ */ r(
+  "path",
+  {
+    d: "M20.0002 10.6667H20.0135M14.6668 26.6667H9.3335C8.27263 26.6667 7.25521 26.2453 6.50507 25.4951C5.75492 24.745 5.3335 23.7276 5.3335 22.6667V9.33337C5.3335 8.27251 5.75492 7.25509 6.50507 6.50495C7.25521 5.7548 8.27263 5.33337 9.3335 5.33337H22.6668C23.7277 5.33337 24.7451 5.7548 25.4953 6.50495C26.2454 7.25509 26.6668 8.27251 26.6668 9.33337V14.6667M5.3335 20.0001L10.6668 14.6668C11.9042 13.4761 13.4295 13.4761 14.6668 14.6668L18.6668 18.6668L20.0002 17.3334C20.4135 16.9361 20.8588 16.6708 21.3162 16.5388M24.5602 20.8133C24.8202 20.5533 25.1289 20.3471 25.4686 20.2064C25.8083 20.0656 26.1724 19.9932 26.5402 19.9932C26.9079 19.9932 27.272 20.0656 27.6117 20.2064C27.9515 20.3471 28.2601 20.5533 28.5202 20.8133C28.7802 21.0734 28.9864 21.3821 29.1272 21.7218C29.2679 22.0615 29.3403 22.4256 29.3403 22.7933C29.3403 23.1611 29.2679 23.5252 29.1272 23.8649C28.9864 24.2046 28.7802 24.5133 28.5202 24.7733L24.0002 29.3333H20.0002V25.3333L24.5602 20.8133Z",
+    stroke: C,
+    strokeWidth: o,
+    strokeLinecap: "round",
+    strokeLinejoin: "round"
+  }
+));
+export {
+  L as EditImageIcon
+};

package/dist/components/icons-v2/ResizeIcon.d.ts

@@ -0,0 +1,123 @@
+/**
+ * @callback ResizeIconClickHandler
+ * @returns {void}
+ */
+/**
+ * Shared {@link IconProps} for this icon. All optional.
+ *
+ * @typedef {object} ResizeIconProps
+ *
+ * @property {import('./constants').IconSize} [iconSize='m']
+ *   T-shirt size token. Controls `width`/`height` and stroke width. Default `'m'`.
+ * @property {ResizeIconClickHandler} [onClick=null]
+ *   Click handler. When set the icon is clickable. Default `null`.
+ * @property {string} [fill='none']
+ *   SVG fill colour. Default `'none'`.
+ * @property {string} [strokeColor='currentColor']
+ *   SVG stroke colour. Accepts any valid CSS colour. Default `'currentColor'`.
+ * @property {string} [strokeColorOnHover]
+ *   Stroke colour applied on hover.
+ * @property {string} [fillOnHover]
+ *   Fill colour applied on hover.
+ * @property {boolean} [disabled]
+ *   Applies disabled colour tokens and ignores clicks.
+ * @property {boolean} [animated=false]
+ *   When `true`, applies the spinner animation class. Default `false`.
+ * @property {number} [viewBoxSize]
+ *   Custom viewBox size for icons that are not 32×32. Sets `0 0 {n} {n}`.
+ *
+ * @see {@link IconProps}
+ */
+/**
+ * SVG resize icon (rounded rectangle with horizontal and vertical double arrows)
+ * used for width and height dimension controls.
+ *
+ * ## Props
+ *
+ * All optional.
+ *
+ * **iconSize** `'s' | 'm' | 'l' | 'xl' | 'xxl' | '4xl'` — default `'m'`
+ * T-shirt size token. Controls `width`/`height` and stroke width.
+ *
+ * **onClick** `() => void` — default `null`
+ * Click handler. When set the icon is clickable.
+ *
+ * **fill** `string` — default `'none'`
+ * SVG fill colour.
+ *
+ * **strokeColor** `string` — default `'currentColor'`
+ * SVG stroke colour. Accepts any valid CSS colour.
+ *
+ * **strokeColorOnHover** `string` — no default
+ * Stroke colour applied on hover.
+ *
+ * **fillOnHover** `string` — no default
+ * Fill colour applied on hover.
+ *
+ * **disabled** `boolean` — no default
+ * Applies disabled colour tokens and ignores clicks.
+ *
+ * **animated** `boolean` — default `false`
+ * When `true`, applies the spinner animation class.
+ *
+ * **viewBoxSize** `number` — no default
+ * Custom viewBox size for icons that are not 32×32. Omit → `0 0 32 32`.
+ *
+ * @param {ResizeIconProps} props
+ * @returns {import('react').ReactElement}
+ *
+ * @example <caption>Playground</caption>
+ * import { ResizeIcon } from '@eyesee/ui-components/icons';
+ *
+ * <ResizeIcon iconSize="m" strokeColor="#333333" fill="none" />
+ *
+ * @example <caption>Gallery</caption>
+ * import { ResizeIcon } from '@eyesee/ui-components/icons';
+ *
+ * <ResizeIcon iconSize="s" strokeColor="#333333" fill="none" />
+ * <ResizeIcon iconSize="m" strokeColor="#333333" fill="none" />
+ * <ResizeIcon iconSize="l" strokeColor="#333333" fill="none" />
+ */
+export const ResizeIcon: (props: IconProps) => import("react").JSX.Element;
+export type ResizeIconClickHandler = () => void;
+/**
+ * Shared {@link IconProps} for this icon. All optional.
+ */
+export type ResizeIconProps = {
+    /**
+     * T-shirt size token. Controls `width`/`height` and stroke width. Default `'m'`.
+     */
+    iconSize?: import("./constants").IconSize;
+    /**
+     * Click handler. When set the icon is clickable. Default `null`.
+     */
+    onClick?: ResizeIconClickHandler;
+    /**
+     * SVG fill colour. Default `'none'`.
+     */
+    fill?: string;
+    /**
+     * SVG stroke colour. Accepts any valid CSS colour. Default `'currentColor'`.
+     */
+    strokeColor?: string;
+    /**
+     * Stroke colour applied on hover.
+     */
+    strokeColorOnHover?: string;
+    /**
+     * Fill colour applied on hover.
+     */
+    fillOnHover?: string;
+    /**
+     * Applies disabled colour tokens and ignores clicks.
+     */
+    disabled?: boolean;
+    /**
+     * When `true`, applies the spinner animation class. Default `false`.
+     */
+    animated?: boolean;
+    /**
+     * Custom viewBox size for icons that are not 32×32. Sets `0 0 {n} {n}`.
+     */
+    viewBoxSize?: number;
+};

package/dist/components/icons-v2/ResizeIcon.js

@@ -0,0 +1,77 @@
+import { jsxs as r, Fragment as L, jsx as o } from "react/jsx-runtime";
+import { createIcon as i } from "./createIcon.js";
+const d = i(({ strokeColor: n, strokeWidth: e }) => /* @__PURE__ */ r(L, { children: [
+  /* @__PURE__ */ o(
+    "path",
+    {
+      d: "M4 6.66667H18.6667",
+      stroke: n,
+      strokeWidth: e,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ o(
+    "path",
+    {
+      d: "M16 9.33333L18.6667 6.66667L16 4",
+      stroke: n,
+      strokeWidth: e,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ o(
+    "path",
+    {
+      d: "M6.66667 4L4 6.66667L6.66667 9.33333",
+      stroke: n,
+      strokeWidth: e,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ o(
+    "path",
+    {
+      d: "M25.3333 13.3333V28",
+      stroke: n,
+      strokeWidth: e,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ o(
+    "path",
+    {
+      d: "M22.6667 25.3333L25.3333 28L28 25.3333",
+      stroke: n,
+      strokeWidth: e,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ o(
+    "path",
+    {
+      d: "M28 16L25.3333 13.3333L22.6667 16",
+      stroke: n,
+      strokeWidth: e,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ),
+  /* @__PURE__ */ o(
+    "path",
+    {
+      d: "M4 16C4 15.2928 4.28095 14.6145 4.78105 14.1144C5.28115 13.6143 5.95942 13.3333 6.66667 13.3333H16C16.7072 13.3333 17.3855 13.6143 17.8856 14.1144C18.3857 14.6145 18.6667 15.2928 18.6667 16V25.3333C18.6667 26.0406 18.3857 26.7189 17.8856 27.219C17.3855 27.719 16.7072 28 16 28H6.66667C5.95942 28 5.28115 27.719 4.78105 27.219C4.28095 26.7189 4 26.0406 4 25.3333V16Z",
+      stroke: n,
+      strokeWidth: e,
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  )
+] }));
+export {
+  d as ResizeIcon
+};

package/dist/components/icons-v2/index.d.ts

@@ -41,6 +41,7 @@ export { AttributesEvaluationIcon } from "./AttributesEvaluationIcon";
 export { ArrowUpIcon } from "./ArrowUpIcon";
 export { ArrowRightIcon } from "./ArrowRightIcon";
 export { ArrowMoveDownIcon } from "./ArrowMoveDownIcon";
+export { ArrowsMaximizeIcon } from "./ArrowsMaximizeIcon";
 export { ChartbarIcon } from "./ChartbarIcon";
 export { ChartbarOffIcon } from "./ChartbarOffIcon";
 export { ChatbotIcon } from "./ChatbotIcon";
@@ -155,6 +156,7 @@ export { RefreshIcon } from "./RefreshIcon";
 export { RefreshAlertIcon } from "./RefreshAlertIcon";
 export { ReplaceIcon } from "./ReplaceIcon";
 export { ReplyIcon } from "./ReplyIcon";
+export { ResizeIcon } from "./ResizeIcon";
 export { ScalesIcon } from "./ScalesIcon";
 export { SearchIcon } from "./SearchIcon";
 export { SendIcon } from "./SendIcon";
@@ -210,3 +212,5 @@ export { RectanglesAddIcon } from "./RectanglesAddIcon";
 export { ColumnIcon } from "./ColumnIcon";
 export { ListCheckIcon } from "./ListCheckIcon";
 export { ImagesIcon } from "./ImagesIcon";
+export { EditImageIcon } from "./EditImageIcon";
+export { AddImageIcon } from "./AddImageIcon";