@hitachivantara/uikit-react-core 5.37.2 → 5.38.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/components/Calendar/CalendarHeader/CalendarHeader.cjs.map +1 -1
- package/dist/cjs/components/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.cjs.map +1 -1
- package/dist/cjs/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.cjs.map +1 -1
- package/dist/cjs/components/Calendar/model.cjs.map +1 -1
- package/dist/cjs/components/FilterGroup/RightPanel/RightPanel.cjs +11 -3
- package/dist/cjs/components/FilterGroup/RightPanel/RightPanel.cjs.map +1 -1
- package/dist/cjs/components/Header/Navigation/MenuBar/Bar.cjs.map +1 -1
- package/dist/cjs/components/Header/Navigation/MenuBar/MenuBar.cjs.map +1 -1
- package/dist/cjs/components/Header/Navigation/MenuItem/MenuItem.cjs.map +1 -1
- package/dist/cjs/components/Input/Input.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/ConfirmationDialog/ConfirmationDialog.styles.cjs +1 -3
- package/dist/cjs/components/QueryBuilder/ConfirmationDialog/ConfirmationDialog.styles.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/QueryBuilder.styles.cjs +4 -5
- package/dist/cjs/components/QueryBuilder/QueryBuilder.styles.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/Rule/Rule.cjs +4 -4
- package/dist/cjs/components/QueryBuilder/Rule/Rule.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/Rule/Rule.styles.cjs +7 -4
- package/dist/cjs/components/QueryBuilder/Rule/Rule.styles.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.styles.cjs +3 -5
- package/dist/cjs/components/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.styles.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/Rule/Value/NumericValue/Numeric.styles.cjs +6 -10
- package/dist/cjs/components/QueryBuilder/Rule/Value/NumericValue/Numeric.styles.cjs.map +1 -1
- package/dist/cjs/components/QueryBuilder/RuleGroup/RuleGroup.cjs +10 -13
- package/dist/cjs/components/QueryBuilder/RuleGroup/RuleGroup.cjs.map +1 -1
- package/dist/cjs/components/Table/TableBody/TableBody.cjs +1 -1
- package/dist/cjs/components/Table/TableBody/TableBody.cjs.map +1 -1
- package/dist/cjs/components/Tooltip/Tooltip.cjs +1 -1
- package/dist/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
- package/dist/cjs/components/Typography/Typography.cjs +7 -0
- package/dist/cjs/components/Typography/Typography.cjs.map +1 -1
- package/dist/cjs/hooks/useControlled.cjs.map +1 -1
- package/dist/cjs/hooks/useImageLoaded.cjs +1 -1
- package/dist/cjs/hooks/useImageLoaded.cjs.map +1 -1
- package/dist/esm/components/Calendar/CalendarHeader/CalendarHeader.js.map +1 -1
- package/dist/esm/components/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.js.map +1 -1
- package/dist/esm/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.js.map +1 -1
- package/dist/esm/components/Calendar/model.js.map +1 -1
- package/dist/esm/components/FilterGroup/RightPanel/RightPanel.js +11 -3
- package/dist/esm/components/FilterGroup/RightPanel/RightPanel.js.map +1 -1
- package/dist/esm/components/Header/Navigation/MenuBar/Bar.js.map +1 -1
- package/dist/esm/components/Header/Navigation/MenuBar/MenuBar.js.map +1 -1
- package/dist/esm/components/Header/Navigation/MenuItem/MenuItem.js.map +1 -1
- package/dist/esm/components/Input/Input.js.map +1 -1
- package/dist/esm/components/QueryBuilder/ConfirmationDialog/ConfirmationDialog.styles.js +1 -3
- package/dist/esm/components/QueryBuilder/ConfirmationDialog/ConfirmationDialog.styles.js.map +1 -1
- package/dist/esm/components/QueryBuilder/QueryBuilder.styles.js +4 -5
- package/dist/esm/components/QueryBuilder/QueryBuilder.styles.js.map +1 -1
- package/dist/esm/components/QueryBuilder/Rule/Rule.js +4 -4
- package/dist/esm/components/QueryBuilder/Rule/Rule.js.map +1 -1
- package/dist/esm/components/QueryBuilder/Rule/Rule.styles.js +7 -4
- package/dist/esm/components/QueryBuilder/Rule/Rule.styles.js.map +1 -1
- package/dist/esm/components/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.styles.js +3 -5
- package/dist/esm/components/QueryBuilder/Rule/Value/DateTimeValue/DateTimeValue.styles.js.map +1 -1
- package/dist/esm/components/QueryBuilder/Rule/Value/NumericValue/Numeric.styles.js +6 -10
- package/dist/esm/components/QueryBuilder/Rule/Value/NumericValue/Numeric.styles.js.map +1 -1
- package/dist/esm/components/QueryBuilder/RuleGroup/RuleGroup.js +10 -13
- package/dist/esm/components/QueryBuilder/RuleGroup/RuleGroup.js.map +1 -1
- package/dist/esm/components/Table/TableBody/TableBody.js +1 -1
- package/dist/esm/components/Table/TableBody/TableBody.js.map +1 -1
- package/dist/esm/components/Tooltip/Tooltip.js +1 -1
- package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/esm/components/Typography/Typography.js +7 -0
- package/dist/esm/components/Typography/Typography.js.map +1 -1
- package/dist/esm/hooks/useControlled.js.map +1 -1
- package/dist/esm/hooks/useImageLoaded.js +1 -1
- package/dist/esm/hooks/useImageLoaded.js.map +1 -1
- package/dist/types/index.d.ts +30 -24
- package/package.json +5 -5
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CalendarHeader.cjs","sources":["../../../../../src/components/Calendar/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import { useState, useEffect, useContext } from \"react\";\nimport dayjs from \"dayjs\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\n\nimport {\n HvFormElementContext,\n HvFormElementValueContext,\n HvFormElementDescriptorsContext,\n} from \"@core/components/Forms\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks\";\nimport { HvInput, HvInputProps } from \"@core/components/Input\";\n\nimport { isRange, isSameDay, formatToLocale, isDate } from \"../utils\";\nimport { DateRangeProp } from \"../types\";\nimport { staticClasses, useClasses } from \"./CalendarHeader.styles\";\n\nexport { staticClasses as calendarHeaderClasses };\n\nexport type HvCalendarHeaderClasses = ExtractNames<typeof useClasses>;\n\ndayjs.extend(localeData);\ndayjs.extend(localizedFormat);\ndayjs.extend(customParseFormat);\n\nexport const HvCalendarHeader = (props: HvCalendarHeaderProps) => {\n const {\n id,\n value,\n locale = \"en-US\",\n classes: classesProp,\n onChange,\n showEndDate,\n showDayOfWeek = false,\n onFocus,\n invalidDateLabel = \"Invalid Date\",\n } = useDefaultProps(\"HvCalendarHeader\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const { elementId } = useContext(HvFormElementContext);\n const elementValue = useContext(HvFormElementValueContext);\n const { label } = useContext(HvFormElementDescriptorsContext);\n\n let localValue: string | Date | DateRangeProp | undefined =\n value ?? elementValue ?? \"\";\n if (isRange(localValue)) {\n localValue = showEndDate ? localValue.endDate : localValue.startDate;\n }\n\n const [dateValue, setDateValue] = useState<\n string | Date | DateRangeProp | undefined\n >(localValue);\n const [editedValue, setEditedValue] = useState<string | null>(null);\n const [displayValue, setDisplayValue] = useState(\"\");\n const [weekdayDisplay, setWeekdayDisplay] = useState(\"\");\n\n const localId = id ?? setId(elementId, \"calendarHeader\");\n\n const inputValue = editedValue ?? displayValue;\n const localeFormat = dayjs().locale(locale).localeData().longDateFormat(\"L\");\n\n const [isValidValue, setIsValidValue] = useState(\n inputValue.length === 0 || (!!inputValue && dayjs(localValue).isValid())\n );\n\n const validateInput = (incomingValid) =>\n incomingValid === undefined || dayjs(incomingValid).isValid();\n\n useEffect(() => {\n const valid = validateInput(localValue);\n setIsValidValue(valid);\n if (valid) {\n if (!localValue) {\n setDisplayValue(\"\");\n setEditedValue(null);\n setWeekdayDisplay(\"\");\n return;\n }\n const weekday = new Intl.DateTimeFormat(locale, {\n weekday: \"short\",\n }).format(isDate(localValue) ? localValue : 0);\n setDisplayValue(formatToLocale(localValue, locale));\n setEditedValue(null);\n setWeekdayDisplay(weekday);\n }\n }, [localValue, locale]);\n\n const handleNewDate = (event, date) => {\n // attempt to format in locale data, or fallback to default\n const localeParsedDate = dayjs(date, localeFormat);\n\n const isValidInput = localeParsedDate.isValid();\n const dateParsed = isValidInput\n ? localeParsedDate.toDate()\n : dayjs(date).toDate();\n // prevent extra updates\n if (!isSameDay(dateParsed, dateValue)) {\n setDateValue(dateParsed);\n onChange?.(event, dateParsed);\n }\n\n setIsValidValue(isValidInput);\n if (isValidInput) {\n setEditedValue(null);\n }\n };\n\n const onBlurHandler: HvInputProps[\"onBlur\"] = (event) => {\n if (editedValue == null) return;\n if (editedValue === \"\") {\n setIsValidValue(true);\n setEditedValue(null);\n return;\n }\n handleNewDate(event, editedValue);\n };\n\n const keyDownHandler: HvInputProps[\"onKeyDown\"] = (event) => {\n if (!isKey(event, \"Enter\") || editedValue == null || editedValue === \"\")\n return;\n event.preventDefault();\n\n handleNewDate(event, editedValue);\n };\n\n const onFocusHandler: HvInputProps[\"onFocus\"] = (event) => {\n if (!localValue) return;\n const formattedDate =\n isValidValue && isDate(localValue)\n ? dayjs(localValue).locale(locale).format(\"L\")\n : editedValue;\n setEditedValue(formattedDate);\n onFocus?.(event, formattedDate);\n };\n\n const onChangeHandler: HvInputProps[\"onChange\"] = (event, val) => {\n setEditedValue(val);\n };\n\n const isInvalid = !isValidValue && inputValue !== \"\";\n\n // This component needs to be further refactored\n // It's not possible to clear the date\n // In a new major there's no need for all these classes\n return (\n <div\n id={localId}\n className={cx(classes.root, {\n [classes.invalid]: isInvalid,\n })}\n >\n {showDayOfWeek && (\n <HvTypography className={classes.headerDayOfWeek}>\n {weekdayDisplay || \"\\u00A0\"}\n </HvTypography>\n )}\n <HvInput\n type=\"text\"\n id={setId(localId, \"header-input\")}\n className={classes.headerDate}\n classes={{\n input: classes.input,\n inputBorderContainer: classes.inputBorderContainer,\n error: classes.invalidMessageStyling,\n }}\n placeholder={localeFormat}\n value={inputValue}\n aria-labelledby={label?.[0]?.id}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n onChange={onChangeHandler}\n onKeyDown={keyDownHandler}\n status={isInvalid ? \"invalid\" : \"valid\"}\n statusMessage={invalidDateLabel}\n />\n </div>\n );\n};\n\n// TODO: refactor this out\nHvCalendarHeader.formElementType = \"HvCalendarHeader\";\n\nexport interface HvCalendarHeaderProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvCalendarHeaderClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * The text to be shown on the main part of the header.\n */\n value?: string | Date | DateRangeProp;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n value: Date | DateRangeProp\n ) => void;\n /**\n * Callback to handle input onFocus.\n */\n onFocus?: (\n event: React.FocusEvent<HTMLTextAreaElement | HTMLInputElement>,\n formattedDate: string | null\n ) => void;\n /**\n * Indicates if header should display end date in a date range.\n */\n showEndDate?: boolean;\n /**\n * Indicates if header should display the day of week.\n */\n showDayOfWeek?: boolean;\n /**\n * Label shown when date is invalid.\n */\n invalidDateLabel?: string;\n}\n"],"names":["dayjs","extend","localeData","localizedFormat","customParseFormat","HvCalendarHeader","props","id","value","locale","classes","classesProp","onChange","showEndDate","showDayOfWeek","onFocus","invalidDateLabel","useDefaultProps","cx","useClasses","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","label","HvFormElementDescriptorsContext","localValue","isRange","endDate","startDate","dateValue","setDateValue","useState","editedValue","setEditedValue","displayValue","setDisplayValue","weekdayDisplay","setWeekdayDisplay","localId","setId","inputValue","localeFormat","longDateFormat","isValidValue","setIsValidValue","length","isValid","validateInput","incomingValid","undefined","useEffect","valid","weekday","Intl","DateTimeFormat","format","isDate","formatToLocale","handleNewDate","event","date","localeParsedDate","isValidInput","dateParsed","toDate","isSameDay","onBlurHandler","keyDownHandler","isKey","preventDefault","onFocusHandler","formattedDate","onChangeHandler","val","isInvalid","root","invalid","HvTypography","headerDayOfWeek","jsx","HvInput","headerDate","input","inputBorderContainer","error","invalidMessageStyling","formElementType"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"CalendarHeader.cjs","sources":["../../../../../src/components/Calendar/CalendarHeader/CalendarHeader.tsx"],"sourcesContent":["import { useState, useEffect, useContext } from \"react\";\nimport dayjs from \"dayjs\";\nimport localeData from \"dayjs/plugin/localeData\";\nimport localizedFormat from \"dayjs/plugin/localizedFormat\";\nimport customParseFormat from \"dayjs/plugin/customParseFormat\";\n\nimport {\n HvFormElementContext,\n HvFormElementValueContext,\n HvFormElementDescriptorsContext,\n} from \"@core/components/Forms\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { useDefaultProps } from \"@core/hooks\";\nimport { HvInput, HvInputProps } from \"@core/components/Input\";\n\nimport { isRange, isSameDay, formatToLocale, isDate } from \"../utils\";\nimport { DateRangeProp } from \"../types\";\nimport { staticClasses, useClasses } from \"./CalendarHeader.styles\";\n\nexport { staticClasses as calendarHeaderClasses };\n\nexport type HvCalendarHeaderClasses = ExtractNames<typeof useClasses>;\n\ndayjs.extend(localeData);\ndayjs.extend(localizedFormat);\ndayjs.extend(customParseFormat);\n\nexport const HvCalendarHeader = (props: HvCalendarHeaderProps) => {\n const {\n id,\n value,\n locale = \"en-US\",\n classes: classesProp,\n onChange,\n showEndDate,\n showDayOfWeek = false,\n onFocus,\n invalidDateLabel = \"Invalid Date\",\n } = useDefaultProps(\"HvCalendarHeader\", props);\n\n const { classes, cx } = useClasses(classesProp);\n\n const { elementId } = useContext(HvFormElementContext);\n const elementValue = useContext(HvFormElementValueContext);\n const { label } = useContext(HvFormElementDescriptorsContext);\n\n let localValue: string | Date | DateRangeProp | undefined =\n value ?? elementValue ?? \"\";\n if (isRange(localValue)) {\n localValue = showEndDate ? localValue.endDate : localValue.startDate;\n }\n\n const [dateValue, setDateValue] = useState<\n string | Date | DateRangeProp | undefined\n >(localValue);\n const [editedValue, setEditedValue] = useState<string | null>(null);\n const [displayValue, setDisplayValue] = useState(\"\");\n const [weekdayDisplay, setWeekdayDisplay] = useState(\"\");\n\n const localId = id ?? setId(elementId, \"calendarHeader\");\n\n const inputValue = editedValue ?? displayValue;\n const localeFormat = dayjs().locale(locale).localeData().longDateFormat(\"L\");\n\n const [isValidValue, setIsValidValue] = useState(\n inputValue.length === 0 || (!!inputValue && dayjs(localValue).isValid())\n );\n\n const validateInput = (incomingValid: any) =>\n incomingValid === undefined || dayjs(incomingValid).isValid();\n\n useEffect(() => {\n const valid = validateInput(localValue);\n setIsValidValue(valid);\n if (valid) {\n if (!localValue) {\n setDisplayValue(\"\");\n setEditedValue(null);\n setWeekdayDisplay(\"\");\n return;\n }\n const weekday = new Intl.DateTimeFormat(locale, {\n weekday: \"short\",\n }).format(isDate(localValue) ? localValue : 0);\n setDisplayValue(formatToLocale(localValue, locale));\n setEditedValue(null);\n setWeekdayDisplay(weekday);\n }\n }, [localValue, locale]);\n\n const handleNewDate = (event: any, date: string) => {\n // attempt to format in locale data, or fallback to default\n const localeParsedDate = dayjs(date, localeFormat);\n\n const isValidInput = localeParsedDate.isValid();\n const dateParsed = isValidInput\n ? localeParsedDate.toDate()\n : dayjs(date).toDate();\n // prevent extra updates\n if (!isSameDay(dateParsed, dateValue)) {\n setDateValue(dateParsed);\n onChange?.(event, dateParsed);\n }\n\n setIsValidValue(isValidInput);\n if (isValidInput) {\n setEditedValue(null);\n }\n };\n\n const onBlurHandler: HvInputProps[\"onBlur\"] = (event) => {\n if (editedValue == null) return;\n if (editedValue === \"\") {\n setIsValidValue(true);\n setEditedValue(null);\n return;\n }\n handleNewDate(event, editedValue);\n };\n\n const keyDownHandler: HvInputProps[\"onKeyDown\"] = (event) => {\n if (!isKey(event, \"Enter\") || editedValue == null || editedValue === \"\")\n return;\n event.preventDefault();\n\n handleNewDate(event, editedValue);\n };\n\n const onFocusHandler: HvInputProps[\"onFocus\"] = (event) => {\n if (!localValue) return;\n const formattedDate =\n isValidValue && isDate(localValue)\n ? dayjs(localValue).locale(locale).format(\"L\")\n : editedValue;\n setEditedValue(formattedDate);\n onFocus?.(event, formattedDate);\n };\n\n const onChangeHandler: HvInputProps[\"onChange\"] = (event, val) => {\n setEditedValue(val);\n };\n\n const isInvalid = !isValidValue && inputValue !== \"\";\n\n // This component needs to be further refactored\n // It's not possible to clear the date\n // In a new major there's no need for all these classes\n return (\n <div\n id={localId}\n className={cx(classes.root, {\n [classes.invalid]: isInvalid,\n })}\n >\n {showDayOfWeek && (\n <HvTypography className={classes.headerDayOfWeek}>\n {weekdayDisplay || \"\\u00A0\"}\n </HvTypography>\n )}\n <HvInput\n type=\"text\"\n id={setId(localId, \"header-input\")}\n className={classes.headerDate}\n classes={{\n input: classes.input,\n inputBorderContainer: classes.inputBorderContainer,\n error: classes.invalidMessageStyling,\n }}\n placeholder={localeFormat}\n value={inputValue}\n aria-labelledby={label?.[0]?.id}\n onBlur={onBlurHandler}\n onFocus={onFocusHandler}\n onChange={onChangeHandler}\n onKeyDown={keyDownHandler}\n status={isInvalid ? \"invalid\" : \"valid\"}\n statusMessage={invalidDateLabel}\n />\n </div>\n );\n};\n\n// TODO: refactor this out\nHvCalendarHeader.formElementType = \"HvCalendarHeader\";\n\nexport interface HvCalendarHeaderProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvCalendarHeaderClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * The text to be shown on the main part of the header.\n */\n value?: string | Date | DateRangeProp;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event:\n | React.ChangeEvent<HTMLTextAreaElement | HTMLInputElement>\n | undefined,\n value: Date | DateRangeProp\n ) => void;\n /**\n * Callback to handle input onFocus.\n */\n onFocus?: (\n event: React.FocusEvent<HTMLTextAreaElement | HTMLInputElement>,\n formattedDate: string | null\n ) => void;\n /**\n * Indicates if header should display end date in a date range.\n */\n showEndDate?: boolean;\n /**\n * Indicates if header should display the day of week.\n */\n showDayOfWeek?: boolean;\n /**\n * Label shown when date is invalid.\n */\n invalidDateLabel?: string;\n}\n"],"names":["dayjs","extend","localeData","localizedFormat","customParseFormat","HvCalendarHeader","props","id","value","locale","classes","classesProp","onChange","showEndDate","showDayOfWeek","onFocus","invalidDateLabel","useDefaultProps","cx","useClasses","elementId","useContext","HvFormElementContext","elementValue","HvFormElementValueContext","label","HvFormElementDescriptorsContext","localValue","isRange","endDate","startDate","dateValue","setDateValue","useState","editedValue","setEditedValue","displayValue","setDisplayValue","weekdayDisplay","setWeekdayDisplay","localId","setId","inputValue","localeFormat","longDateFormat","isValidValue","setIsValidValue","length","isValid","validateInput","incomingValid","undefined","useEffect","valid","weekday","Intl","DateTimeFormat","format","isDate","formatToLocale","handleNewDate","event","date","localeParsedDate","isValidInput","dateParsed","toDate","isSameDay","onBlurHandler","keyDownHandler","isKey","preventDefault","onFocusHandler","formattedDate","onChangeHandler","val","isInvalid","root","invalid","HvTypography","headerDayOfWeek","jsx","HvInput","headerDate","input","inputBorderContainer","error","invalidMessageStyling","formElementType"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComposedNavigation.cjs","sources":["../../../../../../src/components/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.tsx"],"sourcesContent":["import { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport { Navigation } from \"../Navigation\";\nimport { VisibilitySelectorActions } from \"../../types\";\n\nimport { staticClasses, useClasses } from \"./ComposedNavigation.styles\";\n\nexport { staticClasses as composedNavigationClasses };\n\nexport type HvComposedNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport const HvComposedNavigation = ({\n classes: classesProp,\n id,\n locale,\n onChange,\n onViewModeChange,\n visibleYear,\n visibleMonth,\n ...others\n}: HvComposedNavigationProps) => {\n const { classes } = useClasses(classesProp);\n\n const listMonthNamesLong = getMonthNamesList(locale, \"long\");\n const monthName = listMonthNamesLong[visibleMonth - 1];\n\n return (\n <div className={classes.navigationContainer} {...others}>\n <div className={classes.navigationMonth}>\n <Navigation\n id={setId(id, \"navigation-month\")}\n navigationText={monthName}\n onNavigatePrevious={(event) => {\n onChange?.(event, \"previous_month\");\n }}\n onNavigateNext={(event) => {\n onChange?.(event, \"next_month\");\n }}\n onTextClick={() => {\n onViewModeChange(\"monthly\");\n }}\n className={classes.navigationMonth}\n />\n </div>\n\n <Navigation\n id={setId(id, \"navigation-year\")}\n navigationText={visibleYear.toString()}\n onNavigatePrevious={(event) => {\n onChange?.(event, \"previous_year\");\n }}\n onNavigateNext={(event) => {\n onChange?.(event, \"next_year\");\n }}\n />\n </div>\n );\n};\n\nexport interface HvComposedNavigationProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvComposedNavigationClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (event, action: VisibilitySelectorActions) => void;\n /**\n * Callback to define the view mode.\n */\n onViewModeChange: (viewMode: ViewMode) => void;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear: number;\n}\n"],"names":["HvComposedNavigation","classes","classesProp","id","locale","onChange","onViewModeChange","visibleYear","visibleMonth","others","useClasses","listMonthNamesLong","getMonthNamesList","monthName","navigationContainer","jsx","navigationMonth","Navigation","setId","event","toString"],"mappings":";;;;;;;AAeO,MAAMA,uBAAuBA,CAAC;AAAA,EACnCC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACsB,MAAM;AACzB,QAAA;AAAA,IAAER;AAAAA,EAAAA,IAAYS,0BAAAA,WAAWR,WAAW;AAEpCS,QAAAA,qBAAqBC,MAAAA,kBAAkBR,QAAQ,MAAM;AACrDS,QAAAA,YAAYF,mBAAmBH,eAAe,CAAC;AAErD,yCACG,OAAI,EAAA,WAAWP,QAAQa,qBAAqB,GAAIL,QAC/C,UAAA;AAAA,IAAAM,2BAAA,IAAC,OAAI,EAAA,WAAWd,QAAQe,iBACtB,yCAACC,WACC,YAAA,EAAA,IAAIC,MAAMf,MAAAA,IAAI,kBAAkB,GAChC,gBAAgBU,WAChB,oBAAqBM,CAAU,UAAA;AAC7Bd,iBAAWc,OAAO,gBAAgB;AAAA,IAAA,GAEpC,gBAAiBA,CAAU,UAAA;AACzBd,iBAAWc,OAAO,YAAY;AAAA,IAChC,GACA,aAAa,MAAM;AACjBb,uBAAiB,SAAS;AAAA,IAE5B,GAAA,WAAWL,QAAQe,gBAAAA,CAAgB,EAEvC,CAAA;AAAA,IAECD,2BAAAA,IAAAE,WAAAA,YAAA,EACC,IAAIC,MAAAA,MAAMf,IAAI,iBAAiB,GAC/B,gBAAgBI,YAAYa,SAC5B,GAAA,oBAAqBD,CAAU,UAAA;AAC7Bd,iBAAWc,OAAO,eAAe;AAAA,IAAA,GAEnC,gBAAiBA,CAAU,UAAA;AACzBd,iBAAWc,OAAO,WAAW;AAAA,IAAA,GAC7B;AAAA,EAEN,EAAA,CAAA;AAEJ;;;"}
|
|
1
|
+
{"version":3,"file":"ComposedNavigation.cjs","sources":["../../../../../../src/components/Calendar/CalendarNavigation/ComposedNavigation/ComposedNavigation.tsx"],"sourcesContent":["import { setId } from \"@core/utils/setId\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport { Navigation } from \"../Navigation\";\nimport { VisibilitySelectorActions } from \"../../types\";\n\nimport { staticClasses, useClasses } from \"./ComposedNavigation.styles\";\n\nexport { staticClasses as composedNavigationClasses };\n\nexport type HvComposedNavigationClasses = ExtractNames<typeof useClasses>;\n\nexport const HvComposedNavigation = ({\n classes: classesProp,\n id,\n locale,\n onChange,\n onViewModeChange,\n visibleYear,\n visibleMonth,\n ...others\n}: HvComposedNavigationProps) => {\n const { classes } = useClasses(classesProp);\n\n const listMonthNamesLong = getMonthNamesList(locale, \"long\");\n const monthName = listMonthNamesLong[visibleMonth - 1];\n\n return (\n <div className={classes.navigationContainer} {...others}>\n <div className={classes.navigationMonth}>\n <Navigation\n id={setId(id, \"navigation-month\")}\n navigationText={monthName}\n onNavigatePrevious={(event) => {\n onChange?.(event, \"previous_month\");\n }}\n onNavigateNext={(event) => {\n onChange?.(event, \"next_month\");\n }}\n onTextClick={() => {\n onViewModeChange(\"monthly\");\n }}\n className={classes.navigationMonth}\n />\n </div>\n\n <Navigation\n id={setId(id, \"navigation-year\")}\n navigationText={visibleYear.toString()}\n onNavigatePrevious={(event) => {\n onChange?.(event, \"previous_year\");\n }}\n onNavigateNext={(event) => {\n onChange?.(event, \"next_year\");\n }}\n />\n </div>\n );\n};\n\nexport interface HvComposedNavigationProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvComposedNavigationClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (event: any, action: VisibilitySelectorActions) => void;\n /**\n * Callback to define the view mode.\n */\n onViewModeChange: (viewMode: ViewMode) => void;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear: number;\n}\n"],"names":["HvComposedNavigation","classes","classesProp","id","locale","onChange","onViewModeChange","visibleYear","visibleMonth","others","useClasses","listMonthNamesLong","getMonthNamesList","monthName","navigationContainer","jsx","navigationMonth","Navigation","setId","event","toString"],"mappings":";;;;;;;AAeO,MAAMA,uBAAuBA,CAAC;AAAA,EACnCC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACsB,MAAM;AACzB,QAAA;AAAA,IAAER;AAAAA,EAAAA,IAAYS,0BAAAA,WAAWR,WAAW;AAEpCS,QAAAA,qBAAqBC,MAAAA,kBAAkBR,QAAQ,MAAM;AACrDS,QAAAA,YAAYF,mBAAmBH,eAAe,CAAC;AAErD,yCACG,OAAI,EAAA,WAAWP,QAAQa,qBAAqB,GAAIL,QAC/C,UAAA;AAAA,IAAAM,2BAAA,IAAC,OAAI,EAAA,WAAWd,QAAQe,iBACtB,yCAACC,WACC,YAAA,EAAA,IAAIC,MAAMf,MAAAA,IAAI,kBAAkB,GAChC,gBAAgBU,WAChB,oBAAqBM,CAAU,UAAA;AAC7Bd,iBAAWc,OAAO,gBAAgB;AAAA,IAAA,GAEpC,gBAAiBA,CAAU,UAAA;AACzBd,iBAAWc,OAAO,YAAY;AAAA,IAChC,GACA,aAAa,MAAM;AACjBb,uBAAiB,SAAS;AAAA,IAE5B,GAAA,WAAWL,QAAQe,gBAAAA,CAAgB,EAEvC,CAAA;AAAA,IAECD,2BAAAA,IAAAE,WAAAA,YAAA,EACC,IAAIC,MAAAA,MAAMf,IAAI,iBAAiB,GAC/B,gBAAgBI,YAAYa,SAC5B,GAAA,oBAAqBD,CAAU,UAAA;AAC7Bd,iBAAWc,OAAO,eAAe;AAAA,IAAA,GAEnC,gBAAiBA,CAAU,UAAA;AACzBd,iBAAWc,OAAO,WAAW;AAAA,IAAA,GAC7B;AAAA,EAEN,EAAA,CAAA;AAEJ;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MonthSelector.cjs","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.tsx"],"sourcesContent":["import { isKey } from \"@core/utils/keyboardUtils\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"../../types\";\n\nimport { staticClasses, useClasses } from \"./MonthSelector.styles\";\n\nexport { staticClasses as monthSelectorClasses };\n\nexport type HvMonthSelectorClasses = ExtractNames<typeof useClasses>;\n\nexport const HvMonthSelector = ({\n classes: classesProp,\n id,\n locale,\n onChange,\n onViewModeChange,\n rangeMode,\n visibleMonth,\n ...others\n}: HvMonthSelectorProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const listMonthNamesShort = getMonthNamesList(locale, \"short\");\n const onKeyDownHandler = (event, index) => {\n if (isKey(event, \"Enter\")) {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }\n };\n return (\n <div\n className={cx(classes.calendarMonthlyGrid, {\n [classes.rangeModeWidth]: rangeMode,\n [classes.normalWidth]: !rangeMode,\n })}\n >\n {listMonthNamesShort.map((monthName, index) => (\n <div\n className={classes.focusSelection}\n key={monthName}\n role=\"button\"\n onClick={(event) => {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }}\n onKeyDown={(event) => onKeyDownHandler(event, index)}\n tabIndex={0}\n {...others}\n >\n <HvTypography\n className={cx(classes.calendarMonthlyCell, {\n [classes.calendarMonthlyCellSelected]: index + 1 === visibleMonth,\n })}\n >\n {monthName}\n </HvTypography>\n </div>\n ))}\n </div>\n );\n};\n\nexport interface HvMonthSelectorProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvMonthSelectorClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event: any,\n action: VisibilitySelectorActions,\n value: Date | DateRangeProp | number\n ) => void;\n /**\n * Callback to define the input date.\n */\n onViewModeChange: (viewMode: ViewMode) => void;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear?: number;\n rangeMode?: boolean;\n}\n"],"names":["HvMonthSelector","classes","classesProp","id","locale","onChange","onViewModeChange","rangeMode","visibleMonth","others","cx","useClasses","listMonthNamesShort","getMonthNamesList","onKeyDownHandler","event","index","isKey","jsx","calendarMonthlyGrid","rangeModeWidth","normalWidth","map","monthName","focusSelection","HvTypography","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;;;;AAeO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACiB,MAAM;AACpB,QAAA;AAAA,IAAER;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,qBAAAA,WAAWT,WAAW;AAExCU,QAAAA,sBAAsBC,MAAAA,kBAAkBT,QAAQ,OAAO;AACvDU,QAAAA,mBAAmBA,CAACC,
|
|
1
|
+
{"version":3,"file":"MonthSelector.cjs","sources":["../../../../../../src/components/Calendar/CalendarNavigation/MonthSelector/MonthSelector.tsx"],"sourcesContent":["import { isKey } from \"@core/utils/keyboardUtils\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { getMonthNamesList } from \"../../utils\";\nimport { ViewMode } from \"../../enums\";\nimport { DateRangeProp, VisibilitySelectorActions } from \"../../types\";\n\nimport { staticClasses, useClasses } from \"./MonthSelector.styles\";\n\nexport { staticClasses as monthSelectorClasses };\n\nexport type HvMonthSelectorClasses = ExtractNames<typeof useClasses>;\n\nexport const HvMonthSelector = ({\n classes: classesProp,\n id,\n locale,\n onChange,\n onViewModeChange,\n rangeMode,\n visibleMonth,\n ...others\n}: HvMonthSelectorProps) => {\n const { classes, cx } = useClasses(classesProp);\n\n const listMonthNamesShort = getMonthNamesList(locale, \"short\");\n const onKeyDownHandler = (event: any, index: number) => {\n if (isKey(event, \"Enter\")) {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }\n };\n return (\n <div\n className={cx(classes.calendarMonthlyGrid, {\n [classes.rangeModeWidth]: rangeMode,\n [classes.normalWidth]: !rangeMode,\n })}\n >\n {listMonthNamesShort.map((monthName, index) => (\n <div\n className={classes.focusSelection}\n key={monthName}\n role=\"button\"\n onClick={(event) => {\n onChange?.(event, \"month\", index + 1);\n onViewModeChange(\"calendar\");\n }}\n onKeyDown={(event) => onKeyDownHandler(event, index)}\n tabIndex={0}\n {...others}\n >\n <HvTypography\n className={cx(classes.calendarMonthlyCell, {\n [classes.calendarMonthlyCellSelected]: index + 1 === visibleMonth,\n })}\n >\n {monthName}\n </HvTypography>\n </div>\n ))}\n </div>\n );\n};\n\nexport interface HvMonthSelectorProps {\n /**\n * A Jss Object used to override or extend the component styles.\n */\n classes?: HvMonthSelectorClasses;\n /**\n * Identifier.\n */\n id?: string;\n /**\n * Locale to be used by the calendar.\n */\n locale?: string;\n /**\n * Callback to define the input date.\n */\n onChange?: (\n event: any,\n action: VisibilitySelectorActions,\n value: Date | DateRangeProp | number\n ) => void;\n /**\n * Callback to define the input date.\n */\n onViewModeChange: (viewMode: ViewMode) => void;\n /**\n * Controls the visible month of the Calendar\n */\n visibleMonth: number;\n /**\n * Controls the visible month of the Calendar\n */\n visibleYear?: number;\n rangeMode?: boolean;\n}\n"],"names":["HvMonthSelector","classes","classesProp","id","locale","onChange","onViewModeChange","rangeMode","visibleMonth","others","cx","useClasses","listMonthNamesShort","getMonthNamesList","onKeyDownHandler","event","index","isKey","jsx","calendarMonthlyGrid","rangeModeWidth","normalWidth","map","monthName","focusSelection","HvTypography","calendarMonthlyCell","calendarMonthlyCellSelected"],"mappings":";;;;;;;AAeO,MAAMA,kBAAkBA,CAAC;AAAA,EAC9BC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACiB,MAAM;AACpB,QAAA;AAAA,IAAER;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,qBAAAA,WAAWT,WAAW;AAExCU,QAAAA,sBAAsBC,MAAAA,kBAAkBT,QAAQ,OAAO;AACvDU,QAAAA,mBAAmBA,CAACC,OAAYC,UAAkB;AAClDC,QAAAA,cAAAA,MAAMF,OAAO,OAAO,GAAG;AACdA,iBAAAA,OAAO,SAASC,QAAQ,CAAC;AACpCV,uBAAiB,UAAU;AAAA,IAC7B;AAAA,EAAA;AAEF,SACGY,2BAAAA,IAAA,OAAA,EACC,WAAWR,GAAGT,QAAQkB,qBAAqB;AAAA,IACzC,CAAClB,QAAQmB,cAAc,GAAGb;AAAAA,IAC1B,CAACN,QAAQoB,WAAW,GAAG,CAACd;AAAAA,EAAAA,CACzB,GAEAK,UAAoBU,oBAAAA,IAAI,CAACC,WAAWP,UAClCE,+BAAA,OAAA,EACC,WAAWjB,QAAQuB,gBAEnB,MAAK,UACL,SAAUT,CAAU,UAAA;AACPA,eAAAA,OAAO,SAASC,QAAQ,CAAC;AACpCV,qBAAiB,UAAU;AAAA,EAAA,GAE7B,WAAYS,CAAAA,UAAUD,iBAAiBC,OAAOC,KAAK,GACnD,UAAU,GACNP,GAAAA,QAEJ,UAACS,2BAAAA,IAAAO,WAAA,cAAA,EACC,WAAWf,GAAGT,QAAQyB,qBAAqB;AAAA,IACzC,CAACzB,QAAQ0B,2BAA2B,GAAGX,QAAQ,MAAMR;AAAAA,EAAAA,CACtD,GAEAe,UAAAA,UACH,CAAA,EAhBKA,GAAAA,SAiBP,CACD,EACH,CAAA;AAEJ;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"model.cjs","sources":["../../../../src/components/Calendar/model.tsx"],"sourcesContent":["import { createDatesArray, isRange } from \"./utils\";\n\n/**\n * Calendar builder for a specific month and year.\n * Returns an array of date objects.\n */\nexport default class CalendarModel {\n month: any;\n\n year: any;\n\n dates: Date[] = [];\n\n constructor(month?: number, year?: number) {\n this.updateModel(month
|
|
1
|
+
{"version":3,"file":"model.cjs","sources":["../../../../src/components/Calendar/model.tsx"],"sourcesContent":["import { createDatesArray, isRange } from \"./utils\";\n\n/**\n * Calendar builder for a specific month and year.\n * Returns an array of date objects.\n */\nexport default class CalendarModel {\n month: any;\n\n year: any;\n\n dates: Date[] = [];\n\n constructor(month?: number, year?: number) {\n this.updateModel(month!, year!);\n }\n\n /**\n * Updates the model with the received month and year\n *\n * @param month - Number of the month (1 to 12).\n * @param year - Number of the year.\n * @memberOf CalendarModel\n */\n updateModel = (month: number, year: number) => {\n let validMonth = month;\n let validYear = year;\n if (!Number.isInteger(validMonth)) {\n validMonth = new Date().getMonth() + 1;\n }\n if (!Number.isInteger(validYear)) {\n validYear = new Date().getFullYear();\n }\n\n this.month = validMonth;\n this.year = validYear;\n this.dates = createDatesArray(validMonth, validYear);\n };\n}\n\nconst generateModelFromDate = (seedValue) => {\n let calendarModel;\n\n if (typeof seedValue === \"string\") {\n const today = new Date();\n calendarModel = new CalendarModel(\n today.getMonth() + 1,\n today.getFullYear()\n );\n } else if (isRange(seedValue)) {\n calendarModel = new CalendarModel(\n seedValue.startDate.getMonth() + 1,\n seedValue.startDate.getFullYear()\n );\n } else {\n calendarModel = new CalendarModel(\n seedValue.getMonth() + 1,\n seedValue.getFullYear()\n );\n }\n\n return calendarModel;\n};\n\nexport const generateCalendarModel = (\n seedValue: any,\n visibleMonth?: number,\n visibleYear?: number\n) => {\n let calendarModel;\n\n if (visibleMonth && visibleYear) {\n calendarModel = new CalendarModel(visibleMonth, visibleYear);\n } else if (visibleMonth && !visibleYear) {\n calendarModel = new CalendarModel(visibleMonth, seedValue.getFullYear());\n } else if (!visibleMonth && visibleYear) {\n calendarModel = new CalendarModel(1, visibleYear);\n } else {\n calendarModel = generateModelFromDate(seedValue);\n }\n\n return calendarModel;\n};\n"],"names":["CalendarModel","constructor","month","year","dates","updateModel","validMonth","validYear","Number","isInteger","Date","getMonth","getFullYear","createDatesArray","generateModelFromDate","seedValue","calendarModel","today","isRange","startDate","generateCalendarModel","visibleMonth","visibleYear"],"mappings":";;;AAMA,MAAqBA,cAAc;AAAA,EAOjCC,YAAYC,OAAgBC,MAAe;AAF3CC,SAAAA,QAAgB;AAaFC,SAAAA,cAAAA,CAACH,QAAeC,UAAiB;AAC7C,UAAIG,aAAaJ;AACjB,UAAIK,YAAYJ;AAChB,UAAI,CAACK,OAAOC,UAAUH,UAAU,GAAG;AACjCA,sBAAiBI,oBAAAA,KAAOC,GAAAA,SAAAA,IAAa;AAAA,MACvC;AACA,UAAI,CAACH,OAAOC,UAAUF,SAAS,GAAG;AACpB,qBAAA,oBAAIG,KAAK,GAAEE,YAAY;AAAA,MACrC;AAEA,WAAKV,QAAQI;AACb,WAAKH,OAAOI;AACPH,WAAAA,QAAQS,MAAAA,iBAAiBP,YAAYC,SAAS;AAAA,IAAA;AAtB9CF,SAAAA,YAAYH,OAAQC,IAAK;AAAA,EAChC;AAuBF;AAEA,MAAMW,wBAAyBC,CAAc,cAAA;AACvCC,MAAAA;AAEA,MAAA,OAAOD,cAAc,UAAU;AAC3BE,UAAAA,4BAAYP;AACF,oBAAA,IAAIV,cAClBiB,MAAMN,aAAa,GACnBM,MAAML,aACR;AAAA,EAAA,WACSM,MAAAA,QAAQH,SAAS,GAAG;AACb,oBAAA,IAAIf,cAClBe,UAAUI,UAAUR,aAAa,GACjCI,UAAUI,UAAUP,YACtB,CAAA;AAAA,EAAA,OACK;AACW,oBAAA,IAAIZ,cAClBe,UAAUJ,aAAa,GACvBI,UAAUH,aACZ;AAAA,EACF;AAEOI,SAAAA;AACT;AAEO,MAAMI,wBAAwBA,CACnCL,WACAM,cACAC,gBACG;AACCN,MAAAA;AAEJ,MAAIK,gBAAgBC,aAAa;AACf,oBAAA,IAAItB,cAAcqB,cAAcC,WAAW;AAAA,EAAA,WAClDD,gBAAgB,CAACC,aAAa;AACvCN,oBAAgB,IAAIhB,cAAcqB,cAAcN,UAAUH,YAAa,CAAA;AAAA,EAAA,WAC9D,CAACS,gBAAgBC,aAAa;AACvB,oBAAA,IAAItB,cAAc,GAAGsB,WAAW;AAAA,EAAA,OAC3C;AACLN,oBAAgBF,sBAAsBC,SAAS;AAAA,EACjD;AAEOC,SAAAA;AACT;;;"}
|
|
@@ -32,7 +32,7 @@ const HvFilterGroupRightPanel = ({
|
|
|
32
32
|
setFilterValues,
|
|
33
33
|
activeGroup
|
|
34
34
|
} = React.useContext(FilterGroupContext.HvFilterGroupContext);
|
|
35
|
-
const activeGroupOptions = React.useMemo(() => filterOptions[activeGroup]?.data.map((option) => option.id) || [], [filterOptions, activeGroup]);
|
|
35
|
+
const activeGroupOptions = React.useMemo(() => filterOptions[activeGroup]?.data.filter((option) => option.name.toLowerCase().includes(searchStr.toLowerCase())).map((option) => option.id) || [], [filterOptions, activeGroup, searchStr]);
|
|
36
36
|
const activeFilterValues = React.useMemo(() => filterValues[activeGroup]?.filter((value) => activeGroupOptions.includes(value)) || [], [filterValues, activeGroupOptions, activeGroup]);
|
|
37
37
|
const listValues = React.useMemo(() => filterOptions[activeGroup]?.data.map((option) => ({
|
|
38
38
|
...option,
|
|
@@ -57,9 +57,17 @@ const HvFilterGroupRightPanel = ({
|
|
|
57
57
|
};
|
|
58
58
|
const handleSelectAll = React.useCallback(() => {
|
|
59
59
|
const newFilterValues = cloneDeep__default.default(filterValues);
|
|
60
|
-
|
|
60
|
+
if (anySelected) {
|
|
61
|
+
if (searchStr !== "") {
|
|
62
|
+
newFilterValues[activeGroup] = filterValues[activeGroup]?.filter((value) => !activeGroupOptions.includes(value));
|
|
63
|
+
} else {
|
|
64
|
+
newFilterValues[activeGroup] = [];
|
|
65
|
+
}
|
|
66
|
+
} else {
|
|
67
|
+
newFilterValues[activeGroup] = [...filterValues[activeGroup], ...activeGroupOptions];
|
|
68
|
+
}
|
|
61
69
|
setFilterValues(newFilterValues);
|
|
62
|
-
}, [activeGroup, activeGroupOptions, anySelected, filterValues, setFilterValues]);
|
|
70
|
+
}, [activeGroup, activeGroupOptions, anySelected, filterValues, setFilterValues, searchStr]);
|
|
63
71
|
const SelectAll = React.useCallback(() => {
|
|
64
72
|
const nbrSelected = activeFilterValues?.length;
|
|
65
73
|
const defaultLabel = /* @__PURE__ */ jsxRuntime.jsx(Typography.HvTypography, { component: "span", children: nbrSelected > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPanel.cjs","sources":["../../../../../src/components/FilterGroup/RightPanel/RightPanel.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\n\nimport cloneDeep from \"lodash/cloneDeep\";\n\nimport { HvCheckBox } from \"@core/components/CheckBox\";\nimport { HvInput } from \"@core/components/Input\";\nimport { HvList, HvListProps } from \"@core/components/List\";\nimport { HvPanel } from \"@core/components/Panel\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./RightPanel.styles\";\n\nexport { staticClasses as filterGroupRightPanelClasses };\n\nexport type HvFilterGroupRightPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupRightPanelProps {\n id?: string;\n className?: string;\n labels?: {\n searchBoxPlaceholder?: string;\n selectAll?: string;\n multiSelectionConjunction?: string;\n };\n emptyElement?: React.ReactNode;\n classes?: HvFilterGroupRightPanelClasses;\n}\n\nexport const HvFilterGroupRightPanel = ({\n id,\n className,\n labels,\n emptyElement,\n classes: classesProp,\n}: HvFilterGroupRightPanelProps) => {\n const { classes } = useClasses(classesProp);\n const [searchStr, setSearchStr] = useState<string>(\"\");\n const [allSelected, setAllSelected] = useState<boolean>(false);\n const [anySelected, setAnySelected] = useState<boolean>(false);\n\n const {\n filterOptions,\n filterValues = [],\n setFilterValues,\n activeGroup,\n } = useContext(HvFilterGroupContext);\n\n const activeGroupOptions = useMemo(\n () => filterOptions[activeGroup]?.data.map((option) => option.id) || [],\n [filterOptions, activeGroup]\n );\n\n const activeFilterValues = useMemo(\n () =>\n filterValues[activeGroup]?.filter((value) =>\n activeGroupOptions.includes(value)\n ) || [],\n [filterValues, activeGroupOptions, activeGroup]\n );\n\n const listValues = useMemo(\n () =>\n filterOptions[activeGroup]?.data.map((option) => ({\n ...option,\n label: option.name,\n selected: filterValues[activeGroup]?.includes(option.id),\n isHidden:\n option.name.toLowerCase().indexOf(searchStr.toLowerCase()) < 0,\n })) || [],\n [filterOptions, filterValues, activeGroup, searchStr]\n );\n\n const updateSelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n const hasSelection = nbrSelected > 0;\n const allSelect = nbrSelected === activeGroupOptions.length;\n\n setAnySelected(hasSelection);\n setAllSelected(hasSelection && allSelect);\n }, [activeFilterValues, activeGroupOptions]);\n\n useEffect(() => {\n updateSelectAll();\n }, [activeFilterValues, updateSelectAll]);\n\n useEffect(() => setSearchStr(\"\"), [activeGroup]);\n\n const onChangeHandler: HvListProps[\"onChange\"] = (values) => {\n const newFilterValues = filterOptions.map((_, i) =>\n activeGroup === i\n ? values.filter((v) => v.selected).map((v) => v.id)\n : [...(filterValues[i] || [])]\n );\n setFilterValues(newFilterValues as any);\n };\n\n const handleSelectAll = useCallback(() => {\n const newFilterValues = cloneDeep(filterValues);\n newFilterValues[activeGroup] = anySelected ? [] : activeGroupOptions;\n\n setFilterValues(newFilterValues);\n }, [\n activeGroup,\n activeGroupOptions,\n anySelected,\n filterValues,\n setFilterValues,\n ]);\n\n /**\n * Create selectAll component.\n *\n * @returns {*}\n */\n const SelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n\n const defaultLabel = (\n <HvTypography component=\"span\">\n {nbrSelected > 0 ? (\n <>\n <b>{nbrSelected}</b>\n {` ${labels?.multiSelectionConjunction} ${activeGroupOptions.length}`}\n </>\n ) : (\n <>\n <b>{labels?.selectAll}</b>\n {` (${activeGroupOptions.length})`}\n </>\n )}\n </HvTypography>\n );\n\n return (\n <div className={classes.selectAllContainer}>\n <HvCheckBox\n id={setId(id, \"select-all\")}\n label={defaultLabel}\n onChange={() => handleSelectAll()}\n className={classes.selectAll}\n indeterminate={anySelected && !allSelected}\n checked={allSelected}\n />\n </div>\n );\n }, [\n activeFilterValues?.length,\n activeGroupOptions.length,\n allSelected,\n anySelected,\n handleSelectAll,\n id,\n labels,\n classes?.selectAllContainer,\n classes?.selectAll,\n ]);\n\n return (\n <HvPanel id={setId(id, \"rightPanel\")} className={className}>\n {listValues.length > 0 ? (\n <>\n <HvInput\n id={setId(id, \"search\")}\n classes={{\n root: classes.search,\n }}\n type=\"search\"\n placeholder={labels?.searchBoxPlaceholder}\n value={searchStr}\n onChange={(_, str) => setSearchStr(str)}\n />\n <SelectAll />\n <HvList\n key={activeGroup}\n id={setId(id, \"list\")}\n values={listValues}\n className={classes.list}\n multiSelect\n useSelector\n showSelectAll={false}\n onChange={onChangeHandler}\n selectable\n condensed\n hasTooltips\n />\n </>\n ) : (\n emptyElement\n )}\n </HvPanel>\n );\n};\n"],"names":["HvFilterGroupRightPanel","id","className","labels","emptyElement","classes","classesProp","useClasses","searchStr","setSearchStr","useState","allSelected","setAllSelected","anySelected","setAnySelected","filterOptions","filterValues","setFilterValues","activeGroup","useContext","HvFilterGroupContext","activeGroupOptions","useMemo","data","map","option","activeFilterValues","filter","value","includes","listValues","label","name","selected","isHidden","toLowerCase","indexOf","updateSelectAll","useCallback","nbrSelected","length","hasSelection","allSelect","useEffect","onChangeHandler","values","newFilterValues","_","i","v","handleSelectAll","cloneDeep","SelectAll","defaultLabel","jsx","HvTypography","jsxs","Fragment","multiSelectionConjunction","selectAll","selectAllContainer","HvCheckBox","setId","HvPanel","HvInput","root","search","searchBoxPlaceholder","str","HvList","list"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"RightPanel.cjs","sources":["../../../../../src/components/FilterGroup/RightPanel/RightPanel.tsx"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useState } from \"react\";\n\nimport cloneDeep from \"lodash/cloneDeep\";\n\nimport { HvCheckBox } from \"@core/components/CheckBox\";\nimport { HvInput } from \"@core/components/Input\";\nimport { HvList, HvListProps } from \"@core/components/List\";\nimport { HvPanel } from \"@core/components/Panel\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { setId } from \"@core/utils/setId\";\n\nimport { HvFilterGroupContext } from \"../FilterGroupContext\";\nimport { staticClasses, useClasses } from \"./RightPanel.styles\";\n\nexport { staticClasses as filterGroupRightPanelClasses };\n\nexport type HvFilterGroupRightPanelClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvFilterGroupRightPanelProps {\n id?: string;\n className?: string;\n labels?: {\n searchBoxPlaceholder?: string;\n selectAll?: string;\n multiSelectionConjunction?: string;\n };\n emptyElement?: React.ReactNode;\n classes?: HvFilterGroupRightPanelClasses;\n}\n\nexport const HvFilterGroupRightPanel = ({\n id,\n className,\n labels,\n emptyElement,\n classes: classesProp,\n}: HvFilterGroupRightPanelProps) => {\n const { classes } = useClasses(classesProp);\n const [searchStr, setSearchStr] = useState<string>(\"\");\n const [allSelected, setAllSelected] = useState<boolean>(false);\n const [anySelected, setAnySelected] = useState<boolean>(false);\n\n const {\n filterOptions,\n filterValues = [],\n setFilterValues,\n activeGroup,\n } = useContext(HvFilterGroupContext);\n\n const activeGroupOptions = useMemo(\n () =>\n filterOptions[activeGroup]?.data\n .filter((option) =>\n option.name.toLowerCase().includes(searchStr.toLowerCase())\n )\n .map((option) => option.id) || [],\n [filterOptions, activeGroup, searchStr]\n );\n\n const activeFilterValues = useMemo(\n () =>\n filterValues[activeGroup]?.filter((value) =>\n activeGroupOptions.includes(value)\n ) || [],\n [filterValues, activeGroupOptions, activeGroup]\n );\n\n const listValues = useMemo(\n () =>\n filterOptions[activeGroup]?.data.map((option) => ({\n ...option,\n label: option.name,\n selected: filterValues[activeGroup]?.includes(option.id),\n isHidden:\n option.name.toLowerCase().indexOf(searchStr.toLowerCase()) < 0,\n })) || [],\n [filterOptions, filterValues, activeGroup, searchStr]\n );\n\n const updateSelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n const hasSelection = nbrSelected > 0;\n const allSelect = nbrSelected === activeGroupOptions.length;\n\n setAnySelected(hasSelection);\n setAllSelected(hasSelection && allSelect);\n }, [activeFilterValues, activeGroupOptions]);\n\n useEffect(() => {\n updateSelectAll();\n }, [activeFilterValues, updateSelectAll]);\n\n useEffect(() => setSearchStr(\"\"), [activeGroup]);\n\n const onChangeHandler: HvListProps[\"onChange\"] = (values) => {\n const newFilterValues = filterOptions.map((_, i) =>\n activeGroup === i\n ? values.filter((v) => v.selected).map((v) => v.id)\n : [...(filterValues[i] || [])]\n );\n setFilterValues(newFilterValues as any);\n };\n\n const handleSelectAll = useCallback(() => {\n const newFilterValues = cloneDeep(filterValues);\n\n if (anySelected) {\n if (searchStr !== \"\") {\n newFilterValues[activeGroup] = filterValues[activeGroup]?.filter(\n (value) => !activeGroupOptions.includes(value)\n );\n } else {\n newFilterValues[activeGroup] = [];\n }\n } else {\n newFilterValues[activeGroup] = [\n ...filterValues[activeGroup],\n ...activeGroupOptions,\n ];\n }\n\n setFilterValues(newFilterValues);\n }, [\n activeGroup,\n activeGroupOptions,\n anySelected,\n filterValues,\n setFilterValues,\n searchStr,\n ]);\n\n /**\n * Create selectAll component.\n *\n * @returns {*}\n */\n const SelectAll = useCallback(() => {\n const nbrSelected = activeFilterValues?.length;\n\n const defaultLabel = (\n <HvTypography component=\"span\">\n {nbrSelected > 0 ? (\n <>\n <b>{nbrSelected}</b>\n {` ${labels?.multiSelectionConjunction} ${activeGroupOptions.length}`}\n </>\n ) : (\n <>\n <b>{labels?.selectAll}</b>\n {` (${activeGroupOptions.length})`}\n </>\n )}\n </HvTypography>\n );\n\n return (\n <div className={classes.selectAllContainer}>\n <HvCheckBox\n id={setId(id, \"select-all\")}\n label={defaultLabel}\n onChange={() => handleSelectAll()}\n className={classes.selectAll}\n indeterminate={anySelected && !allSelected}\n checked={allSelected}\n />\n </div>\n );\n }, [\n activeFilterValues?.length,\n activeGroupOptions.length,\n allSelected,\n anySelected,\n handleSelectAll,\n id,\n labels,\n classes?.selectAllContainer,\n classes?.selectAll,\n ]);\n\n return (\n <HvPanel id={setId(id, \"rightPanel\")} className={className}>\n {listValues.length > 0 ? (\n <>\n <HvInput\n id={setId(id, \"search\")}\n classes={{\n root: classes.search,\n }}\n type=\"search\"\n placeholder={labels?.searchBoxPlaceholder}\n value={searchStr}\n onChange={(_, str) => setSearchStr(str)}\n />\n <SelectAll />\n <HvList\n key={activeGroup}\n id={setId(id, \"list\")}\n values={listValues}\n className={classes.list}\n multiSelect\n useSelector\n showSelectAll={false}\n onChange={onChangeHandler}\n selectable\n condensed\n hasTooltips\n />\n </>\n ) : (\n emptyElement\n )}\n </HvPanel>\n );\n};\n"],"names":["HvFilterGroupRightPanel","id","className","labels","emptyElement","classes","classesProp","useClasses","searchStr","setSearchStr","useState","allSelected","setAllSelected","anySelected","setAnySelected","filterOptions","filterValues","setFilterValues","activeGroup","useContext","HvFilterGroupContext","activeGroupOptions","useMemo","data","filter","option","name","toLowerCase","includes","map","activeFilterValues","value","listValues","label","selected","isHidden","indexOf","updateSelectAll","useCallback","nbrSelected","length","hasSelection","allSelect","useEffect","onChangeHandler","values","newFilterValues","_","i","v","handleSelectAll","cloneDeep","SelectAll","defaultLabel","jsx","HvTypography","jsxs","Fragment","multiSelectionConjunction","selectAll","selectAllContainer","HvCheckBox","setId","HvPanel","HvInput","root","search","searchBoxPlaceholder","str","HvList","list"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bar.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/Bar.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { staticClasses, useClasses } from \"./Bar.styles\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\n\nexport { staticClasses as headerMenuBarClasses };\n\nexport type HvHeaderMenuBarClasses = ExtractNames<typeof useClasses>;\n\nexport interface BarProps extends HvBaseProps {\n data: HvHeaderNavigationItemProp[];\n type?:
|
|
1
|
+
{"version":3,"file":"Bar.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/Bar.tsx"],"sourcesContent":["import { useContext } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { staticClasses, useClasses } from \"./Bar.styles\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\n\nexport { staticClasses as headerMenuBarClasses };\n\nexport type HvHeaderMenuBarClasses = ExtractNames<typeof useClasses>;\n\nexport interface BarProps extends HvBaseProps {\n data: HvHeaderNavigationItemProp[];\n type?: \"menubar\" | \"menu\";\n classes?: HvHeaderMenuBarClasses;\n}\n\nexport const Bar = (props: BarProps) => {\n const {\n id,\n data = [],\n type = \"menubar\",\n className,\n children,\n classes: classesProp,\n } = useDefaultProps(\"HvHeaderMenuBarBar\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const selectionPath = useContext(SelectionContext);\n\n const isMenu = type === \"menu\";\n\n const isActive =\n isMenu && data.filter((item) => item.id === selectionPath?.[1]).length > 0;\n\n return (\n <div\n className={cx(\n classes.root,\n classes[type],\n {\n [classes.hidden]: isMenu,\n [classes.active]: isActive,\n },\n className\n )}\n >\n <ul className={classes.list} id={id} onFocus={() => {}}>\n {children}\n </ul>\n </div>\n );\n};\n"],"names":["Bar","props","id","data","type","className","children","classes","classesProp","useDefaultProps","cx","useClasses","selectionPath","useContext","SelectionContext","isMenu","isActive","filter","item","length","jsx","root","hidden","active","list"],"mappings":";;;;;;;AAqBaA,MAAAA,MAAMA,CAACC,UAAoB;AAChC,QAAA;AAAA,IACJC;AAAAA,IACAC,OAAO,CAAE;AAAA,IACTC,OAAO;AAAA,IACPC;AAAAA,IACAC;AAAAA,IACAC,SAASC;AAAAA,EAAAA,IACPC,gBAAgB,gBAAA,sBAAsBR,KAAK;AACzC,QAAA;AAAA,IAAEM;AAAAA,IAASG;AAAAA,EAAAA,IAAOC,WAAAA,WAAWH,WAAW;AAExCI,QAAAA,gBAAgBC,iBAAWC,iBAAAA,gBAAgB;AAEjD,QAAMC,SAASX,SAAS;AAElBY,QAAAA,WACJD,UAAUZ,KAAKc,OAAQC,CAAAA,SAASA,KAAKhB,OAAOU,gBAAgB,CAAC,CAAC,EAAEO,SAAS;AAGzE,SAAAC,2BAAA,IAAC,SACC,WAAWV,GACTH,QAAQc,MACRd,QAAQH,IAAI,GACZ;AAAA,IACE,CAACG,QAAQe,MAAM,GAAGP;AAAAA,IAClB,CAACR,QAAQgB,MAAM,GAAGP;AAAAA,EACpB,GACAX,SACF,GAEA,UAACe,2BAAAA,IAAA,MAAA,EAAG,WAAWb,QAAQiB,MAAM,IAAQ,SAAS,MAAM;AAAA,EAAA,GACjDlB,UACH,EACF,CAAA;AAEJ;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuBar.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/MenuBar.tsx"],"sourcesContent":["import { MouseEvent } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { HvHeaderMenuItem } from \"../MenuItem\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar, HvHeaderMenuBarClasses } from \"./Bar\";\n\nexport interface HvHeaderMenuBarProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n data: HvHeaderNavigationItemProp[];\n type
|
|
1
|
+
{"version":3,"file":"MenuBar.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuBar/MenuBar.tsx"],"sourcesContent":["import { MouseEvent } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { HvHeaderMenuItem } from \"../MenuItem\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar, BarProps, HvHeaderMenuBarClasses } from \"./Bar\";\n\nexport interface HvHeaderMenuBarProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n data: HvHeaderNavigationItemProp[];\n type?: BarProps[\"type\"];\n onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n levels: number;\n currentLevel: number;\n classes?: HvHeaderMenuBarClasses;\n}\n\nexport const HvHeaderMenuBar = (props: HvHeaderMenuBarProps) => {\n const {\n data = [],\n onClick,\n type = \"menubar\",\n levels,\n currentLevel,\n classes,\n ...others\n } = useDefaultProps(\"HvHeaderMenuBar\", props);\n return (\n <Bar data={data} type={type} classes={classes} {...others}>\n {data.map((item: HvHeaderNavigationItemProp) => (\n <HvHeaderMenuItem\n key={item.id}\n item={item}\n type={type}\n onClick={onClick}\n levels={levels}\n currentLevel={currentLevel}\n />\n ))}\n </Bar>\n );\n};\n"],"names":["HvHeaderMenuBar","props","data","onClick","type","levels","currentLevel","classes","others","useDefaultProps","jsx","Bar","map","item","HvHeaderMenuItem","id"],"mappings":";;;;;;AAoBaA,MAAAA,kBAAkBA,CAACC,UAAgC;AACxD,QAAA;AAAA,IACJC,OAAO,CAAE;AAAA,IACTC;AAAAA,IACAC,OAAO;AAAA,IACPC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAA,mBAAmBR,KAAK;AAE1C,SAAAS,+BAACC,IAAAA,OAAI,MAAY,MAAY,SAAsBH,GAAAA,QAChDN,eAAKU,IAAI,CAACC,SACRH,2BAAA,IAAAI,2BAAA,EAEC,MACA,MACA,SACA,QACA,aALKD,GAAAA,KAAKE,EAKiB,CAE9B,EACH,CAAA;AAEJ;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MenuItem.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuItem/MenuItem.tsx"],"sourcesContent":["import React, { MouseEvent, useContext } from \"react\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { FocusContext } from \"../utils/FocusContext\";\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { useClasses, staticClasses } from \"./MenuItem.styles\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar } from \"../MenuBar/Bar\";\n\nexport { staticClasses as headerMenuItemClasses };\n\nexport type HvHeaderMenuItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderMenuItemProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n item: HvHeaderNavigationItemProp;\n type?: string;\n onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n levels: number;\n currentLevel: number;\n classes?: HvHeaderMenuItemClasses;\n}\n\n// Traverse the tree of items and return the first href it finds\nconst traverseItem = (node: HvHeaderNavigationItemProp) => {\n let href;\n let target;\n\n if (node?.href) {\n href = node?.href;\n target = node?.target;\n } else if (node?.data != null && node?.data?.length > 0) {\n let i = 0;\n while (href == null && i < node.data.length) {\n const childNavItem = traverseItem(node?.data[i]);\n if (childNavItem?.href != null) {\n href = childNavItem?.href;\n target = childNavItem?.target;\n break;\n }\n\n i += 1;\n }\n }\n\n return { href, target };\n};\n\nexport const HvHeaderMenuItem = (props: HvHeaderMenuItemProps) => {\n const {\n id,\n item,\n type,\n onClick,\n levels,\n currentLevel,\n classes: classesProp,\n className,\n } = useDefaultProps(\"HvHeaderMenuItem\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const selectionPath = useContext(SelectionContext);\n\n const { dispatch } = useContext(FocusContext);\n\n const { data } = item;\n\n const hasSubLevel = data && data.length;\n\n const isMenu = type === \"menu\";\n\n const isSelected = selectionPath?.[isMenu ? 1 : 0] === item.id;\n\n // true: if the item is part of the selection path but is not the current page the user is seeing, i.e has more sub levels\n // page: used when the selected item is actually the current page the user is seeing\n const isCurrent = isSelected ? (hasSubLevel ? true : \"page\") : undefined;\n\n const actionHandler = (event: any) => {\n if (\n event.type === \"click\" ||\n isKey(event, \"Enter\") ||\n isKey(event, \"Space\")\n ) {\n if (event.type === \"click\") {\n event.currentTarget.blur();\n }\n\n onClick?.(event, item);\n }\n };\n\n const handleFocus = (event: React.FocusEvent) => {\n dispatch?.({ type: \"setItemFocused\", itemFocused: event.currentTarget });\n };\n\n const itemProps = {\n onClick: actionHandler,\n onKeyDown: actionHandler,\n onFocus: handleFocus,\n };\n\n const label = (\n <HvTypography\n component=\"span\"\n variant={isSelected ? \"label\" : \"body\"}\n data-text={item.label}\n >\n {item.label}\n </HvTypography>\n );\n\n let itemHref = item?.href;\n let itemTarget = item?.target;\n\n // apps should configure the href even on parent items without content\n // so the fallback logic is theirs, but if not we'll do our best to find a link\n if (item?.href == null) {\n const { href, target } = traverseItem(item);\n itemHref = href;\n itemTarget = target;\n }\n\n return (\n <li\n id={id}\n key={item.label}\n className={cx(\n classes.root,\n {\n [classes.menu]: isMenu,\n [classes.menubar]: !isMenu,\n [classes.selected]: !!isSelected,\n },\n className\n )}\n >\n {itemHref ? (\n <a\n className={classes.link}\n href={itemHref}\n target={itemTarget}\n {...itemProps}\n aria-current={isCurrent}\n // Fix for a possible bug in playwright where, even though hidden from screen readers and not appearing in the accessibility\n // tree, due to the styling duplication (span::after - using 'data-text'), locators have to double the name.\n aria-label={item.label}\n >\n {label}\n </a>\n ) : (\n // keeping this code path for backwards compatibility, but\n // shouldn't really be used as it's not accessible\n <div\n className={classes.button}\n role=\"button\"\n {...itemProps}\n tabIndex={0}\n aria-current={isCurrent}\n >\n {label}\n </div>\n )}\n {/* Limits levels to no more than 2. More than that is not expected and not in DS. */}\n {hasSubLevel && currentLevel < levels && currentLevel < 2 && (\n <Bar data={data} type=\"menu\">\n {data.map((itm: HvHeaderNavigationItemProp) => (\n <HvHeaderMenuItem\n key={itm.id}\n item={itm}\n type=\"menu\"\n onClick={onClick}\n levels={levels}\n currentLevel={currentLevel + 1}\n />\n ))}\n </Bar>\n )}\n </li>\n );\n};\n"],"names":["traverseItem","node","href","target","data","length","i","childNavItem","HvHeaderMenuItem","props","id","item","type","onClick","levels","currentLevel","classes","classesProp","className","useDefaultProps","cx","useClasses","selectionPath","useContext","SelectionContext","dispatch","FocusContext","hasSubLevel","isMenu","isSelected","isCurrent","undefined","actionHandler","event","isKey","currentTarget","blur","handleFocus","itemFocused","itemProps","onKeyDown","onFocus","label","jsx","HvTypography","itemHref","itemTarget","root","menu","menubar","selected","link","button","Bar","map","itm"],"mappings":";;;;;;;;;;;AA8BA,MAAMA,eAAeA,
|
|
1
|
+
{"version":3,"file":"MenuItem.cjs","sources":["../../../../../../src/components/Header/Navigation/MenuItem/MenuItem.tsx"],"sourcesContent":["import React, { MouseEvent, useContext } from \"react\";\n\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { FocusContext } from \"../utils/FocusContext\";\nimport { SelectionContext } from \"../utils/SelectionContext\";\nimport { useClasses, staticClasses } from \"./MenuItem.styles\";\nimport { HvHeaderNavigationItemProp } from \"../useSelectionPath\";\nimport { Bar } from \"../MenuBar/Bar\";\n\nexport { staticClasses as headerMenuItemClasses };\n\nexport type HvHeaderMenuItemClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvHeaderMenuItemProps\n extends HvBaseProps<HTMLDivElement, \"onClick\"> {\n item: HvHeaderNavigationItemProp;\n type?: string;\n onClick?: (event: MouseEvent, selection: HvHeaderNavigationItemProp) => void;\n levels: number;\n currentLevel: number;\n classes?: HvHeaderMenuItemClasses;\n}\n\n// Traverse the tree of items and return the first href it finds\nconst traverseItem = (\n node: HvHeaderNavigationItemProp\n): { href?: string; target?: string } => {\n let href: string | undefined;\n let target: string | undefined;\n\n if (node?.href) {\n href = node?.href;\n target = node?.target;\n } else if (node?.data != null && node?.data?.length > 0) {\n let i = 0;\n while (href == null && i < node.data.length) {\n const childNavItem = traverseItem(node?.data[i]);\n if (childNavItem?.href != null) {\n href = childNavItem?.href;\n target = childNavItem?.target;\n break;\n }\n\n i += 1;\n }\n }\n\n return { href, target };\n};\n\nexport const HvHeaderMenuItem = (props: HvHeaderMenuItemProps) => {\n const {\n id,\n item,\n type,\n onClick,\n levels,\n currentLevel,\n classes: classesProp,\n className,\n } = useDefaultProps(\"HvHeaderMenuItem\", props);\n const { classes, cx } = useClasses(classesProp);\n\n const selectionPath = useContext(SelectionContext);\n\n const { dispatch } = useContext(FocusContext);\n\n const { data } = item;\n\n const hasSubLevel = data && data.length;\n\n const isMenu = type === \"menu\";\n\n const isSelected = selectionPath?.[isMenu ? 1 : 0] === item.id;\n\n // true: if the item is part of the selection path but is not the current page the user is seeing, i.e has more sub levels\n // page: used when the selected item is actually the current page the user is seeing\n const isCurrent = isSelected ? (hasSubLevel ? true : \"page\") : undefined;\n\n const actionHandler = (event: any) => {\n if (\n event.type === \"click\" ||\n isKey(event, \"Enter\") ||\n isKey(event, \"Space\")\n ) {\n if (event.type === \"click\") {\n event.currentTarget.blur();\n }\n\n onClick?.(event, item);\n }\n };\n\n const handleFocus = (event: React.FocusEvent) => {\n dispatch?.({ type: \"setItemFocused\", itemFocused: event.currentTarget });\n };\n\n const itemProps = {\n onClick: actionHandler,\n onKeyDown: actionHandler,\n onFocus: handleFocus,\n };\n\n const label = (\n <HvTypography\n component=\"span\"\n variant={isSelected ? \"label\" : \"body\"}\n data-text={item.label}\n >\n {item.label}\n </HvTypography>\n );\n\n let itemHref = item?.href;\n let itemTarget = item?.target;\n\n // apps should configure the href even on parent items without content\n // so the fallback logic is theirs, but if not we'll do our best to find a link\n if (item?.href == null) {\n const { href, target } = traverseItem(item);\n itemHref = href;\n itemTarget = target;\n }\n\n return (\n <li\n id={id}\n key={item.label}\n className={cx(\n classes.root,\n {\n [classes.menu]: isMenu,\n [classes.menubar]: !isMenu,\n [classes.selected]: !!isSelected,\n },\n className\n )}\n >\n {itemHref ? (\n <a\n className={classes.link}\n href={itemHref}\n target={itemTarget}\n {...itemProps}\n aria-current={isCurrent}\n // Fix for a possible bug in playwright where, even though hidden from screen readers and not appearing in the accessibility\n // tree, due to the styling duplication (span::after - using 'data-text'), locators have to double the name.\n aria-label={item.label}\n >\n {label}\n </a>\n ) : (\n // keeping this code path for backwards compatibility, but\n // shouldn't really be used as it's not accessible\n <div\n className={classes.button}\n role=\"button\"\n {...itemProps}\n tabIndex={0}\n aria-current={isCurrent}\n >\n {label}\n </div>\n )}\n {/* Limits levels to no more than 2. More than that is not expected and not in DS. */}\n {hasSubLevel && currentLevel < levels && currentLevel < 2 && (\n <Bar data={data} type=\"menu\">\n {data.map((itm: HvHeaderNavigationItemProp) => (\n <HvHeaderMenuItem\n key={itm.id}\n item={itm}\n type=\"menu\"\n onClick={onClick}\n levels={levels}\n currentLevel={currentLevel + 1}\n />\n ))}\n </Bar>\n )}\n </li>\n );\n};\n"],"names":["traverseItem","node","href","target","data","length","i","childNavItem","HvHeaderMenuItem","props","id","item","type","onClick","levels","currentLevel","classes","classesProp","className","useDefaultProps","cx","useClasses","selectionPath","useContext","SelectionContext","dispatch","FocusContext","hasSubLevel","isMenu","isSelected","isCurrent","undefined","actionHandler","event","isKey","currentTarget","blur","handleFocus","itemFocused","itemProps","onKeyDown","onFocus","label","jsx","HvTypography","itemHref","itemTarget","root","menu","menubar","selected","link","button","Bar","map","itm"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Input.cjs","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React, {\n HTMLInputTypeAttribute,\n forwardRef,\n isValidElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport {\n InputBaseComponentProps as MuiInputBaseComponentProps,\n useForkRef,\n} from \"@mui/material\";\n\nimport {\n CloseXS,\n PreviewOff,\n Preview,\n Search,\n Success,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { isBrowser } from \"@core/utils/browser\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n HvInputLabels,\n HvInputSuggestion,\n HvValidationMessages,\n} from \"@core/types/forms\";\nimport { HvBaseProps, HvExtraProps } from \"@core/types/generic\";\nimport {\n HvAdornment,\n HvAdornmentProps,\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvSuggestion,\n HvSuggestions,\n HvSuggestionsProps,\n HvWarningText,\n isValid,\n isInvalid,\n} from \"@core/components/Forms\";\nimport validationStates from \"@core/components/Forms/FormElement/validationStates\";\nimport { HvBaseInput, HvBaseInputProps } from \"@core/components/BaseInput\";\nimport {\n DEFAULT_ERROR_MESSAGES,\n computeValidationType,\n hasBuiltInValidations,\n validateInput,\n computeValidationState,\n computeValidationMessage,\n HvInputValidity,\n} from \"@core/components/BaseInput/validations\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useIsMounted } from \"@core/hooks/useIsMounted\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useLabels } from \"@core/hooks/useLabels\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./Input.styles\";\n\nexport { staticClasses as inputClasses };\n\nexport type HvInputClasses = ExtractNames<typeof useClasses>;\n\ntype InputElement = HTMLInputElement | HTMLTextAreaElement;\n\nexport interface HvInputProps\n extends HvBaseProps<\n HTMLElement,\n \"onChange\" | \"onBlur\" | \"onFocus\" | \"onKeyDown\" | \"color\"\n > {\n /** The form element name. */\n name?: string;\n /** The value of the form element. */\n value?: string;\n /** When uncontrolled, defines the initial input value. */\n defaultValue?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label?: React.ReactNode;\n /** Provide additional descriptive text for the form element. */\n description?: React.ReactNode;\n /** Indicates that the form element is disabled. */\n disabled?: boolean;\n /** Indicates that the form element is not editable. */\n readOnly?: boolean;\n /** Indicates that user input is required on the form element. */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n */\n status?: HvFormStatus;\n /** The error message to show when `status` is \"invalid\". */\n statusMessage?: string;\n /**\n * The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it.\n */\n onChange?: HvBaseInputProps[\"onChange\"];\n /**\n * Callback called when the user submits the value by pressing Enter/Return.\n *\n * Also called when the search button is clicked (when type is \"search\").\n */\n onEnter?: (\n event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n value: string\n ) => void;\n /**\n * The function that will be executed onBlur, allows checking the validation state,\n * it receives the value and the validation state.\n */\n onBlur?: (\n event: React.FocusEvent<InputElement>,\n value: string,\n validationState: HvInputValidity\n ) => void;\n /**\n * The function that will be executed onBlur, allows checking the value state,\n * it receives the value.\n */\n onFocus?: (event: React.FocusEvent<InputElement>, value: string) => void;\n /**\n * The function that will be executed onKeyDown, allows checking the value state,\n * it receives the event and value.\n */\n onKeyDown?: (\n event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n value: string\n ) => void;\n /** The input type. */\n type?: HTMLInputTypeAttribute;\n /** The placeholder value of the input. */\n placeholder?: string;\n /** Internal labels?. */\n labels?: HvInputLabels & HvExtraProps;\n /** An Object containing the various texts associated with the input. */\n validationMessages?: HvValidationMessages;\n /** Attributes applied to the input element. */\n inputProps?: MuiInputBaseComponentProps;\n /**\n * Allows passing a ref to the underlying input\n * @deprecated Use `ref` directly instead\n * */\n inputRef?: HvBaseInputProps[\"inputRef\"];\n /** The function that will be executed to received an array of objects that has a label and id to create list of suggestion */\n suggestionListCallback?: (value: string) => HvInputSuggestion[] | null;\n /**\n * The custom validation function, it receives the value and must return\n * either `true` for valid or `false` for invalid, default validations would only\n * occur if this function is null or undefined\n */\n validation?: (value: string) => boolean;\n /** If `true` it should autofocus. */\n autoFocus?: boolean;\n /** If `true` the clear button is disabled. */\n disableClear?: boolean;\n /** If `true` the reveal password button is disabled. Valid only when type is \"password\". */\n disableRevealPassword?: boolean;\n /** If `true` the search button is disabled. Valid only when type is \"search\". */\n disableSearchButton?: boolean;\n /**\n * If `true` the validation icon adornment is visible. Defaults to `false`.\n *\n * Currently, DS specifications define only a positive feedback icon;\n * errors are signaled through the border style and by displaying the error message.\n */\n showValidationIcon?: boolean;\n /** A custom icon to be added into the input. */\n endAdornment?: React.ReactNode;\n /** The maximum allowed length of the characters, if this value is null no check will be performed. */\n maxCharQuantity?: number;\n /** The minimum allowed length of the characters, if this value is null no check will be perform. */\n minCharQuantity?: number;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvInputClasses;\n}\n\nconst DEFAULT_LABELS = {\n clearButtonLabel: \"Clear the text\",\n revealPasswordButtonLabel: \"Reveal password\",\n revealPasswordButtonClickToShowTooltip: \"Click to show password.\",\n revealPasswordButtonClickToHideTooltip: \"Click to hide password.\",\n searchButtonLabel: \"Search\",\n};\n\n/**\n * Find the focused element onBlur.\n */\nconst getFocusedElement = (event) =>\n isBrowser(\"ie\") ? document.activeElement : event.relatedTarget;\n\nfunction eventTargetIsInsideContainer(container, event) {\n return container != null && container.contains(getFocusedElement(event));\n}\n\n/** Changes a given `input`'s `value`, triggering its `onChange` */\nconst changeInputValue = (input: HTMLInputElement | null, value = \"\") => {\n const event = new Event(\"input\", { bubbles: true });\n\n /** Original `input.value` setter (React overrides it). */\n const setInputValue = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n setInputValue?.call(input, value);\n input?.dispatchEvent(event);\n};\n\n/**\n * A text input box is a graphical control element intended to enable the user to input text information to be used by the software.\n */\nexport const HvInput = forwardRef<InputElement, HvInputProps>((props, ref) => {\n const {\n classes: classesProp,\n className,\n id,\n name,\n value: valueProp,\n defaultValue = \"\",\n required = false,\n readOnly = false,\n disabled = false,\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onEnter,\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n type = \"text\",\n placeholder,\n autoFocus = false,\n labels: labelsProp,\n validationMessages,\n disableClear = false,\n disableRevealPassword = false,\n disableSearchButton = false,\n endAdornment,\n maxCharQuantity,\n minCharQuantity,\n validation,\n showValidationIcon = false,\n suggestionListCallback,\n inputRef: inputRefProp,\n onBlur,\n onFocus,\n onKeyDown,\n inputProps = {},\n ...others\n } = useDefaultProps(\"HvInput\", props);\n const { classes, cx } = useClasses(classesProp);\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n const elementId = useUniqueId(id, \"hvinput\");\n\n const inputRef = useRef<HTMLInputElement>(null);\n const forkedRef = useForkRef(ref, inputRef, inputRefProp);\n const suggestionsRef = useRef<HTMLElement>(null);\n\n const [focused, setFocused] = useState(false);\n\n // Signals that the user has manually edited the input value\n const isDirty = useRef(false);\n\n // Value related state\n const [value, setValue] = useControlled(valueProp, defaultValue);\n\n const isEmptyValue = value == null || value === \"\";\n\n // Validation related state\n const [validationState, setValidationState] = useControlled(\n status,\n validationStates.standBy\n );\n\n const [validationMessage, setValidationMessage] = useControlled(\n statusMessage,\n \"\"\n );\n\n // validationMessages reference tends to change, as users will not memoize/useState for it;\n // dependencies must be more explicit so we set\n const errorMessages = useMemo(\n () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [\n validationMessages?.error,\n validationMessages?.requiredError,\n validationMessages?.minCharError,\n validationMessages?.maxCharError,\n validationMessages?.typeMismatchError,\n ]\n );\n\n const validationType = useMemo(() => computeValidationType(type), [type]);\n\n // Validates the input, sets the status and the statusMessage accordingly (if uncontrolled)\n // and returns the validity state of the input.\n const performValidation = useCallback(() => {\n const inputValidity = validateInput(\n inputRef.current,\n value,\n required,\n minCharQuantity,\n maxCharQuantity,\n validationType,\n validation\n );\n\n // This will only run if status is uncontrolled\n setValidationState(computeValidationState(inputValidity, isEmptyValue));\n\n // This will only run if statusMessage is uncontrolled\n setValidationMessage(\n computeValidationMessage(inputValidity, errorMessages)\n );\n\n return inputValidity;\n }, [\n errorMessages,\n isEmptyValue,\n maxCharQuantity,\n minCharQuantity,\n required,\n setValidationMessage,\n setValidationState,\n validation,\n validationType,\n value,\n ]);\n\n // The error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and any of the built-in validations are active\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined &&\n hasBuiltInValidations(\n required,\n validationType,\n minCharQuantity,\n maxCharQuantity,\n validation,\n inputProps\n )));\n\n const isStateInvalid = isInvalid(validationState);\n\n // Input type related state\n const [revealPassword, setRevealPassword] = useState(false);\n\n const realType = useMemo(() => {\n if (type === \"password\") {\n return revealPassword ? \"text\" : \"password\";\n }\n\n if (type === \"search\") {\n return \"search\";\n }\n\n return \"text\";\n }, [revealPassword, type]);\n\n // Suggestions related state\n const [suggestionValues, setSuggestionValues] = useState<\n HvSuggestion[] | null\n >(null);\n\n const canShowSuggestions = suggestionListCallback != null;\n const hasSuggestions = !!suggestionValues;\n\n // Miscellaneous state\n const hasLabel = label != null;\n const hasDescription = description != null;\n\n /**\n * Looks for the node that represent the input inside the material tree and focus it.\n */\n const focusInput = () => {\n inputRef.current?.focus();\n };\n\n const isMounted = useIsMounted();\n\n /**\n * Clears the suggestion array.\n */\n const suggestionClearHandler = () => {\n if (isMounted.current) {\n setSuggestionValues(null);\n }\n };\n\n /**\n * Fills of the suggestion array.\n */\n const suggestionHandler = (val: string) => {\n const suggestionsArray = suggestionListCallback?.(val);\n if (suggestionsArray?.[0]?.label) {\n setSuggestionValues(suggestionsArray);\n } else {\n suggestionClearHandler();\n }\n };\n\n /**\n * Executes the user callback adds the selection to the state and clears the suggestions.\n */\n const suggestionSelectedHandler = (event, item) => {\n const newValue = item.value || item.label;\n\n changeInputValue(inputRef.current, newValue);\n\n focusInput();\n suggestionClearHandler();\n\n if (type === \"search\") {\n // trigger the onEnter callback when the user selects an option in a search box\n onEnter?.(event, newValue);\n }\n };\n\n const onChangeHandler: HvBaseInputProps[\"onChange\"] = (event, newValue) => {\n isDirty.current = true;\n\n // set the input value (only when value is uncontrolled)\n setValue(newValue);\n\n onChange?.(event, newValue);\n\n if (canShowSuggestions) {\n // an edge case might be a controlled input whose onChange callback\n // doesn't change the value (or sets another): the suggestionListCallback\n // callback will still receive the original rejected value.\n // a refactor is needed so the suggestionListCallback might be called only\n // when the input is uncontrolled, providing a way to externally control\n // the suggestion values.\n suggestionHandler(newValue);\n }\n };\n\n /**\n * Validates the input updating the state and modifying the info text, also executes\n * the user provided onBlur passing the current validation status and value.\n */\n const onInputBlurHandler: HvBaseInputProps[\"onBlur\"] = (event) => {\n // If the blur is executed when choosing an suggestion it should be ignored.\n if (eventTargetIsInsideContainer(suggestionsRef.current, event)) return;\n\n setFocused(false);\n\n const inputValidity = performValidation();\n\n onBlur?.(event, value, inputValidity);\n };\n\n /**\n * Updates the state putting again the value from the state because the input value is\n * not automatically manage, it also executes the onFocus function from the user passing the value\n */\n const onFocusHandler: HvBaseInputProps[\"onFocus\"] = (event) => {\n setFocused(true);\n\n // reset validation status to standBy (only when status is uncontrolled)\n setValidationState(validationStates.standBy);\n\n onFocus?.(event, value);\n };\n\n const getSuggestions = (li: number | null) => {\n // TODO Replace with ref\n const listEl = document.getElementById(\n setId(elementId, \"suggestions-list\") || \"\"\n );\n return li != null ? listEl?.getElementsByTagName(\"li\")?.[li] : listEl;\n };\n\n const onSuggestionKeyDown: HvSuggestionsProps[\"onKeyDown\"] = (event) => {\n if (isKey(event, \"Esc\")) {\n suggestionClearHandler();\n focusInput();\n } else if (isKey(event, \"Tab\")) {\n suggestionClearHandler();\n }\n };\n\n /** Focus the suggestion list when the arrow down is pressed. */\n const onKeyDownHandler: HvBaseInputProps[\"onKeyDown\"] = (event) => {\n if (isKey(event, \"ArrowDown\") && hasSuggestions) {\n const li = getSuggestions(0);\n li?.focus();\n } else if (isKey(event, \"Enter\")) {\n onEnter?.(event, value);\n }\n\n onKeyDown?.(event, value);\n };\n\n /** Clears the suggestion list on blur. */\n const onContainerBlurHandler: HvFormElementProps[\"onBlur\"] = (event) => {\n if (event.relatedTarget) {\n setTimeout(() => {\n const list = getSuggestions(null);\n if (!list?.contains(document.activeElement)) suggestionClearHandler();\n }, 10);\n }\n };\n\n const hasOnEnter = onEnter != null;\n\n // show the clear button only if the input is enabled, not read-only, disableClear is false and the input is not empty\n // also, don't show it when the input type is \"search\" and the input is active (standBy)\n const showClear =\n !disabled &&\n !readOnly &&\n !disableClear &&\n !isEmptyValue &&\n (!hasOnEnter ||\n type !== \"search\" ||\n disableSearchButton ||\n validationState !== validationStates.standBy);\n\n const showSearchIcon = type === \"search\" && !disableSearchButton;\n\n const showRevealPasswordButton =\n type === \"password\" && !disableRevealPassword;\n\n /**\n * Clears the input value from the state and refocus the input.\n */\n const handleClear = useCallback(() => {\n // reset validation status to standBy (only when status is uncontrolled)\n setValidationState(validationStates.standBy);\n\n changeInputValue(inputRef.current, \"\");\n\n // we want to focus the input when clicked and not active\n setTimeout(focusInput);\n }, [setValidationState]);\n\n const clearButton = useMemo(() => {\n if (!showClear) {\n return null;\n }\n\n return (\n <HvAdornment\n // Don't control visibility when the search icon is enabled\n className={cx(classes.adornmentButton, {\n [classes.iconClear]: !showSearchIcon,\n })}\n onClick={handleClear}\n aria-label={labels?.clearButtonLabel}\n aria-controls={setId(elementId, \"input\")}\n icon={<CloseXS />}\n />\n );\n }, [\n showClear,\n classes.adornmentButton,\n classes.iconClear,\n showSearchIcon,\n handleClear,\n labels?.clearButtonLabel,\n elementId,\n cx,\n ]);\n\n /**\n * Calls the onEnter callback and refocus the input.\n */\n const handleSearch = useCallback<NonNullable<HvAdornmentProps[\"onClick\"]>>(\n (event) => {\n onEnter?.(event, value);\n },\n [onEnter, value]\n );\n\n const searchButton = useMemo(() => {\n // If the search icon is not actionable, only show it when the input is empty or active\n const reallyShowIt =\n showSearchIcon &&\n (isEmptyValue ||\n (hasOnEnter && validationState === validationStates.standBy));\n\n if (!reallyShowIt) {\n return null;\n }\n\n return (\n <HvAdornment\n className={classes.adornmentButton}\n onClick={hasOnEnter ? handleSearch : undefined}\n aria-label={labels?.searchButtonLabel}\n icon={<Search />}\n />\n );\n }, [\n showSearchIcon,\n isEmptyValue,\n hasOnEnter,\n validationState,\n classes.adornmentButton,\n handleSearch,\n labels?.searchButtonLabel,\n ]);\n\n /**\n * Changes input type and refocus the input.\n */\n const handleRevealPassword = useCallback(() => {\n setRevealPassword(!revealPassword);\n }, [revealPassword]);\n\n const revealPasswordButton = useMemo(() => {\n if (!showRevealPasswordButton) {\n return null;\n }\n\n return (\n <HvTooltip\n disableFocusListener\n disableTouchListener\n title={\n <HvTypography>\n {revealPassword\n ? labels?.revealPasswordButtonClickToHideTooltip\n : labels?.revealPasswordButtonClickToShowTooltip}\n </HvTypography>\n }\n >\n <HvAdornment\n className={classes.adornmentButton}\n onClick={handleRevealPassword}\n aria-label={labels?.revealPasswordButtonLabel}\n aria-controls={setId(elementId, \"input\")}\n icon={revealPassword ? <PreviewOff /> : <Preview />}\n />\n </HvTooltip>\n );\n }, [\n showRevealPasswordButton,\n revealPassword,\n labels?.revealPasswordButtonClickToHideTooltip,\n labels?.revealPasswordButtonClickToShowTooltip,\n labels?.revealPasswordButtonLabel,\n classes.adornmentButton,\n handleRevealPassword,\n elementId,\n ]);\n\n const validationIcon = useMemo(() => {\n if (!showValidationIcon) {\n return null;\n }\n\n if (!isValid(validationState)) {\n return null;\n }\n\n return <Success color=\"positive\" className={classes.icon} />;\n }, [showValidationIcon, validationState, classes.icon]);\n\n // useMemo to avoid repetitive cloning of the custom icon\n const customIconEl = useMemo(\n () =>\n isValidElement(endAdornment) &&\n React.cloneElement(endAdornment as React.ReactElement, {\n className: cx(endAdornment.props.className, classes.icon),\n }),\n [classes.icon, endAdornment, cx]\n );\n\n const adornments = useMemo(() => {\n if (\n !clearButton &&\n !revealPasswordButton &&\n !searchButton &&\n !validationIcon &&\n !customIconEl\n )\n return null;\n\n // note: specification implies that the custom icon should be hidden when\n // a validation feedback icon is being shown.\n return (\n <div className={classes.adornmentsBox} aria-hidden=\"true\">\n {clearButton}\n {revealPasswordButton}\n {searchButton}\n {validationIcon || customIconEl}\n </div>\n );\n }, [\n classes.adornmentsBox,\n clearButton,\n customIconEl,\n revealPasswordButton,\n searchButton,\n validationIcon,\n ]);\n\n // run initial validation after first render\n // and also when any validation condition changes\n useEffect(() => {\n if (focused || (!isDirty.current && isEmptyValue)) {\n // skip validation if currently focused or if empty and\n // the user never manually edited the input value\n return;\n }\n\n performValidation();\n }, [focused, isEmptyValue, performValidation]);\n\n const errorMessageId = isStateInvalid\n ? canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage\n : undefined;\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(\n classes.root,\n {\n [classes.hasSuggestions]: hasSuggestions,\n },\n className\n )}\n onBlur={onContainerBlurHandler}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n className={classes.label}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvBaseInput\n id={\n hasLabel || showClear || showRevealPasswordButton\n ? setId(elementId, \"input\")\n : setId(id, \"input\")\n }\n name={name}\n value={value}\n required={required}\n readOnly={readOnly}\n disabled={disabled}\n onChange={onChangeHandler}\n autoFocus={autoFocus}\n onKeyDown={onKeyDownHandler}\n onBlur={onInputBlurHandler}\n onFocus={onFocusHandler}\n placeholder={placeholder}\n type={realType}\n classes={{\n input: classes.input,\n inputRoot: classes.inputRoot,\n inputRootFocused: classes.inputRootFocused,\n inputRootDisabled: classes.inputRootDisabled,\n inputRootMultiline: classes.inputRootMultiline,\n inputBorderContainer: classes.inputBorderContainer,\n }}\n invalid={isStateInvalid}\n inputProps={{\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-invalid\": isStateInvalid ? true : undefined,\n \"aria-errormessage\": errorMessageId,\n \"aria-describedby\":\n ariaDescribedBy != null\n ? ariaDescribedBy\n : description\n ? setId(elementId, \"description\")\n : undefined,\n \"aria-controls\": canShowSuggestions\n ? setId(elementId, \"suggestions\")\n : undefined,\n\n ref: inputRef,\n\n // prevent browsers auto-fill/suggestions when we have our own\n autoComplete: canShowSuggestions ? \"off\" : undefined,\n\n ...inputProps,\n }}\n inputRef={forkedRef}\n endAdornment={adornments}\n {...others}\n />\n {canShowSuggestions && (\n <>\n {hasSuggestions && (\n <div role=\"presentation\" className={classes.inputExtension} />\n )}\n <HvSuggestions\n ref={suggestionsRef}\n id={setId(elementId, \"suggestions\")}\n classes={{\n root: classes.suggestionsContainer,\n list: classes.suggestionList,\n }}\n expanded={hasSuggestions}\n anchorEl={inputRef.current?.parentElement}\n onClose={suggestionClearHandler}\n onKeyDown={onSuggestionKeyDown}\n onSuggestionSelected={suggestionSelectedHandler}\n suggestionValues={suggestionValues}\n />\n </>\n )}\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["DEFAULT_LABELS","clearButtonLabel","revealPasswordButtonLabel","revealPasswordButtonClickToShowTooltip","revealPasswordButtonClickToHideTooltip","searchButtonLabel","getFocusedElement","event","isBrowser","document","activeElement","relatedTarget","eventTargetIsInsideContainer","container","contains","changeInputValue","input","value","Event","bubbles","setInputValue","Object","getOwnPropertyDescriptor","window","HTMLInputElement","prototype","set","call","dispatchEvent","HvInput","forwardRef","props","ref","classes","classesProp","className","id","name","valueProp","defaultValue","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onEnter","status","statusMessage","ariaErrorMessage","type","placeholder","autoFocus","labels","labelsProp","validationMessages","disableClear","disableRevealPassword","disableSearchButton","endAdornment","maxCharQuantity","minCharQuantity","validation","showValidationIcon","suggestionListCallback","inputRef","inputRefProp","onBlur","onFocus","onKeyDown","inputProps","others","useDefaultProps","cx","useClasses","useLabels","elementId","useUniqueId","useRef","forkedRef","useForkRef","suggestionsRef","focused","setFocused","useState","isDirty","setValue","useControlled","isEmptyValue","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","errorMessages","useMemo","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","typeMismatchError","validationType","computeValidationType","performValidation","useCallback","inputValidity","validateInput","current","computeValidationState","computeValidationMessage","canShowError","undefined","hasBuiltInValidations","isStateInvalid","isInvalid","revealPassword","setRevealPassword","realType","suggestionValues","setSuggestionValues","canShowSuggestions","hasSuggestions","hasLabel","hasDescription","focusInput","focus","isMounted","useIsMounted","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","newValue","onChangeHandler","onInputBlurHandler","onFocusHandler","getSuggestions","li","listEl","getElementById","setId","getElementsByTagName","onSuggestionKeyDown","isKey","onKeyDownHandler","onContainerBlurHandler","setTimeout","list","hasOnEnter","showClear","showSearchIcon","showRevealPasswordButton","handleClear","clearButton","jsx","HvAdornment","adornmentButton","iconClear","CloseXS","handleSearch","searchButton","reallyShowIt","Search","handleRevealPassword","revealPasswordButton","HvTooltip","HvTypography","PreviewOff","Preview","validationIcon","isValid","Success","icon","customIconEl","isValidElement","React","cloneElement","adornments","adornmentsBox","useEffect","errorMessageId","jsxs","HvFormElement","root","labelContainer","HvLabel","HvInfoMessage","HvBaseInput","inputRoot","inputRootFocused","inputRootDisabled","inputRootMultiline","inputBorderContainer","autoComplete","inputExtension","HvSuggestions","suggestionsContainer","suggestionList","parentElement","HvWarningText"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Input.cjs","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React, {\n FocusEvent,\n HTMLInputTypeAttribute,\n forwardRef,\n isValidElement,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from \"react\";\n\nimport {\n InputBaseComponentProps as MuiInputBaseComponentProps,\n useForkRef,\n} from \"@mui/material\";\n\nimport {\n CloseXS,\n PreviewOff,\n Preview,\n Search,\n Success,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { isBrowser } from \"@core/utils/browser\";\nimport { isKey } from \"@core/utils/keyboardUtils\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n HvInputLabels,\n HvInputSuggestion,\n HvValidationMessages,\n} from \"@core/types/forms\";\nimport { HvBaseProps, HvExtraProps } from \"@core/types/generic\";\nimport {\n HvAdornment,\n HvAdornmentProps,\n HvFormElement,\n HvFormElementProps,\n HvFormStatus,\n HvInfoMessage,\n HvLabel,\n HvSuggestion,\n HvSuggestions,\n HvSuggestionsProps,\n HvWarningText,\n isValid,\n isInvalid,\n} from \"@core/components/Forms\";\nimport validationStates from \"@core/components/Forms/FormElement/validationStates\";\nimport { HvBaseInput, HvBaseInputProps } from \"@core/components/BaseInput\";\nimport {\n DEFAULT_ERROR_MESSAGES,\n computeValidationType,\n hasBuiltInValidations,\n validateInput,\n computeValidationState,\n computeValidationMessage,\n HvInputValidity,\n} from \"@core/components/BaseInput/validations\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { useIsMounted } from \"@core/hooks/useIsMounted\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useLabels } from \"@core/hooks/useLabels\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { staticClasses, useClasses } from \"./Input.styles\";\n\nexport { staticClasses as inputClasses };\n\nexport type HvInputClasses = ExtractNames<typeof useClasses>;\n\ntype InputElement = HTMLInputElement | HTMLTextAreaElement;\n\nexport interface HvInputProps\n extends HvBaseProps<\n HTMLElement,\n \"onChange\" | \"onBlur\" | \"onFocus\" | \"onKeyDown\" | \"color\"\n > {\n /** The form element name. */\n name?: string;\n /** The value of the form element. */\n value?: string;\n /** When uncontrolled, defines the initial input value. */\n defaultValue?: string;\n /**\n * The label of the form element.\n *\n * The form element must be labeled for accessibility reasons.\n * If not provided, an aria-label or aria-labelledby must be inputted via inputProps.\n */\n label?: React.ReactNode;\n /** Provide additional descriptive text for the form element. */\n description?: React.ReactNode;\n /** Indicates that the form element is disabled. */\n disabled?: boolean;\n /** Indicates that the form element is not editable. */\n readOnly?: boolean;\n /** Indicates that user input is required on the form element. */\n required?: boolean;\n /**\n * The status of the form element.\n *\n * Valid is correct, invalid is incorrect and standBy means no validations have run.\n *\n * When uncontrolled and unspecified it will default to \"standBy\" and change to either \"valid\"\n * or \"invalid\" after any change to `checked`, depending of the values of both `required` and `checked`.\n */\n status?: HvFormStatus;\n /** The error message to show when `status` is \"invalid\". */\n statusMessage?: string;\n /**\n * The function that will be executed onChange, allows modification of the input,\n * it receives the value. If a new value should be presented it must returned it.\n */\n onChange?: HvBaseInputProps[\"onChange\"];\n /**\n * Callback called when the user submits the value by pressing Enter/Return.\n *\n * Also called when the search button is clicked (when type is \"search\").\n */\n onEnter?: (\n event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n value: string\n ) => void;\n /**\n * The function that will be executed onBlur, allows checking the validation state,\n * it receives the value and the validation state.\n */\n onBlur?: (\n event: React.FocusEvent<InputElement>,\n value: string,\n validationState: HvInputValidity\n ) => void;\n /**\n * The function that will be executed onBlur, allows checking the value state,\n * it receives the value.\n */\n onFocus?: (event: React.FocusEvent<InputElement>, value: string) => void;\n /**\n * The function that will be executed onKeyDown, allows checking the value state,\n * it receives the event and value.\n */\n onKeyDown?: (\n event: React.KeyboardEvent<InputElement> | React.MouseEvent,\n value: string\n ) => void;\n /** The input type. */\n type?: HTMLInputTypeAttribute;\n /** The placeholder value of the input. */\n placeholder?: string;\n /** Internal labels?. */\n labels?: HvInputLabels & HvExtraProps;\n /** An Object containing the various texts associated with the input. */\n validationMessages?: HvValidationMessages;\n /** Attributes applied to the input element. */\n inputProps?: MuiInputBaseComponentProps;\n /**\n * Allows passing a ref to the underlying input\n * @deprecated Use `ref` directly instead\n * */\n inputRef?: HvBaseInputProps[\"inputRef\"];\n /** The function that will be executed to received an array of objects that has a label and id to create list of suggestion */\n suggestionListCallback?: (value: string) => HvInputSuggestion[] | null;\n /**\n * The custom validation function, it receives the value and must return\n * either `true` for valid or `false` for invalid, default validations would only\n * occur if this function is null or undefined\n */\n validation?: (value: string) => boolean;\n /** If `true` it should autofocus. */\n autoFocus?: boolean;\n /** If `true` the clear button is disabled. */\n disableClear?: boolean;\n /** If `true` the reveal password button is disabled. Valid only when type is \"password\". */\n disableRevealPassword?: boolean;\n /** If `true` the search button is disabled. Valid only when type is \"search\". */\n disableSearchButton?: boolean;\n /**\n * If `true` the validation icon adornment is visible. Defaults to `false`.\n *\n * Currently, DS specifications define only a positive feedback icon;\n * errors are signaled through the border style and by displaying the error message.\n */\n showValidationIcon?: boolean;\n /** A custom icon to be added into the input. */\n endAdornment?: React.ReactNode;\n /** The maximum allowed length of the characters, if this value is null no check will be performed. */\n maxCharQuantity?: number;\n /** The minimum allowed length of the characters, if this value is null no check will be perform. */\n minCharQuantity?: number;\n /** A Jss Object used to override or extend the styles applied to the component. */\n classes?: HvInputClasses;\n}\n\nconst DEFAULT_LABELS = {\n clearButtonLabel: \"Clear the text\",\n revealPasswordButtonLabel: \"Reveal password\",\n revealPasswordButtonClickToShowTooltip: \"Click to show password.\",\n revealPasswordButtonClickToHideTooltip: \"Click to hide password.\",\n searchButtonLabel: \"Search\",\n};\n\n/**\n * Find the focused element onBlur.\n */\nconst getFocusedElement = (event: FocusEvent) =>\n isBrowser(\"ie\") ? document.activeElement : event.relatedTarget;\n\nfunction eventTargetIsInsideContainer(\n container: HTMLElement | null,\n event: FocusEvent<any>\n) {\n return container != null && container.contains(getFocusedElement(event));\n}\n\n/** Changes a given `input`'s `value`, triggering its `onChange` */\nconst changeInputValue = (input: HTMLInputElement | null, value = \"\") => {\n const event = new Event(\"input\", { bubbles: true });\n\n /** Original `input.value` setter (React overrides it). */\n const setInputValue = Object.getOwnPropertyDescriptor(\n window.HTMLInputElement.prototype,\n \"value\"\n )?.set;\n\n setInputValue?.call(input, value);\n input?.dispatchEvent(event);\n};\n\n/**\n * A text input box is a graphical control element intended to enable the user to input text information to be used by the software.\n */\nexport const HvInput = forwardRef<InputElement, HvInputProps>((props, ref) => {\n const {\n classes: classesProp,\n className,\n id,\n name,\n value: valueProp,\n defaultValue = \"\",\n required = false,\n readOnly = false,\n disabled = false,\n label,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n description,\n \"aria-describedby\": ariaDescribedBy,\n onChange,\n onEnter,\n status,\n statusMessage,\n \"aria-errormessage\": ariaErrorMessage,\n type = \"text\",\n placeholder,\n autoFocus = false,\n labels: labelsProp,\n validationMessages,\n disableClear = false,\n disableRevealPassword = false,\n disableSearchButton = false,\n endAdornment,\n maxCharQuantity,\n minCharQuantity,\n validation,\n showValidationIcon = false,\n suggestionListCallback,\n inputRef: inputRefProp,\n onBlur,\n onFocus,\n onKeyDown,\n inputProps = {},\n ...others\n } = useDefaultProps(\"HvInput\", props);\n const { classes, cx } = useClasses(classesProp);\n const labels = useLabels(DEFAULT_LABELS, labelsProp);\n const elementId = useUniqueId(id, \"hvinput\");\n\n const inputRef = useRef<HTMLInputElement>(null);\n const forkedRef = useForkRef(ref, inputRef, inputRefProp);\n const suggestionsRef = useRef<HTMLElement>(null);\n\n const [focused, setFocused] = useState(false);\n\n // Signals that the user has manually edited the input value\n const isDirty = useRef(false);\n\n // Value related state\n const [value, setValue] = useControlled(valueProp, defaultValue);\n\n const isEmptyValue = value == null || value === \"\";\n\n // Validation related state\n const [validationState, setValidationState] = useControlled(\n status,\n validationStates.standBy\n );\n\n const [validationMessage, setValidationMessage] = useControlled(\n statusMessage,\n \"\"\n );\n\n // validationMessages reference tends to change, as users will not memoize/useState for it;\n // dependencies must be more explicit so we set\n const errorMessages = useMemo(\n () => ({ ...DEFAULT_ERROR_MESSAGES, ...validationMessages }),\n // eslint-disable-next-line react-hooks/exhaustive-deps\n [\n validationMessages?.error,\n validationMessages?.requiredError,\n validationMessages?.minCharError,\n validationMessages?.maxCharError,\n validationMessages?.typeMismatchError,\n ]\n );\n\n const validationType = useMemo(() => computeValidationType(type), [type]);\n\n // Validates the input, sets the status and the statusMessage accordingly (if uncontrolled)\n // and returns the validity state of the input.\n const performValidation = useCallback(() => {\n const inputValidity = validateInput(\n inputRef.current,\n value,\n required,\n minCharQuantity,\n maxCharQuantity,\n validationType,\n validation\n );\n\n // This will only run if status is uncontrolled\n setValidationState(computeValidationState(inputValidity, isEmptyValue));\n\n // This will only run if statusMessage is uncontrolled\n setValidationMessage(\n computeValidationMessage(inputValidity, errorMessages)\n );\n\n return inputValidity;\n }, [\n errorMessages,\n isEmptyValue,\n maxCharQuantity,\n minCharQuantity,\n required,\n setValidationMessage,\n setValidationState,\n validation,\n validationType,\n value,\n ]);\n\n // The error message area will only be created if:\n // - an external element that provides an error message isn't identified via aria-errormessage AND\n // - both status and statusMessage properties are being controlled OR\n // - status is uncontrolled and any of the built-in validations are active\n const canShowError =\n ariaErrorMessage == null &&\n ((status !== undefined && statusMessage !== undefined) ||\n (status === undefined &&\n hasBuiltInValidations(\n required,\n validationType,\n minCharQuantity,\n maxCharQuantity,\n validation,\n inputProps\n )));\n\n const isStateInvalid = isInvalid(validationState);\n\n // Input type related state\n const [revealPassword, setRevealPassword] = useState(false);\n\n const realType = useMemo(() => {\n if (type === \"password\") {\n return revealPassword ? \"text\" : \"password\";\n }\n\n if (type === \"search\") {\n return \"search\";\n }\n\n return \"text\";\n }, [revealPassword, type]);\n\n // Suggestions related state\n const [suggestionValues, setSuggestionValues] = useState<\n HvSuggestion[] | null\n >(null);\n\n const canShowSuggestions = suggestionListCallback != null;\n const hasSuggestions = !!suggestionValues;\n\n // Miscellaneous state\n const hasLabel = label != null;\n const hasDescription = description != null;\n\n /**\n * Looks for the node that represent the input inside the material tree and focus it.\n */\n const focusInput = () => {\n inputRef.current?.focus();\n };\n\n const isMounted = useIsMounted();\n\n /**\n * Clears the suggestion array.\n */\n const suggestionClearHandler = () => {\n if (isMounted.current) {\n setSuggestionValues(null);\n }\n };\n\n /**\n * Fills of the suggestion array.\n */\n const suggestionHandler = (val: string) => {\n const suggestionsArray = suggestionListCallback?.(val);\n if (suggestionsArray?.[0]?.label) {\n setSuggestionValues(suggestionsArray);\n } else {\n suggestionClearHandler();\n }\n };\n\n /**\n * Executes the user callback adds the selection to the state and clears the suggestions.\n */\n const suggestionSelectedHandler: HvSuggestionsProps[\"onSuggestionSelected\"] =\n (event, item) => {\n const newValue = item.value || (item.label as any);\n\n changeInputValue(inputRef.current, newValue);\n\n focusInput();\n suggestionClearHandler();\n\n if (type === \"search\") {\n // trigger the onEnter callback when the user selects an option in a search box\n onEnter?.(event, newValue);\n }\n };\n\n const onChangeHandler: HvBaseInputProps[\"onChange\"] = (event, newValue) => {\n isDirty.current = true;\n\n // set the input value (only when value is uncontrolled)\n setValue(newValue);\n\n onChange?.(event, newValue);\n\n if (canShowSuggestions) {\n // an edge case might be a controlled input whose onChange callback\n // doesn't change the value (or sets another): the suggestionListCallback\n // callback will still receive the original rejected value.\n // a refactor is needed so the suggestionListCallback might be called only\n // when the input is uncontrolled, providing a way to externally control\n // the suggestion values.\n suggestionHandler(newValue);\n }\n };\n\n /**\n * Validates the input updating the state and modifying the info text, also executes\n * the user provided onBlur passing the current validation status and value.\n */\n const onInputBlurHandler: HvBaseInputProps[\"onBlur\"] = (event) => {\n // If the blur is executed when choosing an suggestion it should be ignored.\n if (eventTargetIsInsideContainer(suggestionsRef.current, event)) return;\n\n setFocused(false);\n\n const inputValidity = performValidation();\n\n onBlur?.(event, value, inputValidity);\n };\n\n /**\n * Updates the state putting again the value from the state because the input value is\n * not automatically manage, it also executes the onFocus function from the user passing the value\n */\n const onFocusHandler: HvBaseInputProps[\"onFocus\"] = (event) => {\n setFocused(true);\n\n // reset validation status to standBy (only when status is uncontrolled)\n setValidationState(validationStates.standBy);\n\n onFocus?.(event, value);\n };\n\n const getSuggestions = (li: number | null) => {\n // TODO Replace with ref\n const listEl = document.getElementById(\n setId(elementId, \"suggestions-list\") || \"\"\n );\n return li != null ? listEl?.getElementsByTagName(\"li\")?.[li] : listEl;\n };\n\n const onSuggestionKeyDown: HvSuggestionsProps[\"onKeyDown\"] = (event) => {\n if (isKey(event, \"Esc\")) {\n suggestionClearHandler();\n focusInput();\n } else if (isKey(event, \"Tab\")) {\n suggestionClearHandler();\n }\n };\n\n /** Focus the suggestion list when the arrow down is pressed. */\n const onKeyDownHandler: HvBaseInputProps[\"onKeyDown\"] = (event) => {\n if (isKey(event, \"ArrowDown\") && hasSuggestions) {\n const li = getSuggestions(0);\n li?.focus();\n } else if (isKey(event, \"Enter\")) {\n onEnter?.(event, value);\n }\n\n onKeyDown?.(event, value);\n };\n\n /** Clears the suggestion list on blur. */\n const onContainerBlurHandler: HvFormElementProps[\"onBlur\"] = (event) => {\n if (event.relatedTarget) {\n setTimeout(() => {\n const list = getSuggestions(null);\n if (!list?.contains(document.activeElement)) suggestionClearHandler();\n }, 10);\n }\n };\n\n const hasOnEnter = onEnter != null;\n\n // show the clear button only if the input is enabled, not read-only, disableClear is false and the input is not empty\n // also, don't show it when the input type is \"search\" and the input is active (standBy)\n const showClear =\n !disabled &&\n !readOnly &&\n !disableClear &&\n !isEmptyValue &&\n (!hasOnEnter ||\n type !== \"search\" ||\n disableSearchButton ||\n validationState !== validationStates.standBy);\n\n const showSearchIcon = type === \"search\" && !disableSearchButton;\n\n const showRevealPasswordButton =\n type === \"password\" && !disableRevealPassword;\n\n /**\n * Clears the input value from the state and refocus the input.\n */\n const handleClear = useCallback(() => {\n // reset validation status to standBy (only when status is uncontrolled)\n setValidationState(validationStates.standBy);\n\n changeInputValue(inputRef.current, \"\");\n\n // we want to focus the input when clicked and not active\n setTimeout(focusInput);\n }, [setValidationState]);\n\n const clearButton = useMemo(() => {\n if (!showClear) {\n return null;\n }\n\n return (\n <HvAdornment\n // Don't control visibility when the search icon is enabled\n className={cx(classes.adornmentButton, {\n [classes.iconClear]: !showSearchIcon,\n })}\n onClick={handleClear}\n aria-label={labels?.clearButtonLabel}\n aria-controls={setId(elementId, \"input\")}\n icon={<CloseXS />}\n />\n );\n }, [\n showClear,\n classes.adornmentButton,\n classes.iconClear,\n showSearchIcon,\n handleClear,\n labels?.clearButtonLabel,\n elementId,\n cx,\n ]);\n\n /**\n * Calls the onEnter callback and refocus the input.\n */\n const handleSearch = useCallback<NonNullable<HvAdornmentProps[\"onClick\"]>>(\n (event) => {\n onEnter?.(event, value);\n },\n [onEnter, value]\n );\n\n const searchButton = useMemo(() => {\n // If the search icon is not actionable, only show it when the input is empty or active\n const reallyShowIt =\n showSearchIcon &&\n (isEmptyValue ||\n (hasOnEnter && validationState === validationStates.standBy));\n\n if (!reallyShowIt) {\n return null;\n }\n\n return (\n <HvAdornment\n className={classes.adornmentButton}\n onClick={hasOnEnter ? handleSearch : undefined}\n aria-label={labels?.searchButtonLabel}\n icon={<Search />}\n />\n );\n }, [\n showSearchIcon,\n isEmptyValue,\n hasOnEnter,\n validationState,\n classes.adornmentButton,\n handleSearch,\n labels?.searchButtonLabel,\n ]);\n\n /**\n * Changes input type and refocus the input.\n */\n const handleRevealPassword = useCallback(() => {\n setRevealPassword(!revealPassword);\n }, [revealPassword]);\n\n const revealPasswordButton = useMemo(() => {\n if (!showRevealPasswordButton) {\n return null;\n }\n\n return (\n <HvTooltip\n disableFocusListener\n disableTouchListener\n title={\n <HvTypography>\n {revealPassword\n ? labels?.revealPasswordButtonClickToHideTooltip\n : labels?.revealPasswordButtonClickToShowTooltip}\n </HvTypography>\n }\n >\n <HvAdornment\n className={classes.adornmentButton}\n onClick={handleRevealPassword}\n aria-label={labels?.revealPasswordButtonLabel}\n aria-controls={setId(elementId, \"input\")}\n icon={revealPassword ? <PreviewOff /> : <Preview />}\n />\n </HvTooltip>\n );\n }, [\n showRevealPasswordButton,\n revealPassword,\n labels?.revealPasswordButtonClickToHideTooltip,\n labels?.revealPasswordButtonClickToShowTooltip,\n labels?.revealPasswordButtonLabel,\n classes.adornmentButton,\n handleRevealPassword,\n elementId,\n ]);\n\n const validationIcon = useMemo(() => {\n if (!showValidationIcon) {\n return null;\n }\n\n if (!isValid(validationState)) {\n return null;\n }\n\n return <Success color=\"positive\" className={classes.icon} />;\n }, [showValidationIcon, validationState, classes.icon]);\n\n // useMemo to avoid repetitive cloning of the custom icon\n const customIconEl = useMemo(\n () =>\n isValidElement(endAdornment) &&\n React.cloneElement(endAdornment as React.ReactElement, {\n className: cx(endAdornment.props.className, classes.icon),\n }),\n [classes.icon, endAdornment, cx]\n );\n\n const adornments = useMemo(() => {\n if (\n !clearButton &&\n !revealPasswordButton &&\n !searchButton &&\n !validationIcon &&\n !customIconEl\n )\n return null;\n\n // note: specification implies that the custom icon should be hidden when\n // a validation feedback icon is being shown.\n return (\n <div className={classes.adornmentsBox} aria-hidden=\"true\">\n {clearButton}\n {revealPasswordButton}\n {searchButton}\n {validationIcon || customIconEl}\n </div>\n );\n }, [\n classes.adornmentsBox,\n clearButton,\n customIconEl,\n revealPasswordButton,\n searchButton,\n validationIcon,\n ]);\n\n // run initial validation after first render\n // and also when any validation condition changes\n useEffect(() => {\n if (focused || (!isDirty.current && isEmptyValue)) {\n // skip validation if currently focused or if empty and\n // the user never manually edited the input value\n return;\n }\n\n performValidation();\n }, [focused, isEmptyValue, performValidation]);\n\n const errorMessageId = isStateInvalid\n ? canShowError\n ? setId(elementId, \"error\")\n : ariaErrorMessage\n : undefined;\n\n return (\n <HvFormElement\n id={id}\n name={name}\n status={validationState}\n disabled={disabled}\n required={required}\n readOnly={readOnly}\n className={cx(\n classes.root,\n {\n [classes.hasSuggestions]: hasSuggestions,\n },\n className\n )}\n onBlur={onContainerBlurHandler}\n >\n {(hasLabel || hasDescription) && (\n <div className={classes.labelContainer}>\n {hasLabel && (\n <HvLabel\n id={setId(elementId, \"label\")}\n className={classes.label}\n htmlFor={setId(elementId, \"input\")}\n label={label}\n />\n )}\n\n {hasDescription && (\n <HvInfoMessage\n id={setId(elementId, \"description\")}\n className={classes.description}\n >\n {description}\n </HvInfoMessage>\n )}\n </div>\n )}\n <HvBaseInput\n id={\n hasLabel || showClear || showRevealPasswordButton\n ? setId(elementId, \"input\")\n : setId(id, \"input\")\n }\n name={name}\n value={value}\n required={required}\n readOnly={readOnly}\n disabled={disabled}\n onChange={onChangeHandler}\n autoFocus={autoFocus}\n onKeyDown={onKeyDownHandler}\n onBlur={onInputBlurHandler}\n onFocus={onFocusHandler}\n placeholder={placeholder}\n type={realType}\n classes={{\n input: classes.input,\n inputRoot: classes.inputRoot,\n inputRootFocused: classes.inputRootFocused,\n inputRootDisabled: classes.inputRootDisabled,\n inputRootMultiline: classes.inputRootMultiline,\n inputBorderContainer: classes.inputBorderContainer,\n }}\n invalid={isStateInvalid}\n inputProps={{\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-invalid\": isStateInvalid ? true : undefined,\n \"aria-errormessage\": errorMessageId,\n \"aria-describedby\":\n ariaDescribedBy != null\n ? ariaDescribedBy\n : description\n ? setId(elementId, \"description\")\n : undefined,\n \"aria-controls\": canShowSuggestions\n ? setId(elementId, \"suggestions\")\n : undefined,\n\n ref: inputRef,\n\n // prevent browsers auto-fill/suggestions when we have our own\n autoComplete: canShowSuggestions ? \"off\" : undefined,\n\n ...inputProps,\n }}\n inputRef={forkedRef}\n endAdornment={adornments}\n {...others}\n />\n {canShowSuggestions && (\n <>\n {hasSuggestions && (\n <div role=\"presentation\" className={classes.inputExtension} />\n )}\n <HvSuggestions\n ref={suggestionsRef}\n id={setId(elementId, \"suggestions\")}\n classes={{\n root: classes.suggestionsContainer,\n list: classes.suggestionList,\n }}\n expanded={hasSuggestions}\n anchorEl={inputRef.current?.parentElement}\n onClose={suggestionClearHandler}\n onKeyDown={onSuggestionKeyDown}\n onSuggestionSelected={suggestionSelectedHandler}\n suggestionValues={suggestionValues}\n />\n </>\n )}\n {canShowError && (\n <HvWarningText\n id={setId(elementId, \"error\")}\n disableBorder\n className={classes.error}\n >\n {validationMessage}\n </HvWarningText>\n )}\n </HvFormElement>\n );\n});\n"],"names":["DEFAULT_LABELS","clearButtonLabel","revealPasswordButtonLabel","revealPasswordButtonClickToShowTooltip","revealPasswordButtonClickToHideTooltip","searchButtonLabel","getFocusedElement","event","isBrowser","document","activeElement","relatedTarget","eventTargetIsInsideContainer","container","contains","changeInputValue","input","value","Event","bubbles","setInputValue","Object","getOwnPropertyDescriptor","window","HTMLInputElement","prototype","set","call","dispatchEvent","HvInput","forwardRef","props","ref","classes","classesProp","className","id","name","valueProp","defaultValue","required","readOnly","disabled","label","ariaLabel","ariaLabelledBy","description","ariaDescribedBy","onChange","onEnter","status","statusMessage","ariaErrorMessage","type","placeholder","autoFocus","labels","labelsProp","validationMessages","disableClear","disableRevealPassword","disableSearchButton","endAdornment","maxCharQuantity","minCharQuantity","validation","showValidationIcon","suggestionListCallback","inputRef","inputRefProp","onBlur","onFocus","onKeyDown","inputProps","others","useDefaultProps","cx","useClasses","useLabels","elementId","useUniqueId","useRef","forkedRef","useForkRef","suggestionsRef","focused","setFocused","useState","isDirty","setValue","useControlled","isEmptyValue","validationState","setValidationState","validationStates","standBy","validationMessage","setValidationMessage","errorMessages","useMemo","DEFAULT_ERROR_MESSAGES","error","requiredError","minCharError","maxCharError","typeMismatchError","validationType","computeValidationType","performValidation","useCallback","inputValidity","validateInput","current","computeValidationState","computeValidationMessage","canShowError","undefined","hasBuiltInValidations","isStateInvalid","isInvalid","revealPassword","setRevealPassword","realType","suggestionValues","setSuggestionValues","canShowSuggestions","hasSuggestions","hasLabel","hasDescription","focusInput","focus","isMounted","useIsMounted","suggestionClearHandler","suggestionHandler","val","suggestionsArray","suggestionSelectedHandler","item","newValue","onChangeHandler","onInputBlurHandler","onFocusHandler","getSuggestions","li","listEl","getElementById","setId","getElementsByTagName","onSuggestionKeyDown","isKey","onKeyDownHandler","onContainerBlurHandler","setTimeout","list","hasOnEnter","showClear","showSearchIcon","showRevealPasswordButton","handleClear","clearButton","jsx","HvAdornment","adornmentButton","iconClear","CloseXS","handleSearch","searchButton","reallyShowIt","Search","handleRevealPassword","revealPasswordButton","HvTooltip","HvTypography","PreviewOff","Preview","validationIcon","isValid","Success","icon","customIconEl","isValidElement","React","cloneElement","adornments","adornmentsBox","useEffect","errorMessageId","jsxs","HvFormElement","root","labelContainer","HvLabel","HvInfoMessage","HvBaseInput","inputRoot","inputRootFocused","inputRootDisabled","inputRootMultiline","inputBorderContainer","autoComplete","inputExtension","HvSuggestions","suggestionsContainer","suggestionList","parentElement","HvWarningText"],"mappings":"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"}
|
package/dist/cjs/components/QueryBuilder/ConfirmationDialog/ConfirmationDialog.styles.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmationDialog.styles.cjs","sources":["../../../../../src/components/QueryBuilder/ConfirmationDialog/ConfirmationDialog.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\n \"HvQueryBuilder-ConfirmationDialog\",\n {\n paper: {
|
|
1
|
+
{"version":3,"file":"ConfirmationDialog.styles.cjs","sources":["../../../../../src/components/QueryBuilder/ConfirmationDialog/ConfirmationDialog.styles.tsx"],"sourcesContent":["import { createClasses } from \"@core/utils/classes\";\n\nexport const { useClasses, staticClasses } = createClasses(\n \"HvQueryBuilder-ConfirmationDialog\",\n {\n paper: {},\n }\n);\n"],"names":["useClasses","staticClasses","createClasses","paper"],"mappings":";;;AAEa,MAAA;AAAA,EAAEA;AAAAA,EAAYC;AAAc,IAAIC,QAAAA,cAC3C,qCACA;AAAA,EACEC,OAAO,CAAC;AACV,CACF;;;"}
|
|
@@ -19,14 +19,13 @@ const {
|
|
|
19
19
|
margin: uikitStyles.theme.space.sm,
|
|
20
20
|
backgroundColor: "transparent",
|
|
21
21
|
maxWidth: "100%",
|
|
22
|
-
|
|
23
|
-
paddingBottom: `calc(${uikitStyles.theme.space.md} * 3)`
|
|
22
|
+
paddingBottom: uikitStyles.theme.space.lg
|
|
24
23
|
},
|
|
25
24
|
/** Styles applied to the sub group containers. */
|
|
26
25
|
subGroup: {
|
|
27
26
|
margin: "40px 14px 32px 20px",
|
|
28
27
|
minHeight: 120,
|
|
29
|
-
paddingBottom:
|
|
28
|
+
paddingBottom: uikitStyles.theme.space.md,
|
|
30
29
|
"&::before": {
|
|
31
30
|
content: '""',
|
|
32
31
|
position: "absolute",
|
|
@@ -56,8 +55,8 @@ const {
|
|
|
56
55
|
/** Styles applied to the multi-button combinator container on the top group. */
|
|
57
56
|
topCombinator: {
|
|
58
57
|
position: "absolute",
|
|
59
|
-
top: `calc(
|
|
60
|
-
left: `calc(
|
|
58
|
+
top: `calc(-1 * ${uikitStyles.theme.space.sm})`,
|
|
59
|
+
left: `calc(-1 * ${uikitStyles.theme.space.sm})`
|
|
61
60
|
},
|
|
62
61
|
/** Styles applied to each combinator button. */
|
|
63
62
|
combinatorButton: {},
|