@progressio_resources/gravity-design-system 3.0.13 → 3.0.14

package/lib/components/gravity-button/gravity-button.component.d.ts

@@ -10,6 +10,8 @@ export declare class GravityButtonComponent {
     size: 'sm' | 'md' | 'lg';
     type: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'negative' | 'disabled';
     isNewIcon(iconName: string): boolean;
+    getSizeClass(size: string): "sm" | "md";
+    getIconSizeClass(size: string): "md-16" | "sm-12";
     static ɵfac: i0.ɵɵFactoryDeclaration<GravityButtonComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<GravityButtonComponent, "gravity-button", never, { "cypressTag": { "alias": "cypressTag"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "customState": { "alias": "customState"; "required": false; }; "iconPosition": { "alias": "iconPosition"; "required": false; }; "iconName": { "alias": "iconName"; "required": false; }; "isLoading": { "alias": "isLoading"; "required": false; }; "showContent": { "alias": "showContent"; "required": false; }; "size": { "alias": "size"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, {}, never, ["*"], false, never>;
 }

package/lib/components/gravity-chip/gravity-chip.component.d.ts

@@ -0,0 +1,15 @@
+import { EventEmitter } from '@angular/core';
+import * as i0 from "@angular/core";
+export declare class GravityChipComponent {
+    isSelected: boolean;
+    label: string;
+    iconName: string;
+    disabled: boolean;
+    closeButton: boolean;
+    close: EventEmitter<void>;
+    select: EventEmitter<void>;
+    onCloseClick(): void;
+    onChipClick(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<GravityChipComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GravityChipComponent, "gravity-chip", never, { "label": { "alias": "label"; "required": false; }; "iconName": { "alias": "iconName"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "closeButton": { "alias": "closeButton"; "required": false; }; }, { "close": "close"; "select": "select"; }, never, never, false, never>;
+}

package/lib/components/gravity-icon/gravity-icon.component.d.ts

@@ -44,26 +44,29 @@ export declare enum ICONS {
     'more-options' = 25,
     'new-tab' = 26,
     'news' = 27,
-    'payout' = 28,
-    'plus' = 29,
-    'question-circle' = 30,
-    'queue' = 31,
-    'rates' = 32,
-    'report' = 33,
-    'search' = 34,
-    'security' = 35,
-    'settings' = 36,
-    'sign-out' = 37,
-    'success-circle' = 38,
-    'swaps' = 39,
-    'swaps-arrow-left' = 40,
-    'swaps-arrow-right' = 41,
-    'switch' = 42,
-    'tool' = 43,
-    'trash' = 44,
-    'unlock' = 45,
-    'unsuccess' = 46,
-    'update' = 47,
-    'user' = 48,
-    'warning-circle' = 49
+    'off' = 28,
+    'on' = 29,
+    'payout' = 30,
+    'plus' = 31,
+    'question-circle' = 32,
+    'queue' = 33,
+    'rates' = 34,
+    'report' = 35,
+    'search' = 36,
+    'security' = 37,
+    'settings' = 38,
+    'sign-out' = 39,
+    'stop' = 40,
+    'success-circle' = 41,
+    'swaps' = 42,
+    'swaps-arrow-left' = 43,
+    'swaps-arrow-right' = 44,
+    'switch' = 45,
+    'tool' = 46,
+    'trash' = 47,
+    'unlock' = 48,
+    'unsuccess' = 49,
+    'update' = 50,
+    'user' = 51,
+    'warning-circle' = 52
 }

package/lib/components/gravity-icon-button/gravity-icon-button.component.d.ts

@@ -2,10 +2,13 @@ import { EventEmitter } from '@angular/core';
 import * as i0 from "@angular/core";
 export declare class GravityIconButtonComponent {
     icon: string;
-    state: 'active' | 'pressed' | 'disabled';
+    supportText: string;
+    variant: boolean;
+    size: 'md-16' | 'lg-24';
     type: 'primary' | 'secondary';
+    state: 'active' | 'pressed' | 'disabled';
     clickOnIcon: EventEmitter<void>;
     onClick(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<GravityIconButtonComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<GravityIconButtonComponent, "gravity-icon-button", never, { "icon": { "alias": "icon"; "required": false; }; "state": { "alias": "state"; "required": false; }; "type": { "alias": "type"; "required": false; }; }, { "clickOnIcon": "clickOnIcon"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<GravityIconButtonComponent, "gravity-icon-button", never, { "icon": { "alias": "icon"; "required": false; }; "supportText": { "alias": "supportText"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "size": { "alias": "size"; "required": false; }; "type": { "alias": "type"; "required": false; }; "state": { "alias": "state"; "required": false; }; }, { "clickOnIcon": "clickOnIcon"; }, never, never, false, never>;
 }

package/lib/components/gravity-tab-secondary/gravity-tab-secondary.component.d.ts

@@ -4,6 +4,7 @@ export declare class GravityTabSecondaryComponent {
     tabs: {
         title: string;
         icon: string;
+        cypressTag: string;
     }[];
     selected: number;
     pressed: EventEmitter<number>;

package/lib/gravity-design-system.module.d.ts

@@ -48,16 +48,17 @@ import * as i46 from "./components/gravity-calendar-v2/datepicker/bs-daterangepi
 import * as i47 from "./components/gravity-modal/gravity-modal.component";
 import * as i48 from "./components/gravity-link/gravity-link.component";
 import * as i49 from "./components/gravity-tab-secondary/gravity-tab-secondary.component";
-import * as i50 from "angular-svg-icon";
-import * as i51 from "angular-svg-icon-preloader";
-import * as i52 from "ngx-bootstrap/datepicker";
-import * as i53 from "@angular/common";
-import * as i54 from "@angular/forms";
-import * as i55 from "./vendor/gravity-tooltip/gravity-tooltip.module";
-import * as i56 from "@ng-bootstrap/ng-bootstrap";
-import * as i57 from "@angular/router";
+import * as i50 from "./components/gravity-chip/gravity-chip.component";
+import * as i51 from "angular-svg-icon";
+import * as i52 from "angular-svg-icon-preloader";
+import * as i53 from "ngx-bootstrap/datepicker";
+import * as i54 from "@angular/common";
+import * as i55 from "@angular/forms";
+import * as i56 from "./vendor/gravity-tooltip/gravity-tooltip.module";
+import * as i57 from "@ng-bootstrap/ng-bootstrap";
+import * as i58 from "@angular/router";
 export declare class GravityDesignSystemModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<GravityDesignSystemModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<GravityDesignSystemModule, [typeof i1.GravityAttachFileComponent, typeof i2.GravityAvatarStackComponent, typeof i3.GravityGenericAvatarComponent, typeof i4.GravityButtonComponent, typeof i5.GravityCalendarComponent, typeof i6.GravityCalendarV2Component, typeof i7.GravityCardListComponent, typeof i8.GravityCheckboxComponent, typeof i9.GravityCurrencyComponent, typeof i10.GravityCurrencyDisplayComponent, typeof i11.GravityDialogComponent, typeof i12.GravityDropdownListComponent, typeof i13.GravityDropdownListDisplayComponent, typeof i14.GravityIconButtonComponent, typeof i15.GravityIconComponent, typeof i16.GravityMultiLanguageComponent, typeof i17.GravityNetworkPillComponent, typeof i18.GravityNotificationComponent, typeof i19.GravityNotificationInstantContainerComponent, typeof i20.GravityOffcanvasComponent, typeof i21.GravityRadioButtonComponent, typeof i22.GravityStatusIndicatorComponent, typeof i23.GravityStepperComponent, typeof i24.GravitySwitchComponent, typeof i25.GravityTableComponent, typeof i26.GravityTextFieldComponent, typeof i27.GravityTextFieldNumberOnlyComponent, typeof i28.GravityTreeViewComponent, typeof i29.NodeComponent, typeof i30.NodeToggleComponent, typeof i31.NodeCheckboxComponent, typeof i32.NodeNameComponent, typeof i33.FilterByPipe, typeof i34.BsDatepickerDayDecoratorComponent, typeof i35.BsDatepickerNavigationViewComponent, typeof i36.BsDaysCalendarViewComponent, typeof i37.BsMonthCalendarViewComponent, typeof i38.BsYearsCalendarViewComponent, typeof i39.BsDatepickerContainerComponent, typeof i40.BsDatepickerDirective, typeof i41.BsDatepickerInlineContainerComponent, typeof i42.BsDatepickerInlineDirective, typeof i43.BsDaterangepickerContainerComponent, typeof i44.BsDaterangepickerDirective, typeof i45.BsDaterangepickerInlineContainerComponent, typeof i46.BsDaterangepickerInlineDirective, typeof i47.GravityModalComponent, typeof i48.GravityLinkComponent, typeof i49.GravityTabSecondaryComponent], [typeof i50.AngularSvgIconModule, typeof i51.AngularSvgIconPreloaderModule, typeof i52.BsDatepickerModule, typeof i53.CommonModule, typeof i54.FormsModule, typeof i55.GravityTooltipModule, typeof i56.NgbDatepickerModule, typeof i56.NgbOffcanvasModule, typeof i56.NgbProgressbarModule, typeof i56.NgbToastModule, typeof i54.ReactiveFormsModule, typeof i57.RouterLink], [typeof i1.GravityAttachFileComponent, typeof i2.GravityAvatarStackComponent, typeof i3.GravityGenericAvatarComponent, typeof i4.GravityButtonComponent, typeof i5.GravityCalendarComponent, typeof i6.GravityCalendarV2Component, typeof i7.GravityCardListComponent, typeof i8.GravityCheckboxComponent, typeof i9.GravityCurrencyComponent, typeof i10.GravityCurrencyDisplayComponent, typeof i11.GravityDialogComponent, typeof i12.GravityDropdownListComponent, typeof i13.GravityDropdownListDisplayComponent, typeof i14.GravityIconButtonComponent, typeof i15.GravityIconComponent, typeof i16.GravityMultiLanguageComponent, typeof i17.GravityNetworkPillComponent, typeof i19.GravityNotificationInstantContainerComponent, typeof i20.GravityOffcanvasComponent, typeof i21.GravityRadioButtonComponent, typeof i22.GravityStatusIndicatorComponent, typeof i23.GravityStepperComponent, typeof i24.GravitySwitchComponent, typeof i25.GravityTableComponent, typeof i26.GravityTextFieldComponent, typeof i27.GravityTextFieldNumberOnlyComponent, typeof i55.GravityTooltipModule, typeof i28.GravityTreeViewComponent, typeof i47.GravityModalComponent, typeof i48.GravityLinkComponent, typeof i49.GravityTabSecondaryComponent]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<GravityDesignSystemModule, [typeof i1.GravityAttachFileComponent, typeof i2.GravityAvatarStackComponent, typeof i3.GravityGenericAvatarComponent, typeof i4.GravityButtonComponent, typeof i5.GravityCalendarComponent, typeof i6.GravityCalendarV2Component, typeof i7.GravityCardListComponent, typeof i8.GravityCheckboxComponent, typeof i9.GravityCurrencyComponent, typeof i10.GravityCurrencyDisplayComponent, typeof i11.GravityDialogComponent, typeof i12.GravityDropdownListComponent, typeof i13.GravityDropdownListDisplayComponent, typeof i14.GravityIconButtonComponent, typeof i15.GravityIconComponent, typeof i16.GravityMultiLanguageComponent, typeof i17.GravityNetworkPillComponent, typeof i18.GravityNotificationComponent, typeof i19.GravityNotificationInstantContainerComponent, typeof i20.GravityOffcanvasComponent, typeof i21.GravityRadioButtonComponent, typeof i22.GravityStatusIndicatorComponent, typeof i23.GravityStepperComponent, typeof i24.GravitySwitchComponent, typeof i25.GravityTableComponent, typeof i26.GravityTextFieldComponent, typeof i27.GravityTextFieldNumberOnlyComponent, typeof i28.GravityTreeViewComponent, typeof i29.NodeComponent, typeof i30.NodeToggleComponent, typeof i31.NodeCheckboxComponent, typeof i32.NodeNameComponent, typeof i33.FilterByPipe, typeof i34.BsDatepickerDayDecoratorComponent, typeof i35.BsDatepickerNavigationViewComponent, typeof i36.BsDaysCalendarViewComponent, typeof i37.BsMonthCalendarViewComponent, typeof i38.BsYearsCalendarViewComponent, typeof i39.BsDatepickerContainerComponent, typeof i40.BsDatepickerDirective, typeof i41.BsDatepickerInlineContainerComponent, typeof i42.BsDatepickerInlineDirective, typeof i43.BsDaterangepickerContainerComponent, typeof i44.BsDaterangepickerDirective, typeof i45.BsDaterangepickerInlineContainerComponent, typeof i46.BsDaterangepickerInlineDirective, typeof i47.GravityModalComponent, typeof i48.GravityLinkComponent, typeof i49.GravityTabSecondaryComponent, typeof i50.GravityChipComponent], [typeof i51.AngularSvgIconModule, typeof i52.AngularSvgIconPreloaderModule, typeof i53.BsDatepickerModule, typeof i54.CommonModule, typeof i55.FormsModule, typeof i56.GravityTooltipModule, typeof i57.NgbDatepickerModule, typeof i57.NgbOffcanvasModule, typeof i57.NgbProgressbarModule, typeof i57.NgbToastModule, typeof i55.ReactiveFormsModule, typeof i58.RouterLink], [typeof i1.GravityAttachFileComponent, typeof i2.GravityAvatarStackComponent, typeof i3.GravityGenericAvatarComponent, typeof i4.GravityButtonComponent, typeof i5.GravityCalendarComponent, typeof i6.GravityCalendarV2Component, typeof i7.GravityCardListComponent, typeof i8.GravityCheckboxComponent, typeof i9.GravityCurrencyComponent, typeof i10.GravityCurrencyDisplayComponent, typeof i11.GravityDialogComponent, typeof i12.GravityDropdownListComponent, typeof i13.GravityDropdownListDisplayComponent, typeof i14.GravityIconButtonComponent, typeof i15.GravityIconComponent, typeof i16.GravityMultiLanguageComponent, typeof i17.GravityNetworkPillComponent, typeof i19.GravityNotificationInstantContainerComponent, typeof i20.GravityOffcanvasComponent, typeof i21.GravityRadioButtonComponent, typeof i22.GravityStatusIndicatorComponent, typeof i23.GravityStepperComponent, typeof i24.GravitySwitchComponent, typeof i25.GravityTableComponent, typeof i26.GravityTextFieldComponent, typeof i27.GravityTextFieldNumberOnlyComponent, typeof i56.GravityTooltipModule, typeof i28.GravityTreeViewComponent, typeof i47.GravityModalComponent, typeof i48.GravityLinkComponent, typeof i49.GravityTabSecondaryComponent, typeof i50.GravityChipComponent]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<GravityDesignSystemModule>;
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@progressio_resources/gravity-design-system",
   "description": "Gravity Design System",
-  "version": "3.0.13",
+  "version": "3.0.14",
   "license": "SEE LICENSE IN LIBRARY-LICENSE",
   "peerDependencies": {
     "@angular/common": "^16.2.12",

package/public-api.d.ts

@@ -29,6 +29,7 @@ export * from './lib/components/gravity-generic-avatar/gravity-generic-avatar.co
 export * from './lib/components/gravity-modal/gravity-modal.component';
 export * from './lib/components/gravity-link/gravity-link.component';
 export * from './lib/components/gravity-tab-secondary/gravity-tab-secondary.component';
+export * from './lib/components/gravity-chip/gravity-chip.component';
 export * from './lib/services/gravity-dialog-manager.service';
 export * from './lib/vendor/gravity-tooltip';
 export * from './lib/components/gravity-notification/gravity-notification-content.interface';

package/src/lib/assets/icon-set/gt-icon-off/gt-icon-off-lg-24.svg

@@ -0,0 +1,10 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1567)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M7.61929 1.27593C7.69255 0.827068 8.05165 0.5 8.47121 0.5H17.6348C17.95 0.5 18.2403 0.686275 18.3925 0.986219C18.5447 1.28616 18.5347 1.6523 18.3664 1.94192L14.2777 8.97922H16.5442C16.8574 8.97922 17.1461 9.16313 17.2991 9.46005C17.4521 9.75698 17.4455 10.1206 17.2818 10.4107L9.5849 24.0512C9.36858 24.4345 8.93268 24.5978 8.54491 24.4406C8.15714 24.2835 7.9261 23.8499 7.99368 23.4063L9.23109 15.2833H6.36522C6.10932 15.2833 5.86655 15.1603 5.70216 14.9472C5.53776 14.7341 5.46862 14.4529 5.5133 14.1791L7.61929 1.27593ZM9.19649 2.38018L7.39737 13.4032H10.2513C10.5054 13.4032 10.7467 13.5246 10.9111 13.7352C11.0755 13.9458 11.1464 14.2243 11.1049 14.4968L10.4239 18.9672L14.9988 10.8594H12.7083C12.393 10.8594 12.1028 10.6731 11.9506 10.3732C11.7984 10.0732 11.8084 9.7071 11.9766 9.41747L16.0654 2.38018H9.19649Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1567">
+<rect width="24" height="24" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-off/gt-icon-off-md-16.svg

@@ -0,0 +1,10 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1565)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M5.01459 1.0254C5.06407 0.722677 5.33058 0.5 5.64342 0.5H11.7633C11.9902 0.5 12.1999 0.618321 12.3139 0.810602C12.4279 1.00288 12.4289 1.24008 12.3165 1.43325L9.56933 6.15482H11.0349C11.2604 6.15482 11.4691 6.27168 11.5836 6.46206C11.698 6.65244 11.7013 6.88796 11.592 7.08128L6.4517 16.1782C6.30246 16.4423 5.98171 16.5638 5.68998 16.4668C5.39825 16.3698 5.21918 16.0821 5.26473 15.7835L6.0931 10.3534H4.23694C4.05045 10.3534 3.87332 10.2733 3.75232 10.1342C3.63133 9.9951 3.57862 9.81103 3.60812 9.63056L5.01459 1.0254ZM6.18637 1.74822L4.98391 9.10516H6.83222C7.01756 9.10516 7.19371 9.18428 7.31468 9.32189C7.43566 9.45949 7.48947 9.64191 7.46207 9.82155L7.04582 12.5501L9.95427 7.40304H8.47311C8.2462 7.40304 8.03643 7.28472 7.92245 7.09244C7.80847 6.90016 7.80749 6.66296 7.91988 6.46979L10.667 1.74822H6.18637Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1565">
+<rect width="16" height="16" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-off/gt-icon-off-sm-12.svg

@@ -0,0 +1,10 @@
+<svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1563)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3.81608 0.926483C3.85479 0.680754 4.06333 0.5 4.30812 0.5H8.70174C8.87929 0.5 9.04343 0.596045 9.13262 0.752125C9.2218 0.908206 9.22257 1.10074 9.13462 1.25755L7.1974 4.71157H8.17883C8.35527 4.71157 8.51856 4.80643 8.60814 4.96097C8.69772 5.11551 8.70024 5.30669 8.61476 5.46361L4.92436 12.2388C4.80758 12.4531 4.55661 12.5518 4.32834 12.4731C4.10007 12.3943 3.95995 12.1608 3.99559 11.9184L4.58325 7.92214H3.29836C3.15243 7.92214 3.01384 7.8571 2.91916 7.74421C2.82449 7.63131 2.78324 7.48189 2.80632 7.3354L3.81608 0.926483ZM4.73296 1.51322L3.88285 6.90892H5.1616C5.30662 6.90892 5.44445 6.97315 5.53911 7.08484C5.63377 7.19654 5.67587 7.34461 5.65443 7.49043L5.38925 9.29378L7.33327 5.72479H6.33964C6.16209 5.72479 5.99795 5.62875 5.90876 5.47267C5.81957 5.31659 5.81881 5.12405 5.90676 4.96724L7.84398 1.51322H4.73296Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1563">
+<rect width="12" height="12" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-off/gt-icon-off-xl-32.svg

@@ -0,0 +1,10 @@
+<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1569)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M10.1641 1.46203C10.2557 0.905511 10.7045 0.5 11.2289 0.5H23.6187C24.0127 0.5 24.3755 0.730952 24.5657 1.10283C24.7559 1.47471 24.7434 1.92867 24.5331 2.28776L18.9191 11.873H22.1441C22.5356 11.873 22.8964 12.101 23.0877 12.4692C23.2789 12.8373 23.2706 13.2881 23.066 13.6478L12.6592 31.9435C12.3889 32.4188 11.8441 32.6212 11.3594 32.4264C10.8748 32.2315 10.586 31.694 10.6705 31.144L12.3606 20.1379H8.38141C8.06159 20.1379 7.75817 19.9853 7.55271 19.7211C7.34725 19.4569 7.26082 19.1082 7.31667 18.7688L10.1641 1.46203ZM12.1353 2.83112L9.67141 17.8068H13.6356C13.9533 17.8068 14.2549 17.9573 14.4604 18.2184C14.6658 18.4796 14.7544 18.8249 14.7025 19.1627L13.7078 25.6402L20.2127 14.2041H16.9577C16.5637 14.2041 16.2009 13.9732 16.0107 13.6013C15.8205 13.2294 15.833 12.7755 16.0433 12.4164L21.6572 2.83112H12.1353Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1569">
+<rect width="32" height="32" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-on/gt-icon-on-lg-24.svg

@@ -0,0 +1,10 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1549)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M8.56326 0.5C8.06604 0.5 7.64245 0.861508 7.5638 1.35297L5.51275 14.1708C5.46587 14.4638 5.54964 14.7626 5.74195 14.9884C5.93426 15.2142 6.21578 15.3443 6.5122 15.3443H9.12212L7.92845 23.3369C7.85605 23.8216 8.14066 24.2887 8.60433 24.4462C9.06801 24.6036 9.5778 24.4063 9.81501 23.9775L17.3111 10.4272C17.4848 10.1134 17.4796 9.73102 17.2977 9.42194C17.1157 9.11287 16.784 8.92315 16.4256 8.92315H14.4321L18.3671 2.0151C18.5457 1.70149 18.5442 1.31641 18.363 1.00425C18.1819 0.69209 17.8484 0.5 17.4878 0.5H8.56326Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1549">
+<rect width="24" height="24" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-on/gt-icon-on-md-16.svg

@@ -0,0 +1,10 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1547)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M5.67369 0.5C5.33711 0.5 5.05037 0.741005 4.99713 1.06864L3.60873 9.61387C3.57699 9.8092 3.6337 10.0084 3.76388 10.1589C3.89406 10.3095 4.08463 10.3962 4.28528 10.3962H6.052L5.24397 15.7246C5.19497 16.0477 5.38762 16.3591 5.70149 16.4641C6.01537 16.5691 6.36046 16.4375 6.52102 16.1517L11.5953 7.11815C11.7129 6.90892 11.7094 6.65401 11.5862 6.44796C11.463 6.24191 11.2385 6.11544 10.9959 6.11544H9.64646L12.3101 1.51007C12.4311 1.30099 12.43 1.04428 12.3074 0.836168C12.1847 0.62806 11.959 0.5 11.7149 0.5H5.67369Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1547">
+<rect width="16" height="16" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-on/gt-icon-on-sm-12.svg

@@ -0,0 +1,3 @@
+<svg width="8" height="13" viewBox="0 0 8 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M2.30811 0.5C2.06333 0.5 1.85479 0.680754 1.81608 0.926484L0.806325 7.3354C0.783244 7.4819 0.824485 7.63131 0.919162 7.74421C1.01384 7.85711 1.15243 7.92214 1.29836 7.92214H2.58325L1.99559 11.9184C1.95995 12.1608 2.10006 12.3944 2.32834 12.4731C2.55661 12.5518 2.80758 12.4531 2.92436 12.2388L6.61476 5.46361C6.70023 5.30669 6.69771 5.11551 6.60813 4.96097C6.51855 4.80643 6.35527 4.71158 6.17883 4.71158H5.1974L7.13462 1.25755C7.22256 1.10074 7.2218 0.908206 7.13261 0.752126C7.04342 0.596045 6.87928 0.5 6.70173 0.5H2.30811Z" fill="var(--icon-color, #394C6E)"/>
+</svg>

package/src/lib/assets/icon-set/gt-icon-on/gt-icon-on-xl-32.svg

@@ -0,0 +1,10 @@
+<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1551)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M11.4001 0.5C10.7346 0.5 10.1676 0.98201 10.0624 1.63729L7.31711 18.7277C7.25436 19.1184 7.36649 19.5168 7.62389 19.8179C7.88129 20.119 8.2581 20.2924 8.65484 20.2924H12.1481L10.5504 30.9491C10.4535 31.5955 10.8345 32.2183 11.4551 32.4282C12.0757 32.6382 12.758 32.3751 13.0755 31.8034L23.1088 13.7363C23.3412 13.3178 23.3343 12.808 23.0908 12.3959C22.8472 11.9838 22.4033 11.7309 21.9236 11.7309H19.2553L24.5222 2.52014C24.7613 2.10198 24.7592 1.58855 24.5167 1.17234C24.2742 0.75612 23.828 0.5 23.3453 0.5H11.4001Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1551">
+<rect width="32" height="32" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-security/gt-icon-security-sm-12.svg

@@ -0,0 +1,3 @@
+<svg width="12" height="12" viewBox="0 0 12 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M3.72314 1.82621C3.72314 1.34001 4.12491 0.945869 4.62052 0.945869H7.37948C7.87509 0.945869 8.27686 1.34001 8.27686 1.82621V4.2111H3.72314V1.82621ZM2.75895 1.82621C2.75895 0.817623 3.59241 0 4.62052 0H7.37948C8.40759 0 9.24105 0.817623 9.24105 1.82621V4.2111H11.5179C11.7842 4.2111 12 4.42284 12 4.68403V11.5271C12 11.7883 11.7842 12 11.5179 12H0.482091C0.215839 12 0 11.7883 0 11.5271V4.68403C0 4.42284 0.215839 4.2111 0.482091 4.2111H2.75895V1.82621ZM0.964182 11.0541V5.15697H11.0358V11.0541H0.964182ZM6.4239 7.88034C6.4239 7.61915 6.20806 7.40741 5.94181 7.40741C5.67556 7.40741 5.45972 7.61915 5.45972 7.88034V9.01994C5.45972 9.28114 5.67556 9.49288 5.94181 9.49288C6.20806 9.49288 6.4239 9.28114 6.4239 9.01994V7.88034Z" fill="var(--icon-color, #394C6E)"/>
+</svg>

package/src/lib/assets/icon-set/gt-icon-stop/gt-icon-stop-lg-24.svg

@@ -0,0 +1,10 @@
+<svg width="24" height="25" viewBox="0 0 24 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1585)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M18.4884 20.2998C16.7296 21.7644 14.4677 22.6455 12 22.6455C6.39682 22.6455 1.85455 18.1032 1.85455 12.5C1.85455 10.0323 2.73558 7.77037 4.20025 6.0116L18.4884 20.2998ZM19.7998 18.9884L5.51161 4.70024C7.27037 3.23557 9.5323 2.35455 12 2.35455C17.6032 2.35455 22.1455 6.89682 22.1455 12.5C22.1455 14.9677 21.2644 17.2296 19.7998 18.9884ZM24 12.5C24 19.1274 18.6274 24.5 12 24.5C5.37258 24.5 0 19.1274 0 12.5C0 5.87258 5.37258 0.5 12 0.5C18.6274 0.5 24 5.87258 24 12.5Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1585">
+<rect width="24" height="24" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-stop/gt-icon-stop-md-16.svg

@@ -0,0 +1,10 @@
+<svg width="16" height="17" viewBox="0 0 16 17" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1583)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.3028 13.6918C11.1352 14.6605 9.63563 15.2429 8 15.2429C4.27602 15.2429 1.25714 12.224 1.25714 8.5C1.25714 6.86437 1.83952 5.36475 2.80823 4.19721L12.3028 13.6918ZM13.1917 12.8028L3.69716 3.30827C4.86471 2.33954 6.36434 1.75714 8 1.75714C11.724 1.75714 14.7429 4.77602 14.7429 8.5C14.7429 10.1357 14.1605 11.6353 13.1917 12.8028ZM16 8.5C16 12.9183 12.4183 16.5 8 16.5C3.58172 16.5 0 12.9183 0 8.5C0 4.08172 3.58172 0.5 8 0.5C12.4183 0.5 16 4.08172 16 8.5Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1583">
+<rect width="16" height="16" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-stop/gt-icon-stop-sm-12.svg

@@ -0,0 +1,10 @@
+<svg width="12" height="13" viewBox="0 0 12 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1581)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M9.16878 10.373C8.30588 11.0799 7.20247 11.504 6 11.504C3.23637 11.504 0.996 9.26363 0.996 6.5C0.996 5.29753 1.42014 4.19412 2.12697 3.33122L9.16878 10.373ZM9.87306 9.66874L2.83126 2.62694C3.69415 1.92013 4.79755 1.496 6 1.496C8.76363 1.496 11.004 3.73637 11.004 6.5C11.004 7.70245 10.5799 8.80585 9.87306 9.66874ZM12 6.5C12 9.81371 9.31371 12.5 6 12.5C2.68629 12.5 0 9.81371 0 6.5C0 3.18629 2.68629 0.5 6 0.5C9.31371 0.5 12 3.18629 12 6.5Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1581">
+<rect width="12" height="12" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/icon-set/gt-icon-stop/gt-icon-stop-xl-32.svg

@@ -0,0 +1,10 @@
+<svg width="32" height="33" viewBox="0 0 32 33" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_7569_1587)">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M24.7889 26.9488C22.414 28.9485 19.3477 30.1533 16 30.1533C8.45947 30.1533 2.34667 24.0405 2.34667 16.5C2.34667 13.1523 3.55152 10.086 5.55124 7.71107L24.7889 26.9488ZM26.4483 25.2895L7.21054 6.05168C9.58554 4.05169 12.652 2.84667 16 2.84667C23.5405 2.84667 29.6533 8.95947 29.6533 16.5C29.6533 19.848 28.4483 22.9145 26.4483 25.2895ZM32 16.5C32 25.3366 24.8366 32.5 16 32.5C7.16344 32.5 0 25.3366 0 16.5C0 7.66344 7.16344 0.5 16 0.5C24.8366 0.5 32 7.66344 32 16.5Z" fill="var(--icon-color, #394C6E)"/>
+</g>
+<defs>
+<clipPath id="clip0_7569_1587">
+<rect width="32" height="32" fill="white" transform="translate(0 0.5)"/>
+</clipPath>
+</defs>
+</svg>

package/src/lib/assets/json/icons.json

@@ -576,6 +576,38 @@
       "iconName": "gt-icon-news-xl-32",
       "iconPath": "/assets/gravity/icon-set/gt-icon-news/gt-icon-news-xl-32.svg"
     },
