@hitachivantara/uikit-react-core 5.32.0 → 5.34.0

package/dist/esm/components/Calendar/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../../../src/components/Calendar/utils.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\n\nimport isNil from \"lodash/isNil\";\nimport capitalize from \"lodash/capitalize\";\n\nimport { DateRangeProp } from \"./types\";\n\n/**\n * Constant with the number of weeks to be displayed on the calendar.\n */\nexport const CALENDAR_WEEKS = 6;\n\n/**\n * Constant with the default locale that should be used as the default.\n */\nexport const DEFAULT_LOCALE = \"en\";\n\n/**\n * Pads a string value with leading zeroes(0) until length is reached.\n *\n * @param value - Value to be padded.\n * @param length - Length of the value after the padding is added.\n * @returns The value as a string with the received amount of padding.\n *\n * @example zeroPad(5, 2) => \"05\"\n */\nexport const zeroPad = (value: number, length: number) =>\n  `${value}`.padStart(length, \"0\");\n\n/**\n * Returns the number of days in the month given a month and year.\n *\n * @param month - Number of the month (1 to 12).\n * @param year - Number of the year.\n * @returns The number of days in a month for the received year.\n */\nexport const getMonthDays = (month: number, year: number) =>\n  new Date(year, month, 0).getDate();\n\n/**\n * Gets the week day of the first day of a given month and year.\n * From 0 (Sunday) to 6 (Saturday).\n *\n * @param month - Number of the month (1 to 12).\n * @param year - Number of the year.\n * @returns The zero indexed week day where 0 is Sunday (0 to 6).\n */\nexport const getMonthFirstWeekday = (month: number, year: number) =>\n  new Date(year, month - 1, 1).getDay();\n\n/**\n * Creates a `Date` instance in UTC timezone.\n *\n * @param year - The year of the date.\n * @param monthIndex - The zero indexed month of the year (0 to 11).\n * @param day - The day of the month.\n * @param [hour=1] - The hour of the day.\n * @returns A `Date` instance in UTC timezone.\n */\nexport const makeUTCDate = (\n  year: number,\n  monthIndex: number,\n  day: number,\n  hour = 1\n) => new Date(Date.UTC(year, monthIndex, day, hour));\n\n/**\n * Checks if the received date is a valid date.\n *\n * @param date - The date to be validated.\n * @returns A flag stating if the date is valid or not.\n */\nexport const isDate = (date: any): date is Date =>\n  Object.prototype.toString.call(date) === \"[object Date]\" &&\n  !Number.isNaN(date.valueOf());\n\nexport const isDateRangeProp = (date: any): date is DateRangeProp =>\n  \"startDate\" in date;\n\n/**\n * Checks if two dates are in the same month and year.\n *\n * @param date1 - First date.\n * @param date2 - Second date.\n * @returns A flag stating if the dates are in the same month and year or not.\n */\nexport const isSameMonth = (date1: any, date2: any) => {\n  if (!(isDate(date1) && isDate(date2))) return false;\n\n  return (\n    date1.getMonth() === date2.getMonth() &&\n    date1.getFullYear() === date2.getFullYear()\n  );\n};\n\n/**\n * Checks if two dates are on the same day.\n *\n * @param date1 - First date.\n * @param date2 - Second date.\n * @returns A flag stating if the dates are in the same day or not.\n */\nexport const isSameDay = (date1: any, date2: any) => {\n  if (!(isDate(date1) && isDate(date2))) return false;\n\n  return (\n    date1.getDate() === date2.getDate() &&\n    date1.getMonth() === date2.getMonth() &&\n    date1.getFullYear() === date2.getFullYear()\n  );\n};\n\n/**\n * Formats the received date using the ISO format (YYYY-MM-DD).\n *\n * @param date - The date to be formatted.\n * @returns The formatted date in ISO format.\n */\nexport const getDateISO = (date?: Date) => {\n  if (!isDate(date)) return null;\n\n  return [\n    date.getFullYear(),\n    zeroPad(date.getMonth() + 1, 2),\n    zeroPad(date.getDate(), 2),\n  ].join(\"-\");\n};\n\n/**\n * Returns an object with the previous month taking also into consideration the year.\n * For example the previous month of January 2000 will be December 1999.\n *\n * @param month - Number of the month.\n * @param year - Number of the year.\n * @returns Object with new month and year defined.\n */\nexport const getPreviousMonth = (month: number, year: number) => {\n  const prevMonth = month > 1 ? month - 1 : 12;\n  const prevMonthYear = month > 1 ? year : year - 1;\n\n  return { month: prevMonth, year: prevMonthYear };\n};\n\n/**\n * Returns an object with the next month taking also into consideration the year.\n * For example the next month of December 2000 will be January 2001.\n *\n * @param month - Number of the month.\n * @param year - Number of the year.\n * @returns Object with new month and year defined.\n */\nexport const getNextMonth = (month: number, year: number) => {\n  const nextMonth = month < 12 ? month + 1 : 1;\n  const nextMonthYear = month < 12 ? year : year + 1;\n\n  return { month: nextMonth, year: nextMonthYear };\n};\n\n/**\n * Returns a list with the names of all the months localized in the received locale and representation value.\n *\n * @param locale - The locale to be applied to the Intl format.\n * @param representationValue - The representation value for the month.\n * @returns An array with all the months names.\n */\nexport const getMonthNamesList = (\n  locale: string | undefined,\n  representationValue: Intl.DateTimeFormatOptions[\"month\"] = \"long\"\n) => {\n  const options = { month: representationValue, timeZone: \"UTC\" };\n\n  return [...new Array(12)].map((n, index) => {\n    const auxDate = makeUTCDate(1970, index, 1);\n    return capitalize(Intl.DateTimeFormat(locale, options).format(auxDate));\n  });\n};\n\n/**\n * Returns a list with the names of all the weekdays localized in the received locale and representation value.\n *\n * @param locale - The locale to be applied.\n * @param dateTimeFormatValue - The representation value for the weekday.\n * @returns An array with all the weekday names.\n */\nexport const getWeekdayNamesList = (\n  locale: string,\n  dateTimeFormatValue: Intl.DateTimeFormatOptions[\"weekday\"] = \"long\"\n) => {\n  const options = { weekday: dateTimeFormatValue, timeZone: \"UTC\" };\n  const weekdayNames: string[] = [];\n\n  for (let day = 4; day <= 10; day += 1) {\n    const auxDate = makeUTCDate(1970, 0, day);\n    weekdayNames.push(Intl.DateTimeFormat(locale, options).format(auxDate));\n  }\n  return weekdayNames;\n};\n\n/**\n * Returns the name of the month for the supplied month localized in the received locale and representation value.\n *\n * @param date - The date from which the month name is extracted.\n * @param locale - The locale to be applied to the Intl format.\n * @param representationValue - The locale to be applied to the Intl format.\n * @returns The name of the month.\n */\nexport const getMonthName = (\n  date: Date,\n  locale: string,\n  representationValue: Intl.DateTimeFormatOptions[\"month\"] = \"long\"\n) =>\n  new Intl.DateTimeFormat(locale, { month: representationValue }).format(date);\n\n/**\n * Formats the received date according to Design System specifications.\n * Currently: day month, year => `14 Aug, 2019`.\n *\n * @param date - UTC date to be formatted.\n * @param locale - The locale to be applied to the Intl format.\n * @returns The formatted date as a string.\n */\nexport const getFormattedDate = (\n  // TODO: fix this\n  date: any,\n  locale: any,\n  rep: Intl.DateTimeFormatOptions[\"month\"] = \"short\"\n) =>\n  `${date.getDate()} ${getMonthName(date, locale, rep)} ${date.getFullYear()}`;\n\n/**\n * Creates an array of 42 days. The complete current month and enough days from the previous and next months to fill\n * the 42 positions.\n *\n * @param month - The number of the month (1 to 12).\n * @param year - The number of the year.\n * @returns The array of dates.\n */\nexport const createDatesArray = (month: number, year: number) => {\n  // Initializes the variables needed to calculate the dates for the received month and year\n  const monthDays = getMonthDays(month, year);\n  const daysFromPrevMonth = getMonthFirstWeekday(month, year);\n  const daysFromNextMonth =\n    CALENDAR_WEEKS * 7 - (daysFromPrevMonth + monthDays);\n  const prevMonthYear = getPreviousMonth(month, year);\n  const nextMonthYear = getNextMonth(month, year);\n  const prevMonthDays = getMonthDays(prevMonthYear.month, prevMonthYear.year);\n\n  // Creates the arrays for the dates for previous, current and next months\n  const prevMonthDates = [...new Array(daysFromPrevMonth)].map((n, index) => {\n    const day = index + 1 + (prevMonthDays - daysFromPrevMonth);\n    return new Date(prevMonthYear.year, prevMonthYear.month - 1, day);\n  });\n  const currentMonthDates = [...new Array(monthDays)].map((n, index) => {\n    const day = index + 1;\n    return new Date(year, month - 1, day);\n  });\n  const nextMonthDates = [...new Array(daysFromNextMonth)].map((n, index) => {\n    const day = index + 1;\n    return new Date(nextMonthYear.year, nextMonthYear.month - 1, day);\n  });\n\n  return [...prevMonthDates, ...currentMonthDates, ...nextMonthDates];\n};\n\n/**\n * Checks if the received locale is valid according to Intl.\n *\n * @param locale - The locale to be checked\n * @returns True if the locale is valid, false otherwise.\n */\nexport const isValidLocale = (locale: string) => {\n  try {\n    if (Intl.DateTimeFormat.supportedLocalesOf(locale).length > 0) {\n      return true;\n    }\n    // eslint-disable-next-line no-console\n    console.warn(`${locale} is not supported. Falling back to a known locale.`);\n    return false;\n  } catch (error) {\n    if (\n      error != null &&\n      typeof error === \"object\" &&\n      \"name\" in error &&\n      error?.name === \"RangeError\"\n    ) {\n      // eslint-disable-next-line no-console\n      console.error(`Invalid locale: ${locale}`);\n      return false;\n    }\n    if (error != null && typeof error === \"object\" && \"message\" in error) {\n      // eslint-disable-next-line no-console\n      console.error(error?.message);\n      return false;\n    }\n\n    return false;\n  }\n};\n\nexport const isRange = (date): date is DateRangeProp =>\n  date != null && typeof date === \"object\" && \"startDate\" in date;\n\n/**\n * Checks if the date falls within a specified date range.\n *\n * @param date - The date to be evaluated.\n * @param providedValueRange - Provided selection range.\n * @returns - True if the date falls within the range, false otherwise.\n */\nexport const dateInProvidedValueRange = (\n  date: any,\n  providedValueRange: any\n) => {\n  const { startDate, endDate } = providedValueRange;\n\n  if (!isRange(providedValueRange) || isNil(endDate)) return false;\n  const localEndDate = endDate;\n\n  const modStartDate = dayjs(startDate).format(\"YYYY-MM-DD\");\n  const modEndDate = dayjs(localEndDate).format(\"YYYY-MM-DD\");\n\n  const convertedDate = dayjs(date).format(\"YYYY-MM-DD\");\n\n  return convertedDate >= modStartDate && convertedDate <= modEndDate;\n};\n\nexport const checkIfDateIsDisabled = (\n  date?: string | number | Date | dayjs.Dayjs,\n  minimumDate?: string | number | Date | dayjs.Dayjs,\n  maximumDate?: string | number | Date | dayjs.Dayjs\n) => {\n  if (!minimumDate && !maximumDate) return false;\n  const modStartDate = minimumDate\n    ? dayjs(minimumDate).format(\"YYYY-MM-DD\")\n    : undefined;\n  const modEndDate = maximumDate\n    ? dayjs(maximumDate).format(\"YYYY-MM-DD\")\n    : undefined;\n\n  const convertedDate = dayjs(date).format(\"YYYY-MM-DD\");\n\n  return (\n    (modStartDate !== undefined && convertedDate < modStartDate) ||\n    (modEndDate !== undefined && convertedDate > modEndDate)\n  );\n};\n\nexport const formatToLocale = (date, locale) => {\n  return new Intl.DateTimeFormat(locale, {\n    day: \"numeric\",\n    month: \"short\",\n    year: \"numeric\",\n  }).format(date);\n};\n"],"names":["CALENDAR_WEEKS","getMonthDays","month","year","Date","getDate","getMonthFirstWeekday","getDay","makeUTCDate","monthIndex","day","hour","UTC","isDate","date","Object","prototype","toString","call","Number","isNaN","valueOf","isDateRangeProp","isSameMonth","date1","date2","getMonth","getFullYear","isSameDay","getPreviousMonth","prevMonth","prevMonthYear","getNextMonth","nextMonth","nextMonthYear","getMonthNamesList","locale","representationValue","options","timeZone","Array","map","n","index","auxDate","capitalize","Intl","DateTimeFormat","format","getWeekdayNamesList","dateTimeFormatValue","weekday","weekdayNames","push","getMonthName","getFormattedDate","rep","createDatesArray","monthDays","daysFromPrevMonth","daysFromNextMonth","prevMonthDays","prevMonthDates","currentMonthDates","nextMonthDates","isRange","dateInProvidedValueRange","providedValueRange","startDate","endDate","isNil","localEndDate","modStartDate","dayjs","modEndDate","convertedDate","checkIfDateIsDisabled","minimumDate","maximumDate","undefined","formatToLocale"],"mappings":";;;AAUO,MAAMA,iBAAiB;AA0BjBC,MAAAA,eAAeA,CAACC,OAAeC,SAC1C,IAAIC,KAAKD,MAAMD,OAAO,CAAC,EAAEG,QAAQ;AAUtBC,MAAAA,uBAAuBA,CAACJ,OAAeC,SAClD,IAAIC,KAAKD,MAAMD,QAAQ,GAAG,CAAC,EAAEK,OAAO;AAW/B,MAAMC,cAAcA,CACzBL,MACAM,YACAC,KACAC,OAAO,MACJ,IAAIP,KAAKA,KAAKQ,IAAIT,MAAMM,YAAYC,KAAKC,IAAI,CAAC;AAQ5C,MAAME,SAASA,CAACC,SACrBC,OAAOC,UAAUC,SAASC,KAAKJ,IAAI,MAAM,mBACzC,CAACK,OAAOC,MAAMN,KAAKO,SAAS;AAEjBC,MAAAA,kBAAkBA,CAACR,SAC9B,eAAeA;AASJS,MAAAA,cAAcA,CAACC,OAAYC,UAAe;AACrD,MAAI,EAAEZ,OAAOW,KAAK,KAAKX,OAAOY,KAAK;AAAW,WAAA;AAG5CD,SAAAA,MAAME,eAAeD,MAAMC,SAAAA,KAC3BF,MAAMG,YAAkBF,MAAAA,MAAME;AAElC;AASaC,MAAAA,YAAYA,CAACJ,OAAYC,UAAe;AACnD,MAAI,EAAEZ,OAAOW,KAAK,KAAKX,OAAOY,KAAK;AAAW,WAAA;AAE9C,SACED,MAAMnB,QAAQ,MAAMoB,MAAMpB,QAAAA,KAC1BmB,MAAME,SAAAA,MAAeD,MAAMC,SAC3BF,KAAAA,MAAMG,YAAY,MAAMF,MAAME;AAElC;AA0BaE,MAAAA,mBAAmBA,CAAC3B,OAAeC,SAAiB;AAC/D,QAAM2B,YAAY5B,QAAQ,IAAIA,QAAQ,IAAI;AAC1C,QAAM6B,gBAAgB7B,QAAQ,IAAIC,OAAOA,OAAO;AAEzC,SAAA;AAAA,IAAED,OAAO4B;AAAAA,IAAW3B,MAAM4B;AAAAA,EAAAA;AACnC;AAUaC,MAAAA,eAAeA,CAAC9B,OAAeC,SAAiB;AAC3D,QAAM8B,YAAY/B,QAAQ,KAAKA,QAAQ,IAAI;AAC3C,QAAMgC,gBAAgBhC,QAAQ,KAAKC,OAAOA,OAAO;AAE1C,SAAA;AAAA,IAAED,OAAO+B;AAAAA,IAAW9B,MAAM+B;AAAAA,EAAAA;AACnC;AASO,MAAMC,oBAAoBA,CAC/BC,QACAC,sBAA2D,WACxD;AACH,QAAMC,UAAU;AAAA,IAAEpC,OAAOmC;AAAAA,IAAqBE,UAAU;AAAA,EAAA;AAEjD,SAAA,CAAC,GAAG,IAAIC,MAAM,EAAE,CAAC,EAAEC,IAAI,CAACC,GAAGC,UAAU;AAC1C,UAAMC,UAAUpC,YAAY,MAAMmC,OAAO,CAAC;AACnCE,WAAAA,WAAWC,KAAKC,eAAeX,QAAQE,OAAO,EAAEU,OAAOJ,OAAO,CAAC;AAAA,EAAA,CACvE;AACH;AASO,MAAMK,sBAAsBA,CACjCb,QACAc,sBAA6D,WAC1D;AACH,QAAMZ,UAAU;AAAA,IAAEa,SAASD;AAAAA,IAAqBX,UAAU;AAAA,EAAA;AAC1D,QAAMa,eAAyB,CAAA;AAE/B,WAAS1C,MAAM,GAAGA,OAAO,IAAIA,OAAO,GAAG;AACrC,UAAMkC,UAAUpC,YAAY,MAAM,GAAGE,GAAG;AAC3B2C,iBAAAA,KAAKP,KAAKC,eAAeX,QAAQE,OAAO,EAAEU,OAAOJ,OAAO,CAAC;AAAA,EACxE;AACOQ,SAAAA;AACT;AAUaE,MAAAA,eAAeA,CAC1BxC,MACAsB,QACAC,sBAA2D,WAE3D,IAAIS,KAAKC,eAAeX,QAAQ;AAAA,EAAElC,OAAOmC;AAAoB,CAAC,EAAEW,OAAOlC,IAAI;AAUtE,MAAMyC,mBAAmBA,CAE9BzC,MACAsB,QACAoB,MAA2C,YAE1C,GAAE1C,KAAKT,QAAU,CAAA,IAAGiD,aAAaxC,MAAMsB,QAAQoB,GAAG,CAAE,IAAG1C,KAAKa,aAAc;AAUhE8B,MAAAA,mBAAmBA,CAACvD,OAAeC,SAAiB;AAEzDuD,QAAAA,YAAYzD,aAAaC,OAAOC,IAAI;AACpCwD,QAAAA,oBAAoBrD,qBAAqBJ,OAAOC,IAAI;AACpDyD,QAAAA,oBACJ5D,iBAAiB,KAAK2D,oBAAoBD;AACtC3B,QAAAA,gBAAgBF,iBAAiB3B,OAAOC,IAAI;AAC5C+B,QAAAA,gBAAgBF,aAAa9B,OAAOC,IAAI;AAC9C,QAAM0D,gBAAgB5D,aAAa8B,cAAc7B,OAAO6B,cAAc5B,IAAI;AAGpE2D,QAAAA,iBAAiB,CAAC,GAAG,IAAItB,MAAMmB,iBAAiB,CAAC,EAAElB,IAAI,CAACC,GAAGC,UAAU;AACnEjC,UAAAA,MAAMiC,QAAQ,KAAKkB,gBAAgBF;AACzC,WAAO,IAAIvD,KAAK2B,cAAc5B,MAAM4B,cAAc7B,QAAQ,GAAGQ,GAAG;AAAA,EAAA,CACjE;AACKqD,QAAAA,oBAAoB,CAAC,GAAG,IAAIvB,MAAMkB,SAAS,CAAC,EAAEjB,IAAI,CAACC,GAAGC,UAAU;AACpE,UAAMjC,MAAMiC,QAAQ;AACpB,WAAO,IAAIvC,KAAKD,MAAMD,QAAQ,GAAGQ,GAAG;AAAA,EAAA,CACrC;AACKsD,QAAAA,iBAAiB,CAAC,GAAG,IAAIxB,MAAMoB,iBAAiB,CAAC,EAAEnB,IAAI,CAACC,GAAGC,UAAU;AACzE,UAAMjC,MAAMiC,QAAQ;AACpB,WAAO,IAAIvC,KAAK8B,cAAc/B,MAAM+B,cAAchC,QAAQ,GAAGQ,GAAG;AAAA,EAAA,CACjE;AAED,SAAO,CAAC,GAAGoD,gBAAgB,GAAGC,mBAAmB,GAAGC,cAAc;AACpE;AAqCaC,MAAAA,UAAUA,CAACnD,SACtBA,QAAQ,QAAQ,OAAOA,SAAS,YAAY,eAAeA;AAShDoD,MAAAA,2BAA2BA,CACtCpD,MACAqD,uBACG;AACG,QAAA;AAAA,IAAEC;AAAAA,IAAWC;AAAAA,EAAYF,IAAAA;AAE/B,MAAI,CAACF,QAAQE,kBAAkB,KAAKG,MAAMD,OAAO;AAAU,WAAA;AAC3D,QAAME,eAAeF;AAErB,QAAMG,eAAeC,MAAML,SAAS,EAAEpB,OAAO,YAAY;AACzD,QAAM0B,aAAaD,MAAMF,YAAY,EAAEvB,OAAO,YAAY;AAE1D,QAAM2B,gBAAgBF,MAAM3D,IAAI,EAAEkC,OAAO,YAAY;AAE9C2B,SAAAA,iBAAiBH,gBAAgBG,iBAAiBD;AAC3D;AAEO,MAAME,wBAAwBA,CACnC9D,MACA+D,aACAC,gBACG;AACC,MAAA,CAACD,eAAe,CAACC;AAAoB,WAAA;AACzC,QAAMN,eAAeK,cACjBJ,MAAMI,WAAW,EAAE7B,OAAO,YAAY,IACtC+B;AACJ,QAAML,aAAaI,cACfL,MAAMK,WAAW,EAAE9B,OAAO,YAAY,IACtC+B;AAEJ,QAAMJ,gBAAgBF,MAAM3D,IAAI,EAAEkC,OAAO,YAAY;AAErD,SACGwB,iBAAiBO,UAAaJ,gBAAgBH,gBAC9CE,eAAeK,UAAaJ,gBAAgBD;AAEjD;AAEaM,MAAAA,iBAAiBA,CAAClE,MAAMsB,WAAW;AACvC,SAAA,IAAIU,KAAKC,eAAeX,QAAQ;AAAA,IACrC1B,KAAK;AAAA,IACLR,OAAO;AAAA,IACPC,MAAM;AAAA,EAAA,CACP,EAAE6C,OAAOlC,IAAI;AAChB;"}
+{"version":3,"file":"utils.js","sources":["../../../../src/components/Calendar/utils.tsx"],"sourcesContent":["import dayjs from \"dayjs\";\n\nimport capitalize from \"lodash/capitalize\";\n\nimport { DateRangeProp } from \"./types\";\n\n/**\n * Constant with the number of weeks to be displayed on the calendar.\n */\nexport const CALENDAR_WEEKS = 6;\n\n/**\n * Constant with the default locale that should be used as the default.\n */\nexport const DEFAULT_LOCALE = \"en\";\n\n/**\n * Pads a string value with leading zeroes(0) until length is reached.\n *\n * @param value - Value to be padded.\n * @param length - Length of the value after the padding is added.\n * @returns The value as a string with the received amount of padding.\n *\n * @example zeroPad(5, 2) => \"05\"\n */\nexport const zeroPad = (value: number, length: number) =>\n  `${value}`.padStart(length, \"0\");\n\n/**\n * Returns the number of days in the month given a month and year.\n *\n * @param month - Number of the month (1 to 12).\n * @param year - Number of the year.\n * @returns The number of days in a month for the received year.\n */\nexport const getMonthDays = (month: number, year: number) =>\n  new Date(year, month, 0).getDate();\n\n/**\n * Gets the week day of the first day of a given month and year.\n * From 0 (Sunday) to 6 (Saturday).\n *\n * @param month - Number of the month (1 to 12).\n * @param year - Number of the year.\n * @returns The zero indexed week day where 0 is Sunday (0 to 6).\n */\nexport const getMonthFirstWeekday = (month: number, year: number) =>\n  new Date(year, month - 1, 1).getDay();\n\n/**\n * Creates a `Date` instance in UTC timezone.\n *\n * @param year - The year of the date.\n * @param monthIndex - The zero indexed month of the year (0 to 11).\n * @param day - The day of the month.\n * @param [hour=1] - The hour of the day.\n * @returns A `Date` instance in UTC timezone.\n */\nexport const makeUTCDate = (\n  year: number,\n  monthIndex: number,\n  day: number,\n  hour = 1\n) => new Date(Date.UTC(year, monthIndex, day, hour));\n\n/**\n * Checks if the received date is a valid date.\n *\n * @param date - The date to be validated.\n * @returns A flag stating if the date is valid or not.\n */\nexport const isDate = (date: any): date is Date =>\n  Object.prototype.toString.call(date) === \"[object Date]\" &&\n  !Number.isNaN(date.valueOf());\n\nexport const isDateRangeProp = (date: any): date is DateRangeProp =>\n  \"startDate\" in date;\n\n/**\n * Checks if two dates are in the same month and year.\n *\n * @param date1 - First date.\n * @param date2 - Second date.\n * @returns A flag stating if the dates are in the same month and year or not.\n */\nexport const isSameMonth = (date1: any, date2: any) => {\n  if (!(isDate(date1) && isDate(date2))) return false;\n\n  return (\n    date1.getMonth() === date2.getMonth() &&\n    date1.getFullYear() === date2.getFullYear()\n  );\n};\n\n/**\n * Checks if two dates are on the same day.\n *\n * @param date1 - First date.\n * @param date2 - Second date.\n * @returns A flag stating if the dates are in the same day or not.\n */\nexport const isSameDay = (date1: any, date2: any) => {\n  if (!(isDate(date1) && isDate(date2))) return false;\n\n  return (\n    date1.getDate() === date2.getDate() &&\n    date1.getMonth() === date2.getMonth() &&\n    date1.getFullYear() === date2.getFullYear()\n  );\n};\n\n/**\n * Formats the received date using the ISO format (YYYY-MM-DD).\n *\n * @param date - The date to be formatted.\n * @returns The formatted date in ISO format.\n */\nexport const getDateISO = (date?: Date) => {\n  if (!isDate(date)) return null;\n\n  return [\n    date.getFullYear(),\n    zeroPad(date.getMonth() + 1, 2),\n    zeroPad(date.getDate(), 2),\n  ].join(\"-\");\n};\n\n/**\n * Returns an object with the previous month taking also into consideration the year.\n * For example the previous month of January 2000 will be December 1999.\n *\n * @param month - Number of the month.\n * @param year - Number of the year.\n * @returns Object with new month and year defined.\n */\nexport const getPreviousMonth = (month: number, year: number) => {\n  const prevMonth = month > 1 ? month - 1 : 12;\n  const prevMonthYear = month > 1 ? year : year - 1;\n\n  return { month: prevMonth, year: prevMonthYear };\n};\n\n/**\n * Returns an object with the next month taking also into consideration the year.\n * For example the next month of December 2000 will be January 2001.\n *\n * @param month - Number of the month.\n * @param year - Number of the year.\n * @returns Object with new month and year defined.\n */\nexport const getNextMonth = (month: number, year: number) => {\n  const nextMonth = month < 12 ? month + 1 : 1;\n  const nextMonthYear = month < 12 ? year : year + 1;\n\n  return { month: nextMonth, year: nextMonthYear };\n};\n\n/**\n * Returns a list with the names of all the months localized in the received locale and representation value.\n *\n * @param locale - The locale to be applied to the Intl format.\n * @param representationValue - The representation value for the month.\n * @returns An array with all the months names.\n */\nexport const getMonthNamesList = (\n  locale: string | undefined,\n  representationValue: Intl.DateTimeFormatOptions[\"month\"] = \"long\"\n) => {\n  const options = { month: representationValue, timeZone: \"UTC\" };\n\n  return [...new Array(12)].map((n, index) => {\n    const auxDate = makeUTCDate(1970, index, 1);\n    return capitalize(Intl.DateTimeFormat(locale, options).format(auxDate));\n  });\n};\n\n/**\n * Returns a list with the names of all the weekdays localized in the received locale and representation value.\n *\n * @param locale - The locale to be applied.\n * @returns An array with all the weekday names.\n */\nexport const getWeekdayNamesList = (locale: string) => {\n  const formatter = new Intl.DateTimeFormat(locale, {\n    weekday: \"narrow\",\n    timeZone: \"UTC\",\n  });\n\n  return [...new Array(7)].map((n, index) => {\n    return formatter.format(makeUTCDate(1970, 0, 4 + index));\n  });\n};\n\n/**\n * Returns the name of the month for the supplied month localized in the received locale and representation value.\n *\n * @param date - The date from which the month name is extracted.\n * @param locale - The locale to be applied to the Intl format.\n * @param representationValue - The locale to be applied to the Intl format.\n * @returns The name of the month.\n */\nexport const getMonthName = (\n  date: Date,\n  locale: string,\n  representationValue: Intl.DateTimeFormatOptions[\"month\"] = \"long\"\n) =>\n  new Intl.DateTimeFormat(locale, { month: representationValue }).format(date);\n\n/**\n * Formats the received date according to Design System specifications.\n * Currently: day month, year => `14 Aug, 2019`.\n *\n * @param date - UTC date to be formatted.\n * @param locale - The locale to be applied to the Intl format.\n * @returns The formatted date as a string.\n */\nexport const getFormattedDate = (\n  // TODO: fix this\n  date: any,\n  locale: any,\n  rep: Intl.DateTimeFormatOptions[\"month\"] = \"short\"\n) =>\n  `${date.getDate()} ${getMonthName(date, locale, rep)} ${date.getFullYear()}`;\n\n/**\n * Creates an array of 42 days. The complete current month and enough days from the previous and next months to fill\n * the 42 positions.\n *\n * @param month - The number of the month (1 to 12).\n * @param year - The number of the year.\n * @returns The array of dates.\n */\nexport const createDatesArray = (month: number, year: number) => {\n  // Initializes the variables needed to calculate the dates for the received month and year\n  const monthDays = getMonthDays(month, year);\n  const daysFromPrevMonth = getMonthFirstWeekday(month, year);\n  const daysFromNextMonth =\n    CALENDAR_WEEKS * 7 - (daysFromPrevMonth + monthDays);\n  const prevMonthYear = getPreviousMonth(month, year);\n  const nextMonthYear = getNextMonth(month, year);\n  const prevMonthDays = getMonthDays(prevMonthYear.month, prevMonthYear.year);\n\n  // Creates the arrays for the dates for previous, current and next months\n  const prevMonthDates = [...new Array(daysFromPrevMonth)].map((n, index) => {\n    const day = index + 1 + (prevMonthDays - daysFromPrevMonth);\n    return new Date(prevMonthYear.year, prevMonthYear.month - 1, day);\n  });\n  const currentMonthDates = [...new Array(monthDays)].map((n, index) => {\n    const day = index + 1;\n    return new Date(year, month - 1, day);\n  });\n  const nextMonthDates = [...new Array(daysFromNextMonth)].map((n, index) => {\n    const day = index + 1;\n    return new Date(nextMonthYear.year, nextMonthYear.month - 1, day);\n  });\n\n  return [...prevMonthDates, ...currentMonthDates, ...nextMonthDates];\n};\n\n/**\n * Checks if the received locale is valid according to Intl.\n *\n * @param locale - The locale to be checked\n * @returns True if the locale is valid, false otherwise.\n */\nexport const isValidLocale = (locale: string) => {\n  try {\n    if (Intl.DateTimeFormat.supportedLocalesOf(locale).length > 0) {\n      return true;\n    }\n    // eslint-disable-next-line no-console\n    console.warn(`${locale} is not supported. Falling back to a known locale.`);\n    return false;\n  } catch (error) {\n    if (\n      error != null &&\n      typeof error === \"object\" &&\n      \"name\" in error &&\n      error?.name === \"RangeError\"\n    ) {\n      // eslint-disable-next-line no-console\n      console.error(`Invalid locale: ${locale}`);\n      return false;\n    }\n    if (error != null && typeof error === \"object\" && \"message\" in error) {\n      // eslint-disable-next-line no-console\n      console.error(error?.message);\n      return false;\n    }\n\n    return false;\n  }\n};\n\nexport const isRange = (date): date is DateRangeProp =>\n  date != null && typeof date === \"object\" && \"startDate\" in date;\n\n/**\n * Checks if the date falls within a specified date range.\n *\n * @param date - The date to be evaluated.\n * @param providedValueRange - Provided selection range.\n * @returns - True if the date falls within the range, false otherwise.\n */\nexport const dateInProvidedValueRange = (\n  date: any,\n  providedValueRange: any\n) => {\n  const { startDate, endDate } = providedValueRange;\n\n  if (!isRange(providedValueRange) || endDate == null) return false;\n  const localEndDate = endDate;\n\n  const modStartDate = dayjs(startDate).format(\"YYYY-MM-DD\");\n  const modEndDate = dayjs(localEndDate).format(\"YYYY-MM-DD\");\n\n  const convertedDate = dayjs(date).format(\"YYYY-MM-DD\");\n\n  return convertedDate >= modStartDate && convertedDate <= modEndDate;\n};\n\nexport const checkIfDateIsDisabled = (\n  date?: string | number | Date | dayjs.Dayjs,\n  minimumDate?: string | number | Date | dayjs.Dayjs,\n  maximumDate?: string | number | Date | dayjs.Dayjs\n) => {\n  if (!minimumDate && !maximumDate) return false;\n  const modStartDate = minimumDate\n    ? dayjs(minimumDate).format(\"YYYY-MM-DD\")\n    : undefined;\n  const modEndDate = maximumDate\n    ? dayjs(maximumDate).format(\"YYYY-MM-DD\")\n    : undefined;\n\n  const convertedDate = dayjs(date).format(\"YYYY-MM-DD\");\n\n  return (\n    (modStartDate !== undefined && convertedDate < modStartDate) ||\n    (modEndDate !== undefined && convertedDate > modEndDate)\n  );\n};\n\nexport const formatToLocale = (date, locale) => {\n  return new Intl.DateTimeFormat(locale, {\n    day: \"numeric\",\n    month: \"short\",\n    year: \"numeric\",\n  }).format(date);\n};\n"],"names":["CALENDAR_WEEKS","getMonthDays","month","year","Date","getDate","getMonthFirstWeekday","getDay","makeUTCDate","monthIndex","day","hour","UTC","isDate","date","Object","prototype","toString","call","Number","isNaN","valueOf","isDateRangeProp","isSameMonth","date1","date2","getMonth","getFullYear","isSameDay","getPreviousMonth","prevMonth","prevMonthYear","getNextMonth","nextMonth","nextMonthYear","getMonthNamesList","locale","representationValue","options","timeZone","Array","map","n","index","auxDate","capitalize","Intl","DateTimeFormat","format","getWeekdayNamesList","formatter","weekday","getMonthName","getFormattedDate","rep","createDatesArray","monthDays","daysFromPrevMonth","daysFromNextMonth","prevMonthDays","prevMonthDates","currentMonthDates","nextMonthDates","isRange","dateInProvidedValueRange","providedValueRange","startDate","endDate","localEndDate","modStartDate","dayjs","modEndDate","convertedDate","checkIfDateIsDisabled","minimumDate","maximumDate","undefined","formatToLocale"],"mappings":"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"}

