@ama-pt/agora-design-system 1.3.0 → 2.1.0

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

@@ -17,7 +17,6 @@ export * from './feedback';
 export * from './footer';
 export * from './glossary-letters';
 export * from './header';
-export * from './header-v2';
 export * from './icon';
 export * from './input-date';
 export * from './input-email-bar';
@@ -30,10 +29,10 @@ export * from './input-search-bar';
 export * from './input-select';
 export * from './input-text';
 export * from './input-textarea';
+export * from './input-time';
 export * from './link-wrapper';
 export * from './list';
 export * from './loader-dialog';
-export * from './menu-item';
 export * from './modal-dialog';
 export * from './pill';
 export * from './popup-dialog';

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

@@ -0,0 +1,32 @@
+import React, { Dispatch, FC, ReactNode, SetStateAction } from 'react';
+import { TimePeriod } from '../../../models';
+export interface Labels {
+    cancelLabel: string;
+    cancelAriaLabel?: string;
+    okLabel: string;
+    okAriaLabel?: string;
+    timepickerMessageLabel?: string;
+    timepickerMessageAriaLabel?: string;
+}
+interface TimePickerStateContextInitialValuesType {
+    selectedTime: string;
+    cancel: (selectedTime: string) => void;
+    labels: Labels;
+}
+interface TimePickerStateContextType extends TimePickerStateContextInitialValuesType {
+    selectedHour: string;
+    setSelectedHour: Dispatch<SetStateAction<string>>;
+    selectedMinute: string;
+    setSelectedMinute: Dispatch<SetStateAction<string>>;
+    selectedPeriod: TimePeriod;
+    setSelectedPeriod: Dispatch<SetStateAction<TimePeriod>>;
+    setSelectedTime: Dispatch<SetStateAction<string>>;
+}
+export declare const TimeInputContext: React.Context<TimePickerStateContextType | undefined>;
+export interface TimePickerStateProviderProps {
+    children: ReactNode;
+    initialValues: TimePickerStateContextInitialValuesType;
+}
+export declare const TimeInputContextProvider: FC<TimePickerStateProviderProps>;
+export declare const useTimeInputContext: () => TimePickerStateContextType;
+export {};

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

@@ -0,0 +1,2 @@
+export { InputTime } from './input-time';
+export type { InputTimeProps } from './input-time';

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

@@ -0,0 +1,78 @@
+import React, { ComponentPropsWithRef, ReactNode } from 'react';
+import './input-time.scss';
+import { BooleanProp, FeedbackState } from '../../models';
+export interface InputTimeProps extends ComponentPropsWithRef<'input'> {
+    /**
+     * Input label text.
+     */
+    label?: string;
+    /**
+     * Show or hide input label.
+     */
+    hideLabel?: BooleanProp;
+    /**
+     * Sets the input in a error state. This also affects the feedback state.
+     */
+    hasError?: BooleanProp;
+    /**
+     * Show or hide the feedback status text.
+     */
+    hasFeedback?: BooleanProp;
+    /**
+     * Defines the state of the feedback text. This param will change the feedback icon and dye it.
+     */
+    feedbackState?: FeedbackState;
+    /**
+     * Feedback text displayed below input.
+     */
+    feedbackText?: ReactNode;
+    /**
+     * Show or hide the leading icon.
+     */
+    hasIcon?: BooleanProp;
+    /**
+     * Name of the icon leading icon to be displayed.
+     */
+    icon?: string;
+    /**
+     * The placeholder to apply in the input minute part
+     */
+    minuteInputPlaceholder?: string;
+    /**
+     * The placeholder to apply in the input hour part
+     */
+    hourInputPlaceholder?: string;
+    /**
+     * Accessible text to apply to the trailing clock icon.
+     */
+    clockIconAriaLabel: string;
+    /**
+     * Label for the timepicker cancel button.
+     */
+    cancelLabel: string;
+    /**
+     * Accessible text for the timepicker cancel button.
+     */
+    cancelAriaLabel?: string;
+    /**
+     * Label for the timepicker ok button.
+     */
+    okLabel: string;
+    /**
+     * Accessible text for the timepicker ok button.
+     */
+    okAriaLabel?: string;
+    /**
+     * Show or hide the timepicker footer message.
+     */
+    hasTimepickerMessage?: BooleanProp;
+    /**
+     * Label for the timepicker footer message.
+     */
+    timepickerMessageLabel?: string;
+    /**
+     * Accessible text for the timepicker footer message.
+     */
+    timepickerMessageAriaLabel?: string;
+}
+export declare const InputTime: React.ForwardRefExoticComponent<Omit<InputTimeProps, "ref"> & React.RefAttributes<HTMLInputElement>>;

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

