@ama-pt/agora-design-system 2.2.0 → 2.2.1

package/artifacts/dist/tailwind.css

@@ -1000,6 +1000,10 @@ input[type]::placeholder{
   margin-bottom: 32px;
 }
 
+.mb-40{
+  margin-bottom: 40px;
+}
+
 .mb-64{
   margin-bottom: 64px;
 }
@@ -1056,6 +1060,10 @@ input[type]::placeholder{
   margin-top: 32px;
 }
 
+.mt-56{
+  margin-top: 56px;
+}
+
 .mt-64{
   margin-top: 64px;
 }
@@ -1771,6 +1779,10 @@ input[type]::placeholder{
   grid-template-columns: repeat(4, minmax(0, 1fr));
 }
 
+.grid-rows-7{
+  grid-template-rows: repeat(7, minmax(0, 1fr));
+}
+
 .grid-rows-8{
   grid-template-rows: repeat(8, minmax(0, 1fr));
 }
@@ -7364,6 +7376,10 @@ input[type]::placeholder{
   padding-bottom: 64px;
 }
 
+.pb-96{
+  padding-bottom: 96px;
+}
+
 .pl-32{
   padding-left: 32px;
 }
@@ -7631,6 +7647,10 @@ input[type]::placeholder{
   font-weight: 700;
 }
 
+.uppercase{
+  text-transform: uppercase;
+}
+
 .capitalize{
   text-transform: capitalize;
 }

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

@@ -32,6 +32,10 @@ export interface AccordionElement extends HTMLDivElement {
     isExpanded: boolean;
 }
 export interface AccordionProps extends ComponentPropsWithRef<'div'> {
+    /**
+     * The flag to set Dark mode.
+     */
+    darkMode?: BooleanProp;
     /**
      * Accordion header title.
      */
@@ -50,8 +54,17 @@ export interface AccordionProps extends ComponentPropsWithRef<'div'> {
     hasIcon?: BooleanProp;
     /**
      * Defines the name of the icon to use.
+     * @deprecated use leadingIcon and leadingIconHover instead.
      */
     icon?: string;
+    /**
+     * Defines the name of the leading icon to use.
+     */
+    leadingIcon?: string;
+    /**
+     * Defines the name of the leading icon to be displayed on mouse hover. If none specified, it will the appropriate variant of the icon.
+     */
+    leadingIconHover?: string;
     /**
      * Event function called whenever the accordion expands.
      */

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

@@ -1,10 +1,16 @@
 import React, { ComponentPropsWithRef, ForwardRefRenderFunction, ReactElement } from 'react';
+import { BooleanProp } from '../../models';
 import { AccordionProps } from '../../components/accordion';
+import './accordion-group.scss';
 export interface AccordionGroupProps extends ComponentPropsWithRef<'div'> {
     /**
      * List of accordion components to use as children of the group.
      */
     children?: ReactElement<AccordionProps> | Array<ReactElement<AccordionProps>>;
+    /**
+     * The flag to set Dark mode.
+     */
+    darkMode?: BooleanProp;
 }
 export declare const InnerAccordionGroup: ForwardRefRenderFunction<HTMLDivElement, AccordionGroupProps>;
 export declare const AccordionGroup: React.ForwardRefExoticComponent<Omit<AccordionGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1,5 @@
+import React from 'react';
+import './equalizer.scss';
+export interface EqualizerProps {
+}
+export declare const Equalizer: React.FC<EqualizerProps>;

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

@@ -38,11 +38,15 @@ export interface InputSearchBarProps extends ComponentPropsWithRef<'input'> {
      */
     hasVoiceActionButton?: BooleanProp;
     /**
-     *  Alternative text for the voice action button
+     * Defines if the voice action button is active and displaying the equalizer animation.
+     */
+    isVoiceActive?: BooleanProp;
+    /**
+     * Alternative text for the voice action button.
      */
     voiceActionAltText?: string;
     /**
-     *  Alternative text for the search action button
+     * Alternative text for the search action button.
      */
     searchActionAltText?: string;
     /**

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

@@ -42,6 +42,10 @@ export interface InputTimeProps extends ComponentPropsWithRef<'input'> {
      * The placeholder to apply in the input hour part
      */
     hourInputPlaceholder?: string;
+    /**
+     * The placeholder to apply in the input hour part
+     */
+    periodInputPlaceholder?: string;
     /**
      * Accessible text to apply to the trailing clock icon.
      */

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

@@ -1,8 +1,10 @@
 import React, { ComponentPropsWithRef, ForwardRefRenderFunction } from 'react';
 import './time-text.scss';
 export interface TimeTextProps extends ComponentPropsWithRef<'input'> {
+    setInputTextValue: (selectedTime: string) => void;
     hourInputPlaceholder?: string;
     minuteInputPlaceholder?: string;
+    periodInputPlaceholder?: string;
 }
 export declare const InnerComponent: ForwardRefRenderFunction<HTMLInputElement, TimeTextProps>;
 export declare const TimeText: React.ForwardRefExoticComponent<Omit<TimeTextProps, "ref"> & React.RefAttributes<HTMLInputElement>>;

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

@@ -4,6 +4,11 @@ export declare const MIN_HOUR = 1;
 export declare const MAX_HOUR = 12;
 export declare const MIN_MINUTE = 0;
 export declare const MAX_MINUTE = 59;
+export declare const DEFAULT_PLACEHOLDER: {
+    HOUR: string;
+    MINUTE: string;
+    PERIOD: string;
+};
 export declare const timePeriod: {
     am: string;
     pm: string;

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

@@ -19,7 +19,7 @@ export interface PillProps extends ComponentPropsWithRef<'div'> {
      */
     appearance?: PillAppearance;
     /**
-     * The variant of the pill. This variants will define the background and border color of the given Pill
+     * The variant of the pill. This variants will define the background and border color of the given Pill.
      */
     variant?: PillVariant;
     /**
@@ -27,12 +27,16 @@ export interface PillProps extends ComponentPropsWithRef<'div'> {
      */
     children?: ReactNode;
     /**
-     * Pill or Circular pill style
+     * Pill or Circular pill style.
      */
     circular?: BooleanProp;
     /**
-     *  Size of pill
+     * Size of pill.
      */
     size?: PillSize;
+    /**
+     * The flag to set Dark mode.
+     */
+    darkMode?: BooleanProp;
 }
 export declare const Pill: FC<PillProps>;

package/package.json

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