+    {
+      "iconName": "gt-icon-off-lg-24",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-off/gt-icon-off-lg-24.svg"
+    },
+    {
+      "iconName": "gt-icon-off-md-16",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-off/gt-icon-off-md-16.svg"
+    },
+    {
+      "iconName": "gt-icon-off-sm-12",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-off/gt-icon-off-sm-12.svg"
+    },
+    {
+      "iconName": "gt-icon-off-xl-32",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-off/gt-icon-off-xl-32.svg"
+    },
+    {
+      "iconName": "gt-icon-on-lg-24",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-on/gt-icon-on-lg-24.svg"
+    },
+    {
+      "iconName": "gt-icon-on-md-16",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-on/gt-icon-on-md-16.svg"
+    },
+    {
+      "iconName": "gt-icon-on-sm-12",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-on/gt-icon-on-sm-12.svg"
+    },
+    {
+      "iconName": "gt-icon-on-xl-32",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-on/gt-icon-on-xl-32.svg"
+    },
     {
       "iconName": "gt-icon-payout-lg-24",
       "iconPath": "/assets/gravity/icon-set/gt-icon-payout/gt-icon-payout-lg-24.svg"
@@ -736,6 +768,22 @@
       "iconName": "gt-icon-sign-out-xl-32",
       "iconPath": "/assets/gravity/icon-set/gt-icon-sign-out/gt-icon-sign-out-xl-32.svg"
     },