@@ -0,0 +1,2 @@
+import { FC } from 'react';
+export declare const DialogBody: FC;

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

@@ -0,0 +1,5 @@
+import { FC } from 'react';
+export interface TimePickerDropdownFooterProps {
+    setInputTextValue: (selectedTime: string) => void;
+}
+export declare const DialogFooter: FC<TimePickerDropdownFooterProps>;

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

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+import { Labels } from './contexts/time-input-state.context';
+import { BooleanProp } from '../../models';
+export interface TimePickerDropdownProps {
+    className?: string;
+    setInputTextValue: (selectedTime: string) => void;
+    onChange: (selectedTime: string) => void;
+    onCancel: (selectedTime: string) => void;
+    hasTimepickerMessage?: BooleanProp;
+    textCurrentValue: string;
+    labels: Labels;
+}
+export declare const TimePickerDropdown: FC<TimePickerDropdownProps>;

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

@@ -0,0 +1,8 @@
+import React, { ComponentPropsWithRef, ForwardRefRenderFunction } from 'react';
+import './time-text.scss';
+export interface TimeTextProps extends ComponentPropsWithRef<'input'> {
+    hourInputPlaceholder?: string;
+    minuteInputPlaceholder?: 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

@@ -0,0 +1,24 @@
+import { TimePeriod } from '../../../models';
+export declare const FULL_TIME_TEXT_REGEX: RegExp;
+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 timePeriod: {
+    am: string;
+    pm: string;
+};
+export declare const startTime: {
+    hour: string;
+    minute: string;
+    period: string;
+};
+export declare const formatHour: (hour: number | string) => string;
+export declare const formatMinute: (minute: number | string) => string;
+export declare const formatFullTime: (selectedHour: number | string, selectedMinute: number | string, selectedPeriod: TimePeriod) => string;
+export declare const parseFullTime: (fullTimeText: string) => {
+    selectedHour: string;
+    selectedMinute: string;
+    selectedPeriod: TimePeriod;
+};
+export declare const isTimeTextValid: (timeText: string | number | undefined) => boolean;

package/artifacts/dist/types/components/modal-dialog/modal-config.model.d.ts

@@ -6,7 +6,15 @@ export interface ModalConfiguration extends Omit<ComponentPropsWithoutRef<'div'>
      */
     closeButtonLabel: string;
     /**
-     * Render dialog with dark mode styles.
+     * Render modal with dark mode styles.
      */
     darkMode?: BooleanProp;
+    /**
+     * Callback to run after modal is closed.
+     */
+    onHide?: () => void;
+    /**
+     * Callback to run after modal is opened.
+     */
+    onShow?: () => void;
 }

package/artifacts/dist/types/components/modal-dialog/modal-context.d.ts