package/dist/esm/components/Card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBox } from \"@core/components/Box\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvAtmosphereColorKeys, HvSemanticColorKeys } from \"@core/types/tokens\";\n\nimport { staticClasses, useClasses } from \"./Card.styles\";\n\nexport { staticClasses as cardClasses };\n\nexport type HvCardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardProps extends HvBaseProps {\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** Whether the card is selectable. */\n  selectable?: boolean;\n  /** Whether the card is currently selected. */\n  selected?: boolean;\n  /** The background color of the card. */\n  bgcolor?:\n    | \"sema0\"\n    | HvSemanticColorKeys\n    | HvAtmosphereColorKeys\n    | \"transparent\";\n  /**\n   *  The border color at the top of the card. Must be one of palette semantic or atmosphere colors.\n   *  To set another color, the borderTop should be override.\n   */\n  statusColor?: \"sema0\" | HvSemanticColorKeys | HvAtmosphereColorKeys;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardClasses;\n}\n\n/**\n * A card is a container for a few short and related pieces of content.\n * It roughly resembles a playing card in size and shape and is intended as a\n * linked short representation of a conceptual unit. For that reason,\n * this pattern must be used as an entry-point for further information.\n */\nexport const HvCard = (props: HvCardProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    icon,\n    selectable = false,\n    selected = false,\n    statusColor = \"sema0\",\n    bgcolor,\n    ...others\n  } = useDefaultProps(\"HvCard\", props);\n\n  const { classes, css, cx } = useClasses(classesProp);\n\n  return (\n    <HvBox\n      className={cx(\n        \"HvIsCardGridElement\",\n        classes.root,\n        css({\n          backgroundColor: bgcolor && theme.colors[bgcolor],\n        }),\n        {\n          [classes.selectable]: selectable,\n          [classes.selected]: selected,\n        },\n        className\n      )}\n      {...others}\n    >\n      <div className={classes.semanticContainer}>\n        <div\n          className={cx(\n            css({\n              height: selected ? 4 : 2,\n              backgroundColor:\n                statusColor === \"sema0\"\n                  ? selected\n                    ? theme.colors.secondary\n                    : theme.colors.atmo4\n                  : theme.colors[statusColor],\n            }),\n            classes.semanticBar\n          )}\n        />\n        <div className={classes.icon}>{icon}</div>\n      </div>\n      {children}\n    </HvBox>\n  );\n};\n"],"names":["HvCard","props","classes","classesProp","className","children","icon","selectable","selected","statusColor","bgcolor","others","useDefaultProps","css","cx","useClasses","root","backgroundColor","theme","colors","semanticContainer","height","secondary","atmo4","semanticBar"],"mappings":";;;;;;AA0CaA,MAAAA,SAASA,CAACC,UAAuB;AACtC,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,aAAa;AAAA,IACbC,WAAW;AAAA,IACXC,cAAc;AAAA,IACdC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,UAAUX,KAAK;AAE7B,QAAA;AAAA,IAAEC;AAAAA,IAASW;AAAAA,IAAKC;AAAAA,EAAAA,IAAOC,WAAWZ,WAAW;AAEnD,8BACG,OACC,EAAA,WAAWW,GACT,uBACAZ,QAAQc,MACRH,IAAI;AAAA,IACFI,iBAAiBP,WAAWQ,MAAMC,OAAOT,OAAO;AAAA,EAAA,CACjD,GACD;AAAA,IACE,CAACR,QAAQK,UAAU,GAAGA;AAAAA,IACtB,CAACL,QAAQM,QAAQ,GAAGA;AAAAA,EAEtBJ,GAAAA,SACF,GACA,GAAIO,QAEJ,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAWT,QAAQkB,mBACtB,UAAA;AAAA,MAAC,oBAAA,OAAA,EACC,WAAWN,GACTD,IAAI;AAAA,QACFQ,QAAQb,WAAW,IAAI;AAAA,QACvBS,iBACER,gBAAgB,UACZD,WACEU,MAAMC,OAAOG,YACbJ,MAAMC,OAAOI,QACfL,MAAMC,OAAOV,WAAW;AAAA,MAAA,CAC/B,GACDP,QAAQsB,WACV,GAAE;AAAA,MAEH,oBAAA,OAAA,EAAI,WAAWtB,QAAQI,MAAOA,UAAK,MAAA;AAAA,IAAA,GACtC;AAAA,IACCD;AAAAA,EACH,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"Card.js","sources":["../../../../src/components/Card/Card.tsx"],"sourcesContent":["import { theme } from \"@hitachivantara/uikit-styles\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBox } from \"@core/components/Box\";\nimport { ExtractNames } from \"@core/utils/classes\";\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvAtmosphereColorKeys, HvSemanticColorKeys } from \"@core/types/tokens\";\n\nimport { staticClasses, useClasses } from \"./Card.styles\";\n\nexport { staticClasses as cardClasses };\n\nexport type HvCardClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardProps extends HvBaseProps {\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** Whether the card is selectable. */\n  selectable?: boolean;\n  /** Whether the card is currently selected. */\n  selected?: boolean;\n  /** The background color of the card. */\n  bgcolor?:\n    | \"sema0\"\n    | HvSemanticColorKeys\n    | HvAtmosphereColorKeys\n    | \"transparent\";\n  /**\n   *  The border color at the top of the card. Must be one of palette semantic or atmosphere colors.\n   *  To set another color, the borderTop should be override.\n   */\n  statusColor?: \"sema0\" | HvSemanticColorKeys | HvAtmosphereColorKeys;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardClasses;\n}\n\n/**\n * A card is a container for a few short and related pieces of content.\n * It roughly resembles a playing card in size and shape and is intended as a\n * linked short representation of a conceptual unit. For that reason,\n * this pattern must be used as an entry-point for further information.\n */\nexport const HvCard = (props: HvCardProps) => {\n  const {\n    classes: classesProp,\n    className,\n    children,\n    icon,\n    selectable = false,\n    selected = false,\n    statusColor = \"sema0\",\n    bgcolor,\n    ...others\n  } = useDefaultProps(\"HvCard\", props);\n\n  const { classes, css, cx } = useClasses(classesProp);\n\n  return (\n    <HvBox\n      className={cx(\n        \"HvIsCardGridElement\",\n        classes.root,\n        css({\n          backgroundColor: bgcolor && theme.colors[bgcolor],\n        }),\n        {\n          [classes.selectable]: selectable,\n          [classes.selected]: selected,\n        },\n        className\n      )}\n      {...others}\n    >\n      <div className={classes.semanticContainer}>\n        <div\n          className={cx(\n            css({\n              height: selected ? 4 : 2,\n              backgroundColor:\n                statusColor === \"sema0\"\n                  ? selected\n                    ? theme.colors.secondary\n                    : theme.colors.atmo4\n                  : theme.colors[statusColor],\n            }),\n            classes.semanticBar\n          )}\n        />\n        <div className={classes.icon}>{icon}</div>\n      </div>\n      {children}\n    </HvBox>\n  );\n};\n"],"names":["HvCard","props","classes","classesProp","className","children","icon","selectable","selected","statusColor","bgcolor","others","useDefaultProps","css","cx","useClasses","root","backgroundColor","theme","colors","semanticContainer","height","secondary","atmo4","semanticBar"],"mappings":";;;;;;AA2CaA,MAAAA,SAASA,CAACC,UAAuB;AACtC,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC,aAAa;AAAA,IACbC,WAAW;AAAA,IACXC,cAAc;AAAA,IACdC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,UAAUX,KAAK;AAE7B,QAAA;AAAA,IAAEC;AAAAA,IAASW;AAAAA,IAAKC;AAAAA,EAAAA,IAAOC,WAAWZ,WAAW;AAEnD,8BACG,OACC,EAAA,WAAWW,GACT,uBACAZ,QAAQc,MACRH,IAAI;AAAA,IACFI,iBAAiBP,WAAWQ,MAAMC,OAAOT,OAAO;AAAA,EAAA,CACjD,GACD;AAAA,IACE,CAACR,QAAQK,UAAU,GAAGA;AAAAA,IACtB,CAACL,QAAQM,QAAQ,GAAGA;AAAAA,EAEtBJ,GAAAA,SACF,GACA,GAAIO,QAEJ,UAAA;AAAA,IAAC,qBAAA,OAAA,EAAI,WAAWT,QAAQkB,mBACtB,UAAA;AAAA,MAAC,oBAAA,OAAA,EACC,WAAWN,GACTD,IAAI;AAAA,QACFQ,QAAQb,WAAW,IAAI;AAAA,QACvBS,iBACER,gBAAgB,UACZD,WACEU,MAAMC,OAAOG,YACbJ,MAAMC,OAAOI,QACfL,MAAMC,OAAOV,WAAW;AAAA,MAAA,CAC/B,GACDP,QAAQsB,WACV,GAAE;AAAA,MAEH,oBAAA,OAAA,EAAI,WAAWtB,QAAQI,MAAOA,UAAK,MAAA;AAAA,IAAA,GACtC;AAAA,IACCD;AAAAA,EACH,EAAA,CAAA;AAEJ;"}

