globuswebcomponents 2.16.8 → 2.17.0

package/dist/cjs/reusableModels-_LRAKnsh.js.map

@@ -1 +1 @@
-{"version":3,"file":"reusableModels-_LRAKnsh.js","sources":["src/models/reusableModels.ts"],"sourcesContent":["export type GeneralSizes = 'xxxxl' | 'xxxl' | 'xxl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs' | 'profile_lg' | 'profile_md' | 'profile_sm';\r\n\r\nexport type GeneralHierarchies = 'primary' | 'secondary_gray' | 'secondary_color' | 'tertiary_gray' | 'tertiary_color' | 'link_gray' | 'link_color';\r\n\r\nexport enum StateEnum {\r\n  Default = 'default',\r\n  Disabled = 'disabled',\r\n}\r\n\r\nexport type ArrowPositions = 'bottom_center' | 'bottom_left' | 'bottom_right' | 'top_center' | 'left' | 'right' | 'none' | 'center';\r\n\r\nexport type CheckBoxVariants = 'checkbox' | 'check_circle' | 'radio';\r\n\r\nexport enum BorderWeights {\r\n  VeryLight = 'very_light',\r\n  Light = 'light',\r\n  Regular = 'regular',\r\n  Heavy = 'heavy',\r\n}\r\n\r\nexport enum OnlineIndicatorStates {\r\n  Online = 'online',\r\n  Offline = 'offline',\r\n}\r\n\r\nexport type BreakPoints = 'desktop' | 'mobile';\r\n\r\nexport type FileUploadIconType = 'solid' | 'outline';\r\n\r\nexport type FileUploadStates = 'default' | 'in_progress' | 'complete' | 'hover' | 'disabled' | 'error';\r\n\r\nexport type GeneralColors = 'default' | 'gray' | 'primary' | 'error' | 'warning' | 'success' | 'discovery' | 'information' | 'pink' | 'purple' | 'white';\r\n\r\nexport type PaginationNumberShapes = 'square' | 'circle';\r\n\r\nexport type PaginationTypes =\r\n  | 'page_default'\r\n  | 'page_minimal_center_aligned'\r\n  | 'card_default'\r\n  | 'card_minimal_right_aligned'\r\n  | 'card_minimal_left_aligned'\r\n  | 'card_minimal_center_aligned'\r\n  | 'card_button_group_right_aligned'\r\n  | 'card_button_group_left_aligned'\r\n  | 'card_button_group_center_aligned';\r\n\r\nexport type TabTypes =\r\n  | 'button_primary'\r\n  | 'button_gray'\r\n  | 'button_white'\r\n  | 'rounded_button_white'\r\n  | 'underline'\r\n  | 'underline_filled'\r\n  | 'line'\r\n  | 'button_white_border'\r\n  | 'rounded_button_white_border'\r\n  | 'button_gray_border';\r\n\r\nexport type GeneralBackgroundCategories = 'plain_background' | 'colored_background';\r\n\r\nexport type InputFieldTypes =\r\n  | 'default'\r\n  | 'icon_leading'\r\n  | 'leading_dropdown'\r\n  | 'trailing_dropdown'\r\n  | 'leading_text'\r\n  | 'payment_input'\r\n  | 'tags'\r\n  | 'trailing_button'\r\n  | 'password'\r\n  | 'password_icon_leading'\r\n  | 'count';\r\n\r\nexport type DropdownTypes = 'default' | 'icon_leading' | 'avatar_leading' | 'dot_leading' | 'checkbox' | 'search' | 'tags';\r\n\r\nexport type ColorTypes = 'gray' | 'blue' | 'cyan' | 'pink' | 'purple' | 'green' | 'yellow' | 'red' | 'white';\r\n\r\nexport type DropdownItemTypes = string | number | { name: string | number; username: string; selected?: boolean };\r\n\r\nexport type PaginationDotTypes = 'dot' | 'line';\r\n\r\nexport type FileIconStyles = 'default' | 'gray' | 'solid';\r\n\r\nexport type FileIconTypes = 'pdf' | 'csv' | 'jpg' | 'jpeg' | 'ppt' | 'pptx' | 'doc' | 'docx' | 'xls' | 'xlsx' | 'svg' | 'txt' | 'zip' | 'rar' | 'mp3' | 'mp4' | 'png' | 'empty';\r\n\r\nexport type TableCellTypes = 'text' | 'lead_text' | 'lead_checkbox' | 'badge';\r\n\r\nexport type ProgressStepStatus = 'incomplete' | 'current' | 'complete';\r\n\r\nexport type ProgressStepTypes = 'icon_only' | 'icon_left' | 'icon_top' | 'text_line' | 'featured_icon_left' | 'featured_icon_top';\r\n\r\nexport type ProgressStepStates = 'default' | 'destructive';\r\n\r\nexport type BadgeTypes = 'pill_color' | 'pill_outline' | 'badge_color' | 'badge_modern';\r\n\r\nexport type GeneralStyles = 'standard' | 'compact';\r\n\r\nexport type StateType = 'default' | 'disabled' | 'applied' | 'loading' | 'open';\r\n\r\nexport type ButtonGroupTypes = 'false' | 'leading' | 'only' | 'dot' | 'checkbox';\r\n\r\nexport type ThemeTypes = 'system' | 'light' | 'dark';\r\n\r\nexport type BadgeIconTypes = 'dot' | 'avatar' | 'icon_leading' | 'icon_trailing' | 'country' | 'only' | 'false';\r\n\r\nexport type DropdownRoles = { badgeLabel: string; badgeColor: GeneralColors; badgeType: BadgeTypes };\r\n\r\nexport type StepperType = {\r\n  state: ProgressStepStates;\r\n  status: ProgressStepStatus;\r\n  label?: string;\r\n  supportingText?: string;\r\n};\r\n\r\nexport type DetailCellType = 'information' | 'document' | 'status' | 'button';\r\n\r\nexport type MetricFeaturedIconTypes = 'glassmorphism' | 'circular_filled';\r\n\r\nexport interface DropdownListGroup {\r\n  icon: string;\r\n  label: string;\r\n  shortcut: string;\r\n}\r\n\r\nexport type CloseButtonPositions = 'left' | 'right';\r\n\r\nexport interface Notification {\r\n  label: string;\r\n  time: string;\r\n  desc: string;\r\n  icon: string;\r\n}\r\n\r\nexport type IllustrationTypes = 'cloud' | 'box' | 'documents' | 'credit_card';\r\n\r\nexport type PatternTypes = 'circles' | 'grid' | 'grid_dot' | 'squares';\r\n\r\nexport type MobilePosition = 'top_left' | 'top_right' | 'bottom_left' | 'bottom_right';\r\n\r\nexport interface TableColumn {\r\n  key: string;\r\n  label: string;\r\n  value?: (row: any) => any;\r\n  supportingText?: string | ((row: any) => string);\r\n  width?: string;\r\n  align?: 'left' | 'center' | 'right';\r\n  helpIcon?: boolean;\r\n  sortable?: boolean;\r\n  sortType?: 'string' | 'number' | 'date';\r\n  visible?: boolean;\r\n  cellComponent?: string;\r\n  searchable?: boolean;\r\n  cellProps?: ((row: any) => { [key: string]: any }) | { [key: string]: any };\r\n  hasAvatar?: boolean;\r\n  cellAvatar?: {\r\n    props?: {};\r\n    slots?: {\r\n      initials?: string | ((row: any) => string | any);\r\n      image?: string | ((row: any) => string | any);\r\n    };\r\n  };\r\n  cellSlots?: {\r\n    default?: {\r\n      tag?: string; // e.g., 'p', 'span' to wrap content\r\n      content: (row: any) => string | any; // Function to get slot content\r\n    };\r\n    named?: {\r\n      [slotName: string]: {\r\n        tag: string; // e.g., 'p', 'h1', 'span'\r\n        content: (row: any) => string | any; // Function to get slot content\r\n      };\r\n    };\r\n  };\r\n  cellClass?: string | ((row: any) => string);\r\n  cellStyle?: { [key: string]: string } | ((row: any) => { [key: string]: string });\r\n  splitCell?: {\r\n    left: (row: any) => string | number;\r\n    right: (row: any) => string | number;\r\n    separator?: string;\r\n    leftStyle?: (row: any) => { [key: string]: string };\r\n    rightStyle?: (row: any) => { [key: string]: string };\r\n  };\r\n  mobile?: {\r\n    position?: MobilePosition;\r\n  };\r\n  gridCard?: {\r\n    buttonIcon?: string;\r\n    buttonText?: string;\r\n  };\r\n}\r\n\r\nexport interface RowAction {\r\n  label: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n  destructive?: boolean;\r\n  type?: 'button' | 'dropdown';\r\n}\r\n\r\nexport interface DropdownOption {\r\n  label: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n}\r\n\r\nexport type PortalPlacement =\r\n  | 'top'\r\n  | 'top-start'\r\n  | 'top-end'\r\n  | 'bottom'\r\n  | 'bottom-start'\r\n  | 'bottom-end'\r\n  | 'left'\r\n  | 'left-start'\r\n  | 'left-end'\r\n  | 'right'\r\n  | 'right-start'\r\n  | 'right-end';\r\n\r\nexport interface FilterField {\r\n  tag: string;\r\n  columnKey?: string; // ← the actual row property to filter on\r\n  key: string | { start: string; end: string }; // date ranges need two keys\r\n  event: string | { start: string; end: string }; // date ranges need two events\r\n  label?: string;\r\n  props?: any;\r\n  default?: any;\r\n}\r\n\r\nexport interface FilterConfig {\r\n  mode?: 'internal' | 'external';\r\n  title?: string;\r\n  showClearButton?: boolean;\r\n  fields?: FilterField[];\r\n  initialValues?: {\r\n    pageNumber: number;\r\n    pageSize: number;\r\n  };\r\n  appliedValues?: Record<string, any>;\r\n}\r\n\r\nexport type IconStyles = 'stroke' | 'two-tone' | 'duotone' | 'solid' | 'bulk';\r\n\r\nexport type IconTypes = 'rounded' | 'sharp';\r\n\r\nexport type SubMenuChild = {\r\n  label: string;\r\n  icon: string;\r\n};\r\n\r\nexport type SubMenuItem = {\r\n  label: string;\r\n  icon: string;\r\n  children?: SubMenuChild[];\r\n};"],"names":["StateEnum","BorderWeights","OnlineIndicatorStates"],"mappings":";;AAIYA;AAAZ,CAAA,UAAY,SAAS,EAAA;AACnB,IAAA,SAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,SAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACvB,CAAC,EAHWA,iBAAS,KAATA,iBAAS,GAGpB,EAAA,CAAA,CAAA;AAMWC;AAAZ,CAAA,UAAY,aAAa,EAAA;AACvB,IAAA,aAAA,CAAA,WAAA,CAAA,GAAA,YAAwB;AACxB,IAAA,aAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,aAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,aAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACjB,CAAC,EALWA,qBAAa,KAAbA,qBAAa,GAKxB,EAAA,CAAA,CAAA;AAEWC;AAAZ,CAAA,UAAY,qBAAqB,EAAA;AAC/B,IAAA,qBAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACrB,CAAC,EAHWA,6BAAqB,KAArBA,6BAAqB,GAGhC,EAAA,CAAA,CAAA;;"}
+{"version":3,"file":"reusableModels-_LRAKnsh.js","sources":["src/models/reusableModels.ts"],"sourcesContent":["export type GeneralSizes = 'xxxxl' | 'xxxl' | 'xxl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs' | 'xxs' | 'profile_lg' | 'profile_md' | 'profile_sm';\r\n\r\nexport type GeneralHierarchies = 'primary' | 'secondary_gray' | 'secondary_color' | 'tertiary_gray' | 'tertiary_color' | 'link_gray' | 'link_color';\r\n\r\nexport enum StateEnum {\r\n  Default = 'default',\r\n  Disabled = 'disabled',\r\n}\r\n\r\nexport type ArrowPositions = 'bottom_center' | 'bottom_left' | 'bottom_right' | 'top_center' | 'left' | 'right' | 'none' | 'center';\r\n\r\nexport type CheckBoxVariants = 'checkbox' | 'check_circle' | 'radio';\r\n\r\nexport enum BorderWeights {\r\n  VeryLight = 'very_light',\r\n  Light = 'light',\r\n  Regular = 'regular',\r\n  Heavy = 'heavy',\r\n}\r\n\r\nexport enum OnlineIndicatorStates {\r\n  Online = 'online',\r\n  Offline = 'offline',\r\n}\r\n\r\nexport type BreakPoints = 'desktop' | 'mobile';\r\n\r\nexport type FileUploadIconType = 'solid' | 'outline';\r\n\r\nexport type FileUploadStates = 'default' | 'in_progress' | 'complete' | 'hover' | 'disabled' | 'error';\r\n\r\nexport type GeneralColors = 'default' | 'gray' | 'primary' | 'error' | 'warning' | 'success' | 'discovery' | 'information' | 'pink' | 'purple' | 'white';\r\n\r\nexport type PaginationNumberShapes = 'square' | 'circle';\r\n\r\nexport type PaginationTypes =\r\n  | 'page_default'\r\n  | 'page_minimal_center_aligned'\r\n  | 'card_default'\r\n  | 'card_minimal_right_aligned'\r\n  | 'card_minimal_left_aligned'\r\n  | 'card_minimal_center_aligned'\r\n  | 'card_button_group_right_aligned'\r\n  | 'card_button_group_left_aligned'\r\n  | 'card_button_group_center_aligned';\r\n\r\nexport type TabTypes =\r\n  | 'button_primary'\r\n  | 'button_gray'\r\n  | 'button_white'\r\n  | 'rounded_button_white'\r\n  | 'underline'\r\n  | 'underline_filled'\r\n  | 'line'\r\n  | 'button_white_border'\r\n  | 'rounded_button_white_border'\r\n  | 'button_gray_border';\r\n\r\nexport type GeneralBackgroundCategories = 'plain_background' | 'colored_background';\r\n\r\nexport type InputFieldTypes =\r\n  | 'default'\r\n  | 'icon_leading'\r\n  | 'leading_dropdown'\r\n  | 'trailing_dropdown'\r\n  | 'leading_text'\r\n  | 'payment_input'\r\n  | 'tags'\r\n  | 'trailing_button'\r\n  | 'password'\r\n  | 'password_icon_leading'\r\n  | 'count';\r\n\r\nexport type DropdownTypes = 'default' | 'icon_leading' | 'avatar_leading' | 'dot_leading' | 'checkbox' | 'search' | 'tags';\r\n\r\nexport type ColorTypes = 'gray' | 'blue' | 'cyan' | 'pink' | 'purple' | 'green' | 'yellow' | 'red' | 'white';\r\n\r\nexport type DropdownItemTypes = string | number | { name: string | number; username: string; selected?: boolean };\r\n\r\nexport type PaginationDotTypes = 'dot' | 'line';\r\n\r\nexport type FileIconStyles = 'default' | 'gray' | 'solid';\r\n\r\nexport type FileIconTypes = 'pdf' | 'csv' | 'jpg' | 'jpeg' | 'ppt' | 'pptx' | 'doc' | 'docx' | 'xls' | 'xlsx' | 'svg' | 'txt' | 'zip' | 'rar' | 'mp3' | 'mp4' | 'png' | 'empty';\r\n\r\nexport type TableCellTypes = 'text' | 'lead_text' | 'lead_checkbox' | 'badge';\r\n\r\nexport type ProgressStepStatus = 'incomplete' | 'current' | 'complete';\r\n\r\nexport type ProgressStepTypes = 'icon_only' | 'icon_left' | 'icon_top' | 'text_line' | 'featured_icon_left' | 'featured_icon_top';\r\n\r\nexport type ProgressStepStates = 'default' | 'destructive';\r\n\r\nexport type BadgeTypes = 'pill_color' | 'pill_outline' | 'badge_color' | 'badge_modern';\r\n\r\nexport type GeneralStyles = 'standard' | 'compact';\r\n\r\nexport type StateType = 'default' | 'disabled' | 'applied' | 'loading' | 'open';\r\n\r\nexport type ButtonGroupTypes = 'false' | 'leading' | 'only' | 'dot' | 'checkbox';\r\n\r\nexport type ThemeTypes = 'system' | 'light' | 'dark';\r\n\r\nexport type BadgeIconTypes = 'dot' | 'avatar' | 'icon_leading' | 'icon_trailing' | 'country' | 'only' | 'false';\r\n\r\nexport type DropdownRoles = { badgeLabel: string; badgeColor: GeneralColors; badgeType: BadgeTypes };\r\n\r\nexport type StepperType = {\r\n  state: ProgressStepStates;\r\n  status: ProgressStepStatus;\r\n  label?: string;\r\n  supportingText?: string;\r\n};\r\n\r\nexport type DetailCellType = 'information' | 'document' | 'status' | 'button';\r\n\r\nexport type MetricFeaturedIconTypes = 'glassmorphism' | 'circular_filled';\r\n\r\nexport interface DropdownListGroup {\r\n  icon: string;\r\n  label: string;\r\n  shortcut: string;\r\n}\r\n\r\nexport type CloseButtonPositions = 'left' | 'right';\r\n\r\nexport interface Notification {\r\n  label: string;\r\n  time: string;\r\n  desc: string;\r\n  icon: string;\r\n}\r\n\r\nexport type IllustrationTypes = 'cloud' | 'box' | 'documents' | 'credit_card';\r\n\r\nexport type PatternTypes = 'circles' | 'grid' | 'grid_dot' | 'squares';\r\n\r\nexport type MobilePosition = 'top_left' | 'top_right' | 'bottom_left' | 'bottom_right';\r\n\r\nexport interface TableColumn {\r\n  key: string;\r\n  label: string;\r\n  value?: (row: any) => any;\r\n  supportingText?: string | ((row: any) => string);\r\n  width?: string;\r\n  align?: 'left' | 'center' | 'right';\r\n  helpIcon?: boolean;\r\n  sortable?: boolean;\r\n  sortType?: 'string' | 'number' | 'date';\r\n  visible?: boolean;\r\n  cellComponent?: string;\r\n  searchable?: boolean;\r\n  cellProps?: ((row: any) => { [key: string]: any }) | { [key: string]: any };\r\n  hasAvatar?: boolean;\r\n  cellAvatar?: {\r\n    props?: {};\r\n    slots?: {\r\n      initials?: string | ((row: any) => string | any);\r\n      image?: string | ((row: any) => string | any);\r\n    };\r\n  };\r\n  cellSlots?: {\r\n    default?: {\r\n      tag?: string; // e.g., 'p', 'span' to wrap content\r\n      content: (row: any) => string | any; // Function to get slot content\r\n    };\r\n    named?: {\r\n      [slotName: string]: {\r\n        tag: string; // e.g., 'p', 'h1', 'span'\r\n        content: (row: any) => string | any; // Function to get slot content\r\n      };\r\n    };\r\n  };\r\n  cellClass?: string | ((row: any) => string);\r\n  cellStyle?: { [key: string]: string } | ((row: any) => { [key: string]: string });\r\n  splitCell?: {\r\n    left: (row: any) => string | number;\r\n    right: (row: any) => string | number;\r\n    separator?: string;\r\n    leftStyle?: (row: any) => { [key: string]: string };\r\n    rightStyle?: (row: any) => { [key: string]: string };\r\n  };\r\n  mobile?: {\r\n    position?: MobilePosition;\r\n  };\r\n  gridCard?: {\r\n    buttonIcon?: string;\r\n    buttonText?: string;\r\n  };\r\n}\r\n\r\nexport interface RowAction {\r\n  label?: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n  destructive?: boolean;\r\n  type?: 'button' | 'dropdown' | 'custom';\r\n}\r\n\r\nexport interface DropdownOption {\r\n  label: string;\r\n  icon?: string;\r\n  action: string; // emitted event name\r\n  disabled?: boolean;\r\n}\r\n\r\nexport type PortalPlacement =\r\n  | 'top'\r\n  | 'top-start'\r\n  | 'top-end'\r\n  | 'bottom'\r\n  | 'bottom-start'\r\n  | 'bottom-end'\r\n  | 'left'\r\n  | 'left-start'\r\n  | 'left-end'\r\n  | 'right'\r\n  | 'right-start'\r\n  | 'right-end';\r\n\r\nexport interface FilterField {\r\n  tag: string;\r\n  columnKey?: string; // ← the actual row property to filter on\r\n  key: string | { start: string; end: string }; // date ranges need two keys\r\n  event: string | { start: string; end: string }; // date ranges need two events\r\n  label?: string;\r\n  props?: any;\r\n  default?: any;\r\n}\r\n\r\nexport interface FilterConfig {\r\n  mode?: 'internal' | 'external';\r\n  title?: string;\r\n  showClearButton?: boolean;\r\n  fields?: FilterField[];\r\n  initialValues?: {\r\n    pageNumber: number;\r\n    pageSize: number;\r\n  };\r\n  appliedValues?: Record<string, any>;\r\n}\r\n\r\nexport type IconStyles = 'stroke' | 'two-tone' | 'duotone' | 'solid' | 'bulk';\r\n\r\nexport type IconTypes = 'rounded' | 'sharp';\r\n\r\nexport type SubMenuChild = {\r\n  label: string;\r\n  icon: string;\r\n};\r\n\r\nexport type SubMenuItem = {\r\n  label: string;\r\n  icon: string;\r\n  children?: SubMenuChild[];\r\n};"],"names":["StateEnum","BorderWeights","OnlineIndicatorStates"],"mappings":";;AAIYA;AAAZ,CAAA,UAAY,SAAS,EAAA;AACnB,IAAA,SAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,SAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACvB,CAAC,EAHWA,iBAAS,KAATA,iBAAS,GAGpB,EAAA,CAAA,CAAA;AAMWC;AAAZ,CAAA,UAAY,aAAa,EAAA;AACvB,IAAA,aAAA,CAAA,WAAA,CAAA,GAAA,YAAwB;AACxB,IAAA,aAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,aAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,aAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACjB,CAAC,EALWA,qBAAa,KAAbA,qBAAa,GAKxB,EAAA,CAAA,CAAA;AAEWC;AAAZ,CAAA,UAAY,qBAAqB,EAAA;AAC/B,IAAA,qBAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACrB,CAAC,EAHWA,6BAAqB,KAArBA,6BAAqB,GAGhC,EAAA,CAAA,CAAA;;"}