@@ -3,13 +3,13 @@ import { ReactNode } from 'react';
 import { ModalConfiguration } from './modal-config.model';
 export interface ModalContextProps {
     /**
-     * The visible dialog element. If not visible the value is null.
+     * The visible modal element. If not visible the value is null.
      */
     current: DialogElement | null;
     /**
      * Tells if a modal is visible or not.
      */
-    visibility?: boolean;
+    isVisible: () => boolean;
     /**
      * Shows a new modal with the configurations provided.
      */

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

@@ -1,3 +1,2 @@
 export * from './rating-buttons';
 export * from './rating-icons';
-export * from './rating-stars';

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

@@ -5,3 +5,4 @@ export * from './months.interface';
 export * from './week-days.interface';
 export * from './heading-level-type';
 export * from './svg-icon.interface';
+export * from './time-period-type';

package/artifacts/dist/types/models/time-period-type.d.ts

@@ -0,0 +1 @@
+export type TimePeriod = 'am' | 'pm';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ama-pt/agora-design-system",
   "description": "Ágora Design system",
-  "version": "1.3.0",
+  "version": "2.1.0",
   "main": "artifacts/dist/index.mjs",
   "module": "artifacts/dist/index.umd.js",
   "files": [
@@ -30,28 +30,28 @@
     "@babel/preset-env": "^7.22.10",
     "@babel/preset-react": "^7.22.5",
     "@babel/preset-typescript": "^7.22.5",
-    "@mdx-js/react": "^2.3.0",
+    "@mdx-js/react": "^3.1.0",
     "@playwright/test": "^1.39.0",
-    "@storybook/addon-a11y": "^8.4.5",
-    "@storybook/addon-actions": "^8.4.5",
-    "@storybook/addon-docs": "^8.4.5",
-    "@storybook/addon-essentials": "^8.4.5",
-    "@storybook/addon-interactions": "^8.4.5",
-    "@storybook/addon-links": "^8.4.5",
-    "@storybook/addon-storysource": "^8.4.5",
-    "@storybook/blocks": "^8.4.5",
+    "@storybook/addon-a11y": "^8.4.7",
+    "@storybook/addon-actions": "^8.4.7",
+    "@storybook/addon-docs": "^8.4.7",
+    "@storybook/addon-essentials": "^8.4.7",
+    "@storybook/addon-interactions": "^8.4.7",
+    "@storybook/addon-links": "^8.4.7",
+    "@storybook/addon-storysource": "^8.4.7",
+    "@storybook/blocks": "^8.4.7",
     "@storybook/mdx2-csf": "^1.1.0",
     "@storybook/preset-scss": "^1.0.3",
-    "@storybook/react": "^8.4.5",
-    "@storybook/react-vite": "^8.4.5",
-    "@storybook/test": "^8.4.5",
-    "@storybook/theming": "^8.4.5",
-    "@storybook/types": "^8.4.5",
+    "@storybook/react": "^8.4.7",
+    "@storybook/react-vite": "^8.4.7",
+    "@storybook/test": "^8.4.7",
+    "@storybook/theming": "^8.4.7",
+    "@storybook/types": "^8.4.7",
     "@testing-library/jest-dom": "^6.4.2",
-    "@testing-library/react": "^15.0.1",
+    "@testing-library/react": "^16.0.1",
     "@testing-library/user-event": "^14.5.1",
     "@types/jest": "^29.5.12",
-    "@types/node": "^20.5.0",
+    "@types/node": "^22.10.0",
     "@types/prop-types": "^15.7.5",
     "@types/react": "^18.2.20",
     "@types/react-dom": "^18.2.7",
@@ -61,8 +61,8 @@
     "@vitejs/plugin-react-swc": "^3.3.2",
     "autoprefixer": "^10.4.17",
     "babel-jest": "^29.7.0",
-    "date-fns": "^2.30.0",
-    "del": "^7.1.0",
+    "date-fns": "^4.1.0",
+    "del": "^8.0.0",
     "eslint": "^8.47.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-typescript": "^17.1.0",
@@ -74,8 +74,8 @@
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-storybook": "^0.11.1",
-    "glob": "^10.3.3",
-    "gulp": "^4.0.2",
+    "glob": "^11.0.0",
+    "gulp": "^5.0.0",
     "gulp-clean-css": "^4.3.0",
     "gulp-concat": "^2.6.1",
     "gulp-file": "^0.4.0",
@@ -90,7 +90,7 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-syntax-highlighter": "^15.5.0",
-    "storybook": "^8.4.5",
+    "storybook": "^8.4.7",
     "tailwindcss": "^3.4.1",
     "ts-dedent": "^2.2.0",
     "ts-jest": "^29.1.2",
@@ -98,7 +98,7 @@
     "tsc-alias": "^1.8.8",
     "typescript": "*",
     "vite": "^5.0.10",
-    "vite-tsconfig-paths": "^4.3.2"
+    "vite-tsconfig-paths": "^5.1.3"
   },
   "peerDependencies": {
     "@types/react": "^18.2.0",