package/dist/esm/components/Card/Header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../../src/components/Card/Header/Header.tsx"],"sourcesContent":["import MuiCardHeader, {\n  CardHeaderProps as MuiCardHeaderProps,\n} from \"@mui/material/CardHeader\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\nimport { staticClasses, useClasses } from \"./Header.styles\";\n\nexport { staticClasses as cardHeaderClasses };\n\nexport type HvCardHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardHeaderProps\n  extends Omit<MuiCardHeaderProps, \"classes\">,\n    HvBaseProps<HTMLDivElement, \"title\"> {\n  /** The renderable content inside the title slot of the header. */\n  title: React.ReactNode;\n  /** The renderable content inside the subheader slot of the header. */\n  subheader?: React.ReactNode;\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardHeaderClasses;\n}\n\nexport const HvCardHeader = (props: HvCardHeaderProps) => {\n  const {\n    classes: classesProp,\n    className,\n    title,\n    subheader,\n    icon,\n    onClick,\n    ...others\n  } = useDefaultProps(\"HvCardHeader\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <MuiCardHeader\n      title={title}\n      subheader={subheader}\n      action={icon}\n      onClick={onClick}\n      className={cx(classes.root, className)}\n      classes={{\n        title: cx({\n          [classes.titleShort]: icon,\n          [classes.title]: !icon,\n        }),\n        subheader: classes.subheader,\n        action: classes.action,\n        content: classes.content,\n      }}\n      {...others}\n    />\n  );\n};\n"],"names":["HvCardHeader","props","classes","classesProp","className","title","subheader","icon","onClick","others","useDefaultProps","cx","useClasses","root","titleShort","action","content"],"mappings":";;;;;AA6BaA,MAAAA,eAAeA,CAACC,UAA6B;AAClD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAgBT,KAAK;AACnC,QAAA;AAAA,IAAEC;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AAE9C,SACG,oBAAA,eAAA,EACC,OACA,WACA,QAAQI,MACR,SACA,WAAWI,GAAGT,QAAQW,MAAMT,SAAS,GACrC,SAAS;AAAA,IACPC,OAAOM,GAAG;AAAA,MACR,CAACT,QAAQY,UAAU,GAAGP;AAAAA,MACtB,CAACL,QAAQG,KAAK,GAAG,CAACE;AAAAA,IAAAA,CACnB;AAAA,IACDD,WAAWJ,QAAQI;AAAAA,IACnBS,QAAQb,QAAQa;AAAAA,IAChBC,SAASd,QAAQc;AAAAA,EAAAA,GAEfP,GAAAA,OACJ,CAAA;AAEN;"}
+{"version":3,"file":"Header.js","sources":["../../../../../src/components/Card/Header/Header.tsx"],"sourcesContent":["import MuiCardHeader, {\n  CardHeaderProps as MuiCardHeaderProps,\n} from \"@mui/material/CardHeader\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useDefaultProps } from \"@core/hooks\";\n\nimport { staticClasses, useClasses } from \"./Header.styles\";\n\nexport { staticClasses as cardHeaderClasses };\n\nexport type HvCardHeaderClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardHeaderProps\n  extends Omit<MuiCardHeaderProps, \"classes\">,\n    HvBaseProps<HTMLDivElement, \"title\"> {\n  /** The renderable content inside the title slot of the header. */\n  title: React.ReactNode;\n  /** The renderable content inside the subheader slot of the header. */\n  subheader?: React.ReactNode;\n  /** The renderable content inside the icon slot of the header. */\n  icon?: React.ReactNode;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardHeaderClasses;\n}\n\nexport const HvCardHeader = (props: HvCardHeaderProps) => {\n  const {\n    classes: classesProp,\n    className,\n    title,\n    subheader,\n    icon,\n    onClick,\n    ...others\n  } = useDefaultProps(\"HvCardHeader\", props);\n  const { classes, cx } = useClasses(classesProp);\n\n  return (\n    <MuiCardHeader\n      title={title}\n      subheader={subheader}\n      action={icon}\n      onClick={onClick}\n      className={cx(classes.root, className)}\n      classes={{\n        title: cx({\n          [classes.titleShort]: icon,\n          [classes.title]: !icon,\n        }),\n        subheader: classes.subheader,\n        action: classes.action,\n        content: classes.content,\n      }}\n      {...others}\n    />\n  );\n};\n"],"names":["HvCardHeader","props","classes","classesProp","className","title","subheader","icon","onClick","others","useDefaultProps","cx","useClasses","root","titleShort","action","content"],"mappings":";;;;;AA8BaA,MAAAA,eAAeA,CAACC,UAA6B;AAClD,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EAAAA,IACDC,gBAAgB,gBAAgBT,KAAK;AACnC,QAAA;AAAA,IAAEC;AAAAA,IAASS;AAAAA,EAAAA,IAAOC,WAAWT,WAAW;AAE9C,SACG,oBAAA,eAAA,EACC,OACA,WACA,QAAQI,MACR,SACA,WAAWI,GAAGT,QAAQW,MAAMT,SAAS,GACrC,SAAS;AAAA,IACPC,OAAOM,GAAG;AAAA,MACR,CAACT,QAAQY,UAAU,GAAGP;AAAAA,MACtB,CAACL,QAAQG,KAAK,GAAG,CAACE;AAAAA,IAAAA,CACnB;AAAA,IACDD,WAAWJ,QAAQI;AAAAA,IACnBS,QAAQb,QAAQa;AAAAA,IAChBC,SAASd,QAAQc;AAAAA,EAAAA,GAEfP,GAAAA,OACJ,CAAA;AAEN;"}

