se-design 1.0.90-dev.0 → 1.0.91-r-dev.1

package/dist/index51.js.map

@@ -1 +1 @@
-{"version":3,"file":"index51.js","sources":["../src/components/DatePicker/index.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport { Button } from '../Button';\nimport { Icon } from '../Icon';\nimport { Dropdown } from '../Dropdown';\nimport { useDatePickerA11y, formatDateId, getCellAriaLabel } from './useDatePickerA11y';\n\nimport './style.scss';\n\nexport interface DateRange {\n  startDate: Date | null;\n  endDate: Date | null;\n}\n\nexport interface DatePickerProps {\n  title?: string;\n  isOpen?: boolean;\n  initialStartDate?: Date;\n  initialEndDate?: Date;\n  onApply?: (dateRange: DateRange) => void;\n  onClose?: () => void;\n  shouldAllowFutureDateSelection?: boolean;\n  maxDays?: number;\n  disablePastDates?: boolean;\n  singleDateSelection?: boolean;\n  minYearOption?: number;\n  showQuickActions?: boolean;\n  className?: string;\n  automationId?: string;\n  showHeader?: boolean;\n  showSingleMonth?: boolean;\n  labels?: {\n    title?: string;\n    clear?: string;\n    apply?: string;\n  };\n}\n\nconst weekDays = ['S', 'M', 'T', 'W', 'T', 'F', 'S'];\nconst weekDaysFull = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];\nconst quickActions = ['Today', 'Yesterday', 'This Week', 'Last Week', 'This Month', 'Last Month'];\n\nconst months = [\n  { value: 'january', label: 'January' },\n  { value: 'february', label: 'February' },\n  { value: 'march', label: 'March' },\n  { value: 'april', label: 'April' },\n  { value: 'may', label: 'May' },\n  { value: 'june', label: 'June' },\n  { value: 'july', label: 'July' },\n  { value: 'august', label: 'August' },\n  { value: 'september', label: 'September' },\n  { value: 'october', label: 'October' },\n  { value: 'november', label: 'November' },\n  { value: 'december', label: 'December' }\n];\n\n// Pure helpers — no component state dependency\nconst getDaysInMonth = (year: number, month: number) => new Date(year, month + 1, 0).getDate();\nconst getFirstDayOfMonth = (year: number, month: number) => new Date(year, month, 1).getDay();\n\n\nexport const DatePicker: React.FC<DatePickerProps> = ({\n  title = 'Select modified date',\n  // isOpen = true,\n  showHeader = true,\n  initialStartDate,\n  initialEndDate,\n  onApply = () => {},\n  onClose,\n  shouldAllowFutureDateSelection = false,\n  maxDays,\n  disablePastDates = false,\n  singleDateSelection = false,\n  minYearOption,\n  showQuickActions = false,\n  showSingleMonth = false,\n  className = '',\n  automationId = 'datepicker',\n  labels = {\n    clear: 'Clear',\n    apply: 'Apply'\n  }\n}) => {\n  const getDefaultDateRange = (): DateRange => {\n    // If initial start and end dates are provided, use them\n    if (initialStartDate && initialEndDate) {\n      return {\n        startDate: initialStartDate,\n        endDate: initialEndDate\n      };\n    }\n\n    // If no initial dates are provided, use today's date\n    const endDate = new Date();\n    endDate.setHours(23, 59, 59, 999); // End of today\n\n    const startDate = new Date();\n    startDate.setHours(0, 0, 0, 0); // Start of today\n\n    return { startDate, endDate };\n  };\n\n  const getDefaultMonths = (): [Date, Date] => {\n    const today = new Date();\n    const lastMonth = new Date();\n\n    // Set both to first day of their respective months\n    today.setDate(1);\n    lastMonth.setDate(1);\n\n    if (!showSingleMonth) {\n      lastMonth.setMonth(lastMonth.getMonth() - 1);\n    }\n\n    today.setHours(0, 0, 0, 0);\n    lastMonth.setHours(0, 0, 0, 0);\n\n    return [lastMonth, today];\n  };\n\n  const [selectedRange, setSelectedRange] = useState<DateRange>(getDefaultDateRange);\n  const [defaultMonths, _] = useState(getDefaultMonths);\n  const [leftMonth, setLeftMonth] = useState(() => defaultMonths[0]);\n  const [rightMonth, setRightMonth] = useState(() => defaultMonths[1]);\n\n  const ensureDateInCorrectOrder = (leftDate: Date, rightDate: Date): [Date, Date] => {\n    if (leftDate.getTime() > rightDate.getTime()) {\n      return [rightDate, leftDate];\n    }\n    return [leftDate, rightDate];\n  };\n\n  const handleMonthChange = (newDate: Date, isLeftCalendar: boolean) => {\n    if (showSingleMonth) {\n      setLeftMonth(newDate);\n      return;\n    }\n    if (isLeftCalendar) {\n      const [newLeft, newRight] = ensureDateInCorrectOrder(newDate, rightMonth);\n      setLeftMonth(newLeft);\n      if (newRight !== rightMonth) setRightMonth(newRight);\n    } else {\n      const [newLeft, newRight] = ensureDateInCorrectOrder(leftMonth, newDate);\n      if (newLeft !== leftMonth) setLeftMonth(newLeft);\n      setRightMonth(newRight);\n    }\n  };\n\n  const {\n    getGridCellProps,\n    getLeftContainerProps,\n    getRightContainerProps\n  } = useDatePickerA11y({\n    leftMonth,\n    rightMonth,\n    showSingleMonth,\n    selectedRange,\n    onMonthChange: handleMonthChange\n  });\n\n  const generateCalendarDays = (year: number, month: number) => {\n    const daysInMonth = getDaysInMonth(year, month);\n    const firstDay = getFirstDayOfMonth(year, month);\n    const days = [];\n\n    // Add empty cells for days before the first day of the month\n    for (let i = 0; i < firstDay; i++) {\n      days.push(null);\n    }\n\n    // Add the days of the month\n    for (let day = 1; day <= daysInMonth; day++) {\n      const date = new Date(year, month, day);\n      date.setHours(0, 0, 0, 0); // Normalize to start of day for consistent comparisons\n      days.push(date);\n    }\n\n    return days;\n  };\n\n  const isSameDay = (date1: Date, date2: Date): boolean => {\n    return (\n      date1.getDate() === date2.getDate() &&\n      date1.getMonth() === date2.getMonth() &&\n      date1.getFullYear() === date2.getFullYear()\n    );\n  };\n\n  const isDateInRange = (date: Date) => {\n    if (!selectedRange.startDate || !selectedRange.endDate) return false;\n\n    const compareDate = new Date(date);\n    compareDate.setHours(12, 0, 0, 0); // Noon to avoid any timezone issues\n\n    const startDate = new Date(selectedRange.startDate);\n    startDate.setHours(0, 0, 0, 0);\n\n    const endDate = new Date(selectedRange.endDate);\n    endDate.setHours(23, 59, 59, 999);\n\n    return compareDate >= startDate && compareDate <= endDate;\n  };\n\n  const isToday = (date: Date) => {\n    const today = new Date();\n    return (\n      date.getDate() === today.getDate() &&\n      date.getMonth() === today.getMonth() &&\n      date.getFullYear() === today.getFullYear()\n    );\n  };\n\n  const isDateDisabled = (date: Date | null) => {\n    if (!date) return true;\n\n    const today = new Date();\n    today.setHours(0, 0, 0, 0);\n    const dateToCheck = new Date(date);\n    dateToCheck.setHours(0, 0, 0, 0);\n\n    // If disablePastDates is true, disable dates before today\n    if (disablePastDates && dateToCheck < today) {\n      return true;\n    }\n\n    // If maxDays is specified, disable dates after maxDays from today\n    if (maxDays !== undefined && maxDays !== null) {\n      const maxDate = new Date(today);\n      maxDate.setDate(maxDate.getDate() + maxDays);\n      maxDate.setHours(0, 0, 0, 0); // Normalize to start of day\n      // Disable all dates after maxDays (dates strictly after maxDate should be disabled)\n      // Dates up to and including maxDate (today + maxDays) are allowed\n      if (dateToCheck > maxDate) {\n        return true;\n      }\n      // If maxDays is set, we're done checking - don't check shouldAllowFutureDateSelection\n      return false;\n    }\n\n    // If shouldAllowFutureDateSelection is false and maxDays is not specified, disable dates after today\n    if (!shouldAllowFutureDateSelection) {\n      return dateToCheck > today;\n    }\n\n    return false;\n  };\n\n  const handleDateClick = (date: Date) => {\n    if (isDateDisabled(date)) return;\n\n    const clickedDate = new Date(date);\n    clickedDate.setHours(12, 0, 0, 0); // Set to noon to avoid timezone issues\n\n    // Single date selection mode - immediately apply on click\n    if (singleDateSelection) {\n      setSelectedRange({ startDate: clickedDate, endDate: clickedDate });\n      onApply({ startDate: clickedDate, endDate: clickedDate });\n      onClose?.();\n      return;\n    }\n\n    // Range selection mode (original behavior)\n    if (!selectedRange.startDate || selectedRange.endDate) {\n      // No dates selected yet, or both dates are selected - start new selection\n      setSelectedRange({ startDate: clickedDate, endDate: null });\n    } else {\n      // Only start date is selected, set end date\n      const currentStart = new Date(selectedRange.startDate);\n      currentStart.setHours(12, 0, 0, 0);\n\n      const endDate = clickedDate > currentStart ? clickedDate : currentStart;\n      const startDate = clickedDate > currentStart ? currentStart : clickedDate;\n\n      setSelectedRange({ startDate, endDate });\n    }\n  };\n\n  const handleMonthNavigation = (date: Date, increment: boolean) => {\n    const newDate = new Date(date);\n    newDate.setMonth(newDate.getMonth() + (increment ? 1 : -1));\n    return newDate;\n  };\n\n  const isStartDate = (date: Date): boolean => {\n    if (!selectedRange?.startDate) return false;\n    return isSameDay(date, selectedRange.startDate);\n  };\n\n  const isEndDate = (date: Date): boolean => {\n    if (!selectedRange?.endDate) return false;\n    return isSameDay(date, selectedRange?.endDate);\n  };\n\n  const isSameStartAndEndDate = (date: Date): boolean => {\n    if (!selectedRange.startDate || !selectedRange.endDate) return false;\n    return isSameDay(selectedRange.startDate, selectedRange.endDate) && isSameDay(date, selectedRange.startDate);\n  };\n\n  const getYearOptions = (currentYear: number, calendarYear: number) => {\n    const startYear = minYearOption || currentYear - 10;\n    let endYear = shouldAllowFutureDateSelection ? currentYear + 10 : currentYear;\n\n    // If maxDays is specified, calculate the maximum year\n    if (maxDays) {\n      const today = new Date();\n      const maxDate = new Date(today);\n      maxDate.setDate(maxDate.getDate() + maxDays);\n      const maxYear = maxDate.getFullYear();\n      // Use the smaller of the two limits\n      endYear = Math.min(endYear, maxYear);\n    }\n\n    endYear = Math.max(endYear, calendarYear);\n\n    const yearCount = endYear - startYear + 1;\n\n    return Array.from({ length: yearCount }, (_, i) => ({\n      value: startYear + i,\n      label: (startYear + i).toString()\n    })).filter((year) => {\n      if (year.value === calendarYear) {\n        return true;\n      }\n      if (!shouldAllowFutureDateSelection && year.value > currentYear) {\n        return false;\n      }\n      // If maxDays is specified, filter out years beyond maxDate\n      if (maxDays) {\n        const today = new Date();\n        const maxDate = new Date(today);\n        maxDate.setDate(maxDate.getDate() + maxDays);\n        return year.value <= maxDate.getFullYear();\n      }\n      return true;\n    });\n  };\n\n  const handleClear = () => {\n    const today = new Date();\n    const startDate = new Date();\n\n    // Set start date to beginning of today\n    startDate.setHours(0, 0, 0, 0);\n\n    // Set end date to end of today\n    today.setHours(23, 59, 59, 999);\n\n    const defaultRange = { startDate, endDate: today };\n    setSelectedRange(defaultRange);\n  };\n\n  const getStartOfDay = (date: Date) => {\n    const newDate = new Date(date);\n    newDate.setHours(0, 0, 0, 0);\n    return newDate;\n  };\n\n  const getEndOfDay = (date: Date) => {\n    const newDate = new Date(date);\n    newDate.setHours(23, 59, 59, 999);\n    return newDate;\n  };\n\n  const handleQuickAction = (action: string) => {\n    const today = new Date();\n    let startDate = new Date();\n    let endDate = new Date();\n\n    switch (action) {\n      case 'Today':\n        startDate = getStartOfDay(today);\n        endDate = getEndOfDay(today);\n        break;\n      case 'Yesterday':\n        startDate = getStartOfDay(new Date(today.setDate(today.getDate() - 1)));\n        endDate = getEndOfDay(new Date(today));\n        break;\n      case 'This Week':\n        const firstDayOfWeek = new Date(today.setDate(today.getDate() - today.getDay()));\n        startDate = getStartOfDay(firstDayOfWeek);\n        endDate = getEndOfDay(new Date());\n        break;\n      case 'Last Week':\n        const lastWeekStart = new Date(today.setDate(today.getDate() - today.getDay() - 7));\n        const lastWeekEnd = new Date(today.setDate(lastWeekStart.getDate() + 6));\n        startDate = getStartOfDay(lastWeekStart);\n        endDate = getEndOfDay(lastWeekEnd);\n        break;\n      case 'This Month':\n        startDate = getStartOfDay(new Date(today.getFullYear(), today.getMonth(), 1));\n        endDate = getEndOfDay(new Date());\n        break;\n      case 'Last Month':\n        startDate = getStartOfDay(new Date(today.getFullYear(), today.getMonth() - 1, 1));\n        endDate = getEndOfDay(new Date(today.getFullYear(), today.getMonth(), 0));\n        break;\n    }\n\n    setSelectedRange({ startDate, endDate });\n  };\n\n  const renderQuickActions = () => {\n    return (\n      <div className=\"w-[147px] p-4 border-r border-[var(--color-gray-200)]\">\n        <div role=\"group\" aria-label=\"Quick date selections\" className=\"flex flex-col gap-3\">\n          {quickActions.map((action) => (\n            <Button key={action} label={action} type=\"link\" onClick={() => handleQuickAction(action)} />\n          ))}\n        </div>\n      </div>\n    );\n  };\n\n  const handleApply = () => {\n    const { startDate = null, endDate = null } = selectedRange;\n\n    if (startDate && endDate) {\n      onApply({ startDate, endDate });\n      return;\n    }\n\n    if (startDate || endDate) {\n      const selectedDate = startDate || endDate;\n      onApply({ startDate: selectedDate, endDate: selectedDate });\n    }\n  };\n\n  const renderCalendar = (date: Date, isLeftCalendar: boolean) => {\n    const year = date.getFullYear();\n    const month = date.getMonth();\n    const days = generateCalendarDays(year, month);\n    const currentYear = new Date().getFullYear();\n    const yearOptions = getYearOptions(currentYear, year);\n    const monthHeading = new Date(year, month, 1).toLocaleString('en-US', { month: 'long', year: 'numeric' });\n    const getGridContainerProps = isLeftCalendar ? getLeftContainerProps : getRightContainerProps;\n    const gridInstructionsId = `calendar-instructions-${isLeftCalendar ? 'left' : 'right'}`;\n    const gridInstructions = singleDateSelection\n      ? 'Press Enter or Space to select a date. Use arrow keys to navigate days, Page Up and Page Down to change months.'\n      : 'Press Enter or Space to select a start date, then again to select an end date. Use arrow keys to navigate days, Page Up and Page Down to change months.';\n\n    const getCellProps = getGridCellProps({ isLeftCalendar, isDateDisabled, handleDateClick });\n\n    // Group flat days array into rows of 7 for ARIA grid row/gridcell structure\n    const rows: (Date | null)[][] = [];\n    for (let i = 0; i < days.length; i += 7) {\n      const row = days.slice(i, i + 7);\n      while (row.length < 7) row.push(null);\n      rows.push(row);\n    }\n\n    const today = new Date();\n    const isPrevMonthDisabled =\n      disablePastDates &&\n      date.getMonth() === today.getMonth() &&\n      date.getFullYear() === today.getFullYear();\n    const isNextMonthDisabled =\n      (!shouldAllowFutureDateSelection &&\n        month === today.getMonth() &&\n        year === today.getFullYear()) ||\n      (maxDays !== undefined &&\n        (() => {\n          const maxDate = new Date(today);\n          maxDate.setDate(maxDate.getDate() + maxDays);\n          return date.getMonth() === maxDate.getMonth() && date.getFullYear() === maxDate.getFullYear();\n        })());\n\n    return (\n      <div className=\"se-design-calendar-container w-fit p-4\">\n        <div className=\"flex justify-between items-center\">\n          <Icon\n            name=\"chevron\"\n            rotation=\"90\"\n            size={16}\n            disabled={isPrevMonthDisabled}\n            onClick={() => {\n              const newDate = handleMonthNavigation(date, false);\n              // Check if navigating back would go before today when disablePastDates is true\n              if (disablePastDates) {\n                const todayCheck = new Date();\n                todayCheck.setHours(0, 0, 0, 0);\n                if (newDate < todayCheck && newDate.getMonth() !== todayCheck.getMonth()) {\n                  return; // Don't navigate to past months\n                }\n              }\n              handleMonthChange(newDate, isLeftCalendar);\n            }}\n            automationId={`${automationId}-previous-month`}\n            ariaLabel={showSingleMonth ? 'Previous month' : isLeftCalendar ? 'Previous month of starting date' : 'Previous month of end date'}\n          />\n\n          <div className=\"flex gap-2\" onClick={(e) => e.stopPropagation()}>\n            <Dropdown\n              type=\"select\"\n              dropDownOptions={months}\n              defaultSelectedValue={months[month]}\n              selectBy=\"label\"\n              optionsUniqueBy=\"value\"\n              displaySelected={true}\n              label={showSingleMonth ? 'Month' : isLeftCalendar ? 'Start month' : 'End month'}\n              firstOptionAsHeading={true}\n              onOptionClick={(selectedOption) => {\n                const newDate = new Date(date);\n                newDate.setMonth(months.findIndex((m) => m.value === selectedOption.value));\n                handleMonthChange(newDate, isLeftCalendar);\n              }}\n              className=\"w-[124px] dropdown-option-container\"\n            />\n            <Dropdown\n              type=\"select\"\n              dropDownOptions={yearOptions}\n              defaultSelectedValue={yearOptions.find((y) => y.value === year)}\n              selectBy=\"label\"\n              optionsUniqueBy=\"value\"\n              displaySelected={true}\n              label={showSingleMonth ? 'Year' : isLeftCalendar ? 'Start year' : 'End year'}\n              firstOptionAsHeading={true}\n              onOptionClick={(selectedOption) => {\n                const newDate = new Date(date);\n                newDate.setFullYear(selectedOption.value);\n                handleMonthChange(newDate, isLeftCalendar);\n              }}\n              className=\"w-[104px] dropdown-option-container\"\n            />\n          </div>\n\n          <Icon\n            name=\"chevron\"\n            rotation=\"270\"\n            size={16}\n            disabled={isNextMonthDisabled}\n            onClick={() => {\n              const newDate = handleMonthNavigation(date, true);\n              // Check if the new date would exceed maxDays\n              if (maxDays !== undefined) {\n                const today = new Date();\n                const maxDate = new Date(today);\n                maxDate.setDate(maxDate.getDate() + maxDays);\n                if (newDate > maxDate) {\n                  return;\n                }\n              }\n              handleMonthChange(newDate, isLeftCalendar);\n            }}\n            automationId={`${automationId}-next-month`}\n            ariaLabel={showSingleMonth ? 'Next month' : isLeftCalendar ? 'Next month of starting date' : 'Next month of end date'}\n          />\n        </div>\n\n        {/* Calendar grid with ARIA grid/row/gridcell/columnheader roles */}\n        <span id={gridInstructionsId} className=\"sr-only\">\n          {gridInstructions}\n        </span>\n        <div {...getGridContainerProps({ ariaLabel: monthHeading, ariaDescribedBy: gridInstructionsId })} className=\"mt-3\">\n          {/* Column headers (week days) */}\n          <div role=\"row\" className=\"grid grid-cols-7 gap-2\">\n            {weekDays.map((day, index) => (\n              <abbr\n                key={`${day}-${index}`}\n                role=\"columnheader\"\n                title={weekDaysFull[index]}\n                className=\"datepicker-weekdays\"\n              >\n                {day}\n              </abbr>\n            ))}\n          </div>\n\n          {/* Day rows */}\n          {rows.map((row, rowIdx) => (\n            <div key={rowIdx} role=\"row\" className=\"grid grid-cols-7 gap-2\">\n              {row.map((cellDate, colIdx) => {\n                if (!cellDate) {\n                  return (\n                    <div\n                      key={`empty-${rowIdx}-${colIdx}`}\n                      role=\"gridcell\"\n                      aria-hidden=\"true\"\n                      className=\"h-10 w-10\"\n                    />\n                  );\n                }\n\n                const cellId = formatDateId(cellDate);\n                const isStart = isStartDate(cellDate);\n                const isEnd = isEndDate(cellDate);\n                const isSameStartEnd = isSameStartAndEndDate(cellDate);\n                const inRange = !isStart && !isEnd && isDateInRange(cellDate);\n                const todayDate = isToday(cellDate);\n                const disabled = isDateDisabled(cellDate);\n\n                const { ref: cellRef, ...cellProps } = getCellProps({\n                  cellId,\n                  cellDate,\n                  disabled,\n                  ariaLabel: getCellAriaLabel(cellDate, isStart, isEnd, isSameStartEnd, singleDateSelection, inRange),\n                  ariaCurrent: todayDate ? 'date' : undefined,\n                  ariaDisabled: disabled || undefined\n                });\n\n                return (\n                  <div\n                    key={cellId}\n                    role=\"gridcell\"\n                    aria-selected={isStart || isEnd || undefined}\n                    className=\"relative h-10 w-10\"\n                  >\n                    <button\n                      type=\"button\"\n                      {...cellProps}\n                      ref={cellRef as React.Ref<HTMLButtonElement>}\n                      className={`\n                        datepicker-cell-button\n                        h-full w-full flex items-center justify-center\n                        rounded-md focus-outline transition-colors\n                        ${\n                          disabled ? 'cursor-not-allowed text-[var(--color-gray-600)] hover:bg-transparent' : 'cursor-pointer'\n                        }\n                        ${\n                          isSameStartEnd\n                            ? 'bg-[var(--color-blue-500)] text-[var(--color-white)] hover:bg-[var(--color-blue-600)]'\n                            : ''\n                        }\n                        ${\n                          !isSameStartEnd && isStart\n                            ? 'bg-[var(--color-blue-500)] text-[var(--color-white)] hover:bg-[var(--color-blue-600)]'\n                            : ''\n                        }\n                        ${\n                          !isSameStartEnd && isEnd\n                            ? 'bg-[var(--color-blue-500)] text-[var(--color-white)] hover:bg-[var(--color-blue-600)]'\n                            : ''\n                        }\n                        ${!isStart && !isEnd && inRange ? 'bg-[var(--color-blue-100)] text-[var(--color-blue-600)] outline outline-1 outline-[var(--color-blue-500)]' : ''}\n                        ${!isStart && !isEnd && !inRange && !disabled ? 'hover:bg-[var(--color-blue-100)] hover:outline hover:outline-1 hover:outline-[var(--color-blue-500)]' : ''}\n                        ${todayDate && !isStart && !isEnd ? 'text-[var(--color-blue-500)] bg-[var(--color-blue-100)] outline outline-1 outline-[var(--color-blue-500)]' : ''}\n                        ${!disabled && !isStart && !isEnd && !todayDate ? 'text-[var(--color-blue-500)]' : ''}\n                      `}\n                      data-automation-id={`${automationId}-date-${cellDate.getDate()}`}\n                    >\n                      {cellDate.getDate()}\n                    </button>\n                    {!isSameStartEnd && (isStart || isEnd) && (\n                      <div\n                        aria-hidden=\"true\"\n                        className={`absolute top-0 bottom-0 ${isStart ? 'right-[-8px]' : 'left-[-8px]'} w-[8px]\n                        bg-[var(--color-blue-100)] -z-10`}\n                      />\n                    )}\n                  </div>\n                );\n              })}\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  };\n\n  return (\n    <div\n      className={`se-design-datepicker-container flex flex-col bg-[var(--color-white)] rounded-md shadow-md w-max max-w-full ${className}`}\n    >\n      {showHeader && (\n        <div className=\"se-design-datepicker-header flex justify-between items-center border-b border-[var(--color-gray-200)] p-4\">\n          <h2 className=\"datepicker-title\">{title}</h2>\n          {onClose && (\n            <Icon\n              name=\"close\"\n              size={16}\n              onClick={onClose}\n              className=\"cursor-pointer\"\n              automationId={`${automationId}-close`}\n              ariaLabel=\"Close date picker\"\n            />\n          )}\n        </div>\n      )}\n      <div className=\"se-design-datepicker-content flex\">\n        {showQuickActions && renderQuickActions()}\n        <div className=\"flex\">\n          {showSingleMonth ? (\n            renderCalendar(leftMonth, true)\n          ) : (\n            <>\n              {renderCalendar(leftMonth, true)}\n              <div className=\"h-full w-[1px] border-r border-[var(--color-gray-200)]\" aria-hidden=\"true\"></div>\n              {renderCalendar(rightMonth, false)}\n            </>\n          )}\n        </div>\n      </div>\n      {!singleDateSelection && (\n        <div className=\"se-design-datepicker-footer flex justify-end items-center gap-5 p-4 border-t border-[var(--color-gray-200)]\">\n          <Button\n            label={labels?.clear || 'Clear'}\n            type=\"ghost\"\n            onClick={handleClear}\n            data-automation-id={`${automationId}-clear-button`}\n          />\n          <Button\n            label={labels?.apply || 'Apply'}\n            type=\"primary\"\n            onClick={handleApply}\n            data-automation-id={`${automationId}-apply-button`}\n          />\n        </div>\n      )}\n\n    </div>\n  );\n};\n"],"names":["weekDays","weekDaysFull","quickActions","months","value","label","getDaysInMonth","year","month","Date","getDate","getFirstDayOfMonth","getDay","DatePicker","title","showHeader","initialStartDate","initialEndDate","onApply","onClose","shouldAllowFutureDateSelection","maxDays","disablePastDates","singleDateSelection","minYearOption","showQuickActions","showSingleMonth","className","automationId","labels","clear","apply","getDefaultDateRange","startDate","endDate","setHours","getDefaultMonths","today","lastMonth","setDate","setMonth","getMonth","selectedRange","setSelectedRange","useState","defaultMonths","leftMonth","setLeftMonth","rightMonth","setRightMonth","ensureDateInCorrectOrder","leftDate","rightDate","getTime","handleMonthChange","newDate","isLeftCalendar","newLeft","newRight","getGridCellProps","getLeftContainerProps","getRightContainerProps","useDatePickerA11y","onMonthChange","generateCalendarDays","daysInMonth","firstDay","days","i","push","day","date","isSameDay","date1","date2","getFullYear","isDateInRange","compareDate","isToday","isDateDisabled","dateToCheck","maxDate","handleDateClick","clickedDate","currentStart","handleMonthNavigation","increment","isStartDate","isEndDate","isSameStartAndEndDate","getYearOptions","currentYear","calendarYear","startYear","endYear","maxYear","Math","min","max","yearCount","Array","from","length","_","toString","filter","handleClear","getStartOfDay","getEndOfDay","handleQuickAction","action","firstDayOfWeek","lastWeekStart","lastWeekEnd","renderQuickActions","React","createElement","role","map","Button","key","type","onClick","handleApply","selectedDate","renderCalendar","yearOptions","monthHeading","toLocaleString","getGridContainerProps","gridInstructionsId","gridInstructions","getCellProps","rows","row","slice","isPrevMonthDisabled","isNextMonthDisabled","undefined","Icon","name","rotation","size","disabled","todayCheck","ariaLabel","e","stopPropagation","Dropdown","dropDownOptions","defaultSelectedValue","selectBy","optionsUniqueBy","displaySelected","firstOptionAsHeading","onOptionClick","selectedOption","findIndex","m","find","y","setFullYear","id","_extends","ariaDescribedBy","index","rowIdx","cellDate","colIdx","cellId","formatDateId","isStart","isEnd","isSameStartEnd","inRange","todayDate","ref","cellRef","cellProps","getCellAriaLabel","ariaCurrent","ariaDisabled","Fragment"],"mappings":"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"}
+{"version":3,"file":"index51.js","sources":["../src/components/PhoneInput/index.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState, useCallback } from 'react';\nimport './style.scss';\nimport countriesInfoJson from './countriesInfo.json';\nimport { Icon } from '../Icon';\nimport { useStableId } from '../../utils/useStableId';\nimport { getA11yNameAttributes, useCombobox } from '../../utils/a11y';\n\nexport interface PhoneInputProps {\n  onCountrycodeChange: (countryCode: string) => void;\n  onNumberChange: (number: string) => void;\n  error?: boolean;\n  errorMessage?: string;\n  value?: {\n    countryCode: string;\n    number: string;\n  };\n  label?: string;\n  automationId?: string;\n  /**\n   * Accessible label for the entire phone input group (role=\"group\").\n   * Provides context for screen readers (e.g., \"Two-step verification phone number for signer 1\").\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of element(s) that label the group (highest precedence over ariaLabel).\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) providing additional description for the phone number input.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Override aria-label for the phone number input specifically.\n   * Defaults to the visible label text or 'Phone number'.\n   */\n  phoneNumberAriaLabel?: string;\n  /**\n   * Override aria-label for the country code combobox button.\n   * Defaults to \"Select country code. Current: {name} {dial_code}\".\n   */\n  countryCodeAriaLabel?: string;\n  /**\n   * Whether the input is disabled\n   */\n  disabled?: boolean;\n}\n\nexport const PhoneInput: React.FC<PhoneInputProps> = ({\n  onCountrycodeChange,\n  onNumberChange,\n  error,\n  errorMessage,\n  value,\n  label,\n  automationId = '',\n  ariaLabel,\n  ariaLabelledBy,\n  ariaDescribedBy,\n  phoneNumberAriaLabel,\n  countryCodeAriaLabel,\n  disabled = false\n}) => {\n  const [countryCode, setCountryCode] = useState(value?.countryCode || countriesInfoJson[0].dial_code);\n  const [displaySelectCountryCode, setDisplaySelectCountryCode] = useState(false);\n  const [countriesInfo, setCountriesInfo] = useState(countriesInfoJson);\n  const [searchValue, setSearchValue] = useState('');\n  const [enteredNumber, setEnteredNumber] = useState('');\n  const containerRef = useRef<HTMLDivElement>(null);\n  const countryButtonRef = useRef<HTMLButtonElement>(null);\n  const searchInputRef = useRef<HTMLInputElement>(null);\n  const restoreFocusToButtonRef = useRef(false);\n\n  // Generate stable IDs for ARIA relationships\n  const labelId = useStableId(automationId, 'phone-label');\n  const listboxId = useStableId(automationId, 'phone-listbox');\n  const phoneInputId = useStableId(automationId, 'phone-input');\n  const errorId = useStableId(automationId, 'phone-error');\n\n  const countryInfo = countriesInfoJson.find((country) => country.dial_code === countryCode);\n\n  // Close dropdown and reset state\n  const closeDropdown = useCallback(() => {\n    setDisplaySelectCountryCode(false);\n    setSearchValue('');\n    setCountriesInfo(countriesInfoJson);\n  }, []);\n\n  const handleCountryCodeSelect = useCallback(\n    (country: string) => {\n      if (country) {\n        setCountryCode(country);\n        onCountrycodeChange(country);\n      }\n      closeDropdown();\n      // Focus return is handled by useEffect that watches displaySelectCountryCode\n    },\n    [onCountrycodeChange, closeDropdown]\n  );\n\n  const handleSelectFromDropdown = useCallback(\n    (country: typeof countriesInfoJson[0]) => {\n      restoreFocusToButtonRef.current = true;\n      handleCountryCodeSelect(country.dial_code);\n    },\n    [handleCountryCodeSelect]\n  );\n\n  // Use comprehensive useCombobox hook for country search\n  const {\n    containerProps,\n    inputProps: comboboxInputProps,\n    listboxProps,\n    getOptionProps,\n    highlightedIndex,\n    setHighlightedIndex\n  } = useCombobox({\n    items: countriesInfo,\n    isOpen: displaySelectCountryCode,\n    onOpenChange: setDisplaySelectCountryCode,\n    onSelect: handleSelectFromDropdown,\n    listboxId\n  });\n\n  const handleCountryCodeSearch = (event: React.ChangeEvent<HTMLInputElement>) => {\n    const searchVal = event.target.value;\n    setSearchValue(searchVal);\n    setHighlightedIndex(-1);\n    const filteredCountries = countriesInfoJson.filter(\n      (country) =>\n        country.name.toLowerCase().includes(searchVal.toLowerCase()) ||\n        country.dial_code.toLowerCase().includes(searchVal.toLowerCase()) ||\n        country.code.toLowerCase().includes(searchVal.toLowerCase())\n    );\n    setCountriesInfo(filteredCountries);\n  };\n\n  // Return focus to button when dropdown closes\n  const prevDisplaySelectCountryCodeRef = useRef(displaySelectCountryCode);\n  useEffect(() => {\n    let rafId: number | null = null;\n    // If dropdown was open and is now closed, return focus to button\n    // ONLY when the close was triggered from within the component (Escape/selection),\n    // not when the user moved focus outside (focus-out dismissal).\n    if (prevDisplaySelectCountryCodeRef.current && !displaySelectCountryCode && restoreFocusToButtonRef.current) {\n      rafId = requestAnimationFrame(() => {\n        countryButtonRef.current?.focus();\n      });\n    }\n    if (prevDisplaySelectCountryCodeRef.current && !displaySelectCountryCode) {\n      restoreFocusToButtonRef.current = false;\n    }\n    prevDisplaySelectCountryCodeRef.current = displaySelectCountryCode;\n    return () => {\n      if (rafId !== null) {\n        cancelAnimationFrame(rafId);\n      }\n    };\n  }, [displaySelectCountryCode]);\n\n  useEffect(() => {\n    if (value) {\n      setCountryCode(value.countryCode);\n      setEnteredNumber(value.number);\n    }\n  }, [value]);\n\n  // Focus search input when dropdown opens\n  useEffect(() => {\n    let rafId: number | null = null;\n    if (displaySelectCountryCode) {\n      rafId = requestAnimationFrame(() => {\n        searchInputRef.current?.focus();\n      });\n    }\n    return () => {\n      if (rafId !== null) {\n        cancelAnimationFrame(rafId);\n      }\n    };\n  }, [displaySelectCountryCode]);\n\n  const handleEnteredNumberChange = (val: string) => {\n    const numericValue = val.replace(/\\D/g, ''); // Remove non-numeric characters\n    setEnteredNumber(numericValue);\n    onNumberChange(numericValue);\n  };\n\n  const toggleDropdown = useCallback(() => {\n    if (disabled) return;\n    setDisplaySelectCountryCode((prev) => !prev);\n  }, [disabled]);\n\n  const handleCountryButtonKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (disabled) return;\n\n      switch (e.key) {\n        case 'Enter':\n        case ' ':\n          e.preventDefault();\n          toggleDropdown();\n          break;\n        case 'ArrowDown':\n          e.preventDefault();\n          if (!displaySelectCountryCode) {\n            setDisplaySelectCountryCode(true);\n          }\n          break;\n        // Escape is handled by useDismissOnEscape hook\n      }\n    },\n    [disabled, displaySelectCountryCode, toggleDropdown]\n  );\n\n  // Group label (role=\"group\"): combines the visible label with any external ariaLabelledBy\n  // (handled inside getA11yNameAttributes); ariaLabel overrides the visible label; falls back to 'Phone number'.\n  const groupA11yProps = getA11yNameAttributes({\n    ariaLabelledBy,\n    internalLabelId: label ? labelId : undefined,\n    ariaLabel: ariaLabel || (!label ? 'Phone number' : undefined)\n  });\n\n  // Phone number input: caller override > visible label > fallback 'Phone number'\n  const phoneInputA11yProps = getA11yNameAttributes({\n    ariaLabelledBy: !phoneNumberAriaLabel && label ? labelId : undefined,\n    ariaLabel: phoneNumberAriaLabel || (!label ? 'Phone number' : undefined),\n    ariaDescribedBy: error ? errorId : ariaDescribedBy\n  });\n\n  // Country code button label: caller override > default dynamic label\n  const computedCountryCodeAriaLabel = countryCodeAriaLabel ||\n    `Select country code. Current: ${countryInfo?.name} ${countryInfo?.dial_code}`;\n\n  return (\n    <div \n      className=\"phone-input-container-se-design-main-container\" \n      data-automation-id={automationId}\n      {...containerProps}\n      onKeyDownCapture={(e) => {\n        if (e.key === 'Escape' && displaySelectCountryCode) {\n          restoreFocusToButtonRef.current = true;\n        }\n        containerProps.onKeyDownCapture(e);\n      }}\n    >\n      {label && (\n        <div id={labelId} className=\"label-container\">\n          {label}\n        </div>\n      )}\n      <div\n        role=\"group\"\n        {...groupA11yProps}\n        className={`phone-input-container-se-design-main ${error ? 'error' : ''}`}\n        ref={containerRef}\n      >\n        <div className=\"phone-input-container-se-design\">\n          <button\n            ref={countryButtonRef}\n            type=\"button\"\n            className={`phone-input-container-se-design-country-code focus-outline rounded ${disabled ? 'cursor-not-allowed opacity-60' : ''}`}\n            onClick={toggleDropdown}\n            onKeyDown={handleCountryButtonKeyDown}\n            aria-haspopup=\"listbox\"\n            aria-expanded={displaySelectCountryCode}\n            aria-controls={displaySelectCountryCode ? listboxId : undefined}\n            aria-label={computedCountryCodeAriaLabel}\n            disabled={disabled}\n            data-automation-id=\"country-code-selector\"\n          >\n            <img\n              src={`https://flagcdn.com/${countryInfo?.code.toLowerCase()}.svg`}\n              alt=\"\"\n              aria-hidden=\"true\"\n              width=\"16\"\n            />\n            <span>{countryInfo?.dial_code}</span>\n            <Icon\n              name=\"chevron\"\n              className={!displaySelectCountryCode ? '' : 'rotate-180'}\n              aria-hidden=\"true\"\n            />\n          </button>\n          <span className=\"divider\" aria-hidden=\"true\" />\n          <input\n            id={phoneInputId}\n            type=\"tel\"\n            placeholder=\"Enter phone number\"\n            className={`phone-input-container-se-design-phone-number-input ${disabled ? 'disabled' : ''}`}\n            onChange={(event) => handleEnteredNumberChange(event.target.value)}\n            value={enteredNumber}\n            pattern=\"[0-9]*\"\n            disabled={disabled}\n            aria-invalid={error || undefined}\n            {...phoneInputA11yProps}\n            data-automation-id=\"phone-number-input-field\"\n          />\n        </div>\n\n        {displaySelectCountryCode && (\n          <div\n            {...listboxProps}\n            className=\"phone-input-container-se-design-country-code-list\"\n            aria-label=\"Select country\"\n            data-automation-id=\"country-code-list\"\n          >\n            <div className=\"search-input-wrapper\">\n              <Icon name=\"search\" className=\"search-icon\" aria-hidden=\"true\" />\n              <input\n                ref={searchInputRef}\n                {...comboboxInputProps}\n                type=\"text\"\n                placeholder=\"Search countries\"\n                className=\"phone-input-container-se-design-country-code-list-item-input\"\n                onChange={handleCountryCodeSearch}\n                value={searchValue}\n                aria-label=\"Search countries\"\n                data-automation-id=\"country-code-search-input\"\n              />\n            </div>\n            {countriesInfo.length > 0 ? (\n              countriesInfo.map((country, index) => {\n                const optionProps = getOptionProps(index, country.dial_code === countryCode);\n                return (\n                  <div\n                    key={country.code}\n                    {...optionProps}\n                    className={`phone-input-container-se-design-country-code-list-item ${\n                      highlightedIndex === index ? 'highlighted' : ''\n                    } ${country.dial_code === countryCode ? 'selected' : ''}`}\n                    onClick={() => {\n                      restoreFocusToButtonRef.current = true;\n                      handleCountryCodeSelect(country.dial_code);\n                    }}\n                    onMouseEnter={() => setHighlightedIndex(index)}\n                  >\n                    <img\n                      src={`https://flagcdn.com/${country.code.toLowerCase()}.svg`}\n                      alt=\"\"\n                      aria-hidden=\"true\"\n                      width=\"16\"\n                    />\n                    <span>{country.name}</span>\n                    <span>({country.dial_code})</span>\n                  </div>\n                );\n              })\n            ) : (\n              <div className=\"phone-input-container-se-design-country-code-list-item-no-results\" role=\"status\">\n                No results found\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n      {error && (\n        <div id={errorId} className=\"error-message\" role=\"alert\">\n          {errorMessage}\n        </div>\n      )}\n    </div>\n  );\n};\n"],"names":["PhoneInput","onCountrycodeChange","onNumberChange","error","errorMessage","value","label","automationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","phoneNumberAriaLabel","countryCodeAriaLabel","disabled","countryCode","setCountryCode","useState","countriesInfoJson","dial_code","displaySelectCountryCode","setDisplaySelectCountryCode","countriesInfo","setCountriesInfo","searchValue","setSearchValue","enteredNumber","setEnteredNumber","containerRef","useRef","countryButtonRef","searchInputRef","restoreFocusToButtonRef","labelId","useStableId","listboxId","phoneInputId","errorId","countryInfo","find","country","closeDropdown","useCallback","handleCountryCodeSelect","handleSelectFromDropdown","current","containerProps","inputProps","comboboxInputProps","listboxProps","getOptionProps","highlightedIndex","setHighlightedIndex","useCombobox","items","isOpen","onOpenChange","onSelect","handleCountryCodeSearch","event","searchVal","target","filteredCountries","filter","name","toLowerCase","includes","code","prevDisplaySelectCountryCodeRef","useEffect","rafId","requestAnimationFrame","focus","cancelAnimationFrame","number","handleEnteredNumberChange","val","numericValue","replace","toggleDropdown","prev","handleCountryButtonKeyDown","e","key","preventDefault","groupA11yProps","getA11yNameAttributes","internalLabelId","undefined","phoneInputA11yProps","computedCountryCodeAriaLabel","React","createElement","_extends","className","onKeyDownCapture","id","role","ref","type","onClick","onKeyDown","src","alt","width","Icon","placeholder","onChange","pattern","length","map","index","optionProps","onMouseEnter"],"mappings":"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"}