+    {
+      "iconName": "gt-icon-stop-lg-24",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-stop/gt-icon-stop-lg-24.svg"
+    },
+    {
+      "iconName": "gt-icon-stop-md-16",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-stop/gt-icon-stop-md-16.svg"
+    },
+    {
+      "iconName": "gt-icon-stop-sm-12",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-stop/gt-icon-stop-sm-12.svg"
+    },
+    {
+      "iconName": "gt-icon-stop-xl-32",
+      "iconPath": "/assets/gravity/icon-set/gt-icon-stop/gt-icon-stop-xl-32.svg"
+    },
     {
       "iconName": "gt-icon-success-circle-lg-24",
       "iconPath": "/assets/gravity/icon-set/gt-icon-success-circle/gt-icon-success-circle-lg-24.svg"

package/src/lib/styles/foundations/colors/themes/_hero.theme.scss

@@ -511,9 +511,9 @@ $on-bg-menu-badge-button-dark: $n100;
 $bg-menu-badge-button-dark: $b800;
 
 // icon-button
-$on-bg-icon-button-active-light: $b400;
+$on-bg-icon-button-active-light: $b500;
 $on-bg-icon-button-active-dark: $n900;
-$on-bg-icon-button-hover-light: $b400;
+$on-bg-icon-button-hover-light: $b500;
 $on-bg-icon-button-hover-dark: $n900;
 $bg-icon-button-hover-light: $n800;
 $bg-icon-button-hover-dark: $n400;
@@ -527,6 +527,8 @@ $bg-icon-button-pressed-light: $n700;
 $bg-icon-button-pressed-dark: $n300;
 $on-bg-icon-button-disabled-light: $n700;
 $on-bg-icon-button-disabled-dark: $n400;
+$cl-icon-button-support-text-light: $n900;
+$bg-icon-button-support-text-light: $b200;
 
 // generic-avatar
 $cl-generic-avatar-label-primary-light: $n400;
@@ -542,6 +544,24 @@ $cl-generic-avatar-initials-text-primary-dark: $n500;
 $cl-generic-avatar-initials-text-disabled-light: $n600;
 $cl-generic-avatar-initials-text-disabled-dark: $n500;
 
+// Chip
+$cl-chip-disabled-state-light: $n600;
+$cl-chip-disabled-state-dark: $n500;
+$cl-chip-active-primary-light: $b400;
+$cl-chip-active-primary-dark: $n900;
+$bg-chip-active-primary-light: $n900;
+$bg-chip-active-primary-dark: $n100;
+$cl-chip-active-close-button-light: $b400;
+$cl-chip-active-close-button-dark: $n900;
+$bg-chip-active-close-button-light: $n800;
+$bg-chip-active-close-button-dark: $n200;
+$bg-chip-active-hover-light: $b800;
+$bg-chip-active-hover-dark: $n400;
+$cl-chip-active-close-button-hover-light: $n900;
+$cl-chip-active-close-button-hover-dark: $n100;
+$bg-chip-active-close-button-hover-light: $b400;
+$bg-chip-active-close-button-hover-dark: $n900;
+
 // currencies
 $on-bg-currency: $c1;
 $btc-primary-light: $c10;

package/src/lib/styles/foundations/colors/tokens/_hero.tokens.scss

@@ -307,6 +307,16 @@
   --cl-generic-avatar-initial-text-primary: #{$cl-generic-avatar-initials-text-primary-light};
   --cl-generic-avatar-initial-text-disabled: #{$cl-generic-avatar-initials-text-disabled-light};
 
+  // chip
+  --cl-chip-disabled-state: #{$cl-chip-disabled-state-light};
+  --cl-chip-active-primary: #{$cl-chip-active-primary-light};
+  --bg-chip-active-primary: #{$bg-chip-active-primary-light};
+  --cl-chip-active-close-button: #{$cl-chip-active-close-button-light};
+  --bg-chip-active-close-button: #{$bg-chip-active-close-button-light};
+  --bg-chip-active-hover: #{$bg-chip-active-hover-light};
+  --cl-chip-active-close-button-hover: #{$cl-chip-active-close-button-hover-light};
+  --bg-chip-active-close-button-hover: #{$bg-chip-active-close-button-hover-light};
+
   // Currencies 
   --btc-primary: #{$btc-primary-light};
   --busd-primary: #{$busd-primary-light};
@@ -649,6 +659,16 @@
   --bg-generic-avatar-initials-disabled: #{$bg-generic-avatar-initials-disabled-dark};
   --cl-generic-avatar-initial-text-primary: #{$cl-generic-avatar-initials-text-primary-dark};
   --cl-generic-avatar-initial-text-disabled: #{$cl-generic-avatar-initials-text-disabled-dark};
+  
+  //chip
+  --cl-chip-disabled-state: #{$cl-chip-disabled-state-dark};
+  --cl-chip-active-primary: #{$cl-chip-active-primary-dark};
+  --bg-chip-active-primary: #{$bg-chip-active-primary-dark};
+  --cl-chip-active-close-button: #{$cl-chip-active-close-button-dark};
+  --bg-chip-active-close-button: #{$bg-chip-active-close-button-dark};
+  --bg-chip-active-hover: #{$bg-chip-active-hover-dark};
+  --cl-chip-active-close-button-hover: #{$cl-chip-active-close-button-hover-dark};
+  --bg-chip-active-close-button-hover: #{$bg-chip-active-close-button-hover-dark};
 
   // Currencies
   --btc-primary: #{$c10};