package/dist/esm/components/Card/Media/Media.js.map

@@ -1 +1 @@
-{"version":3,"file":"Media.js","sources":["../../../../../src/components/Card/Media/Media.tsx"],"sourcesContent":["import MuiCardMedia, {\n  CardMediaProps as MuiCardMediaProps,\n} from \"@mui/material/CardMedia\";\n\nimport { ImgHTMLAttributes } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Media.styles\";\n\nexport { staticClasses as cardMediaClasses };\n\nexport type HvCardMediaClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardMediaProps\n  extends Omit<MuiCardMediaProps, \"classes\">,\n    ImgHTMLAttributes<HTMLDivElement>,\n    HvBaseProps<HTMLDivElement, \"onClick\" | \"title\"> {\n  /** Id to be applied to the root node. */\n  id?: string;\n  /** The title of the media. */\n  title?: string;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n  /** The component used for the root node. Either a string to use a HTML element or a component. */\n  component?: React.ElementType;\n  /** The image to display. */\n  image?: string;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardMediaClasses;\n}\n\nexport const HvCardMedia = ({\n  id,\n  classes: classesProp,\n  className,\n  children,\n  title,\n  onClick,\n  ...others\n}: HvCardMediaProps) => {\n  const { classes } = useClasses(classesProp);\n  return (\n    <MuiCardMedia\n      id={id}\n      classes={{\n        root: classes.root,\n        media: classes.media,\n      }}\n      className={className}\n      role=\"img\"\n      title={title}\n      onClick={onClick}\n      {...others}\n    >\n      {children}\n    </MuiCardMedia>\n  );\n};\n"],"names":["HvCardMedia","id","classes","classesProp","className","children","title","onClick","others","useClasses","root","media"],"mappings":";;;;AAiCO,MAAMA,cAAcA,CAAC;AAAA,EAC1BC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACa,MAAM;AAChB,QAAA;AAAA,IAAEN;AAAAA,EAAAA,IAAYO,WAAWN,WAAW;AAExC,SAAA,oBAAC,cACC,EAAA,IACA,SAAS;AAAA,IACPO,MAAMR,QAAQQ;AAAAA,IACdC,OAAOT,QAAQS;AAAAA,EAAAA,GAEjB,WACA,MAAK,OACL,OACA,SACIH,GAAAA,QAEHH,SACH,CAAA;AAEJ;"}
+{"version":3,"file":"Media.js","sources":["../../../../../src/components/Card/Media/Media.tsx"],"sourcesContent":["import { ImgHTMLAttributes } from \"react\";\nimport MuiCardMedia, {\n  CardMediaProps as MuiCardMediaProps,\n} from \"@mui/material/CardMedia\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./Media.styles\";\n\nexport { staticClasses as cardMediaClasses };\n\nexport type HvCardMediaClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCardMediaProps\n  extends Omit<MuiCardMediaProps, \"classes\">,\n    ImgHTMLAttributes<HTMLDivElement>,\n    HvBaseProps<HTMLDivElement, \"onClick\" | \"title\"> {\n  /** Id to be applied to the root node. */\n  id?: string;\n  /** The title of the media. */\n  title?: string;\n  /** The function that will be executed when this section is clicked. */\n  onClick?: React.MouseEventHandler<HTMLDivElement> | undefined;\n  /** The component used for the root node. Either a string to use a HTML element or a component. */\n  component?: React.ElementType;\n  /** The image to display. */\n  image?: string;\n  /** A Jss Object used to override or extend the styles applied to the component. */\n  classes?: HvCardMediaClasses;\n}\n\nexport const HvCardMedia = ({\n  id,\n  classes: classesProp,\n  className,\n  children,\n  title,\n  onClick,\n  ...others\n}: HvCardMediaProps) => {\n  const { classes } = useClasses(classesProp);\n  return (\n    <MuiCardMedia\n      id={id}\n      classes={{\n        root: classes.root,\n        media: classes.media,\n      }}\n      className={className}\n      role=\"img\"\n      title={title}\n      onClick={onClick}\n      {...others}\n    >\n      {children}\n    </MuiCardMedia>\n  );\n};\n"],"names":["HvCardMedia","id","classes","classesProp","className","children","title","onClick","others","useClasses","root","media"],"mappings":";;;;AAgCO,MAAMA,cAAcA,CAAC;AAAA,EAC1BC;AAAAA,EACAC,SAASC;AAAAA,EACTC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACAC;AAAAA,EACA,GAAGC;AACa,MAAM;AAChB,QAAA;AAAA,IAAEN;AAAAA,EAAAA,IAAYO,WAAWN,WAAW;AAExC,SAAA,oBAAC,cACC,EAAA,IACA,SAAS;AAAA,IACPO,MAAMR,QAAQQ;AAAAA,IACdC,OAAOT,QAAQS;AAAAA,EAAAA,GAEjB,WACA,MAAK,OACL,OACA,SACIH,GAAAA,QAEHH,SACH,CAAA;AAEJ;"}

package/dist/esm/components/Carousel/Carousel.js

@@ -1,8 +1,8 @@
 import { jsxs, jsx } from "@emotion/react/jsx-runtime";
 import { useRef, useState, Children, useCallback, useEffect } from "react";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import useCarousel from "embla-carousel-react";
 import { Close, Fullscreen, Backwards, Forwards } from "@hitachivantara/uikit-react-icons";
+import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { useTheme } from "../../hooks/useTheme.js";
 import { HvCarouselControls } from "./CarouselControls.js";
 import { HvCarouselThumbnails } from "./CarouselThumbnails.js";
@@ -45,7 +45,7 @@ const HvCarousel = (props) => {
   } = useClasses(classesProp);
   const thumbnailsRef = useRef(null);
   const [isFullscreen, setIsFullscreen] = useState(false);
-  const isDs3 = (activeTheme == null ? void 0 : activeTheme.name) === "ds3";
+  const isDs3 = activeTheme?.name === "ds3";
   const actionsPosition = isDs3 ? "header" : "controls";
   const controlsPosition = controlsPositionProp ?? (isDs3 ? "bottom" : "top");
   const thumbnailsPosition = thumbnailsPositionProp ?? "bottom";
@@ -54,28 +54,27 @@ const HvCarousel = (props) => {
     loop: true,
     ...carouselOptions
   });
