@ama-pt/agora-design-system 3.5.0 → 3.5.1

package/artifacts/dist/tailwind.css

@@ -988,8 +988,8 @@ input[type]::placeholder{
   margin-bottom: 8px;
 }
 
-.-ml-32{
-  margin-left: -32px;
+.\!mt-\[0px\]{
+  margin-top: 0px !important;
 }
 
 .mb-128{
@@ -1028,6 +1028,10 @@ input[type]::placeholder{
   margin-left: 8px;
 }
 
+.ml-\[45px\]{
+  margin-left: 45px;
+}
+
 .ml-auto{
   margin-left: auto;
 }
@@ -1203,6 +1207,18 @@ input[type]::placeholder{
   height: 126px;
 }
 
+.h-\[16px\]{
+  height: 16px;
+}
+
+.h-\[24px\]{
+  height: 24px;
+}
+
+.h-\[32px\]{
+  height: 32px;
+}
+
 .h-\[350px\]{
   height: 350px;
 }
@@ -1239,10 +1255,6 @@ input[type]::placeholder{
   height: calc(100% - 128px);
 }
 
-.h-dvh{
-  height: 100dvh;
-}
-
 .h-fit{
   height: -moz-fit-content;
   height: fit-content;
@@ -1321,8 +1333,8 @@ input[type]::placeholder{
   width: 32px;
 }
 
-.w-64{
-  width: 64px;
+.w-\[131px\]{
+  width: 131px;
 }
 
 .w-\[190px\]{
@@ -1341,12 +1353,8 @@ input[type]::placeholder{
   width: 496px;
 }
 
-.w-\[60px\]{
-  width: 60px;
-}
-
-.w-\[65px\]{
-  width: 65px;
+.w-\[82px\]{
+  width: 82px;
 }
 
 .w-\[calc\(100\%\+32px\)\]{
@@ -1921,11 +1929,6 @@ input[type]::placeholder{
        column-gap: 32px;
 }
 
-.gap-x-8{
-  -moz-column-gap: 8px;
-       column-gap: 8px;
-}
-
 .gap-y-16{
   row-gap: 16px;
 }
@@ -2333,6 +2336,10 @@ input[type]::placeholder{
   border-color: var(--color-neutral-600);
 }
 
+.border-\[var\(--color-neutral-700\)\]{
+  border-color: var(--color-neutral-700);
+}
+
 .border-\[var\(--color-primary-400\)\]{
   border-color: var(--color-primary-400);
 }
@@ -6104,6 +6111,10 @@ input[type]::placeholder{
   --tw-border-opacity: 0.95;
 }
 
+.\!bg-\[var\(--color-neutral-100\)\]{
+  background-color: var(--color-neutral-100) !important;
+}
+
 .\!bg-transparent{
   background-color: transparent !important;
 }
@@ -6209,6 +6220,10 @@ input[type]::placeholder{
   background-color: var(--color-warning-800);
 }
 
+.bg-\[var\(--color-white\)\]{
+  background-color: var(--color-white);
+}
+
 .bg-backdrop{
   background-color: rgba(43, 54, 60, 0.96);
 }
@@ -7613,6 +7628,11 @@ input[type]::placeholder{
   padding-right: 8px;
 }
 
+.py-0{
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
 .py-16{
   padding-top: 16px;
   padding-bottom: 16px;
@@ -7945,6 +7965,10 @@ input[type]::placeholder{
   font-weight: 700;
 }
 
+.font-medium{
+  font-weight: 500;
+}
+
 .uppercase{
   text-transform: uppercase;
 }
@@ -8487,10 +8511,6 @@ input[type]::placeholder{
   text-decoration-line: line-through;
 }
 
-.decoration-\[var\(--color-primary-600\)\]{
-  text-decoration-color: var(--color-primary-600);
-}
-
 .decoration-2{
   text-decoration-thickness: 2px;
 }
@@ -21705,12 +21725,8 @@ input[type]::placeholder{
     margin-bottom: 64px;
   }
 
-  .xs\:ml-8{
-    margin-left: 8px;
-  }
-
-  .xs\:mt-16{
-    margin-top: 16px;
+  .xs\:mb-8{
+    margin-bottom: 8px;
   }
 
   .xs\:mt-32{
@@ -21748,10 +21764,6 @@ input[type]::placeholder{
     height: 16px;
   }
 
-  .xs\:h-24{
-    height: 24px;
-  }
-
   .xs\:\!w-\[191px\]{
     width: 191px !important;
   }
@@ -21760,10 +21772,6 @@ input[type]::placeholder{
     width: 89px !important;
   }
 
-  .xs\:w-\[118px\]{
-    width: 118px;
-  }
-
   .xs\:w-\[calc\(100\%\+32px\)\]{
     width: calc(100% + 32px);
   }
@@ -22124,10 +22132,6 @@ input[type]::placeholder{
     align-items: flex-start;
   }
 
-  .xs\:justify-start{
-    justify-content: flex-start;
-  }
-
   .xs\:justify-between{
     justify-content: space-between;
   }
@@ -27500,6 +27504,10 @@ input[type]::placeholder{
     stroke-width: 2;
   }
 
+  .xs\:p-0{
+    padding: 0px;
+  }
+
   .xs\:p-32{
     padding: 32px;
   }
@@ -27536,14 +27544,6 @@ input[type]::placeholder{
     padding-left: 0px;
   }
 
-  .xs\:pl-32{
-    padding-left: 32px;
-  }
-
-  .xs\:pl-\[9px\]{
-    padding-left: 9px;
-  }
-
   .xs\:pt-32{
     padding-top: 32px;
   }
@@ -28432,10 +28432,6 @@ input[type]::placeholder{
     grid-column-end: 5;
   }
 
-  .md\:col-end-8{
-    grid-column-end: 8;
-  }
-
   .md\:mx-64{
     margin-left: 64px;
     margin-right: 64px;
@@ -28476,14 +28472,14 @@ input[type]::placeholder{
     margin-bottom: 144px;
   }
 
-  .md\:ml-0{
-    margin-left: 0px;
-  }
-
   .md\:mr-16{
     margin-right: 16px;
   }
 
+  .md\:mr-32{
+    margin-right: 32px;
+  }
+
   .md\:mt-0{
     margin-top: 0px;
   }
@@ -28527,10 +28523,6 @@ input[type]::placeholder{
     display: none;
   }
 
-  .md\:h-40{
-    height: 40px;
-  }
-
   .md\:h-\[calc\(100\%-2px\)\]{
     height: calc(100% - 2px);
   }
@@ -28543,10 +28535,6 @@ input[type]::placeholder{
     width: 220px !important;
   }
 
-  .md\:w-\[137px\]{
-    width: 137px;
-  }
-
   .md\:w-\[50\%\]{
     width: 50%;
   }
@@ -35281,10 +35269,6 @@ input[type]::placeholder{
     grid-column-start: 8;
   }
 
-  .xl\:col-start-9{
-    grid-column-start: 9;
-  }
-
   .xl\:col-end-9{
     grid-column-end: 9;
   }
@@ -35394,10 +35378,6 @@ input[type]::placeholder{
     width: 1120px;
   }
 
-  .xl\:w-\[175px\]{
-    width: 175px;
-  }
-
   .xl\:w-\[40\%\]{
     width: 40%;
   }
@@ -35410,10 +35390,6 @@ input[type]::placeholder{
     width: 696px;
   }
 
-  .xl\:w-\[800px\]{
-    width: 800px;
-  }
-
   .xl\:\!min-w-min{
     min-width: -moz-min-content !important;
     min-width: min-content !important;
@@ -35807,10 +35783,6 @@ input[type]::placeholder{
     align-items: center;
   }
 
-  .xl\:justify-start{
-    justify-content: flex-start;
-  }
-
   .xl\:justify-end{
     justify-content: flex-end;
   }

package/artifacts/dist/types/components/cards/index.d.ts

@@ -18,3 +18,4 @@ export * from './card-topic';
 export * from './card-action';
 export * from './card-illustrative';
 export * from './card-general';
+export * from './status-card';

package/artifacts/dist/types/components/{status-card → cards/status-card}/status-card.d.ts

@@ -1,8 +1,9 @@
-import React, { ComponentProps, FC } from 'react';
+import { ComponentProps, FC, ReactNode } from 'react';
 import './status-card.css';
-import { BooleanProp } from '../../models';
+import { BooleanProp } from '../../../models';
+import { AnchorProps } from '../../../components/anchor/anchor';
 export type StatusCardType = 'informative' | 'success' | 'warning' | 'danger' | 'outline-informative' | 'outline-success' | 'outline-warning' | 'outline-danger';
-export interface StatusCardProps extends ComponentProps<'div'> {
+export interface StatusCardProps extends Omit<ComponentProps<'div'>, 'title'> {
     /**
      * Defines what style to apply.
      */
@@ -22,10 +23,22 @@ export interface StatusCardProps extends ComponentProps<'div'> {
     /**
      * Status card title content
      */
-    title?: string;
+    title?: ReactNode;
     /**
      * Status card description content
      */
-    description?: string | React.ReactNode;
+    description?: ReactNode;
+    /**
+     * The flag to set whether the status card is interactive.
+     */
+    blockedLink?: boolean;
+    /**
+     * anchor props
+     */
+    anchor?: AnchorProps;
+    /**
+     * If true, the anchor will be positioned on the right side of the status card.
+     */
+    anchorOnRightSide?: boolean;
 }
 export declare const StatusCard: FC<StatusCardProps>;

package/artifacts/dist/types/components/checkbox-group/checkbox-group.d.ts

@@ -30,6 +30,18 @@ export interface CheckboxGroupProps extends Omit<HtmlHTMLAttributes<HTMLFieldSet
      *  Event triggered whenever any of the checkboxes changes is own state.
      */
     onChange?: (evt: ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Show or hide the helper text.
+     */
+    hasHelperText?: BooleanProp;
+    /**
+     * Helper text displayed below checkbox.
+     */
+    helperText?: ReactNode;
+    /**
+     * The flag to set if the checkbox is in dark mode or light mode.
+     */
+    darkMode?: BooleanProp;
 }
 declare const CheckboxGroup: FC<CheckboxGroupProps>;
 export { CheckboxGroup };

package/artifacts/dist/types/components/drawer/drawer.d.ts

@@ -49,6 +49,10 @@ export interface DrawerProps extends ComponentProps<'div'> {
      * Callback to be called when the drawer is closed.
      */
     onHide?: () => void;
+    /**
+     * The flag to set Dark mode.
+     */
+    darkMode?: BooleanProp;
 }
 /**
  * Return icon default animation class drawer icon name and default position.

package/artifacts/dist/types/components/index.d.ts

@@ -47,7 +47,6 @@ export * from './scribbles';
 export * from './search-pagination';
 export * from './sidebar';
 export * from './skip-navigation';
-export * from './status-card';
 export * from './step-list';
 export * from './stepper';
 export * from './switch';

package/artifacts/dist/types/components/input-search-bar/input-search-bar.d.ts

@@ -1,6 +1,7 @@
 import { BooleanProp } from '../../models';
 import { ComponentProps, FC, Ref } from 'react';
 import './input-search-bar.css';
+import type { ReactNode } from 'react';
 export interface InputSearchBarElement extends HTMLInputElement {
     /**
      * React ref object to the search action button.
@@ -60,6 +61,14 @@ export interface InputSearchBarProps extends ComponentProps<'input'> {
      * React ref object to the input search bar.
      */
     ref?: Ref<InputSearchBarElement>;
+    /**
+     * Defines helper text.
+     */
+    helperText?: ReactNode;
+    /**
+     * Show or hide the helper text.
+     */
+    hasHelperText?: BooleanProp;
 }
 declare const InputSearchBar: FC<InputSearchBarProps>;
 export { InputSearchBar };

package/artifacts/dist/types/components/input-time/input-time.d.ts

@@ -3,8 +3,8 @@ import './input-time.css';
 import { BooleanProp, FeedbackState, TimeFormat } from '../../models';
 export interface InputTimeProps extends ComponentProps<'input'> {
     /**
-    * Defines the time format that will be used.
-    */
+     * Defines the time format that will be used.
+     */
     format?: TimeFormat;
     /**
      * The flag to set if the label and feedback text is in dark mode or light mode.

package/artifacts/dist/types/components/input-time/utils/format-time.d.ts

@@ -1,4 +1,4 @@
-import { TimePeriod } from '../../../models';
+import { TimeFormat, TimePeriod } from '../../../models';
 export declare const FULL_TIME_TEXT_REGEX_WITH_PERIOD: RegExp;
 export declare const FULL_TIME_TEXT_REGEX_WITHOUT_PERIOD: RegExp;
 export declare const DEFAULT_PLACEHOLDER: {
@@ -11,14 +11,13 @@ export declare const timePeriod: {
     pm: string;
 };
 export declare const startTime: {
-    hour: string;
     minute: string;
     period: string;
 };
 export declare const formatHour: (hour: number | string, minHour: number, maxHour: number) => string;
 export declare const formatMinute: (minute: number | string, minMinute: number, maxMinute: number) => string;
 export declare const formatFullTime: (hasPeriod: boolean, selectedHour: number | string, selectedMinute: number | string, selectedPeriod: TimePeriod) => string;
-export declare const parseFullTime: (hasPeriod: boolean, fullTimeText: string) => {
+export declare const parseFullTime: (hasPeriod: boolean, fullTimeText: string, hourFormat: TimeFormat) => {
     selectedHour: string;
     selectedMinute: string;
     selectedPeriod: TimePeriod;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ama-pt/agora-design-system",
   "description": "Ágora Design system",
-  "version": "3.5.0",
+  "version": "3.5.1",
   "main": "artifacts/dist/index.mjs",
   "module": "artifacts/dist/index.umd.js",
   "files": [