@ethlete/components 0.1.0-next.6 → 0.1.0-next.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ethlete/components",
-  "version": "0.1.0-next.6",
+  "version": "0.1.0-next.8",
   "license": "MIT",
   "sideEffects": false,
   "peerDependencies": {

package/types/ethlete-components.d.ts

@@ -959,13 +959,8 @@ declare class GridItemDirective {
     currentRow: _angular_core.Signal<number>;
     currentColSpan: _angular_core.Signal<number>;
     currentRowSpan: _angular_core.Signal<number>;
-    hostStyles: {
-        remove: (tokens: string) => void;
-        removeMany: (tokens: string[]) => void;
-        has: (tokens: string) => boolean;
-        push: (tokens: string, signal: _angular_core.Signal<unknown>) => void;
-        pushMany: (map: Record<string, _angular_core.Signal<unknown>>) => void;
-    };
+    protected gridColumn: _angular_core.Signal<string>;
+    protected gridRow: _angular_core.Signal<string>;
     constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<GridItemDirective, never>;
     static ɵdir: _angular_core.ɵɵDirectiveDeclaration<GridItemDirective, "[etGridItem]", ["etGridItem"], { "itemId": { "alias": "itemId"; "required": true; "isSignal": true; }; "minColSpan": { "alias": "minColSpan"; "required": false; "isSignal": true; }; "maxColSpan": { "alias": "maxColSpan"; "required": false; "isSignal": true; }; "minRowSpan": { "alias": "minRowSpan"; "required": false; "isSignal": true; }; "maxRowSpan": { "alias": "maxRowSpan"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
@@ -980,13 +975,7 @@ declare class GridDragDirective {
     private renderer;
     private dragStartClient;
     private dragPixelOffset;
-    hostStyles: {
-        remove: (tokens: string) => void;
-        removeMany: (tokens: string[]) => void;
-        has: (tokens: string) => boolean;
-        push: (tokens: string, signal: _angular_core.Signal<unknown>) => void;
-        pushMany: (map: Record<string, _angular_core.Signal<unknown>>) => void;
-    };
+    protected dragTransform: _angular_core.Signal<string>;
     constructor();
     private applyFixed;
     private releaseFixed;
@@ -1015,6 +1004,10 @@ type GridConfig = {
     readonlyAriaLabel: string;
     dragHandleAriaLabel: string;
     transformer: (text: string, locale: string) => string;
+    /** Replaces the default drag handle for all registered items. Receives `data` and `itemId` as inputs. */
+    dragHandleComponent?: Type<unknown>;
+    /** Replaces the default ✕ button for all registered items. Receives `data` and `itemId` as inputs. */
+    actionsComponent?: Type<unknown>;
 };
 declare const provideGridConfig: (valueOverride?: Partial<GridConfig> | undefined) => _angular_core.Provider[];
 declare const injectGridConfig: {
@@ -1050,14 +1043,17 @@ declare class GridComponent {
     private ghostRef;
     private gridConfig;
     private locale;
+    protected isReadOnly: _angular_core.Signal<boolean>;
+    protected dragHandleComponent: _angular_core.Signal<_angular_core.Type<unknown> | undefined>;
+    protected actionsComponent: _angular_core.Signal<_angular_core.Type<unknown> | undefined>;
+    protected registeredItems: _angular_core.Signal<{
+        item: _ethlete_components.GridItemConfig;
+        reg: _ethlete_components.GridComponentRegistration;
+    }[]>;
     protected ariaLabel: _angular_core.Signal<string>;
-    hostStyles: {
-        remove: (tokens: string) => void;
-        removeMany: (tokens: string[]) => void;
-        has: (tokens: string) => boolean;
-        push: (tokens: string, signal: _angular_core.Signal<unknown>) => void;
-        pushMany: (map: Record<string, _angular_core.Signal<unknown>>) => void;
-    };
+    protected gridColumns: _angular_core.Signal<number>;
+    protected gridGap: _angular_core.Signal<string>;
+    protected gridRowHeight: _angular_core.Signal<string>;
     constructor();
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<GridComponent, never>;
     static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridComponent, "et-grid, [et-grid]", never, {}, {}, never, ["*"], true, [{ directive: typeof GridDirective; inputs: { "breakpoints": "breakpoints"; "rowHeight": "rowHeight"; "gap": "gap"; "initialItems": "initialItems"; "readOnly": "readOnly"; }; outputs: { "layoutChange": "layoutChange"; }; }]>;
@@ -1066,17 +1062,22 @@ declare class GridComponent {
 declare class GridItemComponent {
     private grid;
     private gridItem;
+    private provideSurface;
+    private parentSurfaceProvider;
     gridDrag: GridDragDirective;
     gridResize: GridResizeDirective;
     ariaLabel: _angular_core.InputSignal<string>;
     removed: _angular_core.OutputEmitterRef<void>;
+    private surfaceThemes;
     private gridConfig;
     private locale;
     protected isReadOnly: _angular_core.Signal<boolean>;
     protected dragHandleAriaLabel: _angular_core.Signal<string>;
+    private resolvedSurface;
+    constructor();
     applyKeyboardShortcut(event: KeyboardEvent): void;
     static ɵfac: _angular_core.ɵɵFactoryDeclaration<GridItemComponent, never>;
-    static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridItemComponent, "et-grid-item, [et-grid-item]", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "removed": "removed"; }, never, ["[etGridItemDragHandle]", "*", "[etGridItemAction]"], true, [{ directive: typeof GridItemDirective; inputs: { "itemId": "itemId"; "minColSpan": "minColSpan"; "maxColSpan": "maxColSpan"; "minRowSpan": "minRowSpan"; "maxRowSpan": "maxRowSpan"; }; outputs: {}; }, { directive: typeof GridDragDirective; inputs: {}; outputs: {}; }, { directive: typeof GridResizeDirective; inputs: {}; outputs: {}; }]>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<GridItemComponent, "et-grid-item, [et-grid-item]", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "removed": "removed"; }, never, ["[etGridItemDragHandle]", "*", "[etGridItemAction]"], true, [{ directive: typeof GridItemDirective; inputs: { "itemId": "itemId"; "minColSpan": "minColSpan"; "maxColSpan": "maxColSpan"; "minRowSpan": "minRowSpan"; "maxRowSpan": "maxRowSpan"; }; outputs: {}; }, { directive: typeof GridDragDirective; inputs: {}; outputs: {}; }, { directive: typeof GridResizeDirective; inputs: {}; outputs: {}; }, { directive: typeof _ethlete_core.ProvideSurfaceDirective; inputs: {}; outputs: {}; }]>;
 }
 
 /**