-  const [selectedIndex, setSelectedIndex] = useState((carouselOptions == null ? void 0 : carouselOptions.startIndex) ?? 0);
+  const [selectedIndex, setSelectedIndex] = useState(carouselOptions?.startIndex ?? 0);
   const numSlides = Children.count(children);
   const handlePrevious = useCallback(() => {
-    controller == null ? void 0 : controller.scrollPrev();
+    controller?.scrollPrev();
   }, [controller]);
   const handleNext = useCallback(() => {
-    controller == null ? void 0 : controller.scrollNext();
+    controller?.scrollNext();
   }, [controller]);
   const handleScroll = (index) => {
-    controller == null ? void 0 : controller.scrollTo(index);
+    controller?.scrollTo(index);
   };
   const handleSelect = useCallback(() => {
-    var _a, _b, _c;
     if (!controller)
       return;
     const slideIndex = controller.selectedScrollSnap();
     setSelectedIndex(slideIndex);
-    (_c = (_b = (_a = thumbnailsRef.current) == null ? void 0 : _a.querySelectorAll("button")) == null ? void 0 : _b[slideIndex]) == null ? void 0 : _c.scrollIntoView({
+    thumbnailsRef.current?.querySelectorAll("button")?.[slideIndex]?.scrollIntoView({
       behavior: "smooth",
       block: "nearest"
     });
-    onChange == null ? void 0 : onChange(slideIndex);
+    onChange?.(slideIndex);
   }, [controller, onChange]);
   useEffect(() => {
     if (!controller)
@@ -91,8 +90,8 @@ const HvCarousel = (props) => {
     controller.reInit();
     setSelectedIndex((currentIndex) => clamp(currentIndex, numSlides, 0));
   }, [numSlides, controller]);
-  const canPrev = (controller == null ? void 0 : controller.canScrollPrev()) ?? false;
-  const canNext = (controller == null ? void 0 : controller.canScrollNext()) ?? false;
+  const canPrev = controller?.canScrollPrev() ?? false;
+  const canNext = controller?.canScrollNext() ?? false;
   const showTitle = !!title && (!xs || isFullscreen);
   const showFullscreen = showFullscreenProp ?? xs;
   const height = isFullscreen ? "100%" : heightProp ?? "auto";

package/dist/esm/components/Carousel/Carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.js","sources":["../../../../src/components/Carousel/Carousel.tsx"],"sourcesContent":["import React, {\n  CSSProperties,\n  Children,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport useCarousel, { EmblaOptionsType } from \"embla-carousel-react\";\n\nimport {\n  Backwards,\n  Forwards,\n  Close,\n  Fullscreen,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvButton } from \"@core/components/Button\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvContainer } from \"@core/components/Container\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { HvCarouselControls } from \"./CarouselControls\";\nimport { HvCarouselThumbnails } from \"./CarouselThumbnails\";\nimport { staticClasses, useClasses } from \"./Carousel.styles\";\n\nconst clamp = (num: number, max: number, min = 0) =>\n  Math.min(Math.max(num, min), max);\n\nexport { staticClasses as carouselClasses };\n\nexport type HvCarouselClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCarouselProps\n  extends HvBaseProps<HTMLDivElement, \"title\" | \"onChange\"> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCarouselClasses;\n  /** Height of the Slider container. If `undefined`, images will keep a 16/9 aspect-ratio */\n  height?: CSSProperties[\"height\"];\n  /** Width of the thumbnail. Height will try to maintain a 16/9 aspect-ratio */\n  thumbnailWidth?: CSSProperties[\"width\"];\n  /** Title of the carousel */\n  title?: React.ReactNode;\n  /** Content slides to be displayed. @see `<HvCarouselSlide />` */\n  children?: React.ReactNode;\n  /** Custom content to render in the actions area */\n  actions?: React.ReactNode;\n  /** Whether Carousel is in \"xs mode\" - to use in embedded contexts */\n  xs?: boolean;\n  /** Whether to show dots instead of arrow pagination. Defaults to true under 5 elements */\n  showDots?: boolean;\n  /** Whether to show the counter on the top-right corner of the active slide */\n  showCounter?: boolean;\n  /** Whether to show the back/forwards buttons over the active slide */\n  showSlideControls?: boolean;\n  /** Whether to enable the fullscreen toggle button */\n  showFullscreen?: boolean;\n  /** Whether to hide the thumbnails. Hidden by default in \"xs\" mode */\n  hideThumbnails?: boolean;\n  /** Controls position. */\n  controlsPosition?: \"top\" | \"bottom\";\n  /** Thumbnails position. */\n  thumbnailsPosition?: \"top\" | \"bottom\";\n  /** Carousel configuration options. @see https://www.embla-carousel.com/api/options/ */\n  carouselOptions?: EmblaOptionsType;\n  /** Function that renders the thumbnail.  */\n  renderThumbnail?: (index: number) => React.ReactNode;\n  /** The callback fired when the active slide changes. */\n  onChange?: (index: number) => void;\n}\n\n/**\n * A Carousel is commonly used to browse images, it can also be used to browse any kind of content like text, video, or charts.\n * It allows you to focus on a particular content while having a notion of how many you have to explore.\n */\nexport const HvCarousel = (props: HvCarouselProps) => {\n  const {\n    className,\n    classes: classesProp,\n    height: heightProp = \"auto\",\n    thumbnailWidth = 90,\n    title,\n    children,\n    actions: actionsProp,\n    xs,\n    showDots: showDotsProp,\n    showCounter: showCounterProp,\n    showSlideControls,\n    showFullscreen: showFullscreenProp,\n    hideThumbnails: hideThumbnailsProp,\n    controlsPosition: controlsPositionProp,\n    thumbnailsPosition: thumbnailsPositionProp,\n    carouselOptions,\n    renderThumbnail,\n    onChange,\n    ...others\n  } = useDefaultProps(\"HvCarousel\", props);\n  const { activeTheme } = useTheme();\n  const { classes, css, cx } = useClasses(classesProp);\n  const thumbnailsRef = useRef<HTMLDivElement>(null);\n  const [isFullscreen, setIsFullscreen] = useState(false);\n\n  const isDs3 = activeTheme?.name === \"ds3\";\n  const actionsPosition = isDs3 ? \"header\" : \"controls\";\n  const controlsPosition = controlsPositionProp ?? (isDs3 ? \"bottom\" : \"top\");\n  const thumbnailsPosition = thumbnailsPositionProp ?? \"bottom\";\n\n  const [containerRef, controller] = useCarousel({\n    align: \"start\",\n    loop: true,\n    ...carouselOptions,\n  });\n\n  const [selectedIndex, setSelectedIndex] = useState(\n    carouselOptions?.startIndex ?? 0\n  );\n\n  const numSlides = Children.count(children);\n\n  const handlePrevious = useCallback(() => {\n    controller?.scrollPrev();\n  }, [controller]);\n\n  const handleNext = useCallback(() => {\n    controller?.scrollNext();\n  }, [controller]);\n\n  const handleScroll = (index: number) => {\n    controller?.scrollTo(index);\n  };\n\n  const handleSelect = useCallback(() => {\n    if (!controller) return;\n\n    const slideIndex = controller.selectedScrollSnap();\n    setSelectedIndex(slideIndex);\n\n    // scroll to thumbnail button\n    thumbnailsRef.current\n      ?.querySelectorAll(\"button\")\n      ?.[slideIndex]?.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"nearest\",\n      });\n\n    onChange?.(slideIndex);\n  }, [controller, onChange]);\n\n  useEffect(() => {\n    if (!controller) return;\n\n    controller.on(\"select\", handleSelect);\n\n    return () => {\n      controller.off(\"select\", handleSelect);\n    };\n  }, [controller, handleSelect]);\n\n  useEffect(() => {\n    if (!controller) return;\n\n    controller.reInit();\n    setSelectedIndex((currentIndex) => clamp(currentIndex, numSlides, 0));\n  }, [numSlides, controller]);\n\n  const canPrev = controller?.canScrollPrev() ?? false;\n  const canNext = controller?.canScrollNext() ?? false;\n  const showTitle = !!title && (!xs || isFullscreen);\n  const showFullscreen = showFullscreenProp ?? xs;\n  const height = isFullscreen ? \"100%\" : heightProp ?? \"auto\";\n  const showCounter = xs;\n  const hideThumbnails = hideThumbnailsProp ?? (xs && !isFullscreen);\n  const showThumbnails = !hideThumbnails && !!renderThumbnail;\n  const showDots = showDotsProp ?? numSlides <= 5;\n\n  const actions = (\n    <div\n      className={cx(\n        classes.actions,\n        actionsPosition === \"header\"\n          ? css({ position: \"relative\", top: -40, height: 0 })\n          : css({ position: \"absolute\" })\n      )}\n    >\n      {actionsProp}\n      {showFullscreen && (\n        <HvTooltip title={isFullscreen ? \"Close\" : \"Fullscreen\"}>\n          <HvButton\n            icon\n            onClick={() => setIsFullscreen((curr) => !curr)}\n            className={classes.closeButton}\n          >\n            {isFullscreen ? <Close /> : <Fullscreen />}\n          </HvButton>\n        </HvTooltip>\n      )}\n    </div>\n  );\n\n  const controls = (\n    <HvCarouselControls\n      classes={classes}\n      showDots={showDots}\n      page={selectedIndex}\n      pages={numSlides}\n      canPrevious={canPrev}\n      canNext={canNext}\n      onPreviousClick={handlePrevious}\n      onNextClick={handleNext}\n      actions={actionsPosition === \"controls\" && actions}\n    />\n  );\n\n  const thumbnails = showThumbnails && (\n    <HvCarouselThumbnails\n      classes={classes}\n      ref={thumbnailsRef}\n      page={selectedIndex}\n      pages={numSlides}\n      width={thumbnailWidth}\n      onThumbnailClick={(evt, i) => handleScroll(i)}\n      renderThumbnail={renderThumbnail}\n    />\n  );\n\n  return (\n    <HvContainer\n      className={cx(classes.root, className, {\n        [classes.xs]: xs,\n        [classes.fullscreen]: isFullscreen,\n      })}\n      {...others}\n    >\n      {showTitle && (\n        <HvTypography variant=\"title2\" className={classes.title}>\n          {title}\n        </HvTypography>\n      )}\n\n      {actionsPosition === \"header\" && actions}\n      {thumbnailsPosition === \"top\" && thumbnails}\n      {controlsPosition === \"top\" && controls}\n      <div\n        className={cx(classes.main, {\n          [classes.mainXs]: xs,\n          [classes.mainFullscreen]: isFullscreen,\n        })}\n      >\n        {showCounter && (\n          <div className={classes.counterContainer}>\n            <span className={classes.counter}>\n              {`${selectedIndex + 1}/${numSlides}`}\n            </span>\n          </div>\n        )}\n\n        {showSlideControls && (\n          <div className={classes.slideControls}>\n            <HvButton\n              icon\n              disabled={!canPrev}\n              variant=\"secondarySubtle\"\n              aria-label=\"Backwards\"\n              onClick={handlePrevious}\n            >\n              <Backwards iconSize=\"XS\" />\n            </HvButton>\n            <HvButton\n              icon\n              disabled={!canNext}\n              variant=\"secondarySubtle\"\n              aria-label=\"Forwards\"\n              onClick={handleNext}\n            >\n              <Forwards iconSize=\"XS\" />\n            </HvButton>\n          </div>\n        )}\n\n        <div\n          ref={containerRef}\n          style={{ height }}\n          className={classes.slidesViewport}\n        >\n          <div className={classes.slidesContainer}>{children}</div>\n        </div>\n      </div>\n      {controlsPosition === \"bottom\" && controls}\n      {thumbnailsPosition === \"bottom\" && thumbnails}\n    </HvContainer>\n  );\n};\n"],"names":["clamp","num","max","min","Math","HvCarousel","props","className","classes","classesProp","height","heightProp","thumbnailWidth","title","children","actions","actionsProp","xs","showDots","showDotsProp","showCounter","showCounterProp","showSlideControls","showFullscreen","showFullscreenProp","hideThumbnails","hideThumbnailsProp","controlsPosition","controlsPositionProp","thumbnailsPosition","thumbnailsPositionProp","carouselOptions","renderThumbnail","onChange","others","useDefaultProps","activeTheme","useTheme","css","cx","useClasses","thumbnailsRef","useRef","isFullscreen","setIsFullscreen","useState","isDs3","name","actionsPosition","containerRef","controller","useCarousel","align","loop","selectedIndex","setSelectedIndex","startIndex","numSlides","Children","count","handlePrevious","useCallback","scrollPrev","handleNext","scrollNext","handleScroll","index","scrollTo","handleSelect","slideIndex","selectedScrollSnap","current","querySelectorAll","scrollIntoView","behavior","block","useEffect","on","off","reInit","currentIndex","canPrev","canScrollPrev","canNext","canScrollNext","showTitle","showThumbnails","position","top","curr","closeButton","controls","thumbnails","evt","i","root","fullscreen","main","mainXs","mainFullscreen","counterContainer","counter","slideControls","slidesViewport","slidesContainer"],"mappings":"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"}
+{"version":3,"file":"Carousel.js","sources":["../../../../src/components/Carousel/Carousel.tsx"],"sourcesContent":["import React, {\n  CSSProperties,\n  Children,\n  useCallback,\n  useEffect,\n  useRef,\n  useState,\n} from \"react\";\n\nimport useCarousel, { EmblaOptionsType } from \"embla-carousel-react\";\n\nimport {\n  Backwards,\n  Forwards,\n  Close,\n  Fullscreen,\n} from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvButton } from \"@core/components/Button\";\nimport { useTheme } from \"@core/hooks/useTheme\";\nimport { HvTooltip } from \"@core/components/Tooltip\";\nimport { HvTypography } from \"@core/components/Typography\";\nimport { HvContainer } from \"@core/components/Container\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { HvCarouselControls } from \"./CarouselControls\";\nimport { HvCarouselThumbnails } from \"./CarouselThumbnails\";\nimport { staticClasses, useClasses } from \"./Carousel.styles\";\n\nconst clamp = (num: number, max: number, min = 0) =>\n  Math.min(Math.max(num, min), max);\n\nexport { staticClasses as carouselClasses };\n\nexport type HvCarouselClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCarouselProps\n  extends HvBaseProps<HTMLDivElement, \"title\" | \"onChange\"> {\n  /** A Jss Object used to override or extend the styles applied. */\n  classes?: HvCarouselClasses;\n  /** Height of the Slider container. If `undefined`, images will keep a 16/9 aspect-ratio */\n  height?: CSSProperties[\"height\"];\n  /** Width of the thumbnail. Height will try to maintain a 16/9 aspect-ratio */\n  thumbnailWidth?: CSSProperties[\"width\"];\n  /** Title of the carousel */\n  title?: React.ReactNode;\n  /** Content slides to be displayed. @see `<HvCarouselSlide />` */\n  children?: React.ReactNode;\n  /** Custom content to render in the actions area */\n  actions?: React.ReactNode;\n  /** Whether Carousel is in \"xs mode\" - to use in embedded contexts */\n  xs?: boolean;\n  /** Whether to show dots instead of arrow pagination. Defaults to true under 5 elements */\n  showDots?: boolean;\n  /** Whether to show the counter on the top-right corner of the active slide */\n  showCounter?: boolean;\n  /** Whether to show the back/forwards buttons over the active slide */\n  showSlideControls?: boolean;\n  /** Whether to enable the fullscreen toggle button */\n  showFullscreen?: boolean;\n  /** Whether to hide the thumbnails. Hidden by default in \"xs\" mode */\n  hideThumbnails?: boolean;\n  /** Controls position. */\n  controlsPosition?: \"top\" | \"bottom\";\n  /** Thumbnails position. */\n  thumbnailsPosition?: \"top\" | \"bottom\";\n  /** Carousel configuration options. @see https://www.embla-carousel.com/api/options/ */\n  carouselOptions?: EmblaOptionsType;\n  /** Function that renders the thumbnail.  */\n  renderThumbnail?: (index: number) => React.ReactNode;\n  /** The callback fired when the active slide changes. */\n  onChange?: (index: number) => void;\n}\n\n/**\n * A Carousel is commonly used to browse images, it can also be used to browse any kind of content like text, video, or charts.\n * It allows you to focus on a particular content while having a notion of how many you have to explore.\n */\nexport const HvCarousel = (props: HvCarouselProps) => {\n  const {\n    className,\n    classes: classesProp,\n    height: heightProp = \"auto\",\n    thumbnailWidth = 90,\n    title,\n    children,\n    actions: actionsProp,\n    xs,\n    showDots: showDotsProp,\n    showCounter: showCounterProp,\n    showSlideControls,\n    showFullscreen: showFullscreenProp,\n    hideThumbnails: hideThumbnailsProp,\n    controlsPosition: controlsPositionProp,\n    thumbnailsPosition: thumbnailsPositionProp,\n    carouselOptions,\n    renderThumbnail,\n    onChange,\n    ...others\n  } = useDefaultProps(\"HvCarousel\", props);\n  const { activeTheme } = useTheme();\n  const { classes, css, cx } = useClasses(classesProp);\n  const thumbnailsRef = useRef<HTMLDivElement>(null);\n  const [isFullscreen, setIsFullscreen] = useState(false);\n\n  const isDs3 = activeTheme?.name === \"ds3\";\n  const actionsPosition = isDs3 ? \"header\" : \"controls\";\n  const controlsPosition = controlsPositionProp ?? (isDs3 ? \"bottom\" : \"top\");\n  const thumbnailsPosition = thumbnailsPositionProp ?? \"bottom\";\n\n  const [containerRef, controller] = useCarousel({\n    align: \"start\",\n    loop: true,\n    ...carouselOptions,\n  });\n\n  const [selectedIndex, setSelectedIndex] = useState(\n    carouselOptions?.startIndex ?? 0\n  );\n\n  const numSlides = Children.count(children);\n\n  const handlePrevious = useCallback(() => {\n    controller?.scrollPrev();\n  }, [controller]);\n\n  const handleNext = useCallback(() => {\n    controller?.scrollNext();\n  }, [controller]);\n\n  const handleScroll = (index: number) => {\n    controller?.scrollTo(index);\n  };\n\n  const handleSelect = useCallback(() => {\n    if (!controller) return;\n\n    const slideIndex = controller.selectedScrollSnap();\n    setSelectedIndex(slideIndex);\n\n    // scroll to thumbnail button\n    thumbnailsRef.current\n      ?.querySelectorAll(\"button\")\n      ?.[slideIndex]?.scrollIntoView({\n        behavior: \"smooth\",\n        block: \"nearest\",\n      });\n\n    onChange?.(slideIndex);\n  }, [controller, onChange]);\n\n  useEffect(() => {\n    if (!controller) return;\n\n    controller.on(\"select\", handleSelect);\n\n    return () => {\n      controller.off(\"select\", handleSelect);\n    };\n  }, [controller, handleSelect]);\n\n  useEffect(() => {\n    if (!controller) return;\n\n    controller.reInit();\n    setSelectedIndex((currentIndex) => clamp(currentIndex, numSlides, 0));\n  }, [numSlides, controller]);\n\n  const canPrev = controller?.canScrollPrev() ?? false;\n  const canNext = controller?.canScrollNext() ?? false;\n  const showTitle = !!title && (!xs || isFullscreen);\n  const showFullscreen = showFullscreenProp ?? xs;\n  const height = isFullscreen ? \"100%\" : heightProp ?? \"auto\";\n  const showCounter = xs;\n  const hideThumbnails = hideThumbnailsProp ?? (xs && !isFullscreen);\n  const showThumbnails = !hideThumbnails && !!renderThumbnail;\n  const showDots = showDotsProp ?? numSlides <= 5;\n\n  const actions = (\n    <div\n      className={cx(\n        classes.actions,\n        actionsPosition === \"header\"\n          ? css({ position: \"relative\", top: -40, height: 0 })\n          : css({ position: \"absolute\" })\n      )}\n    >\n      {actionsProp}\n      {showFullscreen && (\n        <HvTooltip title={isFullscreen ? \"Close\" : \"Fullscreen\"}>\n          <HvButton\n            icon\n            onClick={() => setIsFullscreen((curr) => !curr)}\n            className={classes.closeButton}\n          >\n            {isFullscreen ? <Close /> : <Fullscreen />}\n          </HvButton>\n        </HvTooltip>\n      )}\n    </div>\n  );\n\n  const controls = (\n    <HvCarouselControls\n      classes={classes}\n      showDots={showDots}\n      page={selectedIndex}\n      pages={numSlides}\n      canPrevious={canPrev}\n      canNext={canNext}\n      onPreviousClick={handlePrevious}\n      onNextClick={handleNext}\n      actions={actionsPosition === \"controls\" && actions}\n    />\n  );\n\n  const thumbnails = showThumbnails && (\n    <HvCarouselThumbnails\n      classes={classes}\n      ref={thumbnailsRef}\n      page={selectedIndex}\n      pages={numSlides}\n      width={thumbnailWidth}\n      onThumbnailClick={(evt, i) => handleScroll(i)}\n      renderThumbnail={renderThumbnail}\n    />\n  );\n\n  return (\n    <HvContainer\n      className={cx(classes.root, className, {\n        [classes.xs]: xs,\n        [classes.fullscreen]: isFullscreen,\n      })}\n      {...others}\n    >\n      {showTitle && (\n        <HvTypography variant=\"title2\" className={classes.title}>\n          {title}\n        </HvTypography>\n      )}\n\n      {actionsPosition === \"header\" && actions}\n      {thumbnailsPosition === \"top\" && thumbnails}\n      {controlsPosition === \"top\" && controls}\n      <div\n        className={cx(classes.main, {\n          [classes.mainXs]: xs,\n          [classes.mainFullscreen]: isFullscreen,\n        })}\n      >\n        {showCounter && (\n          <div className={classes.counterContainer}>\n            <span className={classes.counter}>\n              {`${selectedIndex + 1}/${numSlides}`}\n            </span>\n          </div>\n        )}\n\n        {showSlideControls && (\n          <div className={classes.slideControls}>\n            <HvButton\n              icon\n              disabled={!canPrev}\n              variant=\"secondarySubtle\"\n              aria-label=\"Backwards\"\n              onClick={handlePrevious}\n            >\n              <Backwards iconSize=\"XS\" />\n            </HvButton>\n            <HvButton\n              icon\n              disabled={!canNext}\n              variant=\"secondarySubtle\"\n              aria-label=\"Forwards\"\n              onClick={handleNext}\n            >\n              <Forwards iconSize=\"XS\" />\n            </HvButton>\n          </div>\n        )}\n\n        <div\n          ref={containerRef}\n          style={{ height }}\n          className={classes.slidesViewport}\n        >\n          <div className={classes.slidesContainer}>{children}</div>\n        </div>\n      </div>\n      {controlsPosition === \"bottom\" && controls}\n      {thumbnailsPosition === \"bottom\" && thumbnails}\n    </HvContainer>\n  );\n};\n"],"names":["clamp","num","max","min","Math","HvCarousel","props","className","classes","classesProp","height","heightProp","thumbnailWidth","title","children","actions","actionsProp","xs","showDots","showDotsProp","showCounter","showCounterProp","showSlideControls","showFullscreen","showFullscreenProp","hideThumbnails","hideThumbnailsProp","controlsPosition","controlsPositionProp","thumbnailsPosition","thumbnailsPositionProp","carouselOptions","renderThumbnail","onChange","others","useDefaultProps","activeTheme","useTheme","css","cx","useClasses","thumbnailsRef","useRef","isFullscreen","setIsFullscreen","useState","isDs3","name","actionsPosition","containerRef","controller","useCarousel","align","loop","selectedIndex","setSelectedIndex","startIndex","numSlides","Children","count","handlePrevious","useCallback","scrollPrev","handleNext","scrollNext","handleScroll","index","scrollTo","handleSelect","slideIndex","selectedScrollSnap","current","querySelectorAll","scrollIntoView","behavior","block","useEffect","on","off","reInit","currentIndex","canPrev","canScrollPrev","canNext","canScrollNext","showTitle","showThumbnails","position","top","curr","closeButton","controls","thumbnails","evt","i","root","fullscreen","main","mainXs","mainFullscreen","counterContainer","counter","slideControls","slidesViewport","slidesContainer"],"mappings":"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"}

package/dist/esm/components/Carousel/CarouselControls.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx, Fragment } from "@emotion/react/jsx-runtime";
-import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { Backwards, Forwards } from "@hitachivantara/uikit-react-icons";
+import { useDefaultProps } from "../../hooks/useDefaultProps.js";
 import { useClasses } from "./Carousel.styles.js";
 import { HvButton } from "../Button/Button.js";
 const HvCarouselControls = (props) => {

package/dist/esm/components/Carousel/CarouselControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselControls.js","sources":["../../../../src/components/Carousel/CarouselControls.tsx"],"sourcesContent":["import { MouseEventHandler, ReactNode } from \"react\";\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvButton } from \"@core/components/Button\";\nimport { HvPaginationProps } from \"@core/components/Pagination\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses } from \"./Carousel.styles\";\n\ninterface HvCarouselControlsProps\n  extends HvBaseProps<HTMLDivElement>,\n    Pick<HvPaginationProps, \"page\" | \"pages\" | \"canPrevious\" | \"canNext\"> {\n  showDots?: boolean;\n  classes?: ExtractNames<typeof useClasses>;\n  actions?: ReactNode;\n  onPreviousClick?: MouseEventHandler<HTMLButtonElement>;\n  onNextClick?: MouseEventHandler<HTMLButtonElement>;\n}\n\nexport const HvCarouselControls = (props: HvCarouselControlsProps) => {\n  const {\n    classes: classesProp,\n    className,\n    showDots,\n    page,\n    pages,\n    canPrevious,\n    canNext,\n    actions,\n    onPreviousClick,\n    onNextClick,\n  } = useDefaultProps(\"HvCarouselControls\", props);\n  const { classes, cx } = useClasses(classesProp, false);\n\n  const selectedIndex = page || 0;\n  const numSlides = pages;\n\n  return (\n    <div className={cx(classes.controls, className)}>\n      {showDots ? (\n        <div className={classes.dots}>\n          {Array.from(Array(numSlides)).map((el, index) => (\n            <span\n              key={`circle-${index}`}\n              className={cx(classes.dot, {\n                [classes.dotSelected]: index === selectedIndex,\n              })}\n            />\n          ))}\n        </div>\n      ) : (\n        <>\n          <HvButton\n            icon\n            disabled={!canPrevious}\n            aria-label=\"Backwards\"\n            onClick={onPreviousClick}\n          >\n            <Backwards iconSize=\"XS\" />\n          </HvButton>\n          <div className={classes.pageCounter}>\n            {`${selectedIndex + 1} / ${numSlides}`}\n          </div>\n          <HvButton\n            icon\n            disabled={!canNext}\n            aria-label=\"Forwards\"\n            onClick={onNextClick}\n          >\n            <Forwards iconSize=\"XS\" />\n          </HvButton>\n        </>\n      )}\n      {actions}\n    </div>\n  );\n};\n"],"names":["HvCarouselControls","props","classes","classesProp","className","showDots","page","pages","canPrevious","canNext","actions","onPreviousClick","onNextClick","useDefaultProps","cx","useClasses","selectedIndex","numSlides","controls","dots","Array","from","map","el","index","dot","dotSelected","pageCounter"],"mappings":";;;;;AAsBaA,MAAAA,qBAAqBA,CAACC,UAAmC;AAC9D,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,gBAAgB,sBAAsBZ,KAAK;AACzC,QAAA;AAAA,IAAEC;AAAAA,IAASY;AAAAA,EAAAA,IAAOC,WAAWZ,aAAa,KAAK;AAErD,QAAMa,gBAAgBV,QAAQ;AAC9B,QAAMW,YAAYV;AAElB,8BACG,OAAI,EAAA,WAAWO,GAAGZ,QAAQgB,UAAUd,SAAS,GAC3CC,UAAAA;AAAAA,IACC,WAAA,oBAAC,SAAI,WAAWH,QAAQiB,MACrBC,UAAMC,MAAAA,KAAKD,MAAMH,SAAS,CAAC,EAAEK,IAAI,CAACC,IAAIC,UACrC,oBAAC,UAEC,WAAWV,GAAGZ,QAAQuB,KAAK;AAAA,MACzB,CAACvB,QAAQwB,WAAW,GAAGF,UAAUR;AAAAA,IAClC,CAAA,KAHK,UAASQ,KAAM,EAGlB,CAEN,EACH,CAAA,IAGE,qBAAA,UAAA,EAAA,UAAA;AAAA,MAAA,oBAAC,UACC,EAAA,MAAI,MACJ,UAAU,CAAChB,aACX,cAAW,aACX,SAASG,iBAET,UAAA,oBAAC,WAAU,EAAA,UAAS,KAAI,CAAA,GAC1B;AAAA,MACA,oBAAC,OAAI,EAAA,WAAWT,QAAQyB,aACpB,aAAEX,gBAAgB,CAAE,MAAKC,SAAU,GACvC,CAAA;AAAA,MACC,oBAAA,UAAA,EACC,MAAI,MACJ,UAAU,CAACR,SACX,cAAW,YACX,SAASG,aAET,UAAA,oBAAC,UAAS,EAAA,UAAS,KAAI,CAAA,GACzB;AAAA,IAAA,GACF;AAAA,IAEDF;AAAAA,EACH,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"CarouselControls.js","sources":["../../../../src/components/Carousel/CarouselControls.tsx"],"sourcesContent":["import { MouseEventHandler, ReactNode } from \"react\";\n\nimport { Backwards, Forwards } from \"@hitachivantara/uikit-react-icons\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvButton } from \"@core/components/Button\";\nimport { HvPaginationProps } from \"@core/components/Pagination\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses } from \"./Carousel.styles\";\n\ninterface HvCarouselControlsProps\n  extends HvBaseProps<HTMLDivElement>,\n    Pick<HvPaginationProps, \"page\" | \"pages\" | \"canPrevious\" | \"canNext\"> {\n  showDots?: boolean;\n  classes?: ExtractNames<typeof useClasses>;\n  actions?: ReactNode;\n  onPreviousClick?: MouseEventHandler<HTMLButtonElement>;\n  onNextClick?: MouseEventHandler<HTMLButtonElement>;\n}\n\nexport const HvCarouselControls = (props: HvCarouselControlsProps) => {\n  const {\n    classes: classesProp,\n    className,\n    showDots,\n    page,\n    pages,\n    canPrevious,\n    canNext,\n    actions,\n    onPreviousClick,\n    onNextClick,\n  } = useDefaultProps(\"HvCarouselControls\", props);\n  const { classes, cx } = useClasses(classesProp, false);\n\n  const selectedIndex = page || 0;\n  const numSlides = pages;\n\n  return (\n    <div className={cx(classes.controls, className)}>\n      {showDots ? (\n        <div className={classes.dots}>\n          {Array.from(Array(numSlides)).map((el, index) => (\n            <span\n              key={`circle-${index}`}\n              className={cx(classes.dot, {\n                [classes.dotSelected]: index === selectedIndex,\n              })}\n            />\n          ))}\n        </div>\n      ) : (\n        <>\n          <HvButton\n            icon\n            disabled={!canPrevious}\n            aria-label=\"Backwards\"\n            onClick={onPreviousClick}\n          >\n            <Backwards iconSize=\"XS\" />\n          </HvButton>\n          <div className={classes.pageCounter}>\n            {`${selectedIndex + 1} / ${numSlides}`}\n          </div>\n          <HvButton\n            icon\n            disabled={!canNext}\n            aria-label=\"Forwards\"\n            onClick={onNextClick}\n          >\n            <Forwards iconSize=\"XS\" />\n          </HvButton>\n        </>\n      )}\n      {actions}\n    </div>\n  );\n};\n"],"names":["HvCarouselControls","props","classes","classesProp","className","showDots","page","pages","canPrevious","canNext","actions","onPreviousClick","onNextClick","useDefaultProps","cx","useClasses","selectedIndex","numSlides","controls","dots","Array","from","map","el","index","dot","dotSelected","pageCounter"],"mappings":";;;;;AAuBaA,MAAAA,qBAAqBA,CAACC,UAAmC;AAC9D,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,EAAAA,IACEC,gBAAgB,sBAAsBZ,KAAK;AACzC,QAAA;AAAA,IAAEC;AAAAA,IAASY;AAAAA,EAAAA,IAAOC,WAAWZ,aAAa,KAAK;AAErD,QAAMa,gBAAgBV,QAAQ;AAC9B,QAAMW,YAAYV;AAElB,8BACG,OAAI,EAAA,WAAWO,GAAGZ,QAAQgB,UAAUd,SAAS,GAC3CC,UAAAA;AAAAA,IACC,WAAA,oBAAC,SAAI,WAAWH,QAAQiB,MACrBC,UAAMC,MAAAA,KAAKD,MAAMH,SAAS,CAAC,EAAEK,IAAI,CAACC,IAAIC,UACrC,oBAAC,UAEC,WAAWV,GAAGZ,QAAQuB,KAAK;AAAA,MACzB,CAACvB,QAAQwB,WAAW,GAAGF,UAAUR;AAAAA,IAClC,CAAA,KAHK,UAASQ,KAAM,EAGlB,CAEN,EACH,CAAA,IAGE,qBAAA,UAAA,EAAA,UAAA;AAAA,MAAA,oBAAC,UACC,EAAA,MAAI,MACJ,UAAU,CAAChB,aACX,cAAW,aACX,SAASG,iBAET,UAAA,oBAAC,WAAU,EAAA,UAAS,KAAI,CAAA,GAC1B;AAAA,MACA,oBAAC,OAAI,EAAA,WAAWT,QAAQyB,aACpB,aAAEX,gBAAgB,CAAE,MAAKC,SAAU,GACvC,CAAA;AAAA,MACC,oBAAA,UAAA,EACC,MAAI,MACJ,UAAU,CAACR,SACX,cAAW,YACX,SAASG,aAET,UAAA,oBAAC,UAAS,EAAA,UAAS,KAAI,CAAA,GACzB;AAAA,IAAA,GACF;AAAA,IAEDF;AAAAA,EACH,EAAA,CAAA;AAEJ;"}

