gantri-components 2.258.0 → 2.260.0

package/dist/components/color-picker/color-picker.styles.d.ts

@@ -1,3 +1,5 @@
 /// <reference types="react" />
 export declare const StyledColorPicker: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const StyledColorList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const StyledColorList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $columns?: number | undefined;
+}>> & string;

package/dist/components/color-picker/color-picker.types.d.ts

@@ -4,6 +4,12 @@ import { ResolutionAwareProp } from '../../types/resolution-aware-prop.type';
 export type ColorPickerVariant = 'x-large' | 'large' | 'small';
 export type ColorPickerVariantProp = ResolutionAwareProp<ColorPickerVariant>;
 export interface ColorPickerProps extends Partial<ColorPickerDefaultProps> {
+    /**
+     * When set, render swatches in a CSS grid with this many columns; each swatch
+     * fills its column width. When omitted, swatches flow/wrap at their natural
+     * size (default).
+     */
+    columns?: number;
     labelText?: string;
     labelTx?: string;
     labelTxValues?: Record<string, unknown>;
@@ -25,6 +31,12 @@ export interface ColorPickerProps extends Partial<ColorPickerDefaultProps> {
 export interface ColorPickerDefaultProps {
     allowDeselecting: boolean;
     allowMultipleSelection: boolean;
+    /**
+     * When `true`, `disabled` colors collapse to a small centered dot (e.g. a
+     * "Creator's choice" view). When `false` (default) they keep their full size
+     * but stay non-selectable (e.g. an "All colors" view). The change animates.
+     */
+    collapseDisabled: boolean;
     /** List of colors to render. Defaults to Gantri's product colors list. */
     colors: ColorDetails[];
     /**

package/dist/components/color-picker/components/color-picker-item/color-picker-item.styles.d.ts

@@ -4,16 +4,15 @@ import { CSSProperties } from 'styled-components';
 import { ColorPickerVariantProp } from '../../color-picker.types';
 import { ProductColorCode } from '../../../../styles/theme';
 interface StyledColorOutlineProps {
+    $collapsed?: boolean;
     $disabled?: boolean;
+    $fillWidth?: boolean;
     $isClickable: boolean;
     $selected?: boolean;
     $size?: CSSProperties['width'];
     $variant?: ColorPickerVariantProp;
 }
 export declare const StyledColorOutline: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledColorOutlineProps>> & string;
-export declare const StyledDisabledDot: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    color: ProductColorCode;
-}>> & string;
 export declare const StyledColor: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react-spring").AnimatedProps<{
     hidden?: boolean | undefined;
     color?: string | undefined;
@@ -1133,6 +1132,7 @@ export declare const StyledColor: import("styled-components/dist/types").IStyled
     scrollLeft?: number | import("@react-spring/shared/dist/declarations/src/fluids").FluidValue<number, any> | undefined;
     viewBox?: string | import("@react-spring/shared/dist/declarations/src/fluids").FluidValue<string, any> | undefined;
 }, {
+    $collapsed?: boolean | undefined;
     color: ProductColorCode;
 }>> & string & Omit<import("react-spring").AnimatedComponent<"span">, keyof import("react").Component<any, {}, any>>;
 export {};

package/dist/components/color-picker/components/color-picker-item/color-picker-item.types.d.ts

@@ -2,9 +2,13 @@ import { CSSProperties } from 'styled-components';
 import { ColorDetails, ColorPickerVariantProp } from '../../color-picker.types';
 export interface ColorPickerItemProps extends Partial<ColorPickerItemDefaultProps> {
     active?: boolean;
+    /** When true (with `disabled`), collapse the swatch to a small centered dot. */
+    collapseDisabled?: boolean;
     color: ColorDetails;
-    /** Not selectable; rendered as a small centered dot. */
+    /** Not selectable. Collapses to a small centered dot when `collapseDisabled`. */
     disabled?: boolean;
+    /** When true, the swatch fills its container width (for grid layouts). */
+    fillWidth?: boolean;
     onColorClick?: (color: ColorDetails) => void;
     readOnly?: boolean;
     /** Overrides `variant`. */