@sebgroup/green-core 2.19.0 → 2.20.0-rc.20251215154321804

package/components/table/table.types.d.ts

@@ -0,0 +1,155 @@
+import type { GdsElement } from '../../gds-element';
+import type { GdsBadge, GdsButton, GdsContextMenu, GdsIcon, GdsImg, GdsLink } from '../../pure';
+import type { AccountFormats, DateTimeFormat, NumberFormats } from '../formatted-text/formatters';
+/**
+ * ============================================================================
+ *  TABLE TYPES
+ * ============================================================================
+ */
+export interface Column {
+    key: string;
+    value?: (row: any) => string;
+    label: string;
+    sortable?: boolean;
+    align?: 'start' | 'center' | 'stretch' | 'end';
+    justify?: 'start' | 'center' | 'space-between' | 'end';
+    visible?: boolean;
+    width?: string;
+    cell?: {
+        lead?: Cell | Cell[];
+        value?: Cell | Cell[];
+        trail?: Cell | Cell[];
+    };
+}
+export interface Actions {
+    label?: string;
+    align?: 'start' | 'center' | 'stretch' | 'end';
+    justify?: 'start' | 'center' | 'space-between' | 'end';
+    cell: Cell | Cell[];
+}
+export interface Row {
+    [key: string]: any;
+}
+export interface State {
+    page: number;
+    rows: number;
+    sortColumn?: string;
+    sortDirection?: 'asc' | 'desc';
+    searchQuery: string;
+    visibleColumns: Set<string>;
+}
+export interface Request {
+    page: number;
+    rows: number;
+    sortColumn?: string;
+    sortDirection?: 'asc' | 'desc';
+    searchQuery?: string;
+}
+export interface Response<T> {
+    rows: T[];
+    total: number;
+}
+export declare const DENSITY_CONFIG: {
+    readonly compact: {
+        readonly button: "small";
+        readonly input: "small";
+        readonly dropdown: "small";
+        readonly badge: "small";
+    };
+    readonly comfortable: {
+        readonly button: "small";
+        readonly input: "small";
+        readonly dropdown: "small";
+        readonly badge: "small";
+    };
+    readonly spacious: {
+        readonly button: "medium";
+        readonly input: "large";
+        readonly dropdown: "medium";
+        readonly badge: "default";
+    };
+};
+export type Density = 'comfortable' | 'compact' | 'spacious';
+export type DensityConfig = (typeof DENSITY_CONFIG)[Density];
+export interface CacheEntry<T> {
+    rows: T[];
+    total: number;
+    timestamp: number;
+}
+export interface Cache<T> {
+    [key: string]: CacheEntry<T>;
+}
+export type TableActions = Actions;
+export type TableColumn = Column;
+export type TableRow = Row;
+export type TableState = State;
+export type TableRequest = Request;
+export type TableResponse<T> = Response<T>;
+export type TableDensity = Density;
+export type TableDensityConfig = DensityConfig;
+export type TableCache<T> = Cache<T>;
+export type TableCacheEntry<T> = CacheEntry<T>;
+/**
+ * ============================================================================
+ *  CELL COMPONENT TYPES
+ * ============================================================================
+ */
+type CellProps<T> = {
+    [K in keyof T]?: T[K] | ((row: any) => T[K]);
+};
+export interface Badge extends CellProps<Pick<GdsBadge, 'variant' | 'size'>> {
+    type: 'badge';
+    value: string | ((row: any) => string);
+}
+export interface Image extends CellProps<Omit<GdsImg, keyof GdsElement>> {
+    type: 'image';
+    src: string | ((row: any) => string);
+}
+export interface Icon extends CellProps<Omit<GdsIcon, keyof GdsElement>> {
+    type: 'icon';
+    template: string | ((row: any) => string);
+}
+export interface Button extends CellProps<Omit<GdsButton, keyof GdsElement>> {
+    type: 'button';
+    template?: string | ((row: any) => string);
+    onClick: (row: any) => void;
+}
+export interface Link extends CellProps<Omit<GdsLink, keyof GdsElement>> {
+    type: 'link';
+    template?: string | ((row: any) => string);
+    onClick?: (row: any) => void;
+}
+export interface ContextMenu extends CellProps<Omit<GdsContextMenu, keyof GdsElement>> {
+    type: 'context-menu';
+    items: Array<{
+        label: string | ((row: any) => string);
+        divider?: boolean;
+        onClick: (row: any) => void;
+    }>;
+}
+export interface FormattedNumber {
+    type: 'formatted-number';
+    value: number | string | ((row: any) => number | string);
+    locale?: string;
+    currency?: string;
+    decimals?: number;
+    format?: NumberFormats;
+}
+export interface FormattedAccount {
+    type: 'formatted-account';
+    value: string | ((row: any) => string);
+    format?: AccountFormats;
+}
+export interface FormattedDate {
+    type: 'formatted-date';
+    value: string | Date | ((row: any) => string | Date);
+    locale?: string;
+    format?: DateTimeFormat;
+}
+export type Cell = Image | Icon | Button | Link | Badge | ContextMenu | FormattedNumber | FormattedAccount | FormattedDate;
+export interface CellConfig {
+    lead?: Cell;
+    value?: Cell;
+    trail?: Cell;
+}
+export {};

package/components/table/table.types.js

@@ -0,0 +1,24 @@
+import "../../chunks/chunk.QU3DSPNU.js";
+const DENSITY_CONFIG = {
+  compact: {
+    button: "small",
+    input: "small",
+    dropdown: "small",
+    badge: "small"
+  },
+  comfortable: {
+    button: "small",
+    input: "small",
+    dropdown: "small",
+    badge: "small"
+  },
+  spacious: {
+    button: "medium",
+    input: "large",
+    dropdown: "medium",
+    badge: "default"
+  }
+};
+export {
+  DENSITY_CONFIG
+};