package/dist/esm/components/Carousel/CarouselThumbnails.js

@@ -25,7 +25,7 @@ const HvCarouselThumbnails = forwardRef((props, ref) => {
     width
   }, variant: "secondaryGhost", className: cx(classes.thumbnail, {
     [classes.thumbnailSelected]: i === selectedIndex
-  }), onClick: (event) => onThumbnailClick == null ? void 0 : onThumbnailClick(event, i), ...thumbnailProps, children: renderThumbnail == null ? void 0 : renderThumbnail(i) }, `thumbnail-${i}`)) }) });
+  }), onClick: (event) => onThumbnailClick?.(event, i), ...thumbnailProps, children: renderThumbnail?.(i) }, `thumbnail-${i}`)) }) });
 });
 export {
   HvCarouselThumbnails

package/dist/esm/components/Carousel/CarouselThumbnails.js.map

@@ -1 +1 @@
-{"version":3,"file":"CarouselThumbnails.js","sources":["../../../../src/components/Carousel/CarouselThumbnails.tsx"],"sourcesContent":["import { CSSProperties, MouseEvent, forwardRef } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvPaginationProps } from \"@core/components/Pagination\";\nimport { HvStack } from \"@core/components/Stack\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses } from \"./Carousel.styles\";\n\ninterface HvCarouselThumbnailsProps\n  extends HvBaseProps<HTMLDivElement, \"children\">,\n    Pick<HvPaginationProps, \"page\" | \"pages\" | \"canPrevious\" | \"canNext\"> {\n  width?: CSSProperties[\"width\"];\n  classes?: ExtractNames<typeof useClasses>;\n  onThumbnailClick?: (\n    event: MouseEvent<HTMLButtonElement>,\n    index: number\n  ) => void;\n  thumbnailProps?: Partial<HvButtonProps>;\n  showDots?: boolean;\n  renderThumbnail?: (index: number) => React.ReactNode;\n}\n\nexport const HvCarouselThumbnails = forwardRef<\n  HTMLDivElement,\n  HvCarouselThumbnailsProps\n>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    page,\n    pages,\n    width,\n    renderThumbnail,\n    onThumbnailClick,\n    thumbnailProps,\n    ...others\n  } = props;\n  const { classes, cx } = useClasses(classesProp);\n\n  const selectedIndex = page || 0;\n  const numSlides = pages;\n\n  return (\n    <div ref={ref} className={cx(classes.panel, className)} {...others}>\n      <HvStack direction=\"row\" spacing=\"xs\">\n        {Array.from(Array(numSlides)).map((doc, i) => (\n          <HvButton\n            icon\n            key={`thumbnail-${i}`}\n            style={{ width }}\n            variant=\"secondaryGhost\"\n            className={cx(classes.thumbnail, {\n              [classes.thumbnailSelected]: i === selectedIndex,\n            })}\n            onClick={(event) => onThumbnailClick?.(event, i)}\n            {...thumbnailProps}\n          >\n            {renderThumbnail?.(i)}\n          </HvButton>\n        ))}\n      </HvStack>\n    </div>\n  );\n});\n"],"names":["HvCarouselThumbnails","forwardRef","props","ref","classes","classesProp","className","page","pages","width","renderThumbnail","onThumbnailClick","thumbnailProps","others","cx","useClasses","selectedIndex","numSlides","panel","Array","from","map","doc","i","thumbnail","thumbnailSelected","event"],"mappings":";;;;;AAwBO,MAAMA,uBAAuBC,WAGlC,CAACC,OAAOC,QAAQ;AACV,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EACDX,IAAAA;AACE,QAAA;AAAA,IAAEE;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,WAAWV,WAAW;AAE9C,QAAMW,gBAAgBT,QAAQ;AAC9B,QAAMU,YAAYT;AAElB,SACG,oBAAA,OAAA,EAAI,KAAU,WAAWM,GAAGV,QAAQc,OAAOZ,SAAS,GAAOO,GAAAA,QAC1D,UAAA,oBAAC,WAAQ,WAAU,OAAM,SAAQ,MAC9BM,UAAMC,MAAAA,KAAKD,MAAMF,SAAS,CAAC,EAAEI,IAAI,CAACC,KAAKC,MACtC,oBAAC,UACC,EAAA,MAAI,MAEJ,OAAO;AAAA,IAAEd;AAAAA,EAAAA,GACT,SAAQ,kBACR,WAAWK,GAAGV,QAAQoB,WAAW;AAAA,IAC/B,CAACpB,QAAQqB,iBAAiB,GAAGF,MAAMP;AAAAA,EAAAA,CACpC,GACD,SAAUU,WAAUf,qDAAmBe,OAAOH,IAC9C,GAAIX,gBAEHF,UAAAA,mDAAkBa,GATb,GAAA,aAAYA,CAAE,EAUtB,CACD,GACH,EACF,CAAA;AAEJ,CAAC;"}
+{"version":3,"file":"CarouselThumbnails.js","sources":["../../../../src/components/Carousel/CarouselThumbnails.tsx"],"sourcesContent":["import { CSSProperties, MouseEvent, forwardRef } from \"react\";\n\nimport { HvBaseProps } from \"@core/types/generic\";\nimport { HvPaginationProps } from \"@core/components/Pagination\";\nimport { HvStack } from \"@core/components/Stack\";\nimport { HvButton, HvButtonProps } from \"@core/components/Button\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { useClasses } from \"./Carousel.styles\";\n\ninterface HvCarouselThumbnailsProps\n  extends HvBaseProps<HTMLDivElement, \"children\">,\n    Pick<HvPaginationProps, \"page\" | \"pages\" | \"canPrevious\" | \"canNext\"> {\n  width?: CSSProperties[\"width\"];\n  classes?: ExtractNames<typeof useClasses>;\n  onThumbnailClick?: (\n    event: MouseEvent<HTMLButtonElement>,\n    index: number\n  ) => void;\n  thumbnailProps?: Partial<HvButtonProps>;\n  showDots?: boolean;\n  renderThumbnail?: (index: number) => React.ReactNode;\n}\n\nexport const HvCarouselThumbnails = forwardRef<\n  HTMLDivElement,\n  HvCarouselThumbnailsProps\n>((props, ref) => {\n  const {\n    classes: classesProp,\n    className,\n    page,\n    pages,\n    width,\n    renderThumbnail,\n    onThumbnailClick,\n    thumbnailProps,\n    ...others\n  } = props;\n  const { classes, cx } = useClasses(classesProp);\n\n  const selectedIndex = page || 0;\n  const numSlides = pages;\n\n  return (\n    <div ref={ref} className={cx(classes.panel, className)} {...others}>\n      <HvStack direction=\"row\" spacing=\"xs\">\n        {Array.from(Array(numSlides)).map((doc, i) => (\n          <HvButton\n            icon\n            key={`thumbnail-${i}`}\n            style={{ width }}\n            variant=\"secondaryGhost\"\n            className={cx(classes.thumbnail, {\n              [classes.thumbnailSelected]: i === selectedIndex,\n            })}\n            onClick={(event) => onThumbnailClick?.(event, i)}\n            {...thumbnailProps}\n          >\n            {renderThumbnail?.(i)}\n          </HvButton>\n        ))}\n      </HvStack>\n    </div>\n  );\n});\n"],"names":["HvCarouselThumbnails","forwardRef","props","ref","classes","classesProp","className","page","pages","width","renderThumbnail","onThumbnailClick","thumbnailProps","others","cx","useClasses","selectedIndex","numSlides","panel","Array","from","map","doc","i","thumbnail","thumbnailSelected","event"],"mappings":";;;;;AAwBO,MAAMA,uBAAuBC,WAGlC,CAACC,OAAOC,QAAQ;AACV,QAAA;AAAA,IACJC,SAASC;AAAAA,IACTC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACAC;AAAAA,IACA,GAAGC;AAAAA,EACDX,IAAAA;AACE,QAAA;AAAA,IAAEE;AAAAA,IAASU;AAAAA,EAAAA,IAAOC,WAAWV,WAAW;AAE9C,QAAMW,gBAAgBT,QAAQ;AAC9B,QAAMU,YAAYT;AAElB,SACG,oBAAA,OAAA,EAAI,KAAU,WAAWM,GAAGV,QAAQc,OAAOZ,SAAS,GAAOO,GAAAA,QAC1D,UAAA,oBAAC,WAAQ,WAAU,OAAM,SAAQ,MAC9BM,UAAMC,MAAAA,KAAKD,MAAMF,SAAS,CAAC,EAAEI,IAAI,CAACC,KAAKC,MACtC,oBAAC,UACC,EAAA,MAAI,MAEJ,OAAO;AAAA,IAAEd;AAAAA,EAAAA,GACT,SAAQ,kBACR,WAAWK,GAAGV,QAAQoB,WAAW;AAAA,IAC/B,CAACpB,QAAQqB,iBAAiB,GAAGF,MAAMP;AAAAA,EAAAA,CACpC,GACD,SAAUU,WAAUf,mBAAmBe,OAAOH,CAAC,GAC/C,GAAIX,gBAEHF,UAAAA,kBAAkBa,CAAC,EATd,GAAA,aAAYA,CAAE,EAUtB,CACD,GACH,EACF,CAAA;AAEJ,CAAC;"}

package/dist/esm/components/CheckBox/CheckBox.js

@@ -60,15 +60,15 @@ const HvCheckBox = forwardRef((props, ref) => {
       }
       return newChecked;
     });
