@raystack/apsara 0.44.4 → 0.45.1

package/dist/table/FilteredChip.cjs

@@ -8,8 +8,6 @@ var flex = require('../flex/flex.cjs');
 var select = require('../select/select.cjs');
 var text = require('../text/text.cjs');
 var textfield = require('../textfield/textfield.cjs');
-require('../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/UI.cjs');
-require('../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/useDayPicker.cjs');
 var datePicker = require('../calendar/date-picker.cjs');
 var rangePicker = require('../calendar/range-picker.cjs');
 var datatables_types = require('./datatables.types.cjs');

package/dist/table/FilteredChip.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"FilteredChip.cjs","sources":["../../table/FilteredChip.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Cross1Icon } from \"@radix-ui/react-icons\";\nimport { Column } from \"@tanstack/table-core\";\nimport { Box } from \"~/box\";\nimport { Flex } from \"~/flex\";\nimport { Select } from \"~/select\";\nimport { Text } from \"~/text\";\nimport { TextField } from \"~/textfield\";\nimport { TableColumnMetadata } from \"~/typings\";\nimport { DatePicker, RangePicker } from \"~/calendar\";\nimport {\n  ApsaraColumnDef,\n  FilterValue,\n  columnTypes,\n  columnTypesMap,\n  filterValueType,\n  filterValueTypeMap,\n  updateColumnFilter,\n} from \"./datatables.types\";\nimport { useTable } from \"./hooks/useTable\";\nimport { FilterOperation, operationsOptions } from \"./filterFns\";\nimport styles from \"./datatable.module.css\";\n\ntype FilteredChipProps = {\n  column: Column<any, unknown>;\n  updateColumnCustomFilter: updateColumnFilter;\n};\n\ninterface getFilterValueTypeOptions {\n  filterOperation?: FilterOperation;\n  columnType?: columnTypes;\n}\n\nconst getFilterValueType = ({\n  filterOperation,\n  columnType,\n}: getFilterValueTypeOptions): filterValueType => {\n  if (filterOperation?.component) {\n    return filterOperation?.component;\n  } else if (columnType === columnTypesMap.date) {\n    return filterValueTypeMap.datePicker;\n  } else if (columnType === columnTypesMap.select) {\n    return filterValueTypeMap.select;\n  } else {\n    return filterValueTypeMap.text;\n  }\n};\n\ninterface FilterValuesProps {\n  columnType?: columnTypes;\n  onValueChange?: (value: FilterValue) => void;\n  options?: TableColumnMetadata[];\n  filterOperation?: FilterOperation;\n  column?: Column<any, unknown>;\n}\n\nconst FilterValues = ({\n  column,\n  columnType = filterValueTypeMap.text,\n  options = [],\n  onValueChange,\n  filterOperation,\n  ...props\n}: FilterValuesProps) => {\n  const [value, setValue] = useState<FilterValue>(\n    (column?.columnDef?.meta as any)?.defaultValue\n      ? { value: (column?.columnDef.meta as any).defaultValue }\n      : {\n          value: \"\",\n          date: new Date(),\n          dateRange: { to: new Date(), from: new Date() },\n        }\n  );\n\n  const valueType = getFilterValueType({ filterOperation, columnType });\n\n  useEffect(() => {\n    if (onValueChange) {\n      onValueChange(value);\n    }\n  }, [value]);\n\n  switch (valueType) {\n    case filterValueTypeMap.select:\n      return (\n        <Select\n          value={value.value as string}\n          onValueChange={(value) => setValue({ value })}\n        >\n          <Select.Trigger>\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content>\n            {options.map((opt) => {\n              return (\n                <Select.Item key={opt.key} value={opt.value}>\n                  {opt.label || opt.value}\n                </Select.Item>\n              );\n            })}\n          </Select.Content>\n        </Select>\n      );\n    case filterValueTypeMap.datePicker:\n      return (\n        <DatePicker\n          onSelect={(date) => setValue({ date })}\n          value={value.date}\n        />\n      );\n    case filterValueTypeMap.rangePicker:\n      return (\n        <RangePicker\n          onSelect={(dateRange) => setValue({ dateRange })}\n          value={value.dateRange}\n        />\n      );\n    default:\n      return (\n        <TextField\n          value={value.value}\n          onChange={(e) => setValue({ value: e.target.value })}\n        />\n      );\n  }\n};\n\ninterface OperationProps {\n  columnType?: columnTypes;\n  onOperationSelect: (op: FilterOperation) => void;\n}\n\nconst Operation = ({\n  columnType = columnTypesMap.text,\n  onOperationSelect,\n}: OperationProps) => {\n  const options = operationsOptions[columnType] || [];\n  const [value, setValue] = useState(options?.[0]?.value);\n\n  useEffect(() => {\n    const selectedOption = options.find((o) => o.value === value);\n    if (selectedOption) {\n      onOperationSelect(selectedOption);\n    }\n  }, [value]);\n\n  return (\n    <Select defaultValue={value} onValueChange={setValue}>\n      <Select.Trigger className={styles.filterOperator}>\n        <Select.Value placeholder=\"Select operation\" />\n      </Select.Trigger>\n      <Select.Content>\n        {options.map((opt) => {\n          return (\n            <Select.Item key={opt.label} value={opt.label}>\n              {opt.label}\n            </Select.Item>\n          );\n        })}\n      </Select.Content>\n    </Select>\n  );\n};\n\nexport const FilteredChip = ({\n  column,\n  updateColumnCustomFilter,\n}: FilteredChipProps) => {\n  const [filterOperation, setFilterOperation] = useState<FilterOperation>();\n  const [filterValue, setFilterValue] = useState<FilterValue>();\n\n  const { table, removeFilterColumn } = useTable();\n  const { filterVariant } = column?.columnDef as ApsaraColumnDef<unknown>;\n  const options: TableColumnMetadata[] =\n    (column?.columnDef?.meta as any)?.data || [];\n\n  const facets = column?.getFacetedUniqueValues();\n  const columnHeader = column?.columnDef?.header;\n  const columnName =\n    (typeof columnHeader === \"string\" && columnHeader) || column.id;\n\n  useEffect(() => {\n    if (filterOperation?.fn && filterValue) {\n      updateColumnCustomFilter(column.id, filterOperation?.fn);\n      column.setFilterValue(filterValue);\n    }\n  }, [filterOperation, filterValue]);\n\n  function removeFilter() {\n    column.setFilterValue(undefined);\n    removeFilterColumn(column.id);\n    setFilterOperation(undefined);\n    setFilterValue({});\n  }\n\n  return (\n    <Box className={styles.chip}>\n      <Text className={styles.filterText}>{columnName}</Text>\n      <Operation\n        columnType={filterVariant}\n        onOperationSelect={setFilterOperation}\n      />\n      {filterOperation?.hideValueField ? null : (\n        <FilterValues\n          column={column}\n          columnType={filterVariant}\n          options={options}\n          onValueChange={setFilterValue}\n          filterOperation={filterOperation}\n        />\n      )}\n\n      {/* close filter chip */}\n      <Flex>\n        <Cross1Icon height=\"12\" width=\"12\" onClick={removeFilter} />\n      </Flex>\n    </Box>\n  );\n};\n"],"names":["columnTypesMap","filterValueTypeMap","useState","useEffect","_jsxs","Select","_jsx","DatePicker","RangePicker","TextField","operationsOptions","styles","useTable","Box","Text","Flex","Cross1Icon"],"mappings":"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"}
+{"version":3,"file":"FilteredChip.cjs","sources":["../../table/FilteredChip.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Cross1Icon } from \"@radix-ui/react-icons\";\nimport { Column } from \"@tanstack/table-core\";\nimport { Box } from \"~/box\";\nimport { Flex } from \"~/flex\";\nimport { Select } from \"~/select\";\nimport { Text } from \"~/text\";\nimport { TextField } from \"~/textfield\";\nimport { TableColumnMetadata } from \"~/typings\";\nimport { DatePicker, RangePicker } from \"~/calendar\";\nimport {\n  ApsaraColumnDef,\n  FilterValue,\n  columnTypes,\n  columnTypesMap,\n  filterValueType,\n  filterValueTypeMap,\n  updateColumnFilter,\n} from \"./datatables.types\";\nimport { useTable } from \"./hooks/useTable\";\nimport { FilterOperation, operationsOptions } from \"./filterFns\";\nimport styles from \"./datatable.module.css\";\n\ntype FilteredChipProps = {\n  column: Column<any, unknown>;\n  updateColumnCustomFilter: updateColumnFilter;\n};\n\ninterface getFilterValueTypeOptions {\n  filterOperation?: FilterOperation;\n  columnType?: columnTypes;\n}\n\nconst getFilterValueType = ({\n  filterOperation,\n  columnType,\n}: getFilterValueTypeOptions): filterValueType => {\n  if (filterOperation?.component) {\n    return filterOperation?.component;\n  } else if (columnType === columnTypesMap.date) {\n    return filterValueTypeMap.datePicker;\n  } else if (columnType === columnTypesMap.select) {\n    return filterValueTypeMap.select;\n  } else {\n    return filterValueTypeMap.text;\n  }\n};\n\ninterface FilterValuesProps {\n  columnType?: columnTypes;\n  onValueChange?: (value: FilterValue) => void;\n  options?: TableColumnMetadata[];\n  filterOperation?: FilterOperation;\n  column?: Column<any, unknown>;\n}\n\nconst FilterValues = ({\n  column,\n  columnType = filterValueTypeMap.text,\n  options = [],\n  onValueChange,\n  filterOperation,\n  ...props\n}: FilterValuesProps) => {\n  const [value, setValue] = useState<FilterValue>(\n    (column?.columnDef?.meta as any)?.defaultValue\n      ? { value: (column?.columnDef.meta as any).defaultValue }\n      : {\n          value: \"\",\n          date: new Date(),\n          dateRange: { to: new Date(), from: new Date() },\n        }\n  );\n\n  const valueType = getFilterValueType({ filterOperation, columnType });\n\n  useEffect(() => {\n    if (onValueChange) {\n      onValueChange(value);\n    }\n  }, [value]);\n\n  switch (valueType) {\n    case filterValueTypeMap.select:\n      return (\n        <Select\n          value={value.value as string}\n          onValueChange={(value) => setValue({ value })}\n        >\n          <Select.Trigger>\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content>\n            {options.map((opt) => {\n              return (\n                <Select.Item key={opt.key} value={opt.value}>\n                  {opt.label || opt.value}\n                </Select.Item>\n              );\n            })}\n          </Select.Content>\n        </Select>\n      );\n    case filterValueTypeMap.datePicker:\n      return (\n        <DatePicker\n          onSelect={(date) => setValue({ date })}\n          value={value.date}\n        />\n      );\n    case filterValueTypeMap.rangePicker:\n      return (\n        <RangePicker\n          onSelect={(dateRange) => setValue({ dateRange })}\n          value={value.dateRange}\n        />\n      );\n    default:\n      return (\n        <TextField\n          value={value.value}\n          onChange={(e) => setValue({ value: e.target.value })}\n        />\n      );\n  }\n};\n\ninterface OperationProps {\n  columnType?: columnTypes;\n  onOperationSelect: (op: FilterOperation) => void;\n}\n\nconst Operation = ({\n  columnType = columnTypesMap.text,\n  onOperationSelect,\n}: OperationProps) => {\n  const options = operationsOptions[columnType] || [];\n  const [value, setValue] = useState(options?.[0]?.value);\n\n  useEffect(() => {\n    const selectedOption = options.find((o) => o.value === value);\n    if (selectedOption) {\n      onOperationSelect(selectedOption);\n    }\n  }, [value]);\n\n  return (\n    <Select defaultValue={value} onValueChange={setValue}>\n      <Select.Trigger className={styles.filterOperator}>\n        <Select.Value placeholder=\"Select operation\" />\n      </Select.Trigger>\n      <Select.Content>\n        {options.map((opt) => {\n          return (\n            <Select.Item key={opt.label} value={opt.label}>\n              {opt.label}\n            </Select.Item>\n          );\n        })}\n      </Select.Content>\n    </Select>\n  );\n};\n\nexport const FilteredChip = ({\n  column,\n  updateColumnCustomFilter,\n}: FilteredChipProps) => {\n  const [filterOperation, setFilterOperation] = useState<FilterOperation>();\n  const [filterValue, setFilterValue] = useState<FilterValue>();\n\n  const { table, removeFilterColumn } = useTable();\n  const { filterVariant } = column?.columnDef as ApsaraColumnDef<unknown>;\n  const options: TableColumnMetadata[] =\n    (column?.columnDef?.meta as any)?.data || [];\n\n  const facets = column?.getFacetedUniqueValues();\n  const columnHeader = column?.columnDef?.header;\n  const columnName =\n    (typeof columnHeader === \"string\" && columnHeader) || column.id;\n\n  useEffect(() => {\n    if (filterOperation?.fn && filterValue) {\n      updateColumnCustomFilter(column.id, filterOperation?.fn);\n      column.setFilterValue(filterValue);\n    }\n  }, [filterOperation, filterValue]);\n\n  function removeFilter() {\n    column.setFilterValue(undefined);\n    removeFilterColumn(column.id);\n    setFilterOperation(undefined);\n    setFilterValue({});\n  }\n\n  return (\n    <Box className={styles.chip}>\n      <Text className={styles.filterText}>{columnName}</Text>\n      <Operation\n        columnType={filterVariant}\n        onOperationSelect={setFilterOperation}\n      />\n      {filterOperation?.hideValueField ? null : (\n        <FilterValues\n          column={column}\n          columnType={filterVariant}\n          options={options}\n          onValueChange={setFilterValue}\n          filterOperation={filterOperation}\n        />\n      )}\n\n      {/* close filter chip */}\n      <Flex>\n        <Cross1Icon height=\"12\" width=\"12\" onClick={removeFilter} />\n      </Flex>\n    </Box>\n  );\n};\n"],"names":["columnTypesMap","filterValueTypeMap","useState","useEffect","_jsxs","Select","_jsx","DatePicker","RangePicker","TextField","operationsOptions","styles","useTable","Box","Text","Flex","Cross1Icon"],"mappings":"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"}