package/dist/index52.js

@@ -1,101 +1,41 @@
-import t from "react";
-import { Icon as W } from "./index6.js";
-import { useStableId as j } from "./index206.js";
-import { getA11yNameAttributes as q } from "./index81.js";
-import "./index72.js";
-/* empty css         */
-function U({
-  disabled: c,
-  error: a,
-  errorMessage: E,
-  id: N,
-  inputStyle: r,
-  label: s,
-  leftIcon: l,
-  maxLength: n,
-  onChange: m,
-  onClick: o,
-  onKeyDown: $,
-  placeholder: b,
-  readOnly: d,
-  rightIcon: u,
-  style: y,
-  tag: I,
-  type: k = "text",
-  value: p,
-  className: D = "",
-  automationId: g = "",
-  ariaLabel: A,
-  ariaLabelledBy: C,
-  ariaDescribedBy: K,
-  ariaHasPopup: R,
-  inputProps: _,
-  inputRef: x
-}) {
-  const v = j(N, "se-input-icon"), F = I || "input", H = q({
-    ariaLabel: A,
-    ariaLabelledBy: C,
-    ariaDescribedBy: K
-  }), i = !!d && !!o, h = (e) => {
-    if (!e) return null;
-    const w = c || e.disabled, f = i || w ? void 0 : e.onClick;
-    return /* @__PURE__ */ t.createElement("div", {
-      className: `input-with-icon-icon input-with-icon-icon-${e.position} ${e.className || ""} ${w ? "disabled" : ""} ${e.disableHover ? "no-hover" : ""}`,
-      style: e.style
-    }, /* @__PURE__ */ t.createElement(W, {
-      name: e.name,
-      onClick: f,
-      ariaLabel: f ? e.ariaLabel : void 0
-    }));
-  }, M = (e) => {
-    i && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), o(e)), $?.(e);
-  }, S = !!l, T = !!u;
-  return /* @__PURE__ */ t.createElement("div", {
-    className: `input-with-icon-main-container ${D}`,
-    style: y,
-    "data-automation-id": g
-  }, s && /* @__PURE__ */ t.createElement("label", {
-    className: "label-container",
-    htmlFor: v
-  }, s), /* @__PURE__ */ t.createElement("div", {
-    className: `input-with-icon-wrapper ${S ? "has-left-icon" : ""} ${T ? "has-right-icon" : ""}`,
-    onClick: i ? (e) => o(e) : void 0,
-    style: i ? {
-      cursor: "pointer"
-    } : void 0
-  }, h(l), /* @__PURE__ */ t.createElement(F, {
-    ref: x,
-    id: v,
-    value: p,
-    onChange: m ? (e) => m(e.target.value) : void 0,
-    // In trigger mode don't attach onClick to the input — the wrapper handles it.
-    onClick: i ? void 0 : o,
-    onKeyDown: M,
-    disabled: c,
-    readOnly: d,
-    type: k,
-    className: `input-with-icon-element ${a ? "input-with-icon-container-error" : "input-with-icon-container-default"} ${c ? "input-with-icon-container-disabled" : ""}`,
-    maxLength: n || void 0,
-    placeholder: b,
-    // In trigger mode: pointer cursor so it matches the wrapper, and no text selection
-    // since the value is display-only — selecting "90 days" with a caret is misleading.
-    style: i ? {
-      cursor: "pointer",
-      userSelect: "none",
-      ...r
-    } : r,
-    "aria-haspopup": R,
-    ...H,
-    ..._
-  }), h(u)), (a || n) && /* @__PURE__ */ t.createElement("div", {
-    className: `${a ? "error-and-max-word" : "max-word-container"}`
-  }, a && /* @__PURE__ */ t.createElement("div", {
-    className: "error-message"
-  }, E), n && /* @__PURE__ */ t.createElement("div", {
-    className: "max-word"
-  }, n && p?.length + "/" + n)));
-}
+import o from "react";
+const m = ({
+  progress: a,
+  backgroundColor: n = "#E8E8E8",
+  progressColor: s = "#0066FF",
+  size: e = 40,
+  strokeWidth: r = 4
+}) => {
+  const t = (e - r) / 2, c = t * 2 * Math.PI, l = c - a / 100 * c;
+  return /* @__PURE__ */ o.createElement("svg", {
+    width: e,
+    height: e,
+    style: {
+      transform: "rotate(-90deg)"
+    }
+  }, /* @__PURE__ */ o.createElement("circle", {
+    cx: e / 2,
+    cy: e / 2,
+    r: t,
+    stroke: n,
+    strokeWidth: r,
+    fill: "none"
+  }), /* @__PURE__ */ o.createElement("circle", {
+    cx: e / 2,
+    cy: e / 2,
+    r: t,
+    stroke: s,
+    strokeWidth: r,
+    strokeDasharray: c,
+    strokeDashoffset: l,
+    fill: "none",
+    strokeLinecap: "round",
+    style: {
+      transition: "stroke-dashoffset 0.3s ease"
+    }
+  }));
+};
 export {
-  U as InputWithIcon
+  m as CircularProgressBar
 };
 //# sourceMappingURL=index52.js.map