package/dist/cjs/test-input-tag.cjs.entry.js

@@ -78,7 +78,7 @@ const TestInputTag = class {
         this.exportValue.emit(this.selectedStaff);
     }
     render() {
-        return (index.h("div", { key: 'e2a08dae691eef1558e62dd478ca6703e0cc5894', class: "input_group", ref: el => (this.inputGroupElement = el) }, index.h("label", { key: 'cf61e216b843fa949ea3494a08d7052e85e11f15', htmlFor: this.idOfInput }, this.labelText), index.h("div", { key: '9990e2ba36cb17ff0db0b40a37a9cb28fbc89824', class: "input_like_parent", onClick: () => (this.dropdownOpen = !this.dropdownOpen) }, index.h("input", { key: '7bcfa381edbaf6b340449f73a731a6efd283be6c', id: this.idOfInput, class: "input_like", type: "text", placeholder: this.placeholderText, value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.exportSelectedStaff() }), index.h("div", { key: 'ec87e69a0d5105c936aa81ad11582a22a991f077', class: `results_display ${this.selectedStaff.length >= 1 ? 'show_results' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.selectedStaff.map((staff, index$1) => (
+        return (index.h("div", { key: 'f0f8f6d44a9155b90bb7f139120715c5f40ea8ac', class: "input_group", ref: el => (this.inputGroupElement = el) }, index.h("label", { key: '25d6107ec315af4bcfcf53ee144e67049354f668', htmlFor: this.idOfInput }, this.labelText), index.h("div", { key: '1adffbfd9dce09bc5af6d661754facd0db63cc22', class: "input_like_parent", onClick: () => (this.dropdownOpen = !this.dropdownOpen) }, index.h("input", { key: '3c3b829b6df4a59b88a33914b35fe588d622c807', id: this.idOfInput, class: "input_like", type: "text", placeholder: this.placeholderText, value: this.inputValue, readOnly: this.isReadOnly, ref: el => (this.inputElement = el), onBlur: () => this.exportSelectedStaff() }), index.h("div", { key: '09d7809df8d170fa1b867bb7bc0714bc9ce8289e', class: `results_display ${this.selectedStaff.length >= 1 ? 'show_results' : ''}`, ref: el => (this.resultsDisplayElement = el) }, this.selectedStaff.map((staff, index$1) => (
         //   <span>
         //     {staff.fullname}
         //     <img
@@ -87,7 +87,7 @@ const TestInputTag = class {
         //       onClick={() => this.removeStaff(index)}
         //     />
         //   </span>
-        index.h("gb-tag", { size: "sm", action: "X_close", icon: "avatar", onClick: () => this.removeStaff(index$1) }, index.h("h1", { slot: "initials" }, staff.fullname.split(' ').map(part => part.charAt(0).toUpperCase())), index.h("p", null, staff.fullname.split(' ')[0])))))), this.show && (index.h("div", { key: 'df4081eab4ad2f49f0081e29d67548df112b4b66', class: `dropdown_menu ${this.show ? 'show' : ''}` }, this.staffInfo.map(staff => (
+        index.h("gb-tag", { size: "sm", action: "X_close", icon: "avatar", onClick: () => this.removeStaff(index$1) }, index.h("h1", { slot: "initials" }, staff.fullname.split(' ').map(part => part.charAt(0).toUpperCase())), index.h("p", null, staff.fullname.split(' ')[0])))))), this.show && (index.h("div", { key: '58a8c49baa697bea3807dee05853d6a87a35d185', class: `dropdown_menu ${this.show ? 'show' : ''}` }, this.staffInfo.map(staff => (
         //   <li class="aList" onClick={() => this.selectStaff(staff)}>
         //     <div>{staff.fullname}</div>
         //     <div>{staff.email}</div>

package/dist/cjs/test-wrapper.cjs.entry.js

@@ -0,0 +1,16 @@
+'use strict';
+
+var index = require('./index-Dps6xl1B.js');
+
+const TestWrapper = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.renderRowActions = (row) => (index.h(index.Fragment, null, index.h("gb-button", { hierarchy: "tertiary_gray", size: "sm", icon: "only", "icon-leading": true, "icon-leading-swap": "assets/thumbs-up.svg", onClick: () => document.querySelector('gb-table').handleAction('approve', row) }, "Approve"), index.h("gb-button", { hierarchy: "tertiary_gray", size: "sm", icon: "only", "icon-leading": true, "icon-leading-swap": "assets/thumbs-up.svg", onClick: () => document.querySelector('gb-table').handleAction('reject', row) }, "Reject")));
+    }
+    render() {
+        return index.h("gb-table", { key: 'c2ca9869b7839b87d1ef7b4c4690bc093299e4ed', renderCustomActions: this.renderRowActions });
+    }
+};
+
+exports.test_wrapper = TestWrapper;
+//# sourceMappingURL=test-wrapper.entry.cjs.js.map

package/dist/cjs/test-wrapper.entry.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-wrapper.entry.cjs.js","sources":["src/components/gb-table-test/gb-table-test.tsx"],"sourcesContent":["import { Component, h, Fragment } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: 'test-wrapper',\r\n  shadow: true,\r\n})\r\nexport class TestWrapper {\r\n  private renderRowActions = (row: any) => (\r\n    <>\r\n      <gb-button\r\n        hierarchy=\"tertiary_gray\"\r\n        size=\"sm\"\r\n        icon=\"only\"\r\n        icon-leading={true}\r\n        icon-leading-swap=\"assets/thumbs-up.svg\"\r\n        onClick={() => (document.querySelector('gb-table') as any).handleAction('approve', row)}\r\n      >\r\n        Approve\r\n      </gb-button>\r\n      <gb-button\r\n        hierarchy=\"tertiary_gray\"\r\n        size=\"sm\"\r\n        icon=\"only\"\r\n        icon-leading={true}\r\n        icon-leading-swap=\"assets/thumbs-up.svg\"\r\n        onClick={() => (document.querySelector('gb-table') as any).handleAction('reject', row)}\r\n      >\r\n        Reject\r\n      </gb-button>\r\n    </>\r\n  );\r\n\r\n  render() {\r\n    return <gb-table renderCustomActions={this.renderRowActions}></gb-table>;\r\n  }\r\n}\r\n"],"names":["h","Fragment"],"mappings":";;;;MAMa,WAAW,GAAA,MAAA;AAJxB,IAAA,WAAA,CAAA,OAAA,EAAA;;QAKU,IAAA,CAAA,gBAAgB,GAAG,CAAC,GAAQ,MAClCA,OAAA,CAAAC,cAAA,EAAA,IAAA,EACED,OAAA,CAAA,WAAA,EAAA,EACE,SAAS,EAAC,eAAe,EACzB,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,MAAM,EAAA,cAAA,EACG,IAAI,EAAA,mBAAA,EACA,sBAAsB,EACxC,OAAO,EAAE,MAAO,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAS,CAAC,YAAY,CAAC,SAAS,EAAE,GAAG,CAAC,EAG7E,EAAA,SAAA,CAAA,EACZA,OAAA,CAAA,WAAA,EAAA,EACE,SAAS,EAAC,eAAe,EACzB,IAAI,EAAC,IAAI,EACT,IAAI,EAAC,MAAM,EACG,cAAA,EAAA,IAAI,EACA,mBAAA,EAAA,sBAAsB,EACxC,OAAO,EAAE,MAAO,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAS,CAAC,YAAY,CAAC,QAAQ,EAAE,GAAG,CAAC,EAG5E,EAAA,QAAA,CAAA,CACX,CACJ;AAKF;IAHC,MAAM,GAAA;AACJ,QAAA,OAAOA,uEAAU,mBAAmB,EAAE,IAAI,CAAC,gBAAgB,GAAa;;;;;;"}

package/dist/collection/collection-manifest.json

@@ -106,6 +106,7 @@
     "components/gb-tab-button-base/gb-tab-button-base.js",
     "components/gb-table/gb-table.js",
     "components/gb-table-header/gb-table-header.js",
+    "components/gb-table-test/gb-table-test.js",
     "components/gb-tag/gb-tag.js",
     "components/gb-tag-checkbox/gb-tag-checkbox.js",
     "components/gb-tag-close/gb-tag-close.js",

package/dist/collection/components/gb-table/gb-table.js

@@ -29,14 +29,14 @@ export class GbTable {
         //   key: 'status',
         //   label: 'Status',
         //   cellComponent: 'gb-badge',
-        // cellProps: row => ({ color: row.status === 'Completed' ? 'success' : 'error', type: 'badge_modern', size: 'sm', icon: 'dot' }),
-        // cellSlots: {
-        //   default: {
-        //     tag: 'p',
-        //     content: row => row.status,
+        //   cellProps: row => ({ color: row.status === 'Completed' ? 'success' : 'error', type: 'badge_modern', size: 'sm', icon: 'dot' }),
+        //   cellSlots: {
+        //     default: {
+        //       tag: 'p',
+        //       content: row => row.status,
+        //     },
         //   },
         // },
-        // },
         ];
         this.data = [
         // {
@@ -414,6 +414,29 @@ export class GbTable {
         // },
         ];
         // = {
+        //   name: { key: 'name' },
+        //   badges: [
+        //     { key: 'role', label: 'Role' },
+        //     { key: 'amount', label: 'Amount' },
+        //   ],
+        //   button: { icon: 'assets/sent.svg', text: 'Send Money', action: 'send_money' },
+        // };
+        this.tableHeaderConfig = {
+            type: 'default',
+            tableHeading: false,
+            tableHeadingLabel: 'Suspicious outflows',
+            showDateFilter: true,
+            showFilter: true,
+            showColumnOptions: false,
+            showSearch: true,
+            showExport: true,
+            showRefreshButton: false,
+            showLayoutToggle: false,
+            datePickerMode: 'range',
+            inputPlaceholder: 'Transaction reference',
+            showEntireData: true,
+        };
+        // = {
         //   paginationMode: 'internal',
         //   entriesDropdownMenuPosition: 'top',
         //   currentPage: 1,
@@ -471,9 +494,10 @@ export class GbTable {
         };
         this.showActionsColumn = true;
         this.rowActions = [
-        // { label: 'View Details', action: 'view_details', icon: 'assets/view.svg', type: 'button' },
-        // { label: '', action: '', icon: 'assets/more-horizontal.svg', type: 'dropdown' },
-        // { label: 'Edit', action: 'edit', icon: 'assets/pencil-edit-01.svg', type: 'button' },
+            // { label: 'View Details', action: 'view_details', icon: 'assets/view.svg', type: 'button' },
+            // { label: '', action: '', icon: 'assets/more-horizontal.svg', type: 'dropdown' },
+            // { label: 'Edit', action: 'edit', icon: 'assets/pencil-edit-01.svg', type: 'button' },
+            { action: 'edit', type: 'custom' },
         ];
         this.dropdownOptions = [
         // { label: 'Download invalid', action: 'view', icon: 'assets/view.svg', disabled: false },
@@ -482,7 +506,7 @@ export class GbTable {
         ];
         this.stickyFirstColumn = true;
         this.stickyLastColumn = true;
-        this.showCheckbox = true;
+        this.showCheckbox = false;
         this.tableHeadColor = 'gray';
         this.rowKey = 'id';
         this.tableHeaderType = 'default';
@@ -569,7 +593,8 @@ export class GbTable {
             this.isScrollable = newScrollable; // only update if different
         }
     }
-    handleAction(action, row) {
+    async handleAction(action, row) {
+        console.log('Action clicked:', action, row);
         this.rowActionClicked.emit({ action, row });
     }
     renderCell(col, row) {
@@ -876,7 +901,7 @@ export class GbTable {
             .map((col, index) => (h(Fragment, null, h("td", { style: { textAlign: col.align || 'left' }, class: `table_detail ${this.stickyFirstColumn && index === 0 ? 'sticky_left' : ''} ${this.isScrollable ? 'has_border' : ''}` }, this.renderCell(col, row))))), this.showActionsColumn && (h("td", { class: { table_detail: true, actions_cell: true, sticky_right: this.stickyLastColumn, has_border: this.isScrollable }, style: { width: '50px' } }, h(Fragment, null, h("div", { class: "action_buttons" }, this.rowActions.map(action => (h(Fragment, null, action.type === 'dropdown' ? (h("gb-button", { id: `gb-table-trigger-${rowIndex}`, ref: el => (this.actionButtonRefs[rowIndex] = el), class: "dropdown_button", hierarchy: "tertiary_gray", size: "md", icon: "only", iconLeading: true, iconLeadingSwap: "assets/more-horizontal.svg", onClick: e => {
                 e.stopPropagation();
                 this.toggleDropdown(rowIndex);
-            } })) : (h("gb-button", { hierarchy: "tertiary_gray", size: "md", icon: "only", destructive: action.destructive, iconLeading: true, iconLeadingSwap: action.icon, onClick: e => {
+            } })) : action.type === 'custom' ? (this.renderCustomActions ? (this.renderCustomActions(row)) : null) : (h("gb-button", { hierarchy: "tertiary_gray", size: "md", icon: "only", destructive: action.destructive, iconLeading: true, iconLeadingSwap: action.icon, onClick: e => {
                 e.stopPropagation();
                 this.handleAction(action.action, row);
             } })))))), h(Fragment, null, this.openRowIndex === rowIndex && (h("gb-portal", { "anchor-id": `gb-table-trigger-${rowIndex}`, placement: this.dropdownPlacement, anchorEl: this.currentAnchorEl, boundaryEl: this.scrollContainer, dropdownHeight: requestAnimationFrame(() => this.dropdownRef.scrollHeight), open: true }, h("div", { class: "portal_dropdown_wrapper", ref: el => (this.dropdownRef = el) }, this.dropdownOptions.map(action => (h("gb-dropdown-items-with-shortcut", { icon: action.icon ? true : false, state: action.disabled ? StateEnum.Disabled : StateEnum.Default, label: action.label, "icon-src": action.icon, onClick: () => {
@@ -1097,16 +1122,16 @@ export class GbTable {
         window.removeEventListener('resize', this.checkViewport);
     }
     render() {
-        return (h("div", { key: '08bed4790123cd14b04c9aeca1b17338a21d0378', class: `table_wrapper ${this.currentTableLayout}` }, this.tableHeaderConfig && (h("div", { key: 'f206fa57601e83520530a325186a774be25bec1c', class: `table-header ${this.currentTableLayout}` }, h("gb-table-header", { key: 'e020968dad30ed2c0db4ee96d1de181eb932b494', type: this.tableHeaderConfig.type, mode: this.tableHeaderConfig.datePickerMode, "table-heading": this.tableHeaderConfig.tableHeading, "table-heading-label": this.tableHeaderConfig.tableHeadingLabel, "show-search": this.tableHeaderConfig.showSearch, "show-date-filter": this.tableHeaderConfig.showDateFilter, "show-filter": this.tableHeaderConfig.showFilter, "show-export": this.tableHeaderConfig.showExport, "show-column-options": this.tableHeaderConfig.showColumnOptions, "show-refresh-button": this.tableHeaderConfig.showRefreshButton, "input-placeholder": this.tableHeaderConfig.inputPlaceholder, "date-picker-placeholder": this.tableHeaderConfig.datePickerPlaceholder, "show-entire-data": this.tableHeaderConfig.showEntireData, "show-layout-toggle": this.tableHeaderConfig.showLayoutToggle, "filter-state": Object.keys(this.appliedFilterValues).length > 0 ? 'applied' : 'default', "filter-count": Object.keys(this.appliedFilterValues).length, "export-button-state": this.tableHeaderConfig.exportButtonState, "pdf-state": this.tableHeaderConfig.pdfState, "csv-state": this.tableHeaderConfig.csvState, onInputValueChanged: this.emitSearchValue.bind(this), onDateChange: this.emitDateChange.bind(this), onColumnOptionsButtonClicked: this.columnOptionsButtonClicked(), onExportClicked: e => this.exportButtonClicked(e), onFilterButtonClicked: () => this.openFilterModal(), onRefreshButtonClicked: () => this.onRefreshButtonClicked(), onLayoutButtonClicked: e => this.switchTableLayout(e), onTableControlClicked: e => this.emitTableContolClickedEvent(e) }))), this.showColumnsPanel && this.columns.length > 0 && (h("div", { key: 'faaa2d3c8b31b00c4ede7731702127639ce6aab9', class: "dialog", style: {
+        return (h("div", { key: 'ecbd96f75a578fe7c4729faa64e0981b4db76883', class: `table_wrapper ${this.currentTableLayout}` }, this.tableHeaderConfig && (h("div", { key: '27a90c6c234d6316b92126787b59cc30a4a861ee', class: `table-header ${this.currentTableLayout}` }, h("gb-table-header", { key: 'f74e3eb05a230a35674708ee9319d6f3ead930c2', type: this.tableHeaderConfig.type, mode: this.tableHeaderConfig.datePickerMode, "table-heading": this.tableHeaderConfig.tableHeading, "table-heading-label": this.tableHeaderConfig.tableHeadingLabel, "show-search": this.tableHeaderConfig.showSearch, "show-date-filter": this.tableHeaderConfig.showDateFilter, "show-filter": this.tableHeaderConfig.showFilter, "show-export": this.tableHeaderConfig.showExport, "show-column-options": this.tableHeaderConfig.showColumnOptions, "show-refresh-button": this.tableHeaderConfig.showRefreshButton, "input-placeholder": this.tableHeaderConfig.inputPlaceholder, "date-picker-placeholder": this.tableHeaderConfig.datePickerPlaceholder, "show-entire-data": this.tableHeaderConfig.showEntireData, "show-layout-toggle": this.tableHeaderConfig.showLayoutToggle, "filter-state": Object.keys(this.appliedFilterValues).length > 0 ? 'applied' : 'default', "filter-count": Object.keys(this.appliedFilterValues).length, "export-button-state": this.tableHeaderConfig.exportButtonState, "pdf-state": this.tableHeaderConfig.pdfState, "csv-state": this.tableHeaderConfig.csvState, onInputValueChanged: this.emitSearchValue.bind(this), onDateChange: this.emitDateChange.bind(this), onColumnOptionsButtonClicked: this.columnOptionsButtonClicked(), onExportClicked: e => this.exportButtonClicked(e), onFilterButtonClicked: () => this.openFilterModal(), onRefreshButtonClicked: () => this.onRefreshButtonClicked(), onLayoutButtonClicked: e => this.switchTableLayout(e), onTableControlClicked: e => this.emitTableContolClickedEvent(e) }))), this.showColumnsPanel && this.columns.length > 0 && (h("div", { key: '03a69e03ed948c172825d60afd1b21aebed704d9', class: "dialog", style: {
                 transform: `translate(${this.modalPosition.x}px, ${this.modalPosition.y}px)`,
-            } }, h("div", { key: 'e98a9fcc41d9e7281a538361d4e7ddf1d2f182ea', class: "column-modal" }, h("div", { key: 'f754fb3b60ff7908fad8982157f05108e227f16f', class: "modal_header" }, h("div", { key: '68805a02141e44b3b077606fb01ea22805a2ec8a', class: "modal_header_content", onPointerDown: this.onModalPointerDown }, h("h4", { key: '2502833b479337b8c5a15d5a2467721567a01d93', class: "heading display-xs-semi-bold" }, "Column Options"), h("gb-button-close", { key: '259b8b1bfd01f7be00b2e4081148febcce67b151', class: "close_button", color: "gray", size: "sm", onClick: () => (this.showColumnsPanel = false) }))), h("div", { key: 'de725fb507605422d302f519e4d5edec51430d57', class: "content_wrapper" }, h("div", { key: 'a5e06ec2acd4d58910e19115bf8026bb27e35da0', class: "modal_content" }, this.internalColumns.map((col, index) => (h("div", { class: "column_option", draggable: true, onDragStart: () => (this.draggedIndex = index), onDragOver: e => e.preventDefault(), onDrop: () => {
+            } }, h("div", { key: 'e13f8d1e50ca0f943249d5ebb4827dd81a4c1218', class: "column-modal" }, h("div", { key: '448f4233a36435bbf34e4b839614e33072a4045d', class: "modal_header" }, h("div", { key: '69732e7e814d86476e678fb3143c150a9e4a72b3', class: "modal_header_content", onPointerDown: this.onModalPointerDown }, h("h4", { key: 'e7ab5e157444fffccc412954ce36d8e13e28686b', class: "heading display-xs-semi-bold" }, "Column Options"), h("gb-button-close", { key: '8d91a7c96ae86b19274046bd1bbf8037a4b05461', class: "close_button", color: "gray", size: "sm", onClick: () => (this.showColumnsPanel = false) }))), h("div", { key: '78ee134fb4f9e5a0878effdbc5f51cde7f4782b0', class: "content_wrapper" }, h("div", { key: 'b78b3fbfa603be4b198aa469b69750761659a0c7', class: "modal_content" }, this.internalColumns.map((col, index) => (h("div", { class: "column_option", draggable: true, onDragStart: () => (this.draggedIndex = index), onDragOver: e => e.preventDefault(), onDrop: () => {
                 if (this.draggedIndex !== null && this.draggedIndex !== index) {
                     this.reorderColumns(this.draggedIndex, index);
                 }
                 this.draggedIndex = null;
             } }, h("div", { class: "label_and_dragger" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none" }, h("path", { d: "M8 6H8.00635M8 12H8.00635M8 18H8.00635M15.9937 6H16M15.9937 12H16M15.9937 18H16", stroke: "var(--color-icon, #4B5565)", "stroke-width": "2.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("p", { class: "label text-md-regular" }, col.label)), h("gb-toggle", { size: "sm", state: StateEnum.Default, position: "right", pressed: col.visible, text: false, onToggleClicked: e => {
                 this.toggleColumn(e, col.key);
-            } })))), h("div", { key: '7b4a2031677cff5feeb32fba5466a63087531cec', class: "modal-actions" })))))), this.showFilterModalInternal && this.filterConfig && (h("div", { key: '15113dbc0a79c6796b648b0fe45e4c450dd876a8', class: `filter_modal_wrapper ${this.isFilterModalVisible ? 'open' : 'closing'}` }, h("gb-filter-modal", { key: '4ec80231b62a65272d63131d6a1d1faa69d0c6a6', class: "filter_modal", filterConfig: this.mergedFilterConfig, onClose: e => {
+            } })))), h("div", { key: '81bfd60a84ae3ce018800519a7e16425a44a990e', class: "modal-actions" })))))), this.showFilterModalInternal && this.filterConfig && (h("div", { key: '4fcf8c485b7f9240f9fa9bdfdbc07cc925210038', class: `filter_modal_wrapper ${this.isFilterModalVisible ? 'open' : 'closing'}` }, h("gb-filter-modal", { key: 'c2432a18c99e29b18ca2a55ff9339d2356caee39', class: "filter_modal", filterConfig: this.mergedFilterConfig, onClose: e => {
                 e.stopPropagation();
                 this.closeFilterModal();
             }, onApplyFilters: e => this.onApplyFilters(e), onClearFilters: () => this.handleClearFilters() }))), this.internalLoading ? (
@@ -1153,7 +1178,7 @@ export class GbTable {
                 ? this.renderDesktopView()
                 : this.currentTableLayout === 'grid'
                     ? this.renderGridView()
-                    : null)), this.paginationConfig && (h("div", { key: '39767fe82ce88bcb4f1c570b9b3fd35b2e86ae43', class: `pagination ${this.currentTableLayout}` }, h("gb-pagination", { key: 'c76fc64fda5ebaf94122ca8a51f1addc754f63e3', "entries-dropdown-menu-position": this.paginationConfig.entriesDropdownMenuPosition, "page-size": this.paginationConfig.paginationMode === 'internal' ? this.internalPageSize : this.paginationConfig.pageSize, "current-page": this.paginationConfig.paginationMode === 'internal' ? this.internalCurrentPage : this.paginationConfig.currentPage, "total-pages": this.totalPages, onPageItemSelected: this.handlePageChange.bind(this) }))), this.showToast && (h("gb-toast", { key: 'b92a6728c7f97754cb350f049081af3f76868225', class: `toast ${this.toastVisible ? 'visible' : ''}`, color: "information", "main-text": this.filterMessage, breakpoint: "desktop", size: "floating", onClose: () => this.hideToast() }))));
+                    : null)), this.paginationConfig && (h("div", { key: 'dacef80f52cbcaecb101a6c1f20a1caddea54a96', class: `pagination ${this.currentTableLayout}` }, h("gb-pagination", { key: 'f50686e161588aa3e9d7d564aee3131fb5ca335d', "entries-dropdown-menu-position": this.paginationConfig.entriesDropdownMenuPosition, "page-size": this.paginationConfig.paginationMode === 'internal' ? this.internalPageSize : this.paginationConfig.pageSize, "current-page": this.paginationConfig.paginationMode === 'internal' ? this.internalCurrentPage : this.paginationConfig.currentPage, "total-pages": this.totalPages, onPageItemSelected: this.handlePageChange.bind(this) }))), this.showToast && (h("gb-toast", { key: '9654af9af7f09183e29459f40e704955018d5c2b', class: `toast ${this.toastVisible ? 'visible' : ''}`, color: "information", "main-text": this.filterMessage, breakpoint: "desktop", size: "floating", onClose: () => this.hideToast() }))));
     }
     static get is() { return "gb-table"; }
     static get encapsulation() { return "shadow"; }
@@ -1211,7 +1236,7 @@ export class GbTable {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "[\r\n    // { key: 'id', label: '#', width: '70px', sortable: true, sortType: 'string', mobile: { position: 'top_left' } },\r\n    // { key: 'date', label: 'Date', value: row => row.date.toLocaleString(), mobile: { position: 'bottom_left' } },\r\n    // {\r\n    //   key: 'name',\r\n    //   label: 'Name',\r\n    //   sortable: true,\r\n    //   sortType: 'string',\r\n    //   helpIcon: true,\r\n    //   searchable: true,\r\n    //   hasAvatar: true,\r\n    //   cellAvatar: {\r\n    //     // image: '',\r\n    //     slots: {\r\n    //       // initials: row => row.name.split(' ').map((nm: string) => nm.charAt(0)),\r\n    //       image: row => row.image,\r\n    //     },\r\n    //   },\r\n    //   mobile: { position: 'top_right' },\r\n    // },\r\n    // { key: 'role', label: 'Role', searchable: true },\r\n    // { key: 'amount', label: 'Amount', align: 'right', sortable: true, sortType: 'number', cellStyle: row => ({ color: row.amount > 200 ? 'green' : '' }) },\r\n    // {\r\n    //   key: 'status',\r\n    //   label: 'Status',\r\n    //   cellComponent: 'gb-badge',\r\n    // cellProps: row => ({ color: row.status === 'Completed' ? 'success' : 'error', type: 'badge_modern', size: 'sm', icon: 'dot' }),\r\n    // cellSlots: {\r\n    //   default: {\r\n    //     tag: 'p',\r\n    //     content: row => row.status,\r\n    //   },\r\n    // },\r\n    // },\r\n  ]"
+                "defaultValue": "[\r\n    // { key: 'id', label: '#', width: '70px', sortable: true, sortType: 'string', mobile: { position: 'top_left' } },\r\n    // { key: 'date', label: 'Date', value: row => row.date.toLocaleString(), mobile: { position: 'bottom_left' } },\r\n    // {\r\n    //   key: 'name',\r\n    //   label: 'Name',\r\n    //   sortable: true,\r\n    //   sortType: 'string',\r\n    //   helpIcon: true,\r\n    //   searchable: true,\r\n    //   hasAvatar: true,\r\n    //   cellAvatar: {\r\n    //     // image: '',\r\n    //     slots: {\r\n    //       // initials: row => row.name.split(' ').map((nm: string) => nm.charAt(0)),\r\n    //       image: row => row.image,\r\n    //     },\r\n    //   },\r\n    //   mobile: { position: 'top_right' },\r\n    // },\r\n    // { key: 'role', label: 'Role', searchable: true },\r\n    // { key: 'amount', label: 'Amount', align: 'right', sortable: true, sortType: 'number', cellStyle: row => ({ color: row.amount > 200 ? 'green' : '' }) },\r\n    // {\r\n    //   key: 'status',\r\n    //   label: 'Status',\r\n    //   cellComponent: 'gb-badge',\r\n    //   cellProps: row => ({ color: row.status === 'Completed' ? 'success' : 'error', type: 'badge_modern', size: 'sm', icon: 'dot' }),\r\n    //   cellSlots: {\r\n    //     default: {\r\n    //       tag: 'p',\r\n    //       content: row => row.status,\r\n    //     },\r\n    //   },\r\n    // },\r\n  ]"
             },
             "data": {
                 "type": "unknown",
@@ -1263,7 +1288,8 @@ export class GbTable {
                     "text": ""
                 },
                 "getter": false,
-                "setter": false
+                "setter": false,
+                "defaultValue": "{\r\n    type: 'default',\r\n    tableHeading: false,\r\n    tableHeadingLabel: 'Suspicious outflows',\r\n    showDateFilter: true,\r\n    showFilter: true,\r\n    showColumnOptions: false,\r\n    showSearch: true,\r\n    showExport: true,\r\n    showRefreshButton: false,\r\n    showLayoutToggle: false,\r\n    datePickerMode: 'range',\r\n    inputPlaceholder: 'Transaction reference',\r\n    showEntireData: true,\r\n  }"
             },
             "paginationConfig": {
                 "type": "unknown",
@@ -1402,7 +1428,7 @@ export class GbTable {
                 },
                 "getter": false,
                 "setter": false,
-                "defaultValue": "[\r\n    // { label: 'View Details', action: 'view_details', icon: 'assets/view.svg', type: 'button' },\r\n    // { label: '', action: '', icon: 'assets/more-horizontal.svg', type: 'dropdown' },\r\n    // { label: 'Edit', action: 'edit', icon: 'assets/pencil-edit-01.svg', type: 'button' },\r\n  ]"
+                "defaultValue": "[\r\n    // { label: 'View Details', action: 'view_details', icon: 'assets/view.svg', type: 'button' },\r\n    // { label: '', action: '', icon: 'assets/more-horizontal.svg', type: 'dropdown' },\r\n    // { label: 'Edit', action: 'edit', icon: 'assets/pencil-edit-01.svg', type: 'button' },\r\n    { action: 'edit', type: 'custom' },\r\n  ]"
             },
             "dropdownOptions": {
                 "type": "unknown",
@@ -1486,7 +1512,7 @@ export class GbTable {
                 "setter": false,
                 "reflect": false,
                 "attribute": "show-checkbox",
-                "defaultValue": "true"
+                "defaultValue": "false"
             },
             "tableHeadColor": {
                 "type": "string",
@@ -1547,6 +1573,23 @@ export class GbTable {
                 "reflect": false,
                 "attribute": "table-header-type",
                 "defaultValue": "'default'"
+            },
+            "renderCustomActions": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(row: any) => any",
+                    "resolved": "(row: any) => any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
             }
         };
     }
@@ -1763,6 +1806,35 @@ export class GbTable {
                 }
             }];
     }
+    static get methods() {
+        return {
+            "handleAction": {
+                "complexType": {
+                    "signature": "(action: string, row: any) => Promise<void>",
+                    "parameters": [{
+                            "name": "action",
+                            "type": "string",
+                            "docs": ""
+                        }, {
+                            "name": "row",
+                            "type": "any",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "",
+                    "tags": []
+                }
+            }
+        };
+    }
     static get watchers() {
         return [{
                 "propName": "data",