package/dist/table/FilteredChip.js

@@ -6,8 +6,6 @@ import { Flex } from '../flex/flex.js';
 import { Select } from '../select/select.js';
 import { Text } from '../text/text.js';
 import { TextField } from '../textfield/textfield.js';
-import '../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/UI.js';
-import '../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/useDayPicker.js';
 import { DatePicker } from '../calendar/date-picker.js';
 import { RangePicker } from '../calendar/range-picker.js';
 import { filterValueTypeMap, columnTypesMap } from './datatables.types.js';

package/dist/table/FilteredChip.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilteredChip.js","sources":["../../table/FilteredChip.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Cross1Icon } from \"@radix-ui/react-icons\";\nimport { Column } from \"@tanstack/table-core\";\nimport { Box } from \"~/box\";\nimport { Flex } from \"~/flex\";\nimport { Select } from \"~/select\";\nimport { Text } from \"~/text\";\nimport { TextField } from \"~/textfield\";\nimport { TableColumnMetadata } from \"~/typings\";\nimport { DatePicker, RangePicker } from \"~/calendar\";\nimport {\n  ApsaraColumnDef,\n  FilterValue,\n  columnTypes,\n  columnTypesMap,\n  filterValueType,\n  filterValueTypeMap,\n  updateColumnFilter,\n} from \"./datatables.types\";\nimport { useTable } from \"./hooks/useTable\";\nimport { FilterOperation, operationsOptions } from \"./filterFns\";\nimport styles from \"./datatable.module.css\";\n\ntype FilteredChipProps = {\n  column: Column<any, unknown>;\n  updateColumnCustomFilter: updateColumnFilter;\n};\n\ninterface getFilterValueTypeOptions {\n  filterOperation?: FilterOperation;\n  columnType?: columnTypes;\n}\n\nconst getFilterValueType = ({\n  filterOperation,\n  columnType,\n}: getFilterValueTypeOptions): filterValueType => {\n  if (filterOperation?.component) {\n    return filterOperation?.component;\n  } else if (columnType === columnTypesMap.date) {\n    return filterValueTypeMap.datePicker;\n  } else if (columnType === columnTypesMap.select) {\n    return filterValueTypeMap.select;\n  } else {\n    return filterValueTypeMap.text;\n  }\n};\n\ninterface FilterValuesProps {\n  columnType?: columnTypes;\n  onValueChange?: (value: FilterValue) => void;\n  options?: TableColumnMetadata[];\n  filterOperation?: FilterOperation;\n  column?: Column<any, unknown>;\n}\n\nconst FilterValues = ({\n  column,\n  columnType = filterValueTypeMap.text,\n  options = [],\n  onValueChange,\n  filterOperation,\n  ...props\n}: FilterValuesProps) => {\n  const [value, setValue] = useState<FilterValue>(\n    (column?.columnDef?.meta as any)?.defaultValue\n      ? { value: (column?.columnDef.meta as any).defaultValue }\n      : {\n          value: \"\",\n          date: new Date(),\n          dateRange: { to: new Date(), from: new Date() },\n        }\n  );\n\n  const valueType = getFilterValueType({ filterOperation, columnType });\n\n  useEffect(() => {\n    if (onValueChange) {\n      onValueChange(value);\n    }\n  }, [value]);\n\n  switch (valueType) {\n    case filterValueTypeMap.select:\n      return (\n        <Select\n          value={value.value as string}\n          onValueChange={(value) => setValue({ value })}\n        >\n          <Select.Trigger>\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content>\n            {options.map((opt) => {\n              return (\n                <Select.Item key={opt.key} value={opt.value}>\n                  {opt.label || opt.value}\n                </Select.Item>\n              );\n            })}\n          </Select.Content>\n        </Select>\n      );\n    case filterValueTypeMap.datePicker:\n      return (\n        <DatePicker\n          onSelect={(date) => setValue({ date })}\n          value={value.date}\n        />\n      );\n    case filterValueTypeMap.rangePicker:\n      return (\n        <RangePicker\n          onSelect={(dateRange) => setValue({ dateRange })}\n          value={value.dateRange}\n        />\n      );\n    default:\n      return (\n        <TextField\n          value={value.value}\n          onChange={(e) => setValue({ value: e.target.value })}\n        />\n      );\n  }\n};\n\ninterface OperationProps {\n  columnType?: columnTypes;\n  onOperationSelect: (op: FilterOperation) => void;\n}\n\nconst Operation = ({\n  columnType = columnTypesMap.text,\n  onOperationSelect,\n}: OperationProps) => {\n  const options = operationsOptions[columnType] || [];\n  const [value, setValue] = useState(options?.[0]?.value);\n\n  useEffect(() => {\n    const selectedOption = options.find((o) => o.value === value);\n    if (selectedOption) {\n      onOperationSelect(selectedOption);\n    }\n  }, [value]);\n\n  return (\n    <Select defaultValue={value} onValueChange={setValue}>\n      <Select.Trigger className={styles.filterOperator}>\n        <Select.Value placeholder=\"Select operation\" />\n      </Select.Trigger>\n      <Select.Content>\n        {options.map((opt) => {\n          return (\n            <Select.Item key={opt.label} value={opt.label}>\n              {opt.label}\n            </Select.Item>\n          );\n        })}\n      </Select.Content>\n    </Select>\n  );\n};\n\nexport const FilteredChip = ({\n  column,\n  updateColumnCustomFilter,\n}: FilteredChipProps) => {\n  const [filterOperation, setFilterOperation] = useState<FilterOperation>();\n  const [filterValue, setFilterValue] = useState<FilterValue>();\n\n  const { table, removeFilterColumn } = useTable();\n  const { filterVariant } = column?.columnDef as ApsaraColumnDef<unknown>;\n  const options: TableColumnMetadata[] =\n    (column?.columnDef?.meta as any)?.data || [];\n\n  const facets = column?.getFacetedUniqueValues();\n  const columnHeader = column?.columnDef?.header;\n  const columnName =\n    (typeof columnHeader === \"string\" && columnHeader) || column.id;\n\n  useEffect(() => {\n    if (filterOperation?.fn && filterValue) {\n      updateColumnCustomFilter(column.id, filterOperation?.fn);\n      column.setFilterValue(filterValue);\n    }\n  }, [filterOperation, filterValue]);\n\n  function removeFilter() {\n    column.setFilterValue(undefined);\n    removeFilterColumn(column.id);\n    setFilterOperation(undefined);\n    setFilterValue({});\n  }\n\n  return (\n    <Box className={styles.chip}>\n      <Text className={styles.filterText}>{columnName}</Text>\n      <Operation\n        columnType={filterVariant}\n        onOperationSelect={setFilterOperation}\n      />\n      {filterOperation?.hideValueField ? null : (\n        <FilterValues\n          column={column}\n          columnType={filterVariant}\n          options={options}\n          onValueChange={setFilterValue}\n          filterOperation={filterOperation}\n        />\n      )}\n\n      {/* close filter chip */}\n      <Flex>\n        <Cross1Icon height=\"12\" width=\"12\" onClick={removeFilter} />\n      </Flex>\n    </Box>\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"FilteredChip.js","sources":["../../table/FilteredChip.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { Cross1Icon } from \"@radix-ui/react-icons\";\nimport { Column } from \"@tanstack/table-core\";\nimport { Box } from \"~/box\";\nimport { Flex } from \"~/flex\";\nimport { Select } from \"~/select\";\nimport { Text } from \"~/text\";\nimport { TextField } from \"~/textfield\";\nimport { TableColumnMetadata } from \"~/typings\";\nimport { DatePicker, RangePicker } from \"~/calendar\";\nimport {\n  ApsaraColumnDef,\n  FilterValue,\n  columnTypes,\n  columnTypesMap,\n  filterValueType,\n  filterValueTypeMap,\n  updateColumnFilter,\n} from \"./datatables.types\";\nimport { useTable } from \"./hooks/useTable\";\nimport { FilterOperation, operationsOptions } from \"./filterFns\";\nimport styles from \"./datatable.module.css\";\n\ntype FilteredChipProps = {\n  column: Column<any, unknown>;\n  updateColumnCustomFilter: updateColumnFilter;\n};\n\ninterface getFilterValueTypeOptions {\n  filterOperation?: FilterOperation;\n  columnType?: columnTypes;\n}\n\nconst getFilterValueType = ({\n  filterOperation,\n  columnType,\n}: getFilterValueTypeOptions): filterValueType => {\n  if (filterOperation?.component) {\n    return filterOperation?.component;\n  } else if (columnType === columnTypesMap.date) {\n    return filterValueTypeMap.datePicker;\n  } else if (columnType === columnTypesMap.select) {\n    return filterValueTypeMap.select;\n  } else {\n    return filterValueTypeMap.text;\n  }\n};\n\ninterface FilterValuesProps {\n  columnType?: columnTypes;\n  onValueChange?: (value: FilterValue) => void;\n  options?: TableColumnMetadata[];\n  filterOperation?: FilterOperation;\n  column?: Column<any, unknown>;\n}\n\nconst FilterValues = ({\n  column,\n  columnType = filterValueTypeMap.text,\n  options = [],\n  onValueChange,\n  filterOperation,\n  ...props\n}: FilterValuesProps) => {\n  const [value, setValue] = useState<FilterValue>(\n    (column?.columnDef?.meta as any)?.defaultValue\n      ? { value: (column?.columnDef.meta as any).defaultValue }\n      : {\n          value: \"\",\n          date: new Date(),\n          dateRange: { to: new Date(), from: new Date() },\n        }\n  );\n\n  const valueType = getFilterValueType({ filterOperation, columnType });\n\n  useEffect(() => {\n    if (onValueChange) {\n      onValueChange(value);\n    }\n  }, [value]);\n\n  switch (valueType) {\n    case filterValueTypeMap.select:\n      return (\n        <Select\n          value={value.value as string}\n          onValueChange={(value) => setValue({ value })}\n        >\n          <Select.Trigger>\n            <Select.Value placeholder=\"Select value\" />\n          </Select.Trigger>\n          <Select.Content>\n            {options.map((opt) => {\n              return (\n                <Select.Item key={opt.key} value={opt.value}>\n                  {opt.label || opt.value}\n                </Select.Item>\n              );\n            })}\n          </Select.Content>\n        </Select>\n      );\n    case filterValueTypeMap.datePicker:\n      return (\n        <DatePicker\n          onSelect={(date) => setValue({ date })}\n          value={value.date}\n        />\n      );\n    case filterValueTypeMap.rangePicker:\n      return (\n        <RangePicker\n          onSelect={(dateRange) => setValue({ dateRange })}\n          value={value.dateRange}\n        />\n      );\n    default:\n      return (\n        <TextField\n          value={value.value}\n          onChange={(e) => setValue({ value: e.target.value })}\n        />\n      );\n  }\n};\n\ninterface OperationProps {\n  columnType?: columnTypes;\n  onOperationSelect: (op: FilterOperation) => void;\n}\n\nconst Operation = ({\n  columnType = columnTypesMap.text,\n  onOperationSelect,\n}: OperationProps) => {\n  const options = operationsOptions[columnType] || [];\n  const [value, setValue] = useState(options?.[0]?.value);\n\n  useEffect(() => {\n    const selectedOption = options.find((o) => o.value === value);\n    if (selectedOption) {\n      onOperationSelect(selectedOption);\n    }\n  }, [value]);\n\n  return (\n    <Select defaultValue={value} onValueChange={setValue}>\n      <Select.Trigger className={styles.filterOperator}>\n        <Select.Value placeholder=\"Select operation\" />\n      </Select.Trigger>\n      <Select.Content>\n        {options.map((opt) => {\n          return (\n            <Select.Item key={opt.label} value={opt.label}>\n              {opt.label}\n            </Select.Item>\n          );\n        })}\n      </Select.Content>\n    </Select>\n  );\n};\n\nexport const FilteredChip = ({\n  column,\n  updateColumnCustomFilter,\n}: FilteredChipProps) => {\n  const [filterOperation, setFilterOperation] = useState<FilterOperation>();\n  const [filterValue, setFilterValue] = useState<FilterValue>();\n\n  const { table, removeFilterColumn } = useTable();\n  const { filterVariant } = column?.columnDef as ApsaraColumnDef<unknown>;\n  const options: TableColumnMetadata[] =\n    (column?.columnDef?.meta as any)?.data || [];\n\n  const facets = column?.getFacetedUniqueValues();\n  const columnHeader = column?.columnDef?.header;\n  const columnName =\n    (typeof columnHeader === \"string\" && columnHeader) || column.id;\n\n  useEffect(() => {\n    if (filterOperation?.fn && filterValue) {\n      updateColumnCustomFilter(column.id, filterOperation?.fn);\n      column.setFilterValue(filterValue);\n    }\n  }, [filterOperation, filterValue]);\n\n  function removeFilter() {\n    column.setFilterValue(undefined);\n    removeFilterColumn(column.id);\n    setFilterOperation(undefined);\n    setFilterValue({});\n  }\n\n  return (\n    <Box className={styles.chip}>\n      <Text className={styles.filterText}>{columnName}</Text>\n      <Operation\n        columnType={filterVariant}\n        onOperationSelect={setFilterOperation}\n      />\n      {filterOperation?.hideValueField ? null : (\n        <FilterValues\n          column={column}\n          columnType={filterVariant}\n          options={options}\n          onValueChange={setFilterValue}\n          filterOperation={filterOperation}\n        />\n      )}\n\n      {/* close filter chip */}\n      <Flex>\n        <Cross1Icon height=\"12\" width=\"12\" onClick={removeFilter} />\n      </Flex>\n    </Box>\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/v1/components/calendar/calendar.cjs