-    onChange == null ? void 0 : onChange(event, newChecked, value);
+    onChange?.(event, newChecked, value);
   }, [onChange, required, setIsChecked, setIsIndeterminate, setValidationState, value]);
   const onFocusVisibleCallback = (event) => {
     setFocusVisible(true);
-    onFocusVisible == null ? void 0 : onFocusVisible(event);
+    onFocusVisible?.(event);
   };
   const onBlurCallback = (event) => {
     setFocusVisible(false);
-    onBlur == null ? void 0 : onBlur(event);
+    onBlur?.(event);
   };
   const canShowError = ariaErrorMessage == null && (status !== void 0 && statusMessage !== void 0 || status === void 0 && required);
   const hasLabel = label != null;

package/dist/esm/components/CheckBox/CheckBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckBox.js","sources":["../../../../src/components/CheckBox/CheckBox.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvBaseCheckBox,\n  HvBaseCheckBoxProps,\n} from \"@core/components/BaseCheckBox\";\nimport {\n  HvLabelProps,\n  HvFormStatus,\n  HvWarningText,\n  isInvalid,\n  HvFormElement,\n  HvLabel,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./CheckBox.styles\";\n\nexport { staticClasses as checkBoxClasses };\n\nexport type HvCheckBoxClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCheckBoxProps extends Omit<HvBaseCheckBoxProps, \"classes\"> {\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  /**\n   * Properties passed on to the label element.\n   */\n  labelProps?: HvLabelProps;\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 the state.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when the validation status is \"invalid\".\n   *\n   * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n   */\n  statusMessage?: React.ReactNode;\n  /**\n   * A Jss Object used to override or extend the styles applied to the checkbox.\n   */\n  classes?: HvCheckBoxClasses;\n}\n\n/**\n * A Checkbox is a mechanism that allows the user to select one or more options.\n *\n * Usually used in a Checkbox Group to present the user with a range of options from\n * which the user <b>may select any number of options</b> to complete their task.\n *\n * It can also be used individually to represent the toggle of a single option, when\n * the Toggle Switch and Toggle Button aren't more appropriate.\n */\nexport const HvCheckBox = forwardRef<HTMLButtonElement, HvCheckBoxProps>(\n  (props, ref) => {\n    const {\n      id,\n      classes: classesProp,\n      className,\n      name,\n      checked,\n      status,\n      indeterminate,\n      statusMessage,\n      label,\n      labelProps,\n      inputProps,\n      value = \"on\",\n      required = false,\n      readOnly = false,\n      disabled = false,\n      semantic = false,\n      defaultChecked = false,\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-errormessage\": ariaErrorMessage,\n      onChange,\n      onFocusVisible,\n      onBlur,\n      ...others\n    } = useDefaultProps(\"HvCheckBox\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    const elementId = useUniqueId(id, \"hvcheckbox\");\n\n    const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n    const [validationState, setValidationState] = useControlled(\n      status,\n      \"standBy\"\n    );\n\n    const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n    const [isChecked, setIsChecked] = useControlled(\n      checked,\n      Boolean(defaultChecked)\n    );\n\n    const [isIndeterminate, setIsIndeterminate] = useControlled(\n      checked !== undefined ? indeterminate : undefined,\n      Boolean(indeterminate)\n    );\n\n    const isStateInvalid = isInvalid(validationState);\n\n    const onChangeCallback = useCallback<\n      NonNullable<HvBaseCheckBoxProps[\"onChange\"]>\n    >(\n      (event, newChecked) => {\n        setIsChecked(() => {\n          // This will only run if uncontrolled\n          setIsIndeterminate(false);\n\n          if (required && !newChecked) {\n            setValidationState(\"invalid\");\n          } else {\n            setValidationState(\"valid\");\n          }\n\n          return newChecked;\n        });\n\n        onChange?.(event, newChecked, value);\n      },\n      [\n        onChange,\n        required,\n        setIsChecked,\n        setIsIndeterminate,\n        setValidationState,\n        value,\n      ]\n    );\n\n    const onFocusVisibleCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n      setFocusVisible(true);\n      onFocusVisible?.(event);\n    };\n\n    const onBlurCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n      setFocusVisible(false);\n      onBlur?.(event);\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 required is true\n    const canShowError =\n      ariaErrorMessage == null &&\n      ((status !== undefined && statusMessage !== undefined) ||\n        (status === undefined && required));\n\n    const hasLabel = label != null;\n\n    let errorMessageId;\n    if (isStateInvalid) {\n      errorMessageId = canShowError\n        ? setId(elementId, \"error\")\n        : ariaErrorMessage;\n    }\n\n    const checkbox = (\n      <HvBaseCheckBox\n        ref={ref}\n        id={hasLabel ? setId(elementId, \"input\") : setId(id, \"input\")}\n        name={name}\n        className={cx(classes.checkbox, {\n          [classes.invalidCheckbox]: isStateInvalid,\n        })}\n        disabled={disabled}\n        readOnly={readOnly}\n        required={required}\n        onChange={onChangeCallback}\n        value={value}\n        checked={isChecked}\n        indeterminate={isIndeterminate}\n        semantic={semantic}\n        inputProps={{\n          \"aria-invalid\": isStateInvalid ? true : undefined,\n          \"aria-errormessage\": errorMessageId,\n          \"aria-label\": ariaLabel,\n          \"aria-labelledby\": ariaLabelledBy,\n          \"aria-describedby\": ariaDescribedBy,\n          ...inputProps,\n        }}\n        onFocusVisible={onFocusVisibleCallback}\n        onBlur={onBlurCallback}\n        {...others}\n      />\n    );\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          { [classes.focusVisible]: !!(focusVisible && label) },\n          className\n        )}\n      >\n        {hasLabel ? (\n          <div\n            className={cx(classes.container, {\n              [classes.disabled]: disabled,\n              [classes.invalidContainer]: isStateInvalid,\n            })}\n          >\n            {checkbox}\n            <HvLabel\n              id={setId(elementId, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n              className={classes.label}\n              {...labelProps}\n            />\n          </div>\n        ) : (\n          checkbox\n        )}\n        {canShowError && (\n          <HvWarningText\n            id={setId(elementId, \"error\")}\n            disableAdornment={!hasLabel}\n            hideText={!hasLabel}\n            disableBorder\n          >\n            {validationMessage}\n          </HvWarningText>\n        )}\n      </HvFormElement>\n    );\n  }\n);\n"],"names":["HvCheckBox","forwardRef","props","ref","id","classes","classesProp","className","name","checked","status","indeterminate","statusMessage","label","labelProps","inputProps","value","required","readOnly","disabled","semantic","defaultChecked","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaErrorMessage","onChange","onFocusVisible","onBlur","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","focusVisible","setFocusVisible","useState","validationState","setValidationState","useControlled","validationMessage","isChecked","setIsChecked","Boolean","isIndeterminate","setIsIndeterminate","undefined","isStateInvalid","isInvalid","onChangeCallback","useCallback","event","newChecked","onFocusVisibleCallback","onBlurCallback","canShowError","hasLabel","errorMessageId","setId","checkbox","invalidCheckbox","root","container","invalidContainer"],"mappings":"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"}
+{"version":3,"file":"CheckBox.js","sources":["../../../../src/components/CheckBox/CheckBox.tsx"],"sourcesContent":["import { forwardRef, useCallback, useState } from \"react\";\n\nimport { useDefaultProps } from \"@core/hooks/useDefaultProps\";\nimport { useUniqueId } from \"@core/hooks/useUniqueId\";\nimport { useControlled } from \"@core/hooks/useControlled\";\nimport { setId } from \"@core/utils/setId\";\nimport {\n  HvBaseCheckBox,\n  HvBaseCheckBoxProps,\n} from \"@core/components/BaseCheckBox\";\nimport {\n  HvLabelProps,\n  HvFormStatus,\n  HvWarningText,\n  isInvalid,\n  HvFormElement,\n  HvLabel,\n} from \"@core/components/Forms\";\nimport { ExtractNames } from \"@core/utils/classes\";\n\nimport { staticClasses, useClasses } from \"./CheckBox.styles\";\n\nexport { staticClasses as checkBoxClasses };\n\nexport type HvCheckBoxClasses = ExtractNames<typeof useClasses>;\n\nexport interface HvCheckBoxProps extends Omit<HvBaseCheckBoxProps, \"classes\"> {\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  /**\n   * Properties passed on to the label element.\n   */\n  labelProps?: HvLabelProps;\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 the state.\n   */\n  status?: HvFormStatus;\n  /**\n   * The error message to show when the validation status is \"invalid\".\n   *\n   * Defaults to \"Required\" when the status is uncontrolled and no `aria-errormessage` is provided.\n   */\n  statusMessage?: React.ReactNode;\n  /**\n   * A Jss Object used to override or extend the styles applied to the checkbox.\n   */\n  classes?: HvCheckBoxClasses;\n}\n\n/**\n * A Checkbox is a mechanism that allows the user to select one or more options.\n *\n * Usually used in a Checkbox Group to present the user with a range of options from\n * which the user <b>may select any number of options</b> to complete their task.\n *\n * It can also be used individually to represent the toggle of a single option, when\n * the Toggle Switch and Toggle Button aren't more appropriate.\n */\nexport const HvCheckBox = forwardRef<HTMLButtonElement, HvCheckBoxProps>(\n  (props, ref) => {\n    const {\n      id,\n      classes: classesProp,\n      className,\n      name,\n      checked,\n      status,\n      indeterminate,\n      statusMessage,\n      label,\n      labelProps,\n      inputProps,\n      value = \"on\",\n      required = false,\n      readOnly = false,\n      disabled = false,\n      semantic = false,\n      defaultChecked = false,\n      \"aria-label\": ariaLabel,\n      \"aria-labelledby\": ariaLabelledBy,\n      \"aria-describedby\": ariaDescribedBy,\n      \"aria-errormessage\": ariaErrorMessage,\n      onChange,\n      onFocusVisible,\n      onBlur,\n      ...others\n    } = useDefaultProps(\"HvCheckBox\", props);\n\n    const { classes, cx } = useClasses(classesProp);\n\n    const elementId = useUniqueId(id, \"hvcheckbox\");\n\n    const [focusVisible, setFocusVisible] = useState<boolean>(false);\n\n    const [validationState, setValidationState] = useControlled(\n      status,\n      \"standBy\"\n    );\n\n    const [validationMessage] = useControlled(statusMessage, \"Required\");\n\n    const [isChecked, setIsChecked] = useControlled(\n      checked,\n      Boolean(defaultChecked)\n    );\n\n    const [isIndeterminate, setIsIndeterminate] = useControlled(\n      checked !== undefined ? indeterminate : undefined,\n      Boolean(indeterminate)\n    );\n\n    const isStateInvalid = isInvalid(validationState);\n\n    const onChangeCallback = useCallback<\n      NonNullable<HvBaseCheckBoxProps[\"onChange\"]>\n    >(\n      (event, newChecked) => {\n        setIsChecked(() => {\n          // This will only run if uncontrolled\n          setIsIndeterminate(false);\n\n          if (required && !newChecked) {\n            setValidationState(\"invalid\");\n          } else {\n            setValidationState(\"valid\");\n          }\n\n          return newChecked;\n        });\n\n        onChange?.(event, newChecked, value);\n      },\n      [\n        onChange,\n        required,\n        setIsChecked,\n        setIsIndeterminate,\n        setValidationState,\n        value,\n      ]\n    );\n\n    const onFocusVisibleCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n      setFocusVisible(true);\n      onFocusVisible?.(event);\n    };\n\n    const onBlurCallback: HvBaseCheckBoxProps[\"onBlur\"] = (event) => {\n      setFocusVisible(false);\n      onBlur?.(event);\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 required is true\n    const canShowError =\n      ariaErrorMessage == null &&\n      ((status !== undefined && statusMessage !== undefined) ||\n        (status === undefined && required));\n\n    const hasLabel = label != null;\n\n    let errorMessageId;\n    if (isStateInvalid) {\n      errorMessageId = canShowError\n        ? setId(elementId, \"error\")\n        : ariaErrorMessage;\n    }\n\n    const checkbox = (\n      <HvBaseCheckBox\n        ref={ref}\n        id={hasLabel ? setId(elementId, \"input\") : setId(id, \"input\")}\n        name={name}\n        className={cx(classes.checkbox, {\n          [classes.invalidCheckbox]: isStateInvalid,\n        })}\n        disabled={disabled}\n        readOnly={readOnly}\n        required={required}\n        onChange={onChangeCallback}\n        value={value}\n        checked={isChecked}\n        indeterminate={isIndeterminate}\n        semantic={semantic}\n        inputProps={{\n          \"aria-invalid\": isStateInvalid ? true : undefined,\n          \"aria-errormessage\": errorMessageId,\n          \"aria-label\": ariaLabel,\n          \"aria-labelledby\": ariaLabelledBy,\n          \"aria-describedby\": ariaDescribedBy,\n          ...inputProps,\n        }}\n        onFocusVisible={onFocusVisibleCallback}\n        onBlur={onBlurCallback}\n        {...others}\n      />\n    );\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          { [classes.focusVisible]: !!(focusVisible && label) },\n          className\n        )}\n      >\n        {hasLabel ? (\n          <div\n            className={cx(classes.container, {\n              [classes.disabled]: disabled,\n              [classes.invalidContainer]: isStateInvalid,\n            })}\n          >\n            {checkbox}\n            <HvLabel\n              id={setId(elementId, \"label\")}\n              htmlFor={setId(elementId, \"input\")}\n              label={label}\n              className={classes.label}\n              {...labelProps}\n            />\n          </div>\n        ) : (\n          checkbox\n        )}\n        {canShowError && (\n          <HvWarningText\n            id={setId(elementId, \"error\")}\n            disableAdornment={!hasLabel}\n            hideText={!hasLabel}\n            disableBorder\n          >\n            {validationMessage}\n          </HvWarningText>\n        )}\n      </HvFormElement>\n    );\n  }\n);\n"],"names":["HvCheckBox","forwardRef","props","ref","id","classes","classesProp","className","name","checked","status","indeterminate","statusMessage","label","labelProps","inputProps","value","required","readOnly","disabled","semantic","defaultChecked","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaErrorMessage","onChange","onFocusVisible","onBlur","others","useDefaultProps","cx","useClasses","elementId","useUniqueId","focusVisible","setFocusVisible","useState","validationState","setValidationState","useControlled","validationMessage","isChecked","setIsChecked","Boolean","isIndeterminate","setIsIndeterminate","undefined","isStateInvalid","isInvalid","onChangeCallback","useCallback","event","newChecked","onFocusVisibleCallback","onBlurCallback","canShowError","hasLabel","errorMessageId","setId","checkbox","invalidCheckbox","root","container","invalidContainer"],"mappings":"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"}