package/dist/index52.js.map

@@ -1 +1 @@
-{"version":3,"file":"index52.js","sources":["../src/components/InputWithIcon/index.tsx"],"sourcesContent":["import React from 'react';\nimport { Icon } from '../Icon';\nimport { useStableId } from '../../utils/useStableId';\nimport { getA11yNameAttributes } from '../../utils/a11y';\nimport './styles.scss';\n\nexport interface InputIconProps {\n  className?: string;\n  disabled?: boolean;\n  disableHover?: boolean;\n  name: string;\n  onClick?: () => void;\n  position: 'left' | 'right';\n  style?: React.CSSProperties;\n  /**\n   * Accessible name for the icon when it is interactive (onClick provided).\n   * Required for a11y when the icon has its own onClick.\n   */\n  ariaLabel?: string;\n}\n\nexport interface InputWithIconProps {\n  disabled?: boolean;\n  error?: boolean;\n  errorMessage?: string;\n  id?: string;\n  inputStyle?: React.CSSProperties;\n  label?: string;\n  leftIcon?: InputIconProps;\n  maxLength?: number | undefined;\n  onChange?: (value: string) => void;\n  onClick?: (e: React.MouseEvent<HTMLInputElement>) => void;\n  onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;\n  placeholder?: string;\n  readOnly?: boolean;\n  rightIcon?: InputIconProps;\n  style?: React.CSSProperties;\n  tag?: string;\n  type?: 'text' | 'password' | 'email' | 'number' | 'tel' | 'url' | 'search';\n  value: string;\n  className?: string;\n  automationId?: string;\n  /**\n   * Accessible name when no visible label exists.\n   * Prefer a visible label prop instead where possible.\n   */\n  ariaLabel?: string;\n  /**\n   * ID(s) of external visible element(s) that label this input.\n   */\n  ariaLabelledBy?: string;\n  /**\n   * ID(s) of element(s) that describe this input (hints, notes, constraints).\n   * Announced by screen readers after the label and value, giving extra context.\n   */\n  ariaDescribedBy?: string;\n  /**\n   * Set to \"dialog\" when this input opens a date picker or other dialog.\n   */\n  ariaHasPopup?: 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';\n  /**\n   * Additional props spread directly onto the inner <input> element.\n   */\n  inputProps?: Record<string, any>;\n  /**\n   * Ref forwarded to the inner <input> element.\n   */\n  inputRef?: React.Ref<HTMLInputElement>;\n}\n\nexport function InputWithIcon({\n  disabled,\n  error,\n  errorMessage,\n  id,\n  inputStyle,\n  label,\n  leftIcon,\n  maxLength,\n  onChange,\n  onClick,\n  onKeyDown,\n  placeholder,\n  readOnly,\n  rightIcon,\n  style,\n  tag,\n  type = 'text',\n  value,\n  className = '',\n  automationId = '',\n  ariaLabel,\n  ariaLabelledBy,\n  ariaDescribedBy,\n  ariaHasPopup,\n  inputProps,\n  inputRef\n}: InputWithIconProps) {\n  const inputId = useStableId(id, 'se-input-icon');\n  const Element = tag || 'input';\n\n  const accessibleNameProps = getA11yNameAttributes({ ariaLabel, ariaLabelledBy, ariaDescribedBy });\n\n  // Trigger mode: readOnly + onClick means the whole widget acts as one interactive element\n  // (e.g. a date picker trigger). ONE tab stop — the input — and the icon is always decorative.\n  // The wrapper div becomes the unified mouse click zone so clicking anywhere, including the\n  // icon area, fires the action without a second focusable element.\n  //\n  // Non-trigger mode: normal editable input. If an icon has its own onClick it is an independent\n  // action (e.g. show/hide password) and becomes its own accessible button via Icon's useAccessiblePress.\n  const isTriggerMode = !!readOnly && !!onClick;\n\n  const renderIcon = (iconProps: InputIconProps) => {\n    if (!iconProps) return null;\n\n    const isIconDisabled = disabled || iconProps.disabled;\n    // In trigger mode icon is always decorative — the wrapper is the click zone for the whole widget.\n    // In non-trigger mode pass onClick to Icon so it uses useAccessiblePress:\n    // role=\"button\", tabIndex=0, Enter/Space, focus-outline. Decorative when no onClick.\n    const iconOnClick = isTriggerMode || isIconDisabled ? undefined : iconProps.onClick;\n\n    return (\n      <div\n        className={`input-with-icon-icon input-with-icon-icon-${iconProps.position} ${iconProps.className || ''} ${isIconDisabled ? 'disabled' : ''} ${iconProps.disableHover ? 'no-hover' : ''}`}\n        style={iconProps.style}\n      >\n        <Icon\n          name={iconProps.name}\n          onClick={iconOnClick}\n          ariaLabel={iconOnClick ? iconProps.ariaLabel : undefined}\n        />\n      </div>\n    );\n  };\n\n  // In trigger mode Enter/Space on the focused input fires the action, same as a button would.\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (isTriggerMode && (e.key === 'Enter' || e.key === ' ')) {\n      e.preventDefault();\n      onClick!(e as any);\n    }\n    onKeyDown?.(e);\n  };\n\n  const hasLeftIcon = !!leftIcon;\n  const hasRightIcon = !!rightIcon;\n\n  return (\n    <div className={`input-with-icon-main-container ${className}`} style={style} data-automation-id={automationId}>\n      {label && <label className=\"label-container\" htmlFor={inputId}>{label}</label>}\n      <div\n        className={`input-with-icon-wrapper ${hasLeftIcon ? 'has-left-icon' : ''} ${hasRightIcon ? 'has-right-icon' : ''}`}\n        // In trigger mode the wrapper is the unified mouse click zone — clicking anywhere in the\n        // widget (including the icon area) fires the action. Don't also put onClick on the input\n        // element or it would double-fire when the input itself is clicked.\n        onClick={isTriggerMode ? (e) => onClick!(e as any) : undefined}\n        style={isTriggerMode ? { cursor: 'pointer' } : undefined}\n      >\n        {renderIcon(leftIcon!)}\n        {React.createElement(Element, {\n          ref: inputRef,\n          id: inputId,\n          value,\n          onChange: onChange\n            ? (e: React.ChangeEvent<HTMLInputElement>) => onChange(e.target.value)\n            : undefined,\n          // In trigger mode don't attach onClick to the input — the wrapper handles it.\n          onClick: isTriggerMode ? undefined : onClick,\n          onKeyDown: handleKeyDown,\n          disabled,\n          readOnly,\n          type,\n          className: `input-with-icon-element ${error ? 'input-with-icon-container-error' : 'input-with-icon-container-default'} ${disabled ? 'input-with-icon-container-disabled' : ''}`,\n          maxLength: maxLength ? maxLength : undefined,\n          placeholder: placeholder,\n          // In trigger mode: pointer cursor so it matches the wrapper, and no text selection\n          // since the value is display-only — selecting \"90 days\" with a caret is misleading.\n          style: isTriggerMode\n            ? { cursor: 'pointer', userSelect: 'none', ...inputStyle }\n            : inputStyle,\n          'aria-haspopup': ariaHasPopup,\n          ...accessibleNameProps,\n          ...inputProps\n        })}\n        {renderIcon(rightIcon!)}\n      </div>\n      {(error || maxLength) &&\n        <div className={`${error ? 'error-and-max-word' : 'max-word-container'}`}>\n          {error && <div className=\"error-message\">{errorMessage}</div>}\n          {maxLength && <div className=\"max-word\">{maxLength && value?.length + '/' + maxLength}</div>}\n        </div>\n      }\n    </div>\n  );\n}\n"],"names":["React__default","Icon","useStableId","getA11yNameAttributes","InputWithIcon","disabled","error","errorMessage","id","inputStyle","label","leftIcon","maxLength","onChange","onClick","onKeyDown","placeholder","readOnly","rightIcon","style","tag","type","value","className","automationId","ariaLabel","ariaLabelledBy","ariaDescribedBy","ariaHasPopup","inputProps","inputRef","inputId","Element","accessibleNameProps","isTriggerMode","renderIcon","iconProps","isIconDisabled","iconOnClick","undefined","React","createElement","position","disableHover","name","handleKeyDown","e","key","preventDefault","hasLeftIcon","hasRightIcon","htmlFor","cursor","ref","target","userSelect","length"],"mappings":"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"}
+{"version":3,"file":"index52.js","sources":["../src/components/CircularProgressBar/index.tsx"],"sourcesContent":["import React from 'react';\n\ninterface CircularProgressBarProps {\n  progress: number;\n  backgroundColor?: string;\n  progressColor?: string;\n  size?: number;\n  strokeWidth?: number;\n}\n\nexport const CircularProgressBar = ({\n  progress,\n  backgroundColor = '#E8E8E8',\n  progressColor = '#0066FF',\n  size = 40,\n  strokeWidth = 4\n}: CircularProgressBarProps) => {\n  const radius = (size - strokeWidth) / 2;\n  const circumference = radius * 2 * Math.PI;\n  const strokeDashoffset = circumference - (progress / 100) * circumference;\n\n  return (\n    <svg width={size} height={size} style={{ transform: 'rotate(-90deg)' }}>\n      {/* Background circle */}\n      <circle cx={size / 2} cy={size / 2} r={radius} stroke={backgroundColor} strokeWidth={strokeWidth} fill=\"none\" />\n      {/* Progress circle */}\n      <circle\n        cx={size / 2}\n        cy={size / 2}\n        r={radius}\n        stroke={progressColor}\n        strokeWidth={strokeWidth}\n        strokeDasharray={circumference}\n        strokeDashoffset={strokeDashoffset}\n        fill=\"none\"\n        strokeLinecap=\"round\"\n        style={{ transition: 'stroke-dashoffset 0.3s ease' }}\n      />\n    </svg>\n  );\n};\n"],"names":["CircularProgressBar","progress","backgroundColor","progressColor","size","strokeWidth","radius","circumference","Math","PI","strokeDashoffset","React","createElement","width","height","style","transform","cx","cy","r","stroke","fill","strokeDasharray","strokeLinecap","transition"],"mappings":";AAUO,MAAMA,IAAsBA,CAAC;AAAA,EAClCC,UAAAA;AAAAA,EACAC,iBAAAA,IAAkB;AAAA,EAClBC,eAAAA,IAAgB;AAAA,EAChBC,MAAAA,IAAO;AAAA,EACPC,aAAAA,IAAc;AACU,MAAM;AAC9B,QAAMC,KAAUF,IAAOC,KAAe,GAChCE,IAAgBD,IAAS,IAAIE,KAAKC,IAClCC,IAAmBH,IAAiBN,IAAW,MAAOM;AAE5D,SACEI,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,OAAOT;AAAAA,IAAMU,QAAQV;AAAAA,IAAMW,OAAO;AAAA,MAAEC,WAAW;AAAA,IAAA;AAAA,EAAiB,GAEnEL,gBAAAA,EAAAC,cAAA,UAAA;AAAA,IAAQK,IAAIb,IAAO;AAAA,IAAGc,IAAId,IAAO;AAAA,IAAGe,GAAGb;AAAAA,IAAQc,QAAQlB;AAAAA,IAAiBG,aAAAA;AAAAA,IAA0BgB,MAAK;AAAA,EAAA,CAAQ,GAE/GV,gBAAAA,EAAAC,cAAA,UAAA;AAAA,IACEK,IAAIb,IAAO;AAAA,IACXc,IAAId,IAAO;AAAA,IACXe,GAAGb;AAAAA,IACHc,QAAQjB;AAAAA,IACRE,aAAAA;AAAAA,IACAiB,iBAAiBf;AAAAA,IACjBG,kBAAAA;AAAAA,IACAW,MAAK;AAAA,IACLE,eAAc;AAAA,IACdR,OAAO;AAAA,MAAES,YAAY;AAAA,IAAA;AAAA,EAA8B,CACpD,CACE;AAET;"}

package/dist/index53.js

@@ -1,46 +1,39 @@
-import e, { useEffect as a } from "react";
-import { delay as m } from "./index246.js";
-import { announce as i } from "./index75.js";
-import { Icon as s } from "./index6.js";
-const u = (l) => {
-  const {
-    title: o = "",
-    itemsList: t = [],
-    handleDownload: n,
-    backgroundColor: c = "var(--color-white)",
-    titleBackgroundColor: d = "var(--color-blue-50)"
-  } = l;
-  return a(() => {
-    t?.length > 0 && t?.forEach((r) => {
-      m(2e3).then(() => {
-        n(r);
-      });
-    });
-  }, [t?.length]), a(() => {
-    o && i(o, {
-      delay: 300
-    });
-  }, []), /* @__PURE__ */ e.createElement("div", {
-    className: "download-widgets-container rounded-t-xl border border-[var(--color-gray-400)] w-[300px] overflow-hidden fixed bottom-0 right-5 z-[1100]",
+import m from "react";
+const a = ["var(--color-green-500)", "var(--color-blue-500)", "var(--color-purple-600)", "var(--color-red-400)", "var(--color-yellow-600)"], h = ({
+  size: r = 40,
+  text: l,
+  textColor: i = "var(--color-white)",
+  backgroundColor: t = "",
+  className: n = "",
+  onClick: e,
+  automationId: c = "",
+  ariaLabel: o
+}) => {
+  const d = l?.split(" ")?.map((s) => s[0])?.join("")?.toUpperCase()?.slice(0, 2), u = () => t || a[Math.floor(Math.random() * a.length)];
+  return /* @__PURE__ */ m.createElement("div", {
+    className: `
+        se-design-avatar 
+        flex items-center justify-center 
+        rounded-full font-medium
+        ${e ? "cursor-pointer" : "cursor-default"}
+        ${n}
+      `,
+    onClick: e,
+    "data-automation-id": c,
+    "aria-hidden": o ? void 0 : !0,
+    "aria-label": o,
     style: {
-      backgroundColor: c
+      width: r,
+      height: r,
+      minWidth: 20,
+      minHeight: 20,
+      backgroundColor: u(),
+      color: i,
+      fontSize: `${r * 0.4}px`
     }
-  }, /* @__PURE__ */ e.createElement("div", {
-    className: "p-4 text-base font-medium",
-    style: {
-      backgroundColor: d
-    }
-  }, o), t?.map((r) => /* @__PURE__ */ e.createElement("div", {
-    className: " download-item flex items-center gap-2 px-4 pt-4 last:pb-4"
-  }, /* @__PURE__ */ e.createElement("span", {
-    className: "text-base font-normal flex-1"
-  }, r.label), /* @__PURE__ */ e.createElement(s, {
-    name: "checked-circle",
-    stroke: "var(--color-green-500)",
-    size: 16
-  }))));
+  }, d);
 };
 export {
-  u as DownloadWidget
+  h as Avatar
 };
 //# sourceMappingURL=index53.js.map

package/dist/index53.js.map

@@ -1 +1 @@
-{"version":3,"file":"index53.js","sources":["../src/components/DownloadWidget/index.tsx"],"sourcesContent":["import React, { useEffect } from 'react';\n\nimport { delay } from 'utils/delay';\nimport { announce } from 'src/utils/a11y/liveAnnouncer/LiveAnnouncer';\n\nimport { Icon } from '../Icon';\n\ntype ItemType = { label: string; id?: number; metadata?: any };\n\ntype DownloadWidgetProps = {\n  title: string;\n  itemsList: ItemType[];\n  handleDownload: (downloadItem?: any) => void;\n  backgroundColor?: string;\n  titleBackgroundColor?: string;\n};\n\nexport const DownloadWidget = (props: DownloadWidgetProps) => {\n  const {\n    title = '',\n    itemsList = [],\n    handleDownload,\n    backgroundColor = 'var(--color-white)',\n    titleBackgroundColor = 'var(--color-blue-50)'\n  } = props;\n\n  useEffect(() => {\n    if (itemsList?.length > 0) {\n      itemsList?.forEach((downloadItem) => {\n        delay(2000).then(() => {\n          handleDownload(downloadItem);\n        });\n      });\n    }\n  }, [itemsList?.length]);\n\n  useEffect(() => {\n    if (title) {\n      announce(title, { delay: 300 });\n    }\n  }, []);\n\n  return (\n    <div\n      className=\"download-widgets-container rounded-t-xl border border-[var(--color-gray-400)] w-[300px] overflow-hidden fixed bottom-0 right-5 z-[1100]\"\n      style={{ backgroundColor }}\n    >\n      <div className=\"p-4 text-base font-medium\" style={{ backgroundColor: titleBackgroundColor }}>\n        {title}\n      </div>\n      {itemsList?.map((item) => (\n        <div className=\" download-item flex items-center gap-2 px-4 pt-4 last:pb-4\">\n          <span className=\"text-base font-normal flex-1\">{item.label}</span>\n          <Icon name=\"checked-circle\" stroke=\"var(--color-green-500)\" size={16} />\n        </div>\n      ))}\n    </div>\n  );\n};\n"],"names":["React__default","useEffect","delay","announce","Icon","DownloadWidget","props","title","itemsList","handleDownload","backgroundColor","titleBackgroundColor","length","forEach","downloadItem","then","React","createElement","className","style","map","item","label","name","stroke","size"],"mappings":"AAiBO,OAAAA,KAAA,aAAAC,SAAA;AAAA,SAAA,SAAAC,SAAA;AAAA,SAAA,YAAAC,SAAA;AAAA,SAAA,QAAAC,SAAA;AAAA,MAAMC,IAAiBA,CAACC,MAA+B;AAC5D,QAAM;AAAA,IACJC,OAAAA,IAAQ;AAAA,IACRC,WAAAA,IAAY,CAAA;AAAA,IACZC,gBAAAA;AAAAA,IACAC,iBAAAA,IAAkB;AAAA,IAClBC,sBAAAA,IAAuB;AAAA,EAAA,IACrBL;AAEJL,SAAAA,EAAU,MAAM;AACd,IAAIO,GAAWI,SAAS,KACtBJ,GAAWK,QAASC,CAAAA,MAAiB;AACnCZ,MAAAA,EAAM,GAAI,EAAEa,KAAK,MAAM;AACrBN,QAAAA,EAAeK,CAAY;AAAA,MAC7B,CAAC;AAAA,IACH,CAAC;AAAA,EAEL,GAAG,CAACN,GAAWI,MAAM,CAAC,GAEtBX,EAAU,MAAM;AACd,IAAIM,KACFJ,EAASI,GAAO;AAAA,MAAEL,OAAO;AAAA,IAAA,CAAK;AAAA,EAElC,GAAG,CAAA,CAAE,GAGHc,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEC,WAAU;AAAA,IACVC,OAAO;AAAA,MAAET,iBAAAA;AAAAA,IAAAA;AAAAA,EAAgB,GAEzBM,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAU;AAAA,IAA4BC,OAAO;AAAA,MAAET,iBAAiBC;AAAAA,IAAAA;AAAAA,EAAqB,GACvFJ,CACE,GACJC,GAAWY,IAAKC,CAAAA,MACfL,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IAAKC,WAAU;AAAA,EAAA,GACbF,gBAAAA,EAAAC,cAAA,QAAA;AAAA,IAAMC,WAAU;AAAA,EAAA,GAAgCG,EAAKC,KAAY,GACjEN,gBAAAA,EAAAC,cAACb,GAAI;AAAA,IAACmB,MAAK;AAAA,IAAiBC,QAAO;AAAA,IAAyBC,MAAM;AAAA,EAAA,CAAK,CACpE,CACN,CACE;AAET;"}
+{"version":3,"file":"index53.js","sources":["../src/components/Avatar/index.tsx"],"sourcesContent":["import React, { FC } from 'react';\n\nexport type AvatarProps = {\n  size?: number;\n  text: string;\n  textColor?: string;\n  backgroundColor?: string;\n  className?: string;\n  onClick?: () => void;\n  automationId?: string;\n  ariaLabel?: string;\n};\n\nconst AVATAR_COLORS = [\n  'var(--color-green-500)',\n  'var(--color-blue-500)',\n  'var(--color-purple-600)',\n  'var(--color-red-400)',\n  'var(--color-yellow-600)'\n];\n\nexport const Avatar: FC<AvatarProps> = ({\n  size = 40,\n  text,\n  textColor = 'var(--color-white)',\n  backgroundColor = '',\n  className = '',\n  onClick,\n  automationId = '',\n  ariaLabel\n}) => {\n  const initials = text\n    ?.split(' ')\n    ?.map((word) => word[0])\n    ?.join('')\n    ?.toUpperCase()\n    ?.slice(0, 2);\n\n  const getBackgroundColor = () => {\n    if (backgroundColor) {\n      return backgroundColor;\n    }\n    return AVATAR_COLORS[Math.floor(Math.random() * AVATAR_COLORS.length)];\n  };\n\n  return (\n    <div\n      className={`\n        se-design-avatar \n        flex items-center justify-center \n        rounded-full font-medium\n        ${onClick ? 'cursor-pointer' : 'cursor-default'}\n        ${className}\n      `}\n      onClick={onClick}\n      data-automation-id={automationId}\n      aria-hidden={ariaLabel ? undefined : true}\n      aria-label={ariaLabel}\n      style={{\n        width: size,\n        height: size,\n        minWidth: 20,\n        minHeight: 20,\n        backgroundColor: getBackgroundColor(),\n        color: textColor,\n        fontSize: `${size * 0.4}px`\n      }}\n    >\n      {initials}\n    </div>\n  );\n};\n"],"names":["React__default","AVATAR_COLORS","Avatar","size","text","textColor","backgroundColor","className","onClick","automationId","ariaLabel","initials","split","map","word","join","toUpperCase","slice","getBackgroundColor","Math","floor","random","length","React","createElement","undefined","style","width","height","minWidth","minHeight","color","fontSize"],"mappings":"AAaA,OAAAA,OAAA;AAAA,MAAMC,IAAgB,CACpB,0BACA,yBACA,2BACA,wBACA,yBAAyB,GAGdC,IAA0BA,CAAC;AAAA,EACtCC,MAAAA,IAAO;AAAA,EACPC,MAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,iBAAAA,IAAkB;AAAA,EAClBC,WAAAA,IAAY;AAAA,EACZC,SAAAA;AAAAA,EACAC,cAAAA,IAAe;AAAA,EACfC,WAAAA;AACF,MAAM;AACJ,QAAMC,IAAWP,GACbQ,MAAM,GAAG,GACTC,IAAKC,OAASA,EAAK,CAAC,CAAC,GACrBC,KAAK,EAAE,GACPC,eACAC,MAAM,GAAG,CAAC,GAERC,IAAqBA,MACrBZ,KAGGL,EAAckB,KAAKC,MAAMD,KAAKE,WAAWpB,EAAcqB,MAAM,CAAC;AAGvE,SACEC,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEjB,WAAW;AAAA;AAAA;AAAA;AAAA,UAIPC,IAAU,mBAAmB,gBAAgB;AAAA,UAC7CD,CAAS;AAAA;AAAA,IAEbC,SAAAA;AAAAA,IACA,sBAAoBC;AAAAA,IACpB,eAAaC,IAAYe,SAAY;AAAA,IACrC,cAAYf;AAAAA,IACZgB,OAAO;AAAA,MACLC,OAAOxB;AAAAA,MACPyB,QAAQzB;AAAAA,MACR0B,UAAU;AAAA,MACVC,WAAW;AAAA,MACXxB,iBAAiBY,EAAAA;AAAAA,MACjBa,OAAO1B;AAAAA,MACP2B,UAAU,GAAG7B,IAAO,GAAG;AAAA,IAAA;AAAA,EACzB,GAECQ,CACE;AAET;"}