@bethinkpl/design-system 39.1.0 → 40.0.0

package/dist/lib/js/components/SurveyQuestions/SurveyQuestionScale/SurveyQuestionScale.vue.d.ts

@@ -45,6 +45,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     ICONS: Readonly<{
         readonly ANSWERS: VueConstructor<Vue>;
         readonly CHANGE: VueConstructor<Vue>;
+        readonly COMMENT_LOCK: VueConstructor<Vue>;
         readonly COMMENTS_CHECK: VueConstructor<Vue>;
         readonly HEAD_WITH_QUESTION_MARK: VueConstructor<Vue>;
         readonly HIDE_ANSWERS: VueConstructor<Vue>;
@@ -146,6 +147,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         readonly FA_CODE_SIMPLE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_CODE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_DOTS: import('@fortawesome/fontawesome-common-types').IconDefinition;
+        readonly FA_COMMENT_PLUS: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_SOLID: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENTS_QUESTION_CHECK: import('@fortawesome/fontawesome-common-types').IconDefinition;
@@ -473,17 +475,23 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             dividerUnderHeader: {
                 type: import('vue').PropType<boolean>;
             };
-            hasBorder: {
+            hasRibbon: {
                 type: import('vue').PropType<boolean>;
             };
-            borderPosition: {
-                type: import('vue').PropType<import('../../Cards/Card').CardBorderPositions>;
+            hasRadius: {
+                type: import('vue').PropType<boolean>;
             };
-            borderSize: {
-                type: import('vue').PropType<import('../../Cards/Card').CardBorderSizes>;
+            backgroundColor: {
+                type: import('vue').PropType<import('../../Cards/Card').CardBackgroundColor>;
             };
-            borderColor: {
-                type: import('vue').PropType<import('../../Cards/Card').CardBorderColors>;
+            ribbonPosition: {
+                type: import('vue').PropType<import('../../Cards/Card').CardRibbonPositions>;
+            };
+            ribbonSize: {
+                type: import('vue').PropType<import('../../Cards/Card').CardRibbonSizes>;
+            };
+            ribbonColor: {
+                type: import('vue').PropType<import('../../Cards/Card').CardRibbonColors>;
             };
             hasRibbonRadius: {
                 type: import('vue').PropType<boolean>;
@@ -503,6 +511,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             isContentScrollable: {
                 type: import('vue').PropType<boolean>;
             };
+            hasBorder: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to hasRibbon">>;
+            };
+            borderPosition: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonPosition">>;
+            };
+            borderSize: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonSize">>;
+            };
+            borderColor: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonColor">>;
+            };
         }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
             P: {};
             B: {};
@@ -526,17 +546,23 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             dividerUnderHeader: {
                 type: import('vue').PropType<boolean>;
             };
-            hasBorder: {
+            hasRibbon: {
                 type: import('vue').PropType<boolean>;
             };
-            borderPosition: {
-                type: import('vue').PropType<import('../../Cards/Card').CardBorderPositions>;
+            hasRadius: {
+                type: import('vue').PropType<boolean>;
             };
-            borderSize: {
-                type: import('vue').PropType<import('../../Cards/Card').CardBorderSizes>;
+            backgroundColor: {
+                type: import('vue').PropType<import('../../Cards/Card').CardBackgroundColor>;
             };
-            borderColor: {
-                type: import('vue').PropType<import('../../Cards/Card').CardBorderColors>;
+            ribbonPosition: {
+                type: import('vue').PropType<import('../../Cards/Card').CardRibbonPositions>;
+            };
+            ribbonSize: {
+                type: import('vue').PropType<import('../../Cards/Card').CardRibbonSizes>;
+            };
+            ribbonColor: {
+                type: import('vue').PropType<import('../../Cards/Card').CardRibbonColors>;
             };
             hasRibbonRadius: {
                 type: import('vue').PropType<boolean>;
@@ -556,6 +582,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             isContentScrollable: {
                 type: import('vue').PropType<boolean>;
             };
+            hasBorder: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to hasRibbon">>;
+            };
+            borderPosition: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonPosition">>;
+            };
+            borderSize: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonSize">>;
+            };
+            borderColor: {
+                type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonColor">>;
+            };
         }>> & Readonly<{}>, {}, {}, {}, {}, {}>;
         __isFragment?: never;
         __isTeleport?: never;
@@ -576,17 +614,23 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         dividerUnderHeader: {
             type: import('vue').PropType<boolean>;
         };
-        hasBorder: {
+        hasRibbon: {
             type: import('vue').PropType<boolean>;
         };
-        borderPosition: {
-            type: import('vue').PropType<import('../../Cards/Card').CardBorderPositions>;
+        hasRadius: {
+            type: import('vue').PropType<boolean>;
         };
-        borderSize: {
-            type: import('vue').PropType<import('../../Cards/Card').CardBorderSizes>;
+        backgroundColor: {
+            type: import('vue').PropType<import('../../Cards/Card').CardBackgroundColor>;
         };
-        borderColor: {
-            type: import('vue').PropType<import('../../Cards/Card').CardBorderColors>;
+        ribbonPosition: {
+            type: import('vue').PropType<import('../../Cards/Card').CardRibbonPositions>;
+        };
+        ribbonSize: {
+            type: import('vue').PropType<import('../../Cards/Card').CardRibbonSizes>;
+        };
+        ribbonColor: {
+            type: import('vue').PropType<import('../../Cards/Card').CardRibbonColors>;
         };
         hasRibbonRadius: {
             type: import('vue').PropType<boolean>;
@@ -606,6 +650,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         isContentScrollable: {
             type: import('vue').PropType<boolean>;
         };
+        hasBorder: {
+            type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to hasRibbon">>;
+        };
+        borderPosition: {
+            type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonPosition">>;
+        };
+        borderSize: {
+            type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonSize">>;
+        };
+        borderColor: {
+            type: import('vue').PropType<import('../../../utils/type.utils').RemovedProp<"renamed to ribbonColor">>;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
         $slots: Readonly<{
             header?: () => any;
@@ -673,6 +729,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         ICONS: Readonly<{
             readonly ANSWERS: VueConstructor<Vue>;
             readonly CHANGE: VueConstructor<Vue>;
+            readonly COMMENT_LOCK: VueConstructor<Vue>;
             readonly COMMENTS_CHECK: VueConstructor<Vue>;
             readonly HEAD_WITH_QUESTION_MARK: VueConstructor<Vue>;
             readonly HIDE_ANSWERS: VueConstructor<Vue>;
@@ -774,6 +831,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             readonly FA_CODE_SIMPLE: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_CODE: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENT_DOTS: import('@fortawesome/fontawesome-common-types').IconDefinition;
+            readonly FA_COMMENT_PLUS: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENT_SOLID: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENT: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENTS_QUESTION_CHECK: import('@fortawesome/fontawesome-common-types').IconDefinition;
@@ -1056,9 +1114,9 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         type: string;
         touchableDeprecated: boolean;
         color: string;
-        elevation: string;
         radius: string;
         state: string;
+        elevation: string;
         colorScheme: string;
     }, {}, {
         WnlIcon: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
@@ -1412,6 +1470,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         ICONS: Readonly<{
             readonly ANSWERS: VueConstructor<Vue>;
             readonly CHANGE: VueConstructor<Vue>;
+            readonly COMMENT_LOCK: VueConstructor<Vue>;
             readonly COMMENTS_CHECK: VueConstructor<Vue>;
             readonly HEAD_WITH_QUESTION_MARK: VueConstructor<Vue>;
             readonly HIDE_ANSWERS: VueConstructor<Vue>;
@@ -1513,6 +1572,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             readonly FA_CODE_SIMPLE: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_CODE: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENT_DOTS: import('@fortawesome/fontawesome-common-types').IconDefinition;
+            readonly FA_COMMENT_PLUS: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENT_SOLID: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENT: import('@fortawesome/fontawesome-common-types').IconDefinition;
             readonly FA_COMMENTS_QUESTION_CHECK: import('@fortawesome/fontawesome-common-types').IconDefinition;

package/dist/lib/js/components/Switch/Switch.vue.d.ts

@@ -45,6 +45,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     ICONS: Readonly<{
         readonly ANSWERS: VueConstructor<Vue>;
         readonly CHANGE: VueConstructor<Vue>;
+        readonly COMMENT_LOCK: VueConstructor<Vue>;
         readonly COMMENTS_CHECK: VueConstructor<Vue>;
         readonly HEAD_WITH_QUESTION_MARK: VueConstructor<Vue>;
         readonly HIDE_ANSWERS: VueConstructor<Vue>;
@@ -146,6 +147,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         readonly FA_CODE_SIMPLE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_CODE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_DOTS: import('@fortawesome/fontawesome-common-types').IconDefinition;
+        readonly FA_COMMENT_PLUS: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_SOLID: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENTS_QUESTION_CHECK: import('@fortawesome/fontawesome-common-types').IconDefinition;

package/dist/lib/js/components/TextGroup/TextGroup.consts.d.ts

@@ -8,9 +8,18 @@ export declare const TEXT_GROUP_LOADING_SIZES: {
     LARGE: string;
 };
 export declare const TEXT_GROUP_SIZES: {
-    X_SMALL: string;
-    SMALL: string;
-    MEDIUM: string;
+    readonly X_SMALL: "x-small";
+    readonly SMALL: "small";
+    readonly MEDIUM: "medium";
+    readonly LARGE: "large";
+};
+export declare const TEXT_GROUP_ALIGNS: {
+    readonly LEFT: "left";
+    readonly CENTER: "center";
+};
+export declare const TEXT_GROUP_MAIN_TEXT_COLORS: {
+    readonly NEUTRAL: "neutral";
+    readonly PRIMARY: "primary";
 };
 export declare const TEXT_GROUP_STATES: {
     readonly DEFAULT: "default";
@@ -22,3 +31,5 @@ export type TextGroupProminence = (typeof TEXT_GROUP_PROMINENCE)[keyof typeof TE
 export type TextGroupLoadingSize = (typeof TEXT_GROUP_LOADING_SIZES)[keyof typeof TEXT_GROUP_LOADING_SIZES];
 export type TextGroupSize = (typeof TEXT_GROUP_SIZES)[keyof typeof TEXT_GROUP_SIZES];
 export type TextGroupState = (typeof TEXT_GROUP_STATES)[keyof typeof TEXT_GROUP_STATES];
+export type TextGroupAlign = (typeof TEXT_GROUP_ALIGNS)[keyof typeof TEXT_GROUP_ALIGNS];
+export type TextGroupMainTextColor = (typeof TEXT_GROUP_MAIN_TEXT_COLORS)[keyof typeof TEXT_GROUP_MAIN_TEXT_COLORS];

package/dist/lib/js/components/TextGroup/TextGroup.vue.d.ts

@@ -1,10 +1,13 @@
-import { TextGroupProminence, TextGroupLoadingSize, TextGroupSize, TextGroupState } from './TextGroup.consts';
+import { TextGroupAlign, TextGroupMainTextColor, TextGroupProminence, TextGroupLoadingSize, TextGroupSize, TextGroupState } from './TextGroup.consts';
+import { RemovedProp } from '../../utils/type.utils';
 
 declare function __VLS_template(): {
     mainText?(_: {}): any;
 };
 declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     size?: TextGroupSize;
+    align?: TextGroupAlign;
+    mainTextColor?: TextGroupMainTextColor;
     prominence?: TextGroupProminence;
     eyebrowText?: string | null;
     eyebrowTextEllipsis?: boolean;
@@ -16,14 +19,16 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     supportingTextEllipsis?: boolean;
     isInteractive?: boolean;
     skeletonLoadingSize?: TextGroupLoadingSize;
-    isSelected?: boolean;
     state?: TextGroupState;
     isSupportingTextTooltipEnabled?: boolean;
     isSupportingTextTooltipEnabledOnMobile?: boolean;
     isSupportingTextTooltipAutoFilledWithContent?: boolean;
     supportingTextTooltipContent?: string;
+    isSelected?: RemovedProp<"use mainTextColor=primary instead">;
 }>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     size?: TextGroupSize;
+    align?: TextGroupAlign;
+    mainTextColor?: TextGroupMainTextColor;
     prominence?: TextGroupProminence;
     eyebrowText?: string | null;
     eyebrowTextEllipsis?: boolean;
@@ -35,12 +40,12 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
     supportingTextEllipsis?: boolean;
     isInteractive?: boolean;
     skeletonLoadingSize?: TextGroupLoadingSize;
-    isSelected?: boolean;
     state?: TextGroupState;
     isSupportingTextTooltipEnabled?: boolean;
     isSupportingTextTooltipEnabledOnMobile?: boolean;
     isSupportingTextTooltipAutoFilledWithContent?: boolean;
     supportingTextTooltipContent?: string;
+    isSelected?: RemovedProp<"use mainTextColor=primary instead">;
 }>>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/dist/lib/js/components/Tile/Tile.sb.shared.d.ts

@@ -5,6 +5,7 @@ export declare const data: () => {
     ICONS: Readonly<{
         readonly ANSWERS: VueConstructor<Vue>;
         readonly CHANGE: VueConstructor<Vue>;
+        readonly COMMENT_LOCK: VueConstructor<Vue>;
         readonly COMMENTS_CHECK: VueConstructor<Vue>;
         readonly HEAD_WITH_QUESTION_MARK: VueConstructor<Vue>;
         readonly HIDE_ANSWERS: VueConstructor<Vue>;
@@ -106,6 +107,7 @@ export declare const data: () => {
         readonly FA_CODE_SIMPLE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_CODE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_DOTS: import('@fortawesome/fontawesome-common-types').IconDefinition;
+        readonly FA_COMMENT_PLUS: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_SOLID: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENTS_QUESTION_CHECK: import('@fortawesome/fontawesome-common-types').IconDefinition;
@@ -291,8 +293,8 @@ export declare const data: () => {
         readonly ACCENT: "accent";
     }>;
     allowedColorsToBorderColorsMap: {
-        neutral: ("primary" | "neutral" | "neutralWeak" | "primaryWeak")[];
-        neutralWeak: ("primary" | "neutral" | "neutralWeak" | "primaryWeak")[];
+        neutral: ("neutral" | "neutralWeak" | "primary" | "primaryWeak")[];
+        neutralWeak: ("neutral" | "neutralWeak" | "primary" | "primaryWeak")[];
         primary: ("primary" | "primaryWeak")[];
         success: ("success" | "successWeak")[];
         fail: ("fail" | "failWeak")[];

package/dist/lib/js/components/Tile/Tile.vue.d.ts

@@ -126,14 +126,14 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     };
 }>> & Readonly<{}>, {
     color: import('./Tile.consts').TileColor;
+    eyebrowText: string;
+    isEyebrowTextUppercase: boolean;
     state: import('./Tile.consts').TileState;
     iconLeft: Record<string, any>;
     iconRight: Record<string, any>;
     borderColor: import('./Tile.consts').TileBorderColors;
     interactive: boolean;
-    eyebrowText: string;
     additionalText: string;
-    isEyebrowTextUppercase: boolean;
     eyebrowEllipsis: boolean;
     textEllipsis: boolean;
     additionalTextMaxWidth: import('./Tile.consts').TileAdditionalTextMaxWidth;

package/dist/lib/js/components/Toast/Toast.vue.d.ts

@@ -76,7 +76,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         RIGHT: string;
     }>;
 }, {
-    buttonPrimaryColor(): "primary" | "neutral";
+    buttonPrimaryColor(): "neutral" | "primary";
     buttonSecondaryColor(): "danger" | "neutral";
     toastPosition(): string;
     toastSize(): string;
@@ -253,17 +253,23 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             dividerUnderHeader: {
                 type: PropType<boolean>;
             };
-            hasBorder: {
+            hasRibbon: {
                 type: PropType<boolean>;
             };
-            borderPosition: {
-                type: PropType<import('../Cards/Card').CardBorderPositions>;
+            hasRadius: {
+                type: PropType<boolean>;
             };
-            borderSize: {
-                type: PropType<import('../Cards/Card').CardBorderSizes>;
+            backgroundColor: {
+                type: PropType<import('../Cards/Card').CardBackgroundColor>;
             };
-            borderColor: {
-                type: PropType<import('../Cards/Card').CardBorderColors>;
+            ribbonPosition: {
+                type: PropType<import('../Cards/Card').CardRibbonPositions>;
+            };
+            ribbonSize: {
+                type: PropType<import('../Cards/Card').CardRibbonSizes>;
+            };
+            ribbonColor: {
+                type: PropType<import('../Cards/Card').CardRibbonColors>;
             };
             hasRibbonRadius: {
                 type: PropType<boolean>;
@@ -283,6 +289,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             isContentScrollable: {
                 type: PropType<boolean>;
             };
+            hasBorder: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to hasRibbon">>;
+            };
+            borderPosition: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonPosition">>;
+            };
+            borderSize: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonSize">>;
+            };
+            borderColor: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonColor">>;
+            };
         }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, import('vue').PublicProps, {}, true, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
             P: {};
             B: {};
@@ -306,17 +324,23 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             dividerUnderHeader: {
                 type: PropType<boolean>;
             };
-            hasBorder: {
+            hasRibbon: {
                 type: PropType<boolean>;
             };
-            borderPosition: {
-                type: PropType<import('../Cards/Card').CardBorderPositions>;
+            hasRadius: {
+                type: PropType<boolean>;
             };
-            borderSize: {
-                type: PropType<import('../Cards/Card').CardBorderSizes>;
+            backgroundColor: {
+                type: PropType<import('../Cards/Card').CardBackgroundColor>;
             };
-            borderColor: {
-                type: PropType<import('../Cards/Card').CardBorderColors>;
+            ribbonPosition: {
+                type: PropType<import('../Cards/Card').CardRibbonPositions>;
+            };
+            ribbonSize: {
+                type: PropType<import('../Cards/Card').CardRibbonSizes>;
+            };
+            ribbonColor: {
+                type: PropType<import('../Cards/Card').CardRibbonColors>;
             };
             hasRibbonRadius: {
                 type: PropType<boolean>;
@@ -336,6 +360,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
             isContentScrollable: {
                 type: PropType<boolean>;
             };
+            hasBorder: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to hasRibbon">>;
+            };
+            borderPosition: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonPosition">>;
+            };
+            borderSize: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonSize">>;
+            };
+            borderColor: {
+                type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonColor">>;
+            };
         }>> & Readonly<{}>, {}, {}, {}, {}, {}>;
         __isFragment?: never;
         __isTeleport?: never;
@@ -356,17 +392,23 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         dividerUnderHeader: {
             type: PropType<boolean>;
         };
-        hasBorder: {
+        hasRibbon: {
             type: PropType<boolean>;
         };
-        borderPosition: {
-            type: PropType<import('../Cards/Card').CardBorderPositions>;
+        hasRadius: {
+            type: PropType<boolean>;
         };
-        borderSize: {
-            type: PropType<import('../Cards/Card').CardBorderSizes>;
+        backgroundColor: {
+            type: PropType<import('../Cards/Card').CardBackgroundColor>;
         };
-        borderColor: {
-            type: PropType<import('../Cards/Card').CardBorderColors>;
+        ribbonPosition: {
+            type: PropType<import('../Cards/Card').CardRibbonPositions>;
+        };
+        ribbonSize: {
+            type: PropType<import('../Cards/Card').CardRibbonSizes>;
+        };
+        ribbonColor: {
+            type: PropType<import('../Cards/Card').CardRibbonColors>;
         };
         hasRibbonRadius: {
             type: PropType<boolean>;
@@ -386,6 +428,18 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         isContentScrollable: {
             type: PropType<boolean>;
         };
+        hasBorder: {
+            type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to hasRibbon">>;
+        };
+        borderPosition: {
+            type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonPosition">>;
+        };
+        borderSize: {
+            type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonSize">>;
+        };
+        borderColor: {
+            type: PropType<import('../../utils/type.utils').RemovedProp<"renamed to ribbonColor">>;
+        };
     }>> & Readonly<{}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & (new () => {
         $slots: Readonly<{
             header?: () => any;

package/dist/lib/js/components/Toggles/ToggleButton/ToggleButton.vue.d.ts

@@ -61,6 +61,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     ICONS: Readonly<{
         readonly ANSWERS: VueConstructor<Vue>;
         readonly CHANGE: VueConstructor<Vue>;
+        readonly COMMENT_LOCK: VueConstructor<Vue>;
         readonly COMMENTS_CHECK: VueConstructor<Vue>;
         readonly HEAD_WITH_QUESTION_MARK: VueConstructor<Vue>;
         readonly HIDE_ANSWERS: VueConstructor<Vue>;
@@ -162,6 +163,7 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
         readonly FA_CODE_SIMPLE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_CODE: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_DOTS: import('@fortawesome/fontawesome-common-types').IconDefinition;
+        readonly FA_COMMENT_PLUS: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT_SOLID: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENT: import('@fortawesome/fontawesome-common-types').IconDefinition;
         readonly FA_COMMENTS_QUESTION_CHECK: import('@fortawesome/fontawesome-common-types').IconDefinition;
@@ -425,12 +427,12 @@ declare const _default: import('vue').DefineComponent<import('vue').ExtractPropT
     label: string;
     color: ToggleButtonColor;
     radius: ToggleButtonRadius;
+    isInteractive: boolean;
     state: ToggleButtonState;
+    isSelected: boolean;
     iconLeft: any;
     iconRight: any;
     isLabelUppercase: boolean;
-    isInteractive: boolean;
-    isSelected: boolean;
     hasSmallHorizontalPadding: boolean;
     labelSize: ToggleButtonLabelSize;
 }, {}, {

package/dist/lib/js/components/Well/Well.consts.d.ts

@@ -17,3 +17,27 @@ export declare const WELL_COLORS: {
 };
 export type WellColor = Value<typeof WELL_COLORS>;
 export declare const WELL_DEFAULT_COLOR: "neutral";
+export declare const WELL_RIBBON_COLORS: {
+    readonly NEUTRAL: "neutral";
+    readonly NEUTRAL_HEAVY: "neutral-heavy";
+    readonly NEUTRAL_STRONG: "neutral-strong";
+    readonly PRIMARY: "primary";
+    readonly SUCCESS: "success";
+    readonly WARNING: "warning";
+    readonly DANGER: "danger";
+    readonly FAIL: "fail";
+    readonly INFO: "info";
+    readonly TRANSPARENT: "transparent";
+};
+export type WellRibbonColor = Value<typeof WELL_RIBBON_COLORS>;
+export declare const WELL_RIBBON_SIZES: {
+    readonly SMALL: "small";
+    readonly MEDIUM: "medium";
+    readonly LARGE: "large";
+};
+export type WellRibbonSize = Value<typeof WELL_RIBBON_SIZES>;
+export declare const WELL_RIBBON_POSITIONS: {
+    readonly TOP: "top";
+    readonly LEFT: "left";
+};
+export type WellRibbonPosition = Value<typeof WELL_RIBBON_POSITIONS>;

package/dist/lib/js/components/Well/Well.vue.d.ts

@@ -1,4 +1,4 @@
-import { WellPadding, WellColor } from './Well.consts';
+import { WellPadding, WellColor, WellRibbonPosition, WellRibbonSize, WellRibbonColor } from './Well.consts';
 
 declare function __VLS_template(): {
     accessory?(_: {}): any;
@@ -7,9 +7,21 @@ declare function __VLS_template(): {
 declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     padding?: WellPadding | null;
     color?: WellColor;
+    hasRadius?: boolean;
+    hasBorder?: boolean;
+    hasRibbon?: boolean;
+    ribbonPosition?: WellRibbonPosition;
+    ribbonSize?: WellRibbonSize;
+    ribbonColor?: WellRibbonColor;
 }>>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
     padding?: WellPadding | null;
     color?: WellColor;
+    hasRadius?: boolean;
+    hasBorder?: boolean;
+    hasRibbon?: boolean;
+    ribbonPosition?: WellRibbonPosition;
+    ribbonSize?: WellRibbonSize;
+    ribbonColor?: WellRibbonColor;
 }>>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
 export default _default;

package/dist/lib/js/icons/fontawesome.d.ts

@@ -91,6 +91,7 @@ export declare const FONTAWESOME_ICONS: {
     readonly FA_CODE_SIMPLE: import('@fortawesome/fontawesome-common-types').IconDefinition;
     readonly FA_CODE: import('@fortawesome/fontawesome-common-types').IconDefinition;
     readonly FA_COMMENT_DOTS: import('@fortawesome/fontawesome-common-types').IconDefinition;
+    readonly FA_COMMENT_PLUS: import('@fortawesome/fontawesome-common-types').IconDefinition;
     readonly FA_COMMENT_SOLID: import('@fortawesome/fontawesome-common-types').IconDefinition;
     readonly FA_COMMENT: import('@fortawesome/fontawesome-common-types').IconDefinition;
     readonly FA_COMMENTS_QUESTION_CHECK: import('@fortawesome/fontawesome-common-types').IconDefinition;

package/dist/lib/js/index.d.ts

@@ -1,3 +1,4 @@
+export { default as DsActionContent } from './components/ActionContent';
 export { default as Avatar } from './components/Avatar';
 export * from './components/Avatar/Avatar.consts';
 export { default as Badge } from './components/Badge';
@@ -84,6 +85,7 @@ export * from './components/Headers/PageHeader/PageHeader.consts';
 export { default as SectionTitle } from './components/SectionTitle/SectionTitle.vue';
 export { default as DsSectionTitle } from './components/SectionTitle/SectionTitle.vue';
 export * from './components/SectionTitle/SectionTitle.consts';
+export { default as DsSpinnerLoading } from './components/SpinnerLoading/SpinnerLoading.vue';
 export { default as Drawer } from './components/Drawer';
 export { default as DsDrawer } from './components/Drawer';
 export * from './components/Drawer/Drawer.consts';

package/dist/lib/js/utils/type.utils.d.ts

@@ -1 +1,4 @@
 export type Value<T extends {}> = T[keyof T];
+export interface RemovedProp<TMessage extends string> {
+    __removed?: TMessage;
+}

package/lib/images/icons/comment-lock.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 64 64"><path fill="currentColor" fill-rule="evenodd" d="M49.5 25C54.8036 25 59.1426 29.3875 59.1426 34.75V40.9658C61.4328 41.6971 63 43.8908 63 46.4502V58.1504C62.9998 61.4408 60.4682 64 57.2139 64H41.7861C38.6523 64 36.0002 61.4408 36 58.1504V46.4502C36 43.8908 37.5672 41.6971 39.8574 40.9658V34.75C39.8574 29.3875 44.1964 25 49.5 25ZM49.5 30.8496C47.3304 30.8496 45.6426 32.5563 45.6426 34.75V40.5996H53.3574V34.75C53.3574 32.5563 51.6696 30.8496 49.5 30.8496Z" clip-rule="evenodd"/><path fill="currentColor" d="M32.5 0C48.8223 0 62.166 11.8359 63 26.7188C61.2129 25.5469 59.1875 24.7266 56.9238 24.4922C55.0176 14.0625 45.1289 5.625 32.5 5.625C18.4414 5.625 7.71875 16.0547 7.71875 28.125C7.71875 33.1641 9.50586 37.7344 12.6035 41.6016C14.0332 43.3594 14.2715 45.8203 13.1992 47.8125L11.0547 51.6797L18.084 48.75C19.3945 48.1641 21.0625 48.1641 22.4922 48.75C25.3516 49.9219 28.5684 50.5078 31.9043 50.625C31.0703 52.3828 30.5938 54.375 30.5938 56.25C26.9004 56.0156 23.4453 55.1953 20.2285 53.9062L6.4082 59.7656C5.93164 60 5.57422 60 5.09766 60C3.31055 60 2 58.7109 2 57.0703C2 56.4844 2.11914 56.0156 2.35742 55.5469L8.19531 45.1172C4.26367 40.4297 2 34.4531 2 28.125C2 12.6562 15.7012 1.84648e-07 32.5 0Z"/></svg>