@@ -2,20 +2,20 @@
 
 var jsxRuntime = require('../../node_modules/.pnpm/react@18.2.0/node_modules/react/jsx-runtime.cjs');
 var reactIcons_esm = require('../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.cjs');
-var index$1 = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
+var index = require('../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.cjs');
 var React = require('react');
-var DayPicker = require('../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/DayPicker.cjs');
-require('../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/useDayPicker.cjs');
-var dateLib = require('../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/lib/dateLib.cjs');
-require('../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/UI.cjs');
-var index = require('../../node_modules/.pnpm/react-loading-skeleton@3.4.0_react@18.2.0/node_modules/react-loading-skeleton/dist/index.cjs');
+var clsx = require('../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
 var flex = require('../flex/flex.cjs');
 var select = require('../select/select.cjs');
 var tooltip = require('../tooltip/tooltip.cjs');
+var skeleton = require('../skeleton/skeleton.cjs');
 var calendar_module = require('./calendar.module.css.cjs');
+var iconButton = require('../icon-button/icon-button.cjs');
+var DayPicker = require('../../node_modules/.pnpm/react-day-picker@9.6.7_react@18.2.0/node_modules/react-day-picker/dist/esm/DayPicker.cjs');
+var DateLib = require('../../node_modules/.pnpm/react-day-picker@9.6.7_react@18.2.0/node_modules/react-day-picker/dist/esm/classes/DateLib.cjs');
 
-const root = index$1.cva(calendar_module.default.calendarRoot);
-function DropDown({ options = [], value, onChange, onDropdownOpen, }) {
+const root = index.cva(calendar_module.default.calendarRoot);
+function DropDown({ options = [], value, onChange, onDropdownOpen, disabled, }) {
     const [open, setOpen] = React.useState(false);
     React.useEffect(() => {
         if (open && onDropdownOpen)
@@ -28,25 +28,23 @@ function DropDown({ options = [], value, onChange, onDropdownOpen, }) {
     }
     return (jsxRuntime.jsxRuntimeExports.jsxs(select.Select, { value: value?.toString(), onValueChange: handleChange, open: open, onOpenChange: setOpen, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.Trigger, { className: calendar_module.default.dropdown_trigger, iconProps: {
                     className: calendar_module.default.dropdown_icon,
-                }, stopPropagation: true, size: "small", variant: "text", children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, {}) }), jsxRuntime.jsxRuntimeExports.jsxs(select.Select.Content, { className: calendar_module.default.dropdown_content, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.ScrollUpButton, { asChild: true, children: jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { justify: 'center', children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.ChevronUpIcon, {}) }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Viewport, { children: options.map((opt) => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value.toString(), disabled: opt.disabled, textProps: {
+                }, stopPropagation: true, size: "small", variant: "text", disabled: disabled, children: jsxRuntime.jsxRuntimeExports.jsx(select.Select.Value, {}) }), jsxRuntime.jsxRuntimeExports.jsxs(select.Select.Content, { className: calendar_module.default.dropdown_content, children: [jsxRuntime.jsxRuntimeExports.jsx(select.Select.ScrollUpButton, { asChild: true, children: jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { justify: 'center', children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.ChevronUpIcon, {}) }) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.Viewport, { children: options.map((opt) => (jsxRuntime.jsxRuntimeExports.jsx(select.Select.Item, { value: opt.value.toString(), disabled: opt.disabled, textProps: {
                                 className: calendar_module.default.dropdown_item_text,
                             }, children: opt.label }, opt.value))) }), jsxRuntime.jsxRuntimeExports.jsx(select.Select.ScrollDownButton, { asChild: true, children: jsxRuntime.jsxRuntimeExports.jsx(flex.Flex, { justify: 'center', children: jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.ChevronDownIcon, {}) }) })] })] }));
 }
-const Calendar = function ({ className, classNames, showOutsideDays = true, onDropdownOpen, showTooltip = false, tooltipMessages = {}, loadingData = false, ...props }) {
-    return (jsxRuntime.jsxRuntimeExports.jsx(DayPicker.DayPicker, { showOutsideDays: showOutsideDays, components: {
+const Calendar = function ({ className, classNames, showOutsideDays = true, onDropdownOpen, showTooltip = false, tooltipMessages = {}, loadingData = false, timeZone, ...props }) {
+    return (jsxRuntime.jsxRuntimeExports.jsx(DayPicker.DayPicker, { showOutsideDays: showOutsideDays, timeZone: timeZone, components: {
             Chevron: (props) => {
-                if (props.orientation === 'left') {
-                    return jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.ChevronLeftIcon, { ...props });
-                }
-                return jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.ChevronRightIcon, { ...props });
+                const icon = props.orientation === 'left' ? (jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.ChevronLeftIcon, {})) : (jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.ChevronRightIcon, {}));
+                return (jsxRuntime.jsxRuntimeExports.jsx(iconButton.IconButton, { ...props, disabled: loadingData, className: clsx.clsx(props.className, loadingData && calendar_module.default.disabled), size: 3, "aria-label": props.orientation === 'left' ? 'Previous month' : 'Next month', children: icon }));
             },
-            Dropdown: (props) => (jsxRuntime.jsxRuntimeExports.jsx(DropDown, { ...props, onDropdownOpen: onDropdownOpen })),
+            Dropdown: (props) => (jsxRuntime.jsxRuntimeExports.jsx(DropDown, { ...props, onDropdownOpen: onDropdownOpen, disabled: loadingData })),
             DayButton: (props) => {
                 const { day, ...buttonProps } = props;
-                const message = tooltipMessages[dateLib.dateLib.format(day.date, 'dd-MM-yyyy')];
+                const message = tooltipMessages[DateLib.dateLib.format(day.date, 'dd-MM-yyyy')];
                 return (jsxRuntime.jsxRuntimeExports.jsx(tooltip.Tooltip, { side: "top", disabled: loadingData || !showTooltip || !message, message: message, children: jsxRuntime.jsxRuntimeExports.jsx("button", { ...buttonProps }) }));
             },
-            MonthGrid: (props) => loadingData ? (jsxRuntime.jsxRuntimeExports.jsx(index.default, { count: 6, height: "12px", width: "252px", style: { marginBottom: "var(--rs-space-5)" }, highlightColor: "var(--rs-color-background-base-primary)", baseColor: "var(--rs-color-background-base-primary-hover)" })) : (jsxRuntime.jsxRuntimeExports.jsx("table", { ...props })),
+            MonthGrid: (props) => loadingData ? (jsxRuntime.jsxRuntimeExports.jsx(skeleton.Skeleton, { count: 5, height: "18px", width: "252px", style: { marginBottom: "var(--rs-space-6)" } })) : (jsxRuntime.jsxRuntimeExports.jsx("table", { ...props })),
         }, classNames: {
             caption_label: calendar_module.default.caption_label,
             button_previous: `${calendar_module.default.nav_button} ${calendar_module.default.nav_button_previous}`,

package/dist/v1/components/calendar/calendar.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.cjs","sources":["../../../../v1/components/calendar/calendar.tsx"],"sourcesContent":["import {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n} from '@radix-ui/react-icons';\nimport { cva } from 'class-variance-authority';\nimport { ChangeEvent, useEffect, useState } from 'react';\nimport {\n  dateLib,\n  DayPicker,\n  DayPickerProps,\n  DropdownProps,\n} from 'react-day-picker';\nimport Skeleton from 'react-loading-skeleton';\n\nimport { Flex } from '../flex/flex';\nimport { Select } from '../select';\nimport { Tooltip } from '../tooltip';\nimport styles from './calendar.module.css';\n\ninterface OnDropdownOpen {\n  onDropdownOpen?: VoidFunction;\n}\n\ninterface CalendarPropsExtended {\n  showTooltip?: boolean;\n  tooltipMessages?: { [key: string]: any };\n  loadingData?: boolean;\n}\n\nexport type CalendarProps = DayPickerProps &\n  OnDropdownOpen &\n  CalendarPropsExtended;\n\nconst root = cva(styles.calendarRoot);\n\nfunction DropDown({\n  options = [],\n  value,\n  onChange,\n  onDropdownOpen,\n}: DropdownProps & OnDropdownOpen) {\n  const [open, setOpen] = useState(false);\n\n  useEffect(() => {\n    if (open && onDropdownOpen) onDropdownOpen();\n  }, [open]);\n\n  function handleChange(value: string) {\n    if (onChange) {\n      onChange({ target: { value } } as ChangeEvent<HTMLSelectElement>);\n    }\n  }\n\n  return (\n    <Select\n      value={value?.toString()}\n      onValueChange={handleChange}\n      open={open}\n      onOpenChange={setOpen}\n    >\n      <Select.Trigger\n        className={styles.dropdown_trigger}\n        iconProps={{\n          className: styles.dropdown_icon,\n        }}\n        stopPropagation={true}\n        size=\"small\"\n        variant=\"text\"\n      >\n        <Select.Value />\n      </Select.Trigger>\n      <Select.Content className={styles.dropdown_content}>\n        <Select.ScrollUpButton asChild>\n          <Flex justify={'center'}>\n            <ChevronUpIcon />\n          </Flex>\n        </Select.ScrollUpButton>\n        <Select.Viewport>\n          {options.map((opt) => (\n            <Select.Item\n              value={opt.value.toString()}\n              key={opt.value}\n              disabled={opt.disabled}\n              textProps={{\n                className: styles.dropdown_item_text,\n              }}\n            >\n              {opt.label}\n            </Select.Item>\n          ))}\n        </Select.Viewport>\n        <Select.ScrollDownButton asChild>\n          <Flex justify={'center'}>\n            <ChevronDownIcon />\n          </Flex>\n        </Select.ScrollDownButton>\n      </Select.Content>\n    </Select>\n  );\n}\n\nexport const Calendar = function ({\n  className,\n  classNames,\n  showOutsideDays = true,\n  onDropdownOpen,\n  showTooltip = false,\n  tooltipMessages = {},\n  loadingData = false,\n  ...props\n}: CalendarProps) {\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      components={{\n        Chevron: (props) => {\n          if (props.orientation === 'left') {\n            return <ChevronLeftIcon {...props} />;\n          }\n          return <ChevronRightIcon {...props} />;\n        },\n        Dropdown: (props: DropdownProps) => (\n          <DropDown {...props} onDropdownOpen={onDropdownOpen} />\n        ),\n        DayButton: (props) => {\n          const { day, ...buttonProps } = props;\n          const message =\n            tooltipMessages[dateLib.format(day.date, 'dd-MM-yyyy')];\n          return (\n            <Tooltip\n              side=\"top\"\n              disabled={loadingData || !showTooltip || !message}\n              message={message}\n            >\n              <button {...buttonProps} />\n            </Tooltip>\n          );\n        },\n        MonthGrid: (props) =>\n          loadingData ? (\n            <Skeleton\n              count={6}\n              height=\"12px\"\n              width=\"252px\"\n              style={{ marginBottom: \"var(--rs-space-5)\" }}\n              highlightColor=\"var(--rs-color-background-base-primary)\"\n              baseColor=\"var(--rs-color-background-base-primary-hover)\"\n            />\n          ) : (\n            <table {...props} />\n          ),\n      }}\n      classNames={{\n        caption_label: styles.caption_label,\n        button_previous: `${styles.nav_button} ${styles.nav_button_previous}`,\n        button_next: `${styles.nav_button} ${styles.nav_button_next}`,\n        month_caption: styles.month_caption,\n        months: styles.months,\n        nav: styles.nav,\n        day: styles.day,\n        today: styles.today,\n        outside: styles.outside,\n        week: styles.week,\n        weekdays: styles.week,\n        weekday: styles.weekday,\n        disabled: styles.disabled,\n        selected: styles.selected,\n        day_button: styles.day_button,\n        range_middle: styles.range_middle,\n        range_end: styles.range_end,\n        range_start: styles.range_start,\n        hidden: styles.hidden,\n        dropdowns: styles.dropdowns,\n        ...classNames,\n      }}\n      className={root({ className })}\n      mode=\"single\"\n      {...props}\n    />\n  );\n};\n"],"names":["cva","styles","useState","useEffect","_jsxs","Select","_jsx","Flex","ChevronUpIcon","ChevronDownIcon","DayPicker","ChevronLeftIcon","ChevronRightIcon","dateLib","Tooltip","Skeleton"],"mappings":"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"}
+{"version":3,"file":"calendar.cjs","sources":["../../../../v1/components/calendar/calendar.tsx"],"sourcesContent":["import {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n} from '@radix-ui/react-icons';\nimport { cva } from 'class-variance-authority';\nimport { ChangeEvent, useEffect, useState } from 'react';\nimport {\n  dateLib,\n  DayPicker,\n  DayPickerProps,\n  DropdownProps,\n} from 'react-day-picker';\nimport { clsx } from 'clsx';\n\nimport { Flex } from '../flex/flex';\nimport { Select } from '../select';\nimport { Tooltip } from '../tooltip';\nimport { Skeleton } from '../skeleton';\nimport styles from './calendar.module.css';\nimport { IconButton } from '../icon-button';\n\ninterface OnDropdownOpen {\n  onDropdownOpen?: VoidFunction;\n}\n\ninterface CalendarPropsExtended {\n  showTooltip?: boolean;\n  tooltipMessages?: { [key: string]: any };\n  loadingData?: boolean;\n  timeZone?: string;\n}\n\nexport type CalendarProps = DayPickerProps &\n  OnDropdownOpen &\n  CalendarPropsExtended;\n\nconst root = cva(styles.calendarRoot);\n\ninterface DropDownComponentProps extends DropdownProps, OnDropdownOpen {\n  disabled?: boolean;\n}\n\nfunction DropDown({\n  options = [],\n  value,\n  onChange,\n  onDropdownOpen,\n  disabled,\n}: DropDownComponentProps) {\n  const [open, setOpen] = useState(false);\n\n  useEffect(() => {\n    if (open && onDropdownOpen) onDropdownOpen();\n  }, [open]);\n\n  function handleChange(value: string) {\n    if (onChange) {\n      onChange({ target: { value } } as ChangeEvent<HTMLSelectElement>);\n    }\n  }\n\n  return (\n    <Select\n      value={value?.toString()}\n      onValueChange={handleChange}\n      open={open}\n      onOpenChange={setOpen}\n    >\n      <Select.Trigger\n        className={styles.dropdown_trigger}\n        iconProps={{\n          className: styles.dropdown_icon,\n        }}\n        stopPropagation={true}\n        size=\"small\"\n        variant=\"text\"\n        disabled={disabled}\n      >\n        <Select.Value />\n      </Select.Trigger>\n      <Select.Content className={styles.dropdown_content}>\n        <Select.ScrollUpButton asChild>\n          <Flex justify={'center'}>\n            <ChevronUpIcon />\n          </Flex>\n        </Select.ScrollUpButton>\n        <Select.Viewport>\n          {options.map((opt) => (\n            <Select.Item\n              value={opt.value.toString()}\n              key={opt.value}\n              disabled={opt.disabled}\n              textProps={{\n                className: styles.dropdown_item_text,\n              }}\n            >\n              {opt.label}\n            </Select.Item>\n          ))}\n        </Select.Viewport>\n        <Select.ScrollDownButton asChild>\n          <Flex justify={'center'}>\n            <ChevronDownIcon />\n          </Flex>\n        </Select.ScrollDownButton>\n      </Select.Content>\n    </Select>\n  );\n}\n\nexport const Calendar = function ({\n  className,\n  classNames,\n  showOutsideDays = true,\n  onDropdownOpen,\n  showTooltip = false,\n  tooltipMessages = {},\n  loadingData = false,\n  timeZone,\n  ...props\n}: CalendarProps) {\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      timeZone={timeZone}\n      components={{\n        Chevron: (props) => {\n          const icon = props.orientation === 'left' ? (\n            <ChevronLeftIcon />\n          ) : (\n            <ChevronRightIcon />\n          );\n\n          return (\n            <IconButton \n              {...props} \n              disabled={loadingData}\n              className={clsx(props.className, loadingData && styles.disabled)}\n              size={3}\n              aria-label={props.orientation === 'left' ? 'Previous month' : 'Next month'}\n            >\n              {icon}\n            </IconButton>\n          );\n        },\n        Dropdown: (props: DropdownProps) => (\n          <DropDown \n            {...props} \n            onDropdownOpen={onDropdownOpen}\n            disabled={loadingData}\n          />\n        ),\n        DayButton: (props) => {\n          const { day, ...buttonProps } = props;\n          const message =\n            tooltipMessages[dateLib.format(day.date, 'dd-MM-yyyy')];\n          return (\n            <Tooltip\n              side=\"top\"\n              disabled={loadingData || !showTooltip || !message}\n              message={message}\n            >\n              <button {...buttonProps} />\n            </Tooltip>\n          );\n        },\n        MonthGrid: (props) =>\n          loadingData ? (\n            <Skeleton\n              count={5}\n              height=\"18px\"\n              width=\"252px\"\n              style={{ marginBottom: \"var(--rs-space-6)\" }}\n            />\n          ) : (\n            <table {...props} />\n          ),\n      }}\n      classNames={{\n        caption_label: styles.caption_label,\n        button_previous: `${styles.nav_button} ${styles.nav_button_previous}`,\n        button_next: `${styles.nav_button} ${styles.nav_button_next}`,\n        month_caption: styles.month_caption,\n        months: styles.months,\n        nav: styles.nav,\n        day: styles.day,\n        today: styles.today,\n        outside: styles.outside,\n        week: styles.week,\n        weekdays: styles.week,\n        weekday: styles.weekday,\n        disabled: styles.disabled,\n        selected: styles.selected,\n        day_button: styles.day_button,\n        range_middle: styles.range_middle,\n        range_end: styles.range_end,\n        range_start: styles.range_start,\n        hidden: styles.hidden,\n        dropdowns: styles.dropdowns,\n        ...classNames,\n      }}\n      className={root({ className })}\n      mode=\"single\"\n      {...props}\n    />\n  );\n};\n"],"names":["cva","styles","useState","useEffect","_jsxs","Select","_jsx","Flex","ChevronUpIcon","ChevronDownIcon","DayPicker","ChevronLeftIcon","ChevronRightIcon","IconButton","clsx","dateLib","Tooltip","Skeleton"],"mappings":"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"}

package/dist/v1/components/calendar/calendar.d.ts

@@ -8,8 +8,9 @@ interface CalendarPropsExtended {
         [key: string]: any;
     };
     loadingData?: boolean;
+    timeZone?: string;
 }
 export type CalendarProps = DayPickerProps & OnDropdownOpen & CalendarPropsExtended;
-export declare const Calendar: ({ className, classNames, showOutsideDays, onDropdownOpen, showTooltip, tooltipMessages, loadingData, ...props }: CalendarProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Calendar: ({ className, classNames, showOutsideDays, onDropdownOpen, showTooltip, tooltipMessages, loadingData, timeZone, ...props }: CalendarProps) => import("react/jsx-runtime").JSX.Element;
 export {};
 //# sourceMappingURL=calendar.d.ts.map

package/dist/v1/components/calendar/calendar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../v1/components/calendar/calendar.tsx"],"names":[],"mappings":"AAQA,OAAO,EAGL,cAAc,EAEf,MAAM,kBAAkB,CAAC;AAQ1B,UAAU,cAAc;IACtB,cAAc,CAAC,EAAE,YAAY,CAAC;CAC/B;AAED,UAAU,qBAAqB;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,aAAa,GAAG,cAAc,GACxC,cAAc,GACd,qBAAqB,CAAC;AAsExB,eAAO,MAAM,QAAQ,oHASlB,aAAa,4CAsEf,CAAC"}
+{"version":3,"file":"calendar.d.ts","sourceRoot":"","sources":["../../../../v1/components/calendar/calendar.tsx"],"names":[],"mappings":"AAQA,OAAO,EAGL,cAAc,EAEf,MAAM,kBAAkB,CAAC;AAU1B,UAAU,cAAc;IACtB,cAAc,CAAC,EAAE,YAAY,CAAC;CAC/B;AAED,UAAU,qBAAqB;IAC7B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,MAAM,MAAM,aAAa,GAAG,cAAc,GACxC,cAAc,GACd,qBAAqB,CAAC;AA4ExB,eAAO,MAAM,QAAQ,8HAUlB,aAAa,4CAsFf,CAAC"}

package/dist/v1/components/calendar/calendar.js

@@ -2,18 +2,18 @@ import { j as jsxRuntimeExports } from '../../node_modules/.pnpm/react@18.2.0/no
 import { ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronDownIcon } from '../../node_modules/.pnpm/@radix-ui_react-icons@1.3.0_react@18.2.0/node_modules/@radix-ui/react-icons/dist/react-icons.esm.js';
 import { cva } from '../../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.js';
 import { useState, useEffect } from 'react';
-import { DayPicker } from '../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/DayPicker.js';
-import '../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/useDayPicker.js';
-import { dateLib } from '../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/lib/dateLib.js';
-import '../../node_modules/.pnpm/react-day-picker@9.0.4_react@18.2.0/node_modules/react-day-picker/dist/esm/UI.js';
-import Skeleton from '../../node_modules/.pnpm/react-loading-skeleton@3.4.0_react@18.2.0/node_modules/react-loading-skeleton/dist/index.js';
+import { clsx } from '../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js';
 import { Flex } from '../flex/flex.js';
 import { Select } from '../select/select.js';
 import { Tooltip } from '../tooltip/tooltip.js';
+import { Skeleton } from '../skeleton/skeleton.js';
 import styles from './calendar.module.css.js';
+import { IconButton } from '../icon-button/icon-button.js';
+import { DayPicker } from '../../node_modules/.pnpm/react-day-picker@9.6.7_react@18.2.0/node_modules/react-day-picker/dist/esm/DayPicker.js';
+import { dateLib } from '../../node_modules/.pnpm/react-day-picker@9.6.7_react@18.2.0/node_modules/react-day-picker/dist/esm/classes/DateLib.js';
 
 const root = cva(styles.calendarRoot);
-function DropDown({ options = [], value, onChange, onDropdownOpen, }) {
+function DropDown({ options = [], value, onChange, onDropdownOpen, disabled, }) {
     const [open, setOpen] = useState(false);
     useEffect(() => {
         if (open && onDropdownOpen)
@@ -26,25 +26,23 @@ function DropDown({ options = [], value, onChange, onDropdownOpen, }) {
     }
     return (jsxRuntimeExports.jsxs(Select, { value: value?.toString(), onValueChange: handleChange, open: open, onOpenChange: setOpen, children: [jsxRuntimeExports.jsx(Select.Trigger, { className: styles.dropdown_trigger, iconProps: {
                     className: styles.dropdown_icon,
-                }, stopPropagation: true, size: "small", variant: "text", children: jsxRuntimeExports.jsx(Select.Value, {}) }), jsxRuntimeExports.jsxs(Select.Content, { className: styles.dropdown_content, children: [jsxRuntimeExports.jsx(Select.ScrollUpButton, { asChild: true, children: jsxRuntimeExports.jsx(Flex, { justify: 'center', children: jsxRuntimeExports.jsx(ChevronUpIcon, {}) }) }), jsxRuntimeExports.jsx(Select.Viewport, { children: options.map((opt) => (jsxRuntimeExports.jsx(Select.Item, { value: opt.value.toString(), disabled: opt.disabled, textProps: {
+                }, stopPropagation: true, size: "small", variant: "text", disabled: disabled, children: jsxRuntimeExports.jsx(Select.Value, {}) }), jsxRuntimeExports.jsxs(Select.Content, { className: styles.dropdown_content, children: [jsxRuntimeExports.jsx(Select.ScrollUpButton, { asChild: true, children: jsxRuntimeExports.jsx(Flex, { justify: 'center', children: jsxRuntimeExports.jsx(ChevronUpIcon, {}) }) }), jsxRuntimeExports.jsx(Select.Viewport, { children: options.map((opt) => (jsxRuntimeExports.jsx(Select.Item, { value: opt.value.toString(), disabled: opt.disabled, textProps: {
                                 className: styles.dropdown_item_text,
                             }, children: opt.label }, opt.value))) }), jsxRuntimeExports.jsx(Select.ScrollDownButton, { asChild: true, children: jsxRuntimeExports.jsx(Flex, { justify: 'center', children: jsxRuntimeExports.jsx(ChevronDownIcon, {}) }) })] })] }));
 }
-const Calendar = function ({ className, classNames, showOutsideDays = true, onDropdownOpen, showTooltip = false, tooltipMessages = {}, loadingData = false, ...props }) {
-    return (jsxRuntimeExports.jsx(DayPicker, { showOutsideDays: showOutsideDays, components: {
+const Calendar = function ({ className, classNames, showOutsideDays = true, onDropdownOpen, showTooltip = false, tooltipMessages = {}, loadingData = false, timeZone, ...props }) {
+    return (jsxRuntimeExports.jsx(DayPicker, { showOutsideDays: showOutsideDays, timeZone: timeZone, components: {
             Chevron: (props) => {
-                if (props.orientation === 'left') {
-                    return jsxRuntimeExports.jsx(ChevronLeftIcon, { ...props });
-                }
-                return jsxRuntimeExports.jsx(ChevronRightIcon, { ...props });
+                const icon = props.orientation === 'left' ? (jsxRuntimeExports.jsx(ChevronLeftIcon, {})) : (jsxRuntimeExports.jsx(ChevronRightIcon, {}));
+                return (jsxRuntimeExports.jsx(IconButton, { ...props, disabled: loadingData, className: clsx(props.className, loadingData && styles.disabled), size: 3, "aria-label": props.orientation === 'left' ? 'Previous month' : 'Next month', children: icon }));
             },
-            Dropdown: (props) => (jsxRuntimeExports.jsx(DropDown, { ...props, onDropdownOpen: onDropdownOpen })),
+            Dropdown: (props) => (jsxRuntimeExports.jsx(DropDown, { ...props, onDropdownOpen: onDropdownOpen, disabled: loadingData })),
             DayButton: (props) => {
                 const { day, ...buttonProps } = props;
                 const message = tooltipMessages[dateLib.format(day.date, 'dd-MM-yyyy')];
                 return (jsxRuntimeExports.jsx(Tooltip, { side: "top", disabled: loadingData || !showTooltip || !message, message: message, children: jsxRuntimeExports.jsx("button", { ...buttonProps }) }));
             },
-            MonthGrid: (props) => loadingData ? (jsxRuntimeExports.jsx(Skeleton, { count: 6, height: "12px", width: "252px", style: { marginBottom: "var(--rs-space-5)" }, highlightColor: "var(--rs-color-background-base-primary)", baseColor: "var(--rs-color-background-base-primary-hover)" })) : (jsxRuntimeExports.jsx("table", { ...props })),
+            MonthGrid: (props) => loadingData ? (jsxRuntimeExports.jsx(Skeleton, { count: 5, height: "18px", width: "252px", style: { marginBottom: "var(--rs-space-6)" } })) : (jsxRuntimeExports.jsx("table", { ...props })),
         }, classNames: {
             caption_label: styles.caption_label,
             button_previous: `${styles.nav_button} ${styles.nav_button_previous}`,

package/dist/v1/components/calendar/calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.js","sources":["../../../../v1/components/calendar/calendar.tsx"],"sourcesContent":["import {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n} from '@radix-ui/react-icons';\nimport { cva } from 'class-variance-authority';\nimport { ChangeEvent, useEffect, useState } from 'react';\nimport {\n  dateLib,\n  DayPicker,\n  DayPickerProps,\n  DropdownProps,\n} from 'react-day-picker';\nimport Skeleton from 'react-loading-skeleton';\n\nimport { Flex } from '../flex/flex';\nimport { Select } from '../select';\nimport { Tooltip } from '../tooltip';\nimport styles from './calendar.module.css';\n\ninterface OnDropdownOpen {\n  onDropdownOpen?: VoidFunction;\n}\n\ninterface CalendarPropsExtended {\n  showTooltip?: boolean;\n  tooltipMessages?: { [key: string]: any };\n  loadingData?: boolean;\n}\n\nexport type CalendarProps = DayPickerProps &\n  OnDropdownOpen &\n  CalendarPropsExtended;\n\nconst root = cva(styles.calendarRoot);\n\nfunction DropDown({\n  options = [],\n  value,\n  onChange,\n  onDropdownOpen,\n}: DropdownProps & OnDropdownOpen) {\n  const [open, setOpen] = useState(false);\n\n  useEffect(() => {\n    if (open && onDropdownOpen) onDropdownOpen();\n  }, [open]);\n\n  function handleChange(value: string) {\n    if (onChange) {\n      onChange({ target: { value } } as ChangeEvent<HTMLSelectElement>);\n    }\n  }\n\n  return (\n    <Select\n      value={value?.toString()}\n      onValueChange={handleChange}\n      open={open}\n      onOpenChange={setOpen}\n    >\n      <Select.Trigger\n        className={styles.dropdown_trigger}\n        iconProps={{\n          className: styles.dropdown_icon,\n        }}\n        stopPropagation={true}\n        size=\"small\"\n        variant=\"text\"\n      >\n        <Select.Value />\n      </Select.Trigger>\n      <Select.Content className={styles.dropdown_content}>\n        <Select.ScrollUpButton asChild>\n          <Flex justify={'center'}>\n            <ChevronUpIcon />\n          </Flex>\n        </Select.ScrollUpButton>\n        <Select.Viewport>\n          {options.map((opt) => (\n            <Select.Item\n              value={opt.value.toString()}\n              key={opt.value}\n              disabled={opt.disabled}\n              textProps={{\n                className: styles.dropdown_item_text,\n              }}\n            >\n              {opt.label}\n            </Select.Item>\n          ))}\n        </Select.Viewport>\n        <Select.ScrollDownButton asChild>\n          <Flex justify={'center'}>\n            <ChevronDownIcon />\n          </Flex>\n        </Select.ScrollDownButton>\n      </Select.Content>\n    </Select>\n  );\n}\n\nexport const Calendar = function ({\n  className,\n  classNames,\n  showOutsideDays = true,\n  onDropdownOpen,\n  showTooltip = false,\n  tooltipMessages = {},\n  loadingData = false,\n  ...props\n}: CalendarProps) {\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      components={{\n        Chevron: (props) => {\n          if (props.orientation === 'left') {\n            return <ChevronLeftIcon {...props} />;\n          }\n          return <ChevronRightIcon {...props} />;\n        },\n        Dropdown: (props: DropdownProps) => (\n          <DropDown {...props} onDropdownOpen={onDropdownOpen} />\n        ),\n        DayButton: (props) => {\n          const { day, ...buttonProps } = props;\n          const message =\n            tooltipMessages[dateLib.format(day.date, 'dd-MM-yyyy')];\n          return (\n            <Tooltip\n              side=\"top\"\n              disabled={loadingData || !showTooltip || !message}\n              message={message}\n            >\n              <button {...buttonProps} />\n            </Tooltip>\n          );\n        },\n        MonthGrid: (props) =>\n          loadingData ? (\n            <Skeleton\n              count={6}\n              height=\"12px\"\n              width=\"252px\"\n              style={{ marginBottom: \"var(--rs-space-5)\" }}\n              highlightColor=\"var(--rs-color-background-base-primary)\"\n              baseColor=\"var(--rs-color-background-base-primary-hover)\"\n            />\n          ) : (\n            <table {...props} />\n          ),\n      }}\n      classNames={{\n        caption_label: styles.caption_label,\n        button_previous: `${styles.nav_button} ${styles.nav_button_previous}`,\n        button_next: `${styles.nav_button} ${styles.nav_button_next}`,\n        month_caption: styles.month_caption,\n        months: styles.months,\n        nav: styles.nav,\n        day: styles.day,\n        today: styles.today,\n        outside: styles.outside,\n        week: styles.week,\n        weekdays: styles.week,\n        weekday: styles.weekday,\n        disabled: styles.disabled,\n        selected: styles.selected,\n        day_button: styles.day_button,\n        range_middle: styles.range_middle,\n        range_end: styles.range_end,\n        range_start: styles.range_start,\n        hidden: styles.hidden,\n        dropdowns: styles.dropdowns,\n        ...classNames,\n      }}\n      className={root({ className })}\n      mode=\"single\"\n      {...props}\n    />\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;;;;;;AAmCA,MAAM,IAAI,GAAG,GAAG,CAAC,MAAM,CAAC,YAAY,CAAC,CAAC;AAEtC,SAAS,QAAQ,CAAC,EAChB,OAAO,GAAG,EAAE,EACZ,KAAK,EACL,QAAQ,EACR,cAAc,GACiB,EAAA;IAC/B,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAExC,SAAS,CAAC,MAAK;QACb,IAAI,IAAI,IAAI,cAAc;AAAE,YAAA,cAAc,EAAE,CAAC;AAC/C,KAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,SAAS,YAAY,CAAC,KAAa,EAAA;QACjC,IAAI,QAAQ,EAAE;YACZ,QAAQ,CAAC,EAAE,MAAM,EAAE,EAAE,KAAK,EAAE,EAAoC,CAAC,CAAC;SACnE;KACF;AAED,IAAA,QACEA,sBAAA,CAAC,MAAM,EAAA,EACL,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,EACxB,aAAa,EAAE,YAAY,EAC3B,IAAI,EAAE,IAAI,EACV,YAAY,EAAE,OAAO,EAErB,QAAA,EAAA,CAAAC,qBAAA,CAAC,MAAM,CAAC,OAAO,EACb,EAAA,SAAS,EAAE,MAAM,CAAC,gBAAgB,EAClC,SAAS,EAAE;oBACT,SAAS,EAAE,MAAM,CAAC,aAAa;AAChC,iBAAA,EACD,eAAe,EAAE,IAAI,EACrB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,MAAM,YAEdA,qBAAC,CAAA,MAAM,CAAC,KAAK,EAAA,EAAA,CAAG,GACD,EACjBD,sBAAA,CAAC,MAAM,CAAC,OAAO,EAAC,EAAA,SAAS,EAAE,MAAM,CAAC,gBAAgB,EAChD,QAAA,EAAA,CAAAC,qBAAA,CAAC,MAAM,CAAC,cAAc,IAAC,OAAO,EAAA,IAAA,EAAA,QAAA,EAC5BA,sBAAC,IAAI,EAAA,EAAC,OAAO,EAAE,QAAQ,EACrB,QAAA,EAAAA,qBAAA,CAAC,aAAa,EAAG,EAAA,CAAA,EAAA,CACZ,GACe,EACxBA,qBAAA,CAAC,MAAM,CAAC,QAAQ,EACb,EAAA,QAAA,EAAA,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,MACfA,qBAAC,CAAA,MAAM,CAAC,IAAI,EAAA,EACV,KAAK,EAAE,GAAG,CAAC,KAAK,CAAC,QAAQ,EAAE,EAE3B,QAAQ,EAAE,GAAG,CAAC,QAAQ,EACtB,SAAS,EAAE;gCACT,SAAS,EAAE,MAAM,CAAC,kBAAkB;AACrC,6BAAA,EAAA,QAAA,EAEA,GAAG,CAAC,KAAK,EAAA,EANL,GAAG,CAAC,KAAK,CAOF,CACf,CAAC,EACc,CAAA,EAClBA,qBAAC,CAAA,MAAM,CAAC,gBAAgB,EAAA,EAAC,OAAO,EAAA,IAAA,EAAA,QAAA,EAC9BA,qBAAC,CAAA,IAAI,EAAC,EAAA,OAAO,EAAE,QAAQ,EAAA,QAAA,EACrBA,qBAAC,CAAA,eAAe,KAAG,EACd,CAAA,EAAA,CACiB,CACX,EAAA,CAAA,CAAA,EAAA,CACV,EACT;AACJ,CAAC;AAEM,MAAM,QAAQ,GAAG,UAAU,EAChC,SAAS,EACT,UAAU,EACV,eAAe,GAAG,IAAI,EACtB,cAAc,EACd,WAAW,GAAG,KAAK,EACnB,eAAe,GAAG,EAAE,EACpB,WAAW,GAAG,KAAK,EACnB,GAAG,KAAK,EACM,EAAA;IACd,QACEA,sBAAC,SAAS,EAAA,EACR,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE;AACV,YAAA,OAAO,EAAE,CAAC,KAAK,KAAI;AACjB,gBAAA,IAAI,KAAK,CAAC,WAAW,KAAK,MAAM,EAAE;AAChC,oBAAA,OAAOA,qBAAC,CAAA,eAAe,EAAK,EAAA,GAAA,KAAK,GAAI,CAAC;iBACvC;AACD,gBAAA,OAAOA,qBAAC,CAAA,gBAAgB,EAAK,EAAA,GAAA,KAAK,GAAI,CAAC;aACxC;AACD,YAAA,QAAQ,EAAE,CAAC,KAAoB,MAC7BA,qBAAA,CAAC,QAAQ,EAAA,EAAA,GAAK,KAAK,EAAE,cAAc,EAAE,cAAc,GAAI,CACxD;AACD,YAAA,SAAS,EAAE,CAAC,KAAK,KAAI;gBACnB,MAAM,EAAE,GAAG,EAAE,GAAG,WAAW,EAAE,GAAG,KAAK,CAAC;AACtC,gBAAA,MAAM,OAAO,GACX,eAAe,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC;gBAC1D,QACEA,qBAAC,CAAA,OAAO,EACN,EAAA,IAAI,EAAC,KAAK,EACV,QAAQ,EAAE,WAAW,IAAI,CAAC,WAAW,IAAI,CAAC,OAAO,EACjD,OAAO,EAAE,OAAO,EAEhB,QAAA,EAAAA,qBAAA,CAAA,QAAA,EAAA,EAAA,GAAY,WAAW,EAAA,CAAI,EACnB,CAAA,EACV;aACH;YACD,SAAS,EAAE,CAAC,KAAK,KACf,WAAW,IACTA,sBAAC,QAAQ,EAAA,EACP,KAAK,EAAE,CAAC,EACR,MAAM,EAAC,MAAM,EACb,KAAK,EAAC,OAAO,EACb,KAAK,EAAE,EAAE,YAAY,EAAE,mBAAmB,EAAE,EAC5C,cAAc,EAAC,yCAAyC,EACxD,SAAS,EAAC,+CAA+C,EACzD,CAAA,KAEFA,qBAAA,CAAA,OAAA,EAAA,EAAA,GAAW,KAAK,EAAA,CAAI,CACrB;AACJ,SAAA,EACD,UAAU,EAAE;YACV,aAAa,EAAE,MAAM,CAAC,aAAa;YACnC,eAAe,EAAE,GAAG,MAAM,CAAC,UAAU,CAAI,CAAA,EAAA,MAAM,CAAC,mBAAmB,CAAE,CAAA;YACrE,WAAW,EAAE,GAAG,MAAM,CAAC,UAAU,CAAI,CAAA,EAAA,MAAM,CAAC,eAAe,CAAE,CAAA;YAC7D,aAAa,EAAE,MAAM,CAAC,aAAa;YACnC,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,GAAG,EAAE,MAAM,CAAC,GAAG;YACf,GAAG,EAAE,MAAM,CAAC,GAAG;YACf,KAAK,EAAE,MAAM,CAAC,KAAK;YACnB,OAAO,EAAE,MAAM,CAAC,OAAO;YACvB,IAAI,EAAE,MAAM,CAAC,IAAI;YACjB,QAAQ,EAAE,MAAM,CAAC,IAAI;YACrB,OAAO,EAAE,MAAM,CAAC,OAAO;YACvB,QAAQ,EAAE,MAAM,CAAC,QAAQ;YACzB,QAAQ,EAAE,MAAM,CAAC,QAAQ;YACzB,UAAU,EAAE,MAAM,CAAC,UAAU;YAC7B,YAAY,EAAE,MAAM,CAAC,YAAY;YACjC,SAAS,EAAE,MAAM,CAAC,SAAS;YAC3B,WAAW,EAAE,MAAM,CAAC,WAAW;YAC/B,MAAM,EAAE,MAAM,CAAC,MAAM;YACrB,SAAS,EAAE,MAAM,CAAC,SAAS;AAC3B,YAAA,GAAG,UAAU;AACd,SAAA,EACD,SAAS,EAAE,IAAI,CAAC,EAAE,SAAS,EAAE,CAAC,EAC9B,IAAI,EAAC,QAAQ,EAAA,GACT,KAAK,EAAA,CACT,EACF;AACJ;;;;"}
+{"version":3,"file":"calendar.js","sources":["../../../../v1/components/calendar/calendar.tsx"],"sourcesContent":["import {\n  ChevronDownIcon,\n  ChevronLeftIcon,\n  ChevronRightIcon,\n  ChevronUpIcon,\n} from '@radix-ui/react-icons';\nimport { cva } from 'class-variance-authority';\nimport { ChangeEvent, useEffect, useState } from 'react';\nimport {\n  dateLib,\n  DayPicker,\n  DayPickerProps,\n  DropdownProps,\n} from 'react-day-picker';\nimport { clsx } from 'clsx';\n\nimport { Flex } from '../flex/flex';\nimport { Select } from '../select';\nimport { Tooltip } from '../tooltip';\nimport { Skeleton } from '../skeleton';\nimport styles from './calendar.module.css';\nimport { IconButton } from '../icon-button';\n\ninterface OnDropdownOpen {\n  onDropdownOpen?: VoidFunction;\n}\n\ninterface CalendarPropsExtended {\n  showTooltip?: boolean;\n  tooltipMessages?: { [key: string]: any };\n  loadingData?: boolean;\n  timeZone?: string;\n}\n\nexport type CalendarProps = DayPickerProps &\n  OnDropdownOpen &\n  CalendarPropsExtended;\n\nconst root = cva(styles.calendarRoot);\n\ninterface DropDownComponentProps extends DropdownProps, OnDropdownOpen {\n  disabled?: boolean;\n}\n\nfunction DropDown({\n  options = [],\n  value,\n  onChange,\n  onDropdownOpen,\n  disabled,\n}: DropDownComponentProps) {\n  const [open, setOpen] = useState(false);\n\n  useEffect(() => {\n    if (open && onDropdownOpen) onDropdownOpen();\n  }, [open]);\n\n  function handleChange(value: string) {\n    if (onChange) {\n      onChange({ target: { value } } as ChangeEvent<HTMLSelectElement>);\n    }\n  }\n\n  return (\n    <Select\n      value={value?.toString()}\n      onValueChange={handleChange}\n      open={open}\n      onOpenChange={setOpen}\n    >\n      <Select.Trigger\n        className={styles.dropdown_trigger}\n        iconProps={{\n          className: styles.dropdown_icon,\n        }}\n        stopPropagation={true}\n        size=\"small\"\n        variant=\"text\"\n        disabled={disabled}\n      >\n        <Select.Value />\n      </Select.Trigger>\n      <Select.Content className={styles.dropdown_content}>\n        <Select.ScrollUpButton asChild>\n          <Flex justify={'center'}>\n            <ChevronUpIcon />\n          </Flex>\n        </Select.ScrollUpButton>\n        <Select.Viewport>\n          {options.map((opt) => (\n            <Select.Item\n              value={opt.value.toString()}\n              key={opt.value}\n              disabled={opt.disabled}\n              textProps={{\n                className: styles.dropdown_item_text,\n              }}\n            >\n              {opt.label}\n            </Select.Item>\n          ))}\n        </Select.Viewport>\n        <Select.ScrollDownButton asChild>\n          <Flex justify={'center'}>\n            <ChevronDownIcon />\n          </Flex>\n        </Select.ScrollDownButton>\n      </Select.Content>\n    </Select>\n  );\n}\n\nexport const Calendar = function ({\n  className,\n  classNames,\n  showOutsideDays = true,\n  onDropdownOpen,\n  showTooltip = false,\n  tooltipMessages = {},\n  loadingData = false,\n  timeZone,\n  ...props\n}: CalendarProps) {\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      timeZone={timeZone}\n      components={{\n        Chevron: (props) => {\n          const icon = props.orientation === 'left' ? (\n            <ChevronLeftIcon />\n          ) : (\n            <ChevronRightIcon />\n          );\n\n          return (\n            <IconButton \n              {...props} \n              disabled={loadingData}\n              className={clsx(props.className, loadingData && styles.disabled)}\n              size={3}\n              aria-label={props.orientation === 'left' ? 'Previous month' : 'Next month'}\n            >\n              {icon}\n            </IconButton>\n          );\n        },\n        Dropdown: (props: DropdownProps) => (\n          <DropDown \n            {...props} \n            onDropdownOpen={onDropdownOpen}\n            disabled={loadingData}\n          />\n        ),\n        DayButton: (props) => {\n          const { day, ...buttonProps } = props;\n          const message =\n            tooltipMessages[dateLib.format(day.date, 'dd-MM-yyyy')];\n          return (\n            <Tooltip\n              side=\"top\"\n              disabled={loadingData || !showTooltip || !message}\n              message={message}\n            >\n              <button {...buttonProps} />\n            </Tooltip>\n          );\n        },\n        MonthGrid: (props) =>\n          loadingData ? (\n            <Skeleton\n              count={5}\n              height=\"18px\"\n              width=\"252px\"\n              style={{ marginBottom: \"var(--rs-space-6)\" }}\n            />\n          ) : (\n            <table {...props} />\n          ),\n      }}\n      classNames={{\n        caption_label: styles.caption_label,\n        button_previous: `${styles.nav_button} ${styles.nav_button_previous}`,\n        button_next: `${styles.nav_button} ${styles.nav_button_next}`,\n        month_caption: styles.month_caption,\n        months: styles.months,\n        nav: styles.nav,\n        day: styles.day,\n        today: styles.today,\n        outside: styles.outside,\n        week: styles.week,\n        weekdays: styles.week,\n        weekday: styles.weekday,\n        disabled: styles.disabled,\n        selected: styles.selected,\n        day_button: styles.day_button,\n        range_middle: styles.range_middle,\n        range_end: styles.range_end,\n        range_start: styles.range_start,\n        hidden: styles.hidden,\n        dropdowns: styles.dropdowns,\n        ...classNames,\n      }}\n      className={root({ className })}\n      mode=\"single\"\n      {...props}\n    />\n  );\n};\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/v1/components/calendar/calendar.module.css.cjs

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var styles = {"calendarRoot":"calendar-module_calendarRoot__OZGQR","caption_label":"calendar-module_caption_label__8K7ZD","dropdowns":"calendar-module_dropdowns__0Uj8G","dropdown_trigger":"calendar-module_dropdown_trigger__HJ6Tm","dropdown_item_text":"calendar-module_dropdown_item_text__vUAKC","nav_button":"calendar-module_nav_button__tZDLw","nav_button_previous":"calendar-module_nav_button_previous__NVCfJ","nav_button_next":"calendar-module_nav_button_next__l1U08","months":"calendar-module_months__bBetg","nav":"calendar-module_nav__QMOu0","month_caption":"calendar-module_month_caption__pYPFz","day":"calendar-module_day__8eOAz","disabled":"calendar-module_disabled__ipw4l","outside":"calendar-module_outside__dbHbx","selected":"calendar-module_selected__TlwjL","range_middle":"calendar-module_range_middle__vn4Fr","range_start":"calendar-module_range_start__ErGPG","range_end":"calendar-module_range_end__K6oe-","week":"calendar-module_week__te1nD","day_button":"calendar-module_day_button__F4ayk","weekday":"calendar-module_weekday__H63mo","hidden":"calendar-module_hidden__5XuPD","calendarPopover":"calendar-module_calendarPopover__ykbVn","dropdown_icon":"calendar-module_dropdown_icon__J5WPO","dropdown_content":"calendar-module_dropdown_content__6KXfz","today":"calendar-module_today__HlNqe","calendarFooter":"calendar-module_calendarFooter__kJw5W"};
+var styles = {"calendarRoot":"calendar-module_calendarRoot__OZGQR","caption_label":"calendar-module_caption_label__8K7ZD","dropdowns":"calendar-module_dropdowns__0Uj8G","dropdown_trigger":"calendar-module_dropdown_trigger__HJ6Tm","dropdown_item_text":"calendar-module_dropdown_item_text__vUAKC","nav_button":"calendar-module_nav_button__tZDLw","nav_button_previous":"calendar-module_nav_button_previous__NVCfJ","nav_button_next":"calendar-module_nav_button_next__l1U08","months":"calendar-module_months__bBetg","nav":"calendar-module_nav__QMOu0","month_caption":"calendar-module_month_caption__pYPFz","day":"calendar-module_day__8eOAz","disabled":"calendar-module_disabled__ipw4l","outside":"calendar-module_outside__dbHbx","selected":"calendar-module_selected__TlwjL","range_middle":"calendar-module_range_middle__vn4Fr","range_start":"calendar-module_range_start__ErGPG","range_end":"calendar-module_range_end__K6oe-","week":"calendar-module_week__te1nD","day_button":"calendar-module_day_button__F4ayk","weekday":"calendar-module_weekday__H63mo","hidden":"calendar-module_hidden__5XuPD","calendarPopover":"calendar-module_calendarPopover__ykbVn","dropdown_icon":"calendar-module_dropdown_icon__J5WPO","dropdown_content":"calendar-module_dropdown_content__6KXfz","today":"calendar-module_today__HlNqe","calendarFooter":"calendar-module_calendarFooter__kJw5W","datePickerInput":"calendar-module_datePickerInput__eVoid"};
 
 exports.default = styles;
 //# sourceMappingURL=calendar.module.css.cjs.map

package/dist/v1/components/calendar/calendar.module.css.js

@@ -1,4 +1,4 @@
-var styles = {"calendarRoot":"calendar-module_calendarRoot__OZGQR","caption_label":"calendar-module_caption_label__8K7ZD","dropdowns":"calendar-module_dropdowns__0Uj8G","dropdown_trigger":"calendar-module_dropdown_trigger__HJ6Tm","dropdown_item_text":"calendar-module_dropdown_item_text__vUAKC","nav_button":"calendar-module_nav_button__tZDLw","nav_button_previous":"calendar-module_nav_button_previous__NVCfJ","nav_button_next":"calendar-module_nav_button_next__l1U08","months":"calendar-module_months__bBetg","nav":"calendar-module_nav__QMOu0","month_caption":"calendar-module_month_caption__pYPFz","day":"calendar-module_day__8eOAz","disabled":"calendar-module_disabled__ipw4l","outside":"calendar-module_outside__dbHbx","selected":"calendar-module_selected__TlwjL","range_middle":"calendar-module_range_middle__vn4Fr","range_start":"calendar-module_range_start__ErGPG","range_end":"calendar-module_range_end__K6oe-","week":"calendar-module_week__te1nD","day_button":"calendar-module_day_button__F4ayk","weekday":"calendar-module_weekday__H63mo","hidden":"calendar-module_hidden__5XuPD","calendarPopover":"calendar-module_calendarPopover__ykbVn","dropdown_icon":"calendar-module_dropdown_icon__J5WPO","dropdown_content":"calendar-module_dropdown_content__6KXfz","today":"calendar-module_today__HlNqe","calendarFooter":"calendar-module_calendarFooter__kJw5W"};
+var styles = {"calendarRoot":"calendar-module_calendarRoot__OZGQR","caption_label":"calendar-module_caption_label__8K7ZD","dropdowns":"calendar-module_dropdowns__0Uj8G","dropdown_trigger":"calendar-module_dropdown_trigger__HJ6Tm","dropdown_item_text":"calendar-module_dropdown_item_text__vUAKC","nav_button":"calendar-module_nav_button__tZDLw","nav_button_previous":"calendar-module_nav_button_previous__NVCfJ","nav_button_next":"calendar-module_nav_button_next__l1U08","months":"calendar-module_months__bBetg","nav":"calendar-module_nav__QMOu0","month_caption":"calendar-module_month_caption__pYPFz","day":"calendar-module_day__8eOAz","disabled":"calendar-module_disabled__ipw4l","outside":"calendar-module_outside__dbHbx","selected":"calendar-module_selected__TlwjL","range_middle":"calendar-module_range_middle__vn4Fr","range_start":"calendar-module_range_start__ErGPG","range_end":"calendar-module_range_end__K6oe-","week":"calendar-module_week__te1nD","day_button":"calendar-module_day_button__F4ayk","weekday":"calendar-module_weekday__H63mo","hidden":"calendar-module_hidden__5XuPD","calendarPopover":"calendar-module_calendarPopover__ykbVn","dropdown_icon":"calendar-module_dropdown_icon__J5WPO","dropdown_content":"calendar-module_dropdown_content__6KXfz","today":"calendar-module_today__HlNqe","calendarFooter":"calendar-module_calendarFooter__kJw5W","datePickerInput":"calendar-module_datePickerInput__eVoid"};
 
 export { styles as default };
 //# sourceMappingURL=calendar.module.css.js.map

package/dist/v1/components/calendar/date-picker.cjs

@@ -6,18 +6,18 @@ var dayjs_min = require('../../node_modules/.pnpm/dayjs@1.11.11/node_modules/day
 var customParseFormat = require('../../node_modules/.pnpm/dayjs@1.11.11/node_modules/dayjs/plugin/customParseFormat.cjs');
 var React = require('react');
 var popover = require('../popover/popover.cjs');
-var textfield = require('../textfield/textfield.cjs');
+var inputField = require('../input-field/input-field.cjs');
 var calendar = require('./calendar.cjs');
 var calendar_module = require('./calendar.module.css.cjs');
 
 dayjs_min.default.extend(customParseFormat.default);
-function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", placeholder = "DD/MM/YYYY", textFieldProps, calendarProps, value = new Date(), onSelect = () => { }, children, showCalendarIcon = true, }) {
+function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", inputFieldProps, calendarProps, value = new Date(), onSelect = () => { }, children, showCalendarIcon = true, timeZone, }) {
     const [showCalendar, setShowCalendar] = React.useState(false);
     const [selectedDate, setSelectedDate] = React.useState(value);
-    const [inputState, setInputState] = React.useState();
+    const [error, setError] = React.useState();
     const formattedDate = dayjs_min.default(selectedDate).format(dateFormat);
     const isDropdownOpenRef = React.useRef(false);
-    const textFieldRef = React.useRef(null);
+    const inputFieldRef = React.useRef(null);
     const contentRef = React.useRef(null);
     const isInputFieldFocused = React.useRef(false);
     const selectedDateRef = React.useRef(selectedDate);
@@ -26,7 +26,7 @@ function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", placeholder = "DD
     }, [selectedDate]);
     function isElementOutside(el) {
         return (!isDropdownOpenRef.current && // Month and Year dropdown from Date picker
-            !textFieldRef.current?.contains(el) && // TextField
+            !inputFieldRef.current?.contains(el) && // InputField
             !contentRef.current?.contains(el));
     }
     const handleMouseDown = React.useCallback((event) => {
@@ -42,16 +42,16 @@ function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", placeholder = "DD
         isInputFieldFocused.current = false;
         setShowCalendar(false);
         const updatedVal = dayjs_min.default(selectedDateRef.current).format(dateFormat);
-        if (textFieldRef.current)
-            textFieldRef.current.value = updatedVal;
-        if (inputState === undefined && !skipUpdate)
+        if (inputFieldRef.current)
+            inputFieldRef.current.value = updatedVal;
+        if (!error && !skipUpdate)
             onSelect(dayjs_min.default(updatedVal).toDate());
         document.removeEventListener("mouseup", handleMouseDown);
     }
     const handleSelect = (day) => {
         setSelectedDate(day);
         onSelect(day);
-        setInputState(undefined);
+        setError(undefined);
         removeEventListeners(true);
     };
     function onDropdownOpen() {
@@ -78,12 +78,12 @@ function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", placeholder = "DD
         }
         else {
             registerEventListeners();
-            setTimeout(() => textFieldRef.current?.select());
+            setTimeout(() => inputFieldRef.current?.select());
         }
     }
     function handleKeyUp(event) {
-        if (event.code === "Enter" && textFieldRef.current) {
-            textFieldRef.current.blur();
+        if (event.code === "Enter" && inputFieldRef.current) {
+            inputFieldRef.current.blur();
             removeEventListeners();
         }
     }
@@ -94,9 +94,7 @@ function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", placeholder = "DD
             : value.includes("-")
                 ? "DD-MM-YYYY"
                 : undefined;
-        const date = dayjs_min.default(value.replace(/(\d{1,2})\/(\d{1,2})\/(\d{4})/, (_, day, month, year) => {
-            return `${day.padStart(2, "0")}/${month.padStart(2, "0")}/${year}`; // Replaces [8/8/2024] to [08/08/2024]
-        }), format);
+        const date = dayjs_min.default(value, format);
         const isValidDate = date.isValid();
         const isAfter = calendarProps?.startMonth !== undefined
             ? dayjs_min.default(date).isSameOrAfter(calendarProps.startMonth)
@@ -107,18 +105,17 @@ function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", placeholder = "DD
         const isValid = isValidDate && isAfter && isBefore && dayjs_min.default(date).isSameOrBefore(dayjs_min.default());
         if (isValid) {
             setSelectedDate(date.toDate());
-            if (inputState === "invalid")
-                setInputState(undefined);
+            setError(undefined);
         }
         else {
-            setInputState("invalid");
+            setError("Invalid date");
         }
     }
-    const defaultTrigger = (jsxRuntime.jsxRuntimeExports.jsx(textfield.TextField, { ref: textFieldRef, defaultValue: formattedDate, trailing: showCalendarIcon ? jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.CalendarIcon, {}) : undefined, onChange: handleInputChange, onFocus: handleInputFocus, onBlur: handleInputBlur, state: inputState, placeholder: placeholder, onKeyUp: handleKeyUp, className: calendar_module.default.datePickerInput, ...textFieldProps }));
+    const defaultTrigger = (jsxRuntime.jsxRuntimeExports.jsx(inputField.InputField, { ref: inputFieldRef, size: "small", placeholder: "Select date", trailingIcon: showCalendarIcon ? jsxRuntime.jsxRuntimeExports.jsx(reactIcons_esm.CalendarIcon, {}) : undefined, ...inputFieldProps, defaultValue: formattedDate, onChange: handleInputChange, onFocus: handleInputFocus, onBlur: handleInputBlur, error: error, onKeyUp: handleKeyUp, className: calendar_module.default.datePickerInput }));
     const trigger = typeof children === "function"
         ? children({ selectedDate: formattedDate })
-        : children || defaultTrigger;
-    return (jsxRuntime.jsxRuntimeExports.jsxs(popover.Popover, { open: showCalendar, onOpenChange: onOpenChange, children: [jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Trigger, { asChild: true, children: trigger }), jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Content, { side: side, className: calendar_module.default.calendarPopover, ref: contentRef, children: jsxRuntime.jsxRuntimeExports.jsx(calendar.Calendar, { required: true, ...calendarProps, onDropdownOpen: onDropdownOpen, mode: "single", selected: selectedDate, month: selectedDate, onSelect: handleSelect, onMonthChange: setSelectedDate }) })] }));
+        : children ? jsxRuntime.jsxRuntimeExports.jsx("div", { children: children }) : defaultTrigger;
+    return (jsxRuntime.jsxRuntimeExports.jsxs(popover.Popover, { open: showCalendar, onOpenChange: onOpenChange, children: [jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Trigger, { asChild: true, children: trigger }), jsxRuntime.jsxRuntimeExports.jsx(popover.Popover.Content, { side: side, className: calendar_module.default.calendarPopover, ref: contentRef, children: jsxRuntime.jsxRuntimeExports.jsx(calendar.Calendar, { required: true, ...calendarProps, timeZone: timeZone, onDropdownOpen: onDropdownOpen, mode: "single", selected: selectedDate, month: selectedDate, onSelect: handleSelect, onMonthChange: setSelectedDate }) })] }));
 }
 
 exports.DatePicker = DatePicker;