package/dist/esm/components/CheckBoxGroup/CheckBoxGroup.js

@@ -23,10 +23,9 @@ const computeSelectAllState = (selected, total) => {
 };
 const getValueFromSelectedChildren = (children) => {
   const selectedValues = Children.toArray(children).map((child) => {
-    var _a, _b, _c, _d;
-    const childIsControlled = ((_a = child == null ? void 0 : child.props) == null ? void 0 : _a.checked) !== void 0;
-    const childIsSelected = childIsControlled ? (_b = child == null ? void 0 : child.props) == null ? void 0 : _b.checked : (_c = child == null ? void 0 : child.props) == null ? void 0 : _c.defaultChecked;
-    return childIsSelected ? (_d = child == null ? void 0 : child.props) == null ? void 0 : _d.value : void 0;
+    const childIsControlled = child?.props?.checked !== void 0;
+    const childIsSelected = childIsControlled ? child?.props?.checked : child?.props?.defaultChecked;
+    return childIsSelected ? child?.props?.value : void 0;
   }).filter((v) => v !== void 0);
   return selectedValues;
 };
@@ -75,8 +74,7 @@ const HvCheckBoxGroup = forwardRef((props, ref) => {
     const childSelectedState = [];
     let childSelectedCounter = 0;
     Children.toArray(children).forEach((child, i) => {
-      var _a;
-      const childValue = (_a = child == null ? void 0 : child.props) == null ? void 0 : _a.value;
+      const childValue = child?.props?.value;
       const childIsSelected = value.indexOf(childValue) !== -1;
       childValues[i] = childValue;
       childSelectedState[i] = childIsSelected;
@@ -89,8 +87,8 @@ const HvCheckBoxGroup = forwardRef((props, ref) => {
   const selectAllState = computeSelectAllState(value.length, selectedState.length);
   const onChildChangeInterceptor = useCallback((index, childOnChange, event, isChecked) => {
     const newValue = multiSelectionEventHandler(event, index, selectionAnchor, allValues, selectedState, isChecked);
-    childOnChange == null ? void 0 : childOnChange(event, isChecked);
-    onChange == null ? void 0 : onChange(event, newValue);
+    childOnChange?.(event, isChecked);
+    onChange?.(event, newValue);
     setValue(() => {
       if (required && newValue.length === 0) {
         setValidationState("invalid");
@@ -102,17 +100,13 @@ const HvCheckBoxGroup = forwardRef((props, ref) => {
   }, [allValues, onChange, required, selectedState, setValidationState, setValue]);
   const modifiedChildren = useMemo(() => {
     return Children.map(children, (child, i) => {
-      var _a, _b, _c;
       const childIsSelected = selectedState[i];
       return cloneElement(child, {
         checked: childIsSelected,
-        name: ((_a = child == null ? void 0 : child.props) == null ? void 0 : _a.name) || name,
-        onChange: (event, isChecked) => {
-          var _a2;
-          return onChildChangeInterceptor(i, (_a2 = child == null ? void 0 : child.props) == null ? void 0 : _a2.onChange, event, isChecked);
-        },
-        disabled: disabled || ((_b = child == null ? void 0 : child.props) == null ? void 0 : _b.disabled),
-        readOnly: readOnly || ((_c = child == null ? void 0 : child.props) == null ? void 0 : _c.readOnly)
+        name: child?.props?.name || name,
+        onChange: (event, isChecked) => onChildChangeInterceptor(i, child?.props?.onChange, event, isChecked),
+        disabled: disabled || child?.props?.disabled,
+        readOnly: readOnly || child?.props?.readOnly
       });
     });
   }, [children, disabled, name, onChildChangeInterceptor, readOnly, selectedState]);
@@ -123,7 +117,7 @@ const HvCheckBoxGroup = forwardRef((props, ref) => {
     } else {
       newValue = [];
     }
-    onChange == null ? void 0 : onChange(event, newValue);
+    onChange?.(event, newValue);
     setValue(() => {
       if (required && newValue.length === 0) {
         setValidationState("invalid");