@orangelogic/design-system 3.0.0 → 3.2.0

package/library/packages/types/src/menu-item.d.ts

@@ -3,6 +3,12 @@ export declare enum MenuItemCheckPlacement {
     Prefix = "prefix",
     Suffix = "suffix"
 }
+/** The ARIA roles a menu item can expose, i.e. the roles allowed as children of `role="menu"`. */
+export declare enum MenuItemRole {
+    Checkbox = "menuitemcheckbox",
+    Item = "menuitem",
+    Radio = "menuitemradio"
+}
 /** Values accepted by the `aria-current` attribute, indicating what kind of "current" item this represents within a set. */
 export declare enum AriaCurrentValue {
     Date = "date",
@@ -11,6 +17,11 @@ export declare enum AriaCurrentValue {
     Step = "step",
     Time = "time"
 }
+/** The kind of menu item to render. `Checkbox` is required before `checked` has any effect. */
+export declare enum MenuItemType {
+    Checkbox = "checkbox",
+    Normal = "normal"
+}
 /**
  * Interface for menu item data that can be shared between events and components
  * This breaks the circular dependency between events and atoms packages
@@ -37,7 +48,7 @@ export interface MenuItemData {
     /** The text content/label of the menu item */
     textContent?: string;
     /** The type of menu item */
-    type?: 'normal' | 'checkbox';
+    type?: MenuItemType;
     /** The value associated with the menu item */
     value?: string;
 }

package/library/packages/utils/src/custom-element/i18n.d.ts

@@ -315,9 +315,12 @@ export interface Translation extends DefaultTranslation {
     defaultWidth: string;
     definition: string;
     delete: string;
+    deleteAllTransitions: string;
     deleteColumn: string;
+    deleteOptions: string;
     deleteRow: string;
     deleteTable: string;
+    deleteTransition: string;
     deployStacks: string;
     descending: string;
     description: string;

package/library/packages/utils/src/transformation/transformation.d.ts

@@ -1,5 +1,12 @@
 import { Asset, Parameter, Transformation } from '../../../types/src/asset-link-format';
 
+/**
+ * Width ladder used for `srcset` candidates, in CSS pixels.
+ *
+ * Kept as a small fixed ladder rather than a per-item computed width so that many
+ * items sharing a display size resolve to the same URLs and stay CDN-cache friendly.
+ */
+export declare const SRCSET_WIDTH_LADDER: readonly [400, 800, 1200, 1600, 2400];
 export declare function buildTransformationString({ asset, baseUrl, extension, options, parameters, transformations, useSession, }: {
     asset?: Asset;
     baseUrl?: string;
@@ -19,3 +26,48 @@ export declare function buildTransformationString({ asset, baseUrl, extension, o
  * and merged into an existing `/t/`. Other URLs keep the plain append behavior.
  */
 export declare function applyTransformationsToUrl(url: string, transformations: Transformation[]): string;
+/**
+ * Inserts a width-only resize into an asset-link URL, preserving any transformations
+ * already present.
+ *
+ * `applyTransformationsToUrl` is deliberately not reused here: it *replaces* an existing
+ * `/t/` segment (dropping a configured crop/rotate/quality) and drops the prettyName tail
+ * when doing so. This function prepends the resize to an existing segment instead, so a
+ * user's configured transformations survive.
+ *
+ * Returns the URL unchanged when it is not an asset-link URL, so arbitrary external
+ * sources are never rewritten.
+ */
+export declare function applyWidthToAssetUrl(url: string, width: number): string;
+/**
+ * Whether the URL already carries a transformation segment.
+ *
+ * An existing `/t/` means a width was already chosen deliberately (a configured resize,
+ * crop or proxy format), so a ladder must not add a competing one.
+ */
+export declare function hasTransformSegment(url: string): boolean;
+/**
+ * Builds a `srcset` value for an asset-link URL by emitting one width-only resize
+ * candidate per ladder entry, letting the browser fetch and decode only the pixels
+ * the layout actually needs.
+ *
+ * Candidates wider than `maxWidth` are dropped so the backend is never asked to
+ * upscale past the asset's real dimensions. When `maxWidth` falls below the whole
+ * ladder, the smallest candidate is still emitted so a `srcset` is always produced
+ * for an eligible URL.
+ *
+ * Returns an empty string when the URL is not an asset link, or when it already carries
+ * a transformation — signalling the caller to omit the attribute and honour the width
+ * that was configured upstream.
+ */
+export declare function buildAssetSrcset(url: string, options?: {
+    maxWidth?: number;
+    widths?: readonly number[];
+}): string;
+/**
+ * Builds a `sizes` value from a known display width in CSS pixels.
+ *
+ * Rounded up to `step` so small layout changes (a resize that shifts a grid cell by a
+ * few pixels) do not produce a new value on every frame.
+ */
+export declare function buildSizesFromDisplayWidth(displayWidth: number, step?: number): string;

package/library/react-web-component.d.ts

@@ -213,6 +213,14 @@
           * Draws a circular icon button.
         */
         circle?: boolean;
+        /**
+          * Marks this button as a toggle control and reflects its state via `aria-pressed`. Leave unset for buttons that are not toggles (the default `role="button"` stays unchanged either way).
+        */
+        pressed?: boolean;
+        /**
+          * Overrides the button's tabindex (e.g. for a roving-tabindex toolbar). Leave unset to keep the default behavior: `0` when enabled, `-1` when `disabled` or `loading`. Attribute is `tab-index` (not the derived `tab-index-value`) to mirror the native `tabindex` attribute.
+        */
+        tabIndexValue?: number;
         /**
           * Make localization attributes reactive eslint-disable-next-line lit/no-native-attributes
         */
@@ -536,7 +544,11 @@
         /**
           * The type of menu item to render. To use `checked`, this value must be set to `checkbox`.
         */
-        type?: 'normal' | 'checkbox';
+        type?: 'checkbox' | 'normal';
+        /**
+          * Overrides the ARIA role derived from `type`. Use `menuitemradio` for a checkbox item that is one choice out of a set.
+        */
+        itemRole?: 'menuitemcheckbox' | 'menuitem' | 'menuitemradio';
         /**
           * The trigger type for the submenu.
         */
@@ -2503,6 +2515,14 @@
           * The path to the image to load.
         */
         src?: string;
+        /**
+          * Candidate sources for the underlying `img`, as a standard `srcset` value (e.g. `"…/re_w_400/img.jpg 400w, …/re_w_800/img.jpg 800w"`). <br/> Lets the browser fetch and decode only the pixels the layout needs, which is what bounds memory on image-heavy pages — a large original decodes to `naturalWidth × naturalHeight × 4` bytes regardless of its display size. Pair with `sizes`; without it the browser assumes the image is `100vw` wide.
+        */
+        srcset?: string;
+        /**
+          * The `sizes` attribute for the underlying `img`, describing the rendered width (e.g. `"400px"`). Only meaningful together with `srcset`.
+        */
+        sizes?: string;
         /**
           * The path to the placeholder image to be shown if src is not available.
         */
@@ -8027,6 +8047,10 @@
           * Total number of items in the dataset, including those not yet loaded. When set, the scroll container height is extended to reflect the full dataset size so the scrollbar is accurate from the first render. Unloaded slots are approximated as 1×1 items.
         */
         totalItems?: number;
+        /**
+          * Delay in milliseconds between releasing one row of images and the next. <br/> Images are held back until their row is released, so the browser opens roughly one row's worth of requests at a time instead of one per rendered item. Each transform URL is an uncached backend render, and enough of them in parallel returns 503. <br/> A row also waits for the previous row's images to finish (capped by `ROW_RELEASE_TIMEOUT`), so this is the floor between releases rather than the exact cadence. Set to `0` to disable gating and let every rendered row load immediately.
+        */
+        rowReleaseDelay?: number;
         /**
           * The show content type.
         */