npm - @commercetools/nimbus - Versions diffs - 0.0.0-canary-20250807210749 → 0.0.0-canary-20250812202252 - Mend

@commercetools/nimbus 0.0.0-canary-20250807210749 → 0.0.0-canary-20250812202252

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (115) hide show

package/dist/chunks/date-range-picker-D7D7R_4k.cjs.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- "use strict";const e=require("react/jsx-runtime"),g=require("@chakra-ui/react"),T=require("./date-range-picker.recipe-BARriKKl.cjs.js"),R=require("@commercetools/nimbus-icons"),P=require("./DatePicker-Ch7j_XH3.cjs.js"),D=require("./Dialog-UM6kRwD8.cjs.js"),V=require("./Group-BQlSpW4r.cjs.js"),w=require("./extractStyleProps-lyk7D-zN.cjs.js"),S=require("./icon-button-BEaNe4rE.cjs.js"),j=require("./text--fhvW47o.cjs.js"),y=require("./date-input-CGy4NHpW.cjs.js"),z=require("./range-calendar-13GVqWSL.cjs.js"),C=require("./time-input-ByUOjN2R.cjs.js"),m=require("react"),E=require("./context-DURpz5en.cjs.js"),I=require("./Button-gAaN5cZZ.cjs.js"),q=require("./utils-sWqo2nmW.cjs.js"),B=require("./DateField-Bd9anPa4.cjs.js"),{withProvider:F,withContext:$}=g.createSlotRecipeContext({recipe:T.dateRangePickerSlotRecipe}),W=F("div","root"),G=$("div","group"),O=$("div","trigger"),A=$("div","popover"),H=$("div","calendar"),L=({hideTimeZone:o,hourCycle:i})=>{const{locale:t}=E.$18f2051aff69b9bf$export$43bb16f9c6d9e3f7(),c=m.useContext(P.$06d5b8ec9ee5d538$export$80d7ae1f804790be),{granularity:d,value:r}=c,u=m.useRef(null),l=m.useRef(r);return d==="day"?null:(m.useEffect(()=>{(r?.start&&l.current?.start?.compare(r.start)!==0\|\|r?.end&&l.current?.end?.compare(r.end)!==0)&&setTimeout(()=>{const s=u.current;if(s){const p=s.querySelector('[role="spinbutton"]');p&&p.focus()}},50),l.current=r},[r]),e.jsxs(g.Flex,{ref:u,borderTop:"solid-25",borderColor:"neutral.3",py:"300",px:"400",alignItems:"center",justifyContent:"center",gap:"200",children:[e.jsxs(g.Flex,{alignItems:"center",gap:"200",children:[e.jsx(j.Text,{textStyle:"xs",fontWeight:"500",color:"neutral.12",minWidth:"fit-content",children:"Start time"}),e.jsx(C.TimeInput,{slot:"startTimeInput",locale:t,variant:"ghost",size:"sm",hideTimeZone:o,hourCycle:i})]}),e.jsxs(g.Flex,{alignItems:"center",gap:"200",children:[e.jsx(j.Text,{textStyle:"xs",fontWeight:"500",color:"neutral.12",minWidth:"fit-content",children:"End time"}),e.jsx(C.TimeInput,{slot:"endTimeInput",locale:t,variant:"ghost",size:"sm",hideTimeZone:o,hourCycle:i})]})]}))},M=({children:o})=>{const i=q.$64fa3d84918910a7$export$fabf2dc03a41866e(I.$d2b4bc8c273e7be6$export$24d547caef80ccd1)\|\|{},t=m.useContext(P.$06d5b8ec9ee5d538$export$80d7ae1f804790be),c=n=>n?.day&&n?.month&&n?.year,d=!t?.value\|\|!c(t.value.start)\|\|!c(t.value.end),{granularity:r}=t,u=t?.value?.start&&"hour"in t.value.start?t.value.start:null,l=t?.value?.end&&"hour"in t.value.end?t.value.end:null,f=i?.isDisabled,s=n=>{const a=n==="start"?"Start":"End";switch(r){case"hour":return`${a} time (hour)`;case"minute":return`${a} time (hour and minute)`;case"second":return`${a} time (hour, minute, and second)`;default:return`${a} time`}},p={calendarToggle:{...i,onPress:n=>{const a=document?.activeElement;a&&a.blur(),i.onPress?.(n)}},clear:{onPress:()=>t?.setValue(null),"aria-label":"Clear input value",isDisabled:f,style:d?{display:"none"}:void 0,"aria-hidden":d?!0:void 0}},b={startTimeInput:{value:u,onChange:n=>{if(n!==null&&t?.value?.start){const a=t.value,x=a.start,h=a.end;if(x&&h){const v=x.set({hour:n.hour,minute:n.minute\|\|0,second:n.second\|\|0,millisecond:n.millisecond\|\|0});t.setValue({start:v,end:h})}}},granularity:r==="day"?void 0:r,"aria-label":s("start")},endTimeInput:{value:l,onChange:n=>{if(n!==null&&t?.value?.end){const a=t.value,x=a.start,h=a.end;if(x&&h){const v=h.set({hour:n.hour,minute:n.minute\|\|0,second:n.second\|\|0,millisecond:n.millisecond\|\|0});t.setValue({start:x,end:v})}}},granularity:r==="day"?void 0:r,"aria-label":s("end")}};return e.jsx(q.$64fa3d84918910a7$export$2881499e37b75b9a,{values:[[I.$d2b4bc8c273e7be6$export$24d547caef80ccd1,{slots:p}],[B.$40825cdb76e74f70$export$8e17ddc448e87c1e,{slots:b}]],children:o})},k=o=>{const{granularity:i="day",hideTimeZone:t,hourCycle:c}=o,d=g.useSlotRecipe({recipe:T.dateRangePickerSlotRecipe}),[r,u]=d.splitVariantProps(o),[l,f]=w.extractStyleProps(u),{size:s="md",variant:p}=r,b=s==="md"?"xs":"2xs",n=i==="day"?o.shouldCloseOnSelect:!1;return e.jsx(W,{...r,...l,asChild:!0,children:e.jsx(P.$06d5b8ec9ee5d538$export$17334619f3ac2224,{...f,shouldCloseOnSelect:n,children:e.jsxs(M,{children:[e.jsx(G,{asChild:!0,children:e.jsxs(V.$a049562f99e7db0e$export$eb2fcfdbd7ba97d4,{children:[e.jsx(y.DateInput,{slot:"start",size:s,variant:"plain",width:"auto",hideTimeZone:t,hourCycle:c}),e.jsx(j.Text,{as:"span",px:"150",color:"neutral.11",userSelect:"none","aria-hidden":"true",slot:null,children:"–"}),e.jsx(y.DateInput,{slot:"end",size:s,variant:"plain",width:"auto",hideTimeZone:t,hourCycle:c}),e.jsxs(O,{children:[e.jsx(S.IconButton,{tone:"primary",variant:"ghost",size:b,slot:"clear",children:e.jsx(R.Close,{})}),e.jsx(S.IconButton,{tone:"primary",variant:"ghost",size:b,slot:"calendarToggle",children:e.jsx(R.CalendarMonth,{})})]})]})}),e.jsx(A,{asChild:!0,children:e.jsx(D.$07b14b47974efb58$export$5b6b19405a83ff9d,{placement:"bottom end",children:e.jsxs(D.$de32f1b87079253c$export$3ddf2d174ce01153,{children:[e.jsx(H,{children:e.jsx(z.RangeCalendar,{})}),e.jsx(L,{hideTimeZone:t,hourCycle:c})]})})})]})})})};k.displayName="DateRangePicker";exports.DateRangePicker=k;
2	- //# sourceMappingURL=date-range-picker-D7D7R_4k.cjs.js.map

package/dist/chunks/date-range-picker-D7D7R_4k.cjs.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"date-range-picker-D7D7R_4k.cjs.js","sources":["../../src/components/date-range-picker/date-range-picker.slots.tsx","../../src/components/date-range-picker/components/date-range-picker.time-input.tsx","../../src/components/date-range-picker/components/date-range-picker.custom-context.tsx","../../src/components/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import {\n type HTMLChakraProps,\n type RecipeProps,\n type UnstyledProp,\n createSlotRecipeContext,\n} from \"@chakra-ui/react\";\n\nimport { dateRangePickerSlotRecipe } from \"./date-range-picker.recipe\";\n\n/**\n * Base recipe props interface that combines Chakra UI's recipe props\n * with the unstyled prop option for the div element.\n */\ninterface DateRangePickerRecipeProps extends RecipeProps<\"div\">, UnstyledProp {}\n\n/**\n * Root props interface that extends Chakra's HTML props with our recipe props.\n * This creates a complete set of props for the root element, combining\n * HTML attributes, Chakra's styling system, and our custom recipe props.\n */\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface DateRangePickerRootProps\n extends HTMLChakraProps<\"div\", DateRangePickerRecipeProps> {}\n\n// Correctly destructure from createSlotRecipeContext based on project examples\nconst { withProvider, withContext } = createSlotRecipeContext({\n recipe: dateRangePickerSlotRecipe,\n});\n\n/**\n * Root component that provides the styling context for the DateRangePicker component.\n * Uses Chakra UI's recipe context system for consistent styling across instances.\n */\nexport const DateRangePickerRootSlot = withProvider<\n HTMLDivElement,\n DateRangePickerRootProps\n>(\"div\", \"root\");\n\n/**\n * Slot component for the input group containing the DateInput and trigger button.\n */\nexport const DateRangePickerGroupSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"group\");\n\n/**\n * Slot component for the trigger button that opens the calendar popover.\n */\nexport const DateRangePickerTriggerSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"trigger\");\n\n/**\n * Slot component for the popover container.\n */\nexport const DateRangePickerPopoverSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"popover\");\n\n/**\n * Slot component for the calendar container within the popover.\n */\nexport const DateRangePickerCalendarSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"calendar\");\n\n/**\n * Slot component for the calendar header.\n */\nexport const DateRangePickerCalendarHeaderSlot = withContext<\n HTMLElement,\n HTMLChakraProps<\"header\">\n>(\"header\", \"calendarHeader\");\n\n/**\n * Slot component for the calendar grid.\n */\nexport const DateRangePickerCalendarGridSlot = withContext<\n HTMLTableElement,\n HTMLChakraProps<\"table\">\n>(\"table\", \"calendarGrid\");\n\n/**\n * Slot component for individual calendar cells.\n */\nexport const DateRangePickerCalendarCellSlot = withContext<\n HTMLTableCellElement,\n HTMLChakraProps<\"td\">\n>(\"td\", \"calendarCell\");\n","import { Flex, Text, TimeInput } from \"@/components\";\nimport { useContext, useRef, useEffect } from \"react\";\nimport { useLocale } from \"react-aria\";\nimport { DateRangePickerStateContext } from \"react-aria-components\";\nimport type { DateRangePickerTimeInputProps } from \"../date-range-picker.types\";\n\nexport const DateRangePickerTimeInput = ({\n hideTimeZone,\n hourCycle,\n}: DateRangePickerTimeInputProps) => {\n const { locale } = useLocale();\n const dateRangePickerState = useContext(DateRangePickerStateContext);\n const { granularity, value } = dateRangePickerState!;\n const timeInputRef = useRef<HTMLDivElement>(null);\n const previousValueRef = useRef(value);\n\n // do not show up to the party if you're not invited\n if (granularity === \"day\") {\n return null;\n }\n\n // DateRangePicker-specific: Focus the time input when date range changes (user selects dates from calendar)\n useEffect(() => {\n // DateRangePicker-specific: Check if date range changed by comparing start and end dates\n const hasValueChanged =\n (value?.start &&\n previousValueRef.current?.start?.compare(value.start) !== 0) ||\n (value?.end && previousValueRef.current?.end?.compare(value.end) !== 0);\n\n if (hasValueChanged) {\n // Small delay to ensure the DOM is ready\n setTimeout(() => {\n // Find the first focusable segment within the time input container\n const container = timeInputRef.current;\n if (container) {\n const firstSegment = container.querySelector(\n '[role=\"spinbutton\"]'\n ) as HTMLElement;\n\n if (firstSegment) {\n firstSegment.focus();\n }\n }\n }, 50);\n }\n\n // DateRangePicker-specific: Update previous value reference for range comparison\n previousValueRef.current = value;\n }, [value]);\n\n return (\n <Flex\n ref={timeInputRef}\n borderTop=\"solid-25\"\n borderColor=\"neutral.3\"\n py=\"300\"\n px=\"400\"\n alignItems=\"center\"\n justifyContent=\"center\"\n gap=\"200\"\n >\n {/* DateRangePicker-specific: Start DateInput with separate label */}\n <Flex alignItems=\"center\" gap=\"200\">\n {/* TODO: translate hardcoded string */}\n <Text\n textStyle=\"xs\"\n fontWeight=\"500\"\n color=\"neutral.12\"\n minWidth=\"fit-content\"\n >\n Start time\n </Text>\n <TimeInput\n slot=\"startTimeInput\"\n locale={locale}\n variant=\"ghost\"\n size=\"sm\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n </Flex>\n\n {/* DateRangePicker-specific: End DateInput with separate label */}\n <Flex alignItems=\"center\" gap=\"200\">\n {/* TODO: translate hardcoded string */}\n <Text\n textStyle=\"xs\"\n fontWeight=\"500\"\n color=\"neutral.12\"\n minWidth=\"fit-content\"\n >\n End time\n </Text>\n <TimeInput\n slot=\"endTimeInput\"\n locale={locale}\n variant=\"ghost\"\n size=\"sm\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n </Flex>\n </Flex>\n );\n};\n","import { useContext, type ReactNode } from \"react\";\nimport {\n Provider,\n ButtonContext,\n DateRangePickerStateContext,\n TimeFieldContext,\n useSlottedContext,\n} from \"react-aria-components\";\nimport type { PressEvent, TimeValue } from \"react-aria\";\n\nexport const DateRangePickerCustomContext = ({\n children,\n}: {\n children: ReactNode;\n}) => {\n const buttonContext = useSlottedContext(ButtonContext) || {};\n const dateRangePickerState = useContext(DateRangePickerStateContext);\n\n // DateRangePicker-specific: Check if all 6 segments (start: day, month, year; end: day, month, year) have values\n const hasCompleteRangeDate = (date: any) =>\n date?.day && date?.month && date?.year;\n\n const incompleteValue =\n !dateRangePickerState?.value ||\n !hasCompleteRangeDate(dateRangePickerState.value.start) ||\n !hasCompleteRangeDate(dateRangePickerState.value.end);\n\n // eslint-disable-next-line @typescript-eslint/unbound-method\n const { granularity } = dateRangePickerState!;\n\n // DateRangePicker-specific: Extract time values from start and end dates separately\n const startTimeValue =\n dateRangePickerState?.value?.start &&\n \"hour\" in dateRangePickerState.value.start\n ? dateRangePickerState.value.start\n : null;\n const endTimeValue =\n dateRangePickerState?.value?.end && \"hour\" in dateRangePickerState.value.end\n ? dateRangePickerState.value.end\n : null;\n\n // Try to get disabled state from the button context\n const isDateRangePickerDisabled = buttonContext?.isDisabled;\n\n // Generate default aria-label based on granularity if not provided\n const getDefaultTimeInputAriaLabel = (type: \"start\" | \"end\") => {\n const prefix = type === \"start\" ? \"Start\" : \"End\";\n switch (granularity) {\n case \"hour\":\n return `${prefix} time (hour)`;\n case \"minute\":\n return `${prefix} time (hour and minute)`;\n case \"second\":\n return `${prefix} time (hour, minute, and second)`;\n default:\n return `${prefix} time`;\n }\n };\n\n /**\n * Button slots\n * ================================\n */\n const buttonSlots = {\n /** toggles the calendar popover */\n calendarToggle: {\n ...buttonContext,\n onPress: (event: PressEvent) => {\n // Ensure any active input (e.g., date picker segment) loses focus\n // because blurring the input will close the popover if it's open (or was just opened)\n const activeElement = document?.activeElement as HTMLElement | null;\n\n if (activeElement) {\n activeElement.blur();\n }\n\n buttonContext.onPress?.(event);\n },\n },\n /** Clear button that displays when there's a value in each segment - hidden from both visual and screen readers when there's no value */\n clear: {\n // DateRangePicker-specific: Clear both start and end values\n onPress: () => dateRangePickerState?.setValue(null),\n \"aria-label\": \"Clear input value\",\n isDisabled: isDateRangePickerDisabled,\n // Hide the button when there's no value\n style: incompleteValue ? { display: \"none\" } : undefined,\n \"aria-hidden\": incompleteValue ? true : undefined,\n },\n };\n\n /**\n * TimeInput slots\n * ================================\n */\n\n // DateRangePicker-specific: Separate time input slots for start and end times\n const timeInputSlots = {\n startTimeInput: {\n value: startTimeValue,\n onChange: (value: TimeValue | null) => {\n if (value !== null && dateRangePickerState?.value?.start) {\n // DateRangePicker-specific: Update the start date with the new time\n const currentValue = dateRangePickerState.value;\n const startDate = currentValue.start;\n const endDate = currentValue.end;\n if (startDate && endDate) {\n const newStartDate = startDate.set({\n hour: value.hour,\n minute: value.minute || 0,\n second: value.second || 0,\n millisecond: value.millisecond || 0,\n });\n\n dateRangePickerState.setValue({\n start: newStartDate,\n end: endDate,\n });\n }\n }\n },\n granularity: granularity === \"day\" ? undefined : granularity,\n \"aria-label\": getDefaultTimeInputAriaLabel(\"start\"),\n },\n endTimeInput: {\n value: endTimeValue,\n onChange: (value: TimeValue | null) => {\n if (value !== null && dateRangePickerState?.value?.end) {\n // DateRangePicker-specific: Update the end date with the new time\n const currentValue = dateRangePickerState.value;\n const startDate = currentValue.start;\n const endDate = currentValue.end;\n if (startDate && endDate) {\n const newEndDate = endDate.set({\n hour: value.hour,\n minute: value.minute || 0,\n second: value.second || 0,\n millisecond: value.millisecond || 0,\n });\n\n dateRangePickerState.setValue({\n start: startDate,\n end: newEndDate,\n });\n }\n }\n },\n granularity: granularity === \"day\" ? undefined : granularity,\n \"aria-label\": getDefaultTimeInputAriaLabel(\"end\"),\n },\n };\n\n return (\n <Provider\n values={[\n [\n ButtonContext,\n {\n slots: buttonSlots,\n },\n ],\n [TimeFieldContext, { slots: timeInputSlots }],\n ]}\n >\n {children}\n </Provider>\n );\n};\n","import {\n DateRangePickerRootSlot,\n DateRangePickerGroupSlot,\n DateRangePickerTriggerSlot,\n DateRangePickerPopoverSlot,\n DateRangePickerCalendarSlot,\n} from \"./date-range-picker.slots\";\n\nimport { CalendarMonth, Close } from \"@commercetools/nimbus-icons\";\n\nimport {\n DateRangePicker as ReactAriaDateRangePicker,\n Group,\n Popover,\n Dialog,\n} from \"react-aria-components\";\nimport { useSlotRecipe } from \"@chakra-ui/react\";\nimport { dateRangePickerSlotRecipe } from \"./date-range-picker.recipe\";\nimport type { DateRangePickerProps } from \"./date-range-picker.types\";\nimport { extractStyleProps } from \"@/utils/extractStyleProps\";\nimport { DateInput, RangeCalendar, IconButton, Text } from \"@/components\";\nimport { DateRangePickerTimeInput } from \"./components/date-range-picker.time-input\";\nimport { DateRangePickerCustomContext } from \"./components/date-range-picker.custom-context\";\n\n/**\n * DateRangePicker\n * ============================================================\n * Combines a DateInput with a RangeCalendar popover for date range selection.\n * Users can either type a date range directly or select from the calendar.\n */\nexport const DateRangePicker = (props: DateRangePickerProps) => {\n // Forward hideTimeZone and hourCycle to child components (footer time inputs)\n const { granularity = \"day\", hideTimeZone, hourCycle } = props;\n const recipe = useSlotRecipe({ recipe: dateRangePickerSlotRecipe });\n const [recipeProps, remainingProps] = recipe.splitVariantProps(props);\n\n const [styleProps, otherProps] = extractStyleProps(remainingProps);\n\n // Extract size and variant from recipe props to pass to DateInputs\n const { size = \"md\", variant } = recipeProps;\n\n // the size of the buttons overlaying the input\n const overlayButtonSize = size === \"md\" ? \"xs\" : \"2xs\";\n\n // When granularity is \"day\", use the prop value (defaults to true if not provided)\n // For other granularities (time-based), force to false so users can set both date and time\n const shouldCloseOnSelect =\n granularity === \"day\" ? props.shouldCloseOnSelect : false;\n\n return (\n <DateRangePickerRootSlot {...recipeProps} {...styleProps} asChild>\n <ReactAriaDateRangePicker\n {...otherProps}\n shouldCloseOnSelect={shouldCloseOnSelect}\n >\n <DateRangePickerCustomContext>\n <DateRangePickerGroupSlot asChild>\n <Group>\n <DateInput\n slot=\"start\"\n size={size}\n variant=\"plain\"\n width=\"auto\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n <Text\n as=\"span\"\n px=\"150\"\n color=\"neutral.11\"\n userSelect=\"none\"\n aria-hidden=\"true\"\n slot={null}\n >\n –\n </Text>\n <DateInput\n slot=\"end\"\n size={size}\n variant=\"plain\"\n width=\"auto\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n <DateRangePickerTriggerSlot>\n {/* @ts-expect-error react aria is adding the aria-label prop */}\n <IconButton\n tone=\"primary\"\n variant=\"ghost\"\n size={overlayButtonSize}\n slot=\"clear\"\n >\n <Close />\n </IconButton>\n {/* @ts-expect-error react aria is adding the aria-label prop */}\n <IconButton\n tone=\"primary\"\n variant=\"ghost\"\n size={overlayButtonSize}\n slot=\"calendarToggle\"\n >\n <CalendarMonth />\n </IconButton>\n </DateRangePickerTriggerSlot>\n </Group>\n </DateRangePickerGroupSlot>\n <DateRangePickerPopoverSlot asChild>\n <Popover placement=\"bottom end\">\n <Dialog>\n <DateRangePickerCalendarSlot>\n <RangeCalendar />\n </DateRangePickerCalendarSlot>\n <DateRangePickerTimeInput\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n </Dialog>\n </Popover>\n </DateRangePickerPopoverSlot>\n </DateRangePickerCustomContext>\n </ReactAriaDateRangePicker>\n </DateRangePickerRootSlot>\n );\n};\n\nDateRangePicker.displayName = \"DateRangePicker\";\n"],"names":["withProvider","withContext","createSlotRecipeContext","dateRangePickerSlotRecipe","DateRangePickerRootSlot","DateRangePickerGroupSlot","DateRangePickerTriggerSlot","DateRangePickerPopoverSlot","DateRangePickerCalendarSlot","DateRangePickerTimeInput","hideTimeZone","hourCycle","locale","useLocale","dateRangePickerState","useContext","DateRangePickerStateContext","granularity","value","timeInputRef","useRef","previousValueRef","useEffect","container","firstSegment","jsxs","Flex","jsx","Text","TimeInput","DateRangePickerCustomContext","children","buttonContext","useSlottedContext","ButtonContext","hasCompleteRangeDate","date","incompleteValue","startTimeValue","endTimeValue","isDateRangePickerDisabled","getDefaultTimeInputAriaLabel","type","prefix","buttonSlots","event","activeElement","timeInputSlots","currentValue","startDate","endDate","newStartDate","newEndDate","Provider","TimeFieldContext","DateRangePicker","props","recipe","useSlotRecipe","recipeProps","remainingProps","styleProps","otherProps","extractStyleProps","size","variant","overlayButtonSize","shouldCloseOnSelect","ReactAriaDateRangePicker","Group","DateInput","IconButton","Close","CalendarMonth","Popover","Dialog","RangeCalendar"],"mappings":"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"}

package/dist/chunks/date-range-picker-DGKM05wQ.es.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"date-range-picker-DGKM05wQ.es.js","sources":["../../src/components/date-range-picker/date-range-picker.slots.tsx","../../src/components/date-range-picker/components/date-range-picker.time-input.tsx","../../src/components/date-range-picker/components/date-range-picker.custom-context.tsx","../../src/components/date-range-picker/date-range-picker.tsx"],"sourcesContent":["import {\n type HTMLChakraProps,\n type RecipeProps,\n type UnstyledProp,\n createSlotRecipeContext,\n} from \"@chakra-ui/react\";\n\nimport { dateRangePickerSlotRecipe } from \"./date-range-picker.recipe\";\n\n/**\n * Base recipe props interface that combines Chakra UI's recipe props\n * with the unstyled prop option for the div element.\n */\ninterface DateRangePickerRecipeProps extends RecipeProps<\"div\">, UnstyledProp {}\n\n/**\n * Root props interface that extends Chakra's HTML props with our recipe props.\n * This creates a complete set of props for the root element, combining\n * HTML attributes, Chakra's styling system, and our custom recipe props.\n */\n// eslint-disable-next-line @typescript-eslint/no-empty-object-type\nexport interface DateRangePickerRootProps\n extends HTMLChakraProps<\"div\", DateRangePickerRecipeProps> {}\n\n// Correctly destructure from createSlotRecipeContext based on project examples\nconst { withProvider, withContext } = createSlotRecipeContext({\n recipe: dateRangePickerSlotRecipe,\n});\n\n/**\n * Root component that provides the styling context for the DateRangePicker component.\n * Uses Chakra UI's recipe context system for consistent styling across instances.\n */\nexport const DateRangePickerRootSlot = withProvider<\n HTMLDivElement,\n DateRangePickerRootProps\n>(\"div\", \"root\");\n\n/**\n * Slot component for the input group containing the DateInput and trigger button.\n */\nexport const DateRangePickerGroupSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"group\");\n\n/**\n * Slot component for the trigger button that opens the calendar popover.\n */\nexport const DateRangePickerTriggerSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"trigger\");\n\n/**\n * Slot component for the popover container.\n */\nexport const DateRangePickerPopoverSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"popover\");\n\n/**\n * Slot component for the calendar container within the popover.\n */\nexport const DateRangePickerCalendarSlot = withContext<\n HTMLDivElement,\n HTMLChakraProps<\"div\">\n>(\"div\", \"calendar\");\n\n/**\n * Slot component for the calendar header.\n */\nexport const DateRangePickerCalendarHeaderSlot = withContext<\n HTMLElement,\n HTMLChakraProps<\"header\">\n>(\"header\", \"calendarHeader\");\n\n/**\n * Slot component for the calendar grid.\n */\nexport const DateRangePickerCalendarGridSlot = withContext<\n HTMLTableElement,\n HTMLChakraProps<\"table\">\n>(\"table\", \"calendarGrid\");\n\n/**\n * Slot component for individual calendar cells.\n */\nexport const DateRangePickerCalendarCellSlot = withContext<\n HTMLTableCellElement,\n HTMLChakraProps<\"td\">\n>(\"td\", \"calendarCell\");\n","import { Flex, Text, TimeInput } from \"@/components\";\nimport { useContext, useRef, useEffect } from \"react\";\nimport { useLocale } from \"react-aria\";\nimport { DateRangePickerStateContext } from \"react-aria-components\";\nimport type { DateRangePickerTimeInputProps } from \"../date-range-picker.types\";\n\nexport const DateRangePickerTimeInput = ({\n hideTimeZone,\n hourCycle,\n}: DateRangePickerTimeInputProps) => {\n const { locale } = useLocale();\n const dateRangePickerState = useContext(DateRangePickerStateContext);\n const { granularity, value } = dateRangePickerState!;\n const timeInputRef = useRef<HTMLDivElement>(null);\n const previousValueRef = useRef(value);\n\n // do not show up to the party if you're not invited\n if (granularity === \"day\") {\n return null;\n }\n\n // DateRangePicker-specific: Focus the time input when date range changes (user selects dates from calendar)\n useEffect(() => {\n // DateRangePicker-specific: Check if date range changed by comparing start and end dates\n const hasValueChanged =\n (value?.start &&\n previousValueRef.current?.start?.compare(value.start) !== 0) ||\n (value?.end && previousValueRef.current?.end?.compare(value.end) !== 0);\n\n if (hasValueChanged) {\n // Small delay to ensure the DOM is ready\n setTimeout(() => {\n // Find the first focusable segment within the time input container\n const container = timeInputRef.current;\n if (container) {\n const firstSegment = container.querySelector(\n '[role=\"spinbutton\"]'\n ) as HTMLElement;\n\n if (firstSegment) {\n firstSegment.focus();\n }\n }\n }, 50);\n }\n\n // DateRangePicker-specific: Update previous value reference for range comparison\n previousValueRef.current = value;\n }, [value]);\n\n return (\n <Flex\n ref={timeInputRef}\n borderTop=\"solid-25\"\n borderColor=\"neutral.3\"\n py=\"300\"\n px=\"400\"\n alignItems=\"center\"\n justifyContent=\"center\"\n gap=\"200\"\n >\n {/* DateRangePicker-specific: Start DateInput with separate label */}\n <Flex alignItems=\"center\" gap=\"200\">\n {/* TODO: translate hardcoded string */}\n <Text\n textStyle=\"xs\"\n fontWeight=\"500\"\n color=\"neutral.12\"\n minWidth=\"fit-content\"\n >\n Start time\n </Text>\n <TimeInput\n slot=\"startTimeInput\"\n locale={locale}\n variant=\"ghost\"\n size=\"sm\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n </Flex>\n\n {/* DateRangePicker-specific: End DateInput with separate label */}\n <Flex alignItems=\"center\" gap=\"200\">\n {/* TODO: translate hardcoded string */}\n <Text\n textStyle=\"xs\"\n fontWeight=\"500\"\n color=\"neutral.12\"\n minWidth=\"fit-content\"\n >\n End time\n </Text>\n <TimeInput\n slot=\"endTimeInput\"\n locale={locale}\n variant=\"ghost\"\n size=\"sm\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n </Flex>\n </Flex>\n );\n};\n","import { useContext, type ReactNode } from \"react\";\nimport {\n Provider,\n ButtonContext,\n DateRangePickerStateContext,\n TimeFieldContext,\n useSlottedContext,\n} from \"react-aria-components\";\nimport type { PressEvent, TimeValue } from \"react-aria\";\n\nexport const DateRangePickerCustomContext = ({\n children,\n}: {\n children: ReactNode;\n}) => {\n const buttonContext = useSlottedContext(ButtonContext) || {};\n const dateRangePickerState = useContext(DateRangePickerStateContext);\n\n // DateRangePicker-specific: Check if all 6 segments (start: day, month, year; end: day, month, year) have values\n const hasCompleteRangeDate = (date: any) =>\n date?.day && date?.month && date?.year;\n\n const incompleteValue =\n !dateRangePickerState?.value ||\n !hasCompleteRangeDate(dateRangePickerState.value.start) ||\n !hasCompleteRangeDate(dateRangePickerState.value.end);\n\n // eslint-disable-next-line @typescript-eslint/unbound-method\n const { granularity } = dateRangePickerState!;\n\n // DateRangePicker-specific: Extract time values from start and end dates separately\n const startTimeValue =\n dateRangePickerState?.value?.start &&\n \"hour\" in dateRangePickerState.value.start\n ? dateRangePickerState.value.start\n : null;\n const endTimeValue =\n dateRangePickerState?.value?.end && \"hour\" in dateRangePickerState.value.end\n ? dateRangePickerState.value.end\n : null;\n\n // Try to get disabled state from the button context\n const isDateRangePickerDisabled = buttonContext?.isDisabled;\n\n // Generate default aria-label based on granularity if not provided\n const getDefaultTimeInputAriaLabel = (type: \"start\" | \"end\") => {\n const prefix = type === \"start\" ? \"Start\" : \"End\";\n switch (granularity) {\n case \"hour\":\n return `${prefix} time (hour)`;\n case \"minute\":\n return `${prefix} time (hour and minute)`;\n case \"second\":\n return `${prefix} time (hour, minute, and second)`;\n default:\n return `${prefix} time`;\n }\n };\n\n /**\n * Button slots\n * ================================\n */\n const buttonSlots = {\n /** toggles the calendar popover */\n calendarToggle: {\n ...buttonContext,\n onPress: (event: PressEvent) => {\n // Ensure any active input (e.g., date picker segment) loses focus\n // because blurring the input will close the popover if it's open (or was just opened)\n const activeElement = document?.activeElement as HTMLElement | null;\n\n if (activeElement) {\n activeElement.blur();\n }\n\n buttonContext.onPress?.(event);\n },\n },\n /** Clear button that displays when there's a value in each segment - hidden from both visual and screen readers when there's no value */\n clear: {\n // DateRangePicker-specific: Clear both start and end values\n onPress: () => dateRangePickerState?.setValue(null),\n \"aria-label\": \"Clear input value\",\n isDisabled: isDateRangePickerDisabled,\n // Hide the button when there's no value\n style: incompleteValue ? { display: \"none\" } : undefined,\n \"aria-hidden\": incompleteValue ? true : undefined,\n },\n };\n\n /**\n * TimeInput slots\n * ================================\n */\n\n // DateRangePicker-specific: Separate time input slots for start and end times\n const timeInputSlots = {\n startTimeInput: {\n value: startTimeValue,\n onChange: (value: TimeValue | null) => {\n if (value !== null && dateRangePickerState?.value?.start) {\n // DateRangePicker-specific: Update the start date with the new time\n const currentValue = dateRangePickerState.value;\n const startDate = currentValue.start;\n const endDate = currentValue.end;\n if (startDate && endDate) {\n const newStartDate = startDate.set({\n hour: value.hour,\n minute: value.minute || 0,\n second: value.second || 0,\n millisecond: value.millisecond || 0,\n });\n\n dateRangePickerState.setValue({\n start: newStartDate,\n end: endDate,\n });\n }\n }\n },\n granularity: granularity === \"day\" ? undefined : granularity,\n \"aria-label\": getDefaultTimeInputAriaLabel(\"start\"),\n },\n endTimeInput: {\n value: endTimeValue,\n onChange: (value: TimeValue | null) => {\n if (value !== null && dateRangePickerState?.value?.end) {\n // DateRangePicker-specific: Update the end date with the new time\n const currentValue = dateRangePickerState.value;\n const startDate = currentValue.start;\n const endDate = currentValue.end;\n if (startDate && endDate) {\n const newEndDate = endDate.set({\n hour: value.hour,\n minute: value.minute || 0,\n second: value.second || 0,\n millisecond: value.millisecond || 0,\n });\n\n dateRangePickerState.setValue({\n start: startDate,\n end: newEndDate,\n });\n }\n }\n },\n granularity: granularity === \"day\" ? undefined : granularity,\n \"aria-label\": getDefaultTimeInputAriaLabel(\"end\"),\n },\n };\n\n return (\n <Provider\n values={[\n [\n ButtonContext,\n {\n slots: buttonSlots,\n },\n ],\n [TimeFieldContext, { slots: timeInputSlots }],\n ]}\n >\n {children}\n </Provider>\n );\n};\n","import {\n DateRangePickerRootSlot,\n DateRangePickerGroupSlot,\n DateRangePickerTriggerSlot,\n DateRangePickerPopoverSlot,\n DateRangePickerCalendarSlot,\n} from \"./date-range-picker.slots\";\n\nimport { CalendarMonth, Close } from \"@commercetools/nimbus-icons\";\n\nimport {\n DateRangePicker as ReactAriaDateRangePicker,\n Group,\n Popover,\n Dialog,\n} from \"react-aria-components\";\nimport { useSlotRecipe } from \"@chakra-ui/react\";\nimport { dateRangePickerSlotRecipe } from \"./date-range-picker.recipe\";\nimport type { DateRangePickerProps } from \"./date-range-picker.types\";\nimport { extractStyleProps } from \"@/utils/extractStyleProps\";\nimport { DateInput, RangeCalendar, IconButton, Text } from \"@/components\";\nimport { DateRangePickerTimeInput } from \"./components/date-range-picker.time-input\";\nimport { DateRangePickerCustomContext } from \"./components/date-range-picker.custom-context\";\n\n/**\n * DateRangePicker\n * ============================================================\n * Combines a DateInput with a RangeCalendar popover for date range selection.\n * Users can either type a date range directly or select from the calendar.\n */\nexport const DateRangePicker = (props: DateRangePickerProps) => {\n // Forward hideTimeZone and hourCycle to child components (footer time inputs)\n const { granularity = \"day\", hideTimeZone, hourCycle } = props;\n const recipe = useSlotRecipe({ recipe: dateRangePickerSlotRecipe });\n const [recipeProps, remainingProps] = recipe.splitVariantProps(props);\n\n const [styleProps, otherProps] = extractStyleProps(remainingProps);\n\n // Extract size and variant from recipe props to pass to DateInputs\n const { size = \"md\", variant } = recipeProps;\n\n // the size of the buttons overlaying the input\n const overlayButtonSize = size === \"md\" ? \"xs\" : \"2xs\";\n\n // When granularity is \"day\", use the prop value (defaults to true if not provided)\n // For other granularities (time-based), force to false so users can set both date and time\n const shouldCloseOnSelect =\n granularity === \"day\" ? props.shouldCloseOnSelect : false;\n\n return (\n <DateRangePickerRootSlot {...recipeProps} {...styleProps} asChild>\n <ReactAriaDateRangePicker\n {...otherProps}\n shouldCloseOnSelect={shouldCloseOnSelect}\n >\n <DateRangePickerCustomContext>\n <DateRangePickerGroupSlot asChild>\n <Group>\n <DateInput\n slot=\"start\"\n size={size}\n variant=\"plain\"\n width=\"auto\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n <Text\n as=\"span\"\n px=\"150\"\n color=\"neutral.11\"\n userSelect=\"none\"\n aria-hidden=\"true\"\n slot={null}\n >\n –\n </Text>\n <DateInput\n slot=\"end\"\n size={size}\n variant=\"plain\"\n width=\"auto\"\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n <DateRangePickerTriggerSlot>\n {/* @ts-expect-error react aria is adding the aria-label prop */}\n <IconButton\n tone=\"primary\"\n variant=\"ghost\"\n size={overlayButtonSize}\n slot=\"clear\"\n >\n <Close />\n </IconButton>\n {/* @ts-expect-error react aria is adding the aria-label prop */}\n <IconButton\n tone=\"primary\"\n variant=\"ghost\"\n size={overlayButtonSize}\n slot=\"calendarToggle\"\n >\n <CalendarMonth />\n </IconButton>\n </DateRangePickerTriggerSlot>\n </Group>\n </DateRangePickerGroupSlot>\n <DateRangePickerPopoverSlot asChild>\n <Popover placement=\"bottom end\">\n <Dialog>\n <DateRangePickerCalendarSlot>\n <RangeCalendar />\n </DateRangePickerCalendarSlot>\n <DateRangePickerTimeInput\n hideTimeZone={hideTimeZone}\n hourCycle={hourCycle}\n />\n </Dialog>\n </Popover>\n </DateRangePickerPopoverSlot>\n </DateRangePickerCustomContext>\n </ReactAriaDateRangePicker>\n </DateRangePickerRootSlot>\n );\n};\n\nDateRangePicker.displayName = \"DateRangePicker\";\n"],"names":["withProvider","withContext","createSlotRecipeContext","dateRangePickerSlotRecipe","DateRangePickerRootSlot","DateRangePickerGroupSlot","DateRangePickerTriggerSlot","DateRangePickerPopoverSlot","DateRangePickerCalendarSlot","DateRangePickerTimeInput","hideTimeZone","hourCycle","locale","useLocale","dateRangePickerState","useContext","DateRangePickerStateContext","granularity","value","timeInputRef","useRef","previousValueRef","useEffect","container","firstSegment","jsxs","Flex","jsx","Text","TimeInput","DateRangePickerCustomContext","children","buttonContext","useSlottedContext","ButtonContext","hasCompleteRangeDate","date","incompleteValue","startTimeValue","endTimeValue","isDateRangePickerDisabled","getDefaultTimeInputAriaLabel","type","prefix","buttonSlots","event","activeElement","timeInputSlots","currentValue","startDate","endDate","newStartDate","newEndDate","Provider","TimeFieldContext","DateRangePicker","props","recipe","useSlotRecipe","recipeProps","remainingProps","styleProps","otherProps","extractStyleProps","size","variant","overlayButtonSize","shouldCloseOnSelect","ReactAriaDateRangePicker","Group","DateInput","IconButton","Close","CalendarMonth","Popover","Dialog","RangeCalendar"],"mappings":"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"}

package/dist/chunks/progress-bar-CbZY1dE1.cjs.js DELETED Viewed

	@@ -1,2 +0,0 @@
1	- "use strict";const e=require("react/jsx-runtime"),q=require("react"),x=require("./Label-DFXyfxZM.cjs.js"),v=require("./ProgressBar-Cot0VLjE.cjs.js"),t=require("@chakra-ui/react"),k=require("./box-FU6tRPFs.cjs.js"),w=require("./extractStyleProps-lyk7D-zN.cjs.js"),C=require("./useObjectRef-4v2MxSjQ.cjs.js"),{withProvider:V,withContext:o}=t.createSlotRecipeContext({key:"progressBar"}),F=V("div","root"),H=o("div","track"),L=o("div","fill"),f=o("span","label"),u=o("span","value"),p=n=>{const{ref:h,value:a,minValue:b=0,maxValue:P=100,isDynamic:$=!0,isIndeterminate:r,label:s,formatOptions:j={style:"percent"},variant:O="solid",layout:i="stacked",colorPalette:D="primary",...g}=n,m=t.useSlotRecipe({key:"progressBar"}),[c,B]=m.splitVariantProps(n),[y,G]=w.extractStyleProps(B),R=q.useRef(null),S=C.$df56164dff5785e2$export$4338b53315abf666(t.mergeRefs(R,h));return e.jsx(F,{...c,...y,...c,isDynamic:$,isIndeterminate:r,asChild:!0,children:e.jsx(v.$0393f8ab869a0f1a$export$c17561cb55d4db30,{ref:S,value:a,minValue:b,maxValue:P,isIndeterminate:r,formatOptions:j,...g,children:({percentage:l,valueText:d})=>e.jsxs(e.Fragment,{children:[i==="stacked"&&e.jsxs(t.Flex,{children:[s&&e.jsx(f,{asChild:!0,children:e.jsx(x.$01b77f81d0f07f68$export$b04be29aa201d4f5,{children:s})}),e.jsx(k.Box,{flexGrow:"1"}),s&&a&&e.jsx(u,{children:d})]}),i==="inline"&&s&&e.jsx(f,{lineHeight:"1",asChild:!0,children:e.jsx(x.$01b77f81d0f07f68$export$b04be29aa201d4f5,{children:s})}),e.jsx(H,{children:e.jsx(L,{style:{width:r?"40%":`${l}%`},"data-indeterminate":r,"data-complete":!r&&l!==void 0&&l>=100})}),i==="inline"&&a&&e.jsx(u,{lineHeight:"1",children:d})]})})})};p.displayName="ProgressBar";exports.ProgressBar=p;
2	- //# sourceMappingURL=progress-bar-CbZY1dE1.cjs.js.map

package/dist/chunks/progress-bar-CbZY1dE1.cjs.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"progress-bar-CbZY1dE1.cjs.js","sources":["../../src/components/progress-bar/progress-bar.slots.tsx","../../src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["import { createSlotRecipeContext } from \"@chakra-ui/react\";\nimport type {\n RecipeProps,\n UnstyledProp,\n HTMLChakraProps,\n RecipeVariantProps,\n} from \"@chakra-ui/react\";\nimport type { AriaProgressBarProps } from \"react-aria\";\nimport { progressBarSlotRecipe } from \"./progress-bar.recipe.tsx\";\n\n/**\n * Base recipe props interface that combines Chakra UI's recipe props\n * with the unstyled prop option for the div element.\n */\nexport interface ProgressBarRecipeProps\n extends RecipeProps<\"div\">,\n UnstyledProp {}\n\n/**\n * Root props interface that extends Chakra's HTML props with our recipe props,\n * aria props, and data attributes.\n */\nexport interface ProgressBarRootProps\n extends HTMLChakraProps<\"div\", ProgressBarRecipeProps>,\n Omit<RecipeVariantProps<typeof progressBarSlotRecipe>, \"isIndeterminate\">,\n AriaProgressBarProps {\n [key: `data-${string}`]: string;\n}\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n key: \"progressBar\",\n});\n\n// ProgressBar Root - Main container\nexport const ProgressBarRootSlot = withProvider<\n HTMLDivElement,\n ProgressBarRootProps\n>(\"div\", \"root\");\n\n// ProgressBar Track - Background bar\nexport interface ProgressBarTrackSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const ProgressBarTrackSlot = withContext<\n HTMLDivElement,\n ProgressBarTrackSlotProps\n>(\"div\", \"track\");\n\n// ProgressBar Fill - Progress indicator\nexport interface ProgressBarFillSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const ProgressBarFillSlot = withContext<\n HTMLDivElement,\n ProgressBarFillSlotProps\n>(\"div\", \"fill\");\n// ProgressBar Label - Label text\nexport interface ProgressBarLabelSlotProps extends HTMLChakraProps<\"span\"> {}\nexport const ProgressBarLabelSlot = withContext<\n HTMLSpanElement,\n ProgressBarLabelSlotProps\n>(\"span\", \"label\");\n\n// ProgressBar Value - Value text\nexport interface ProgressBarValueSlotProps extends HTMLChakraProps<\"span\"> {}\nexport const ProgressBarValueSlot = withContext<\n HTMLSpanElement,\n ProgressBarValueSlotProps\n>(\"span\", \"value\");\n","import { useRef } from \"react\";\nimport {\n ProgressBar as RaProgressBar,\n Label as RaLabel,\n} from \"react-aria-components\";\nimport { useObjectRef } from \"react-aria\";\nimport { mergeRefs, useSlotRecipe } from \"@chakra-ui/react\";\nimport { Flex, Box } from \"@/components\";\nimport {\n ProgressBarRootSlot,\n ProgressBarTrackSlot,\n ProgressBarFillSlot,\n ProgressBarLabelSlot,\n ProgressBarValueSlot,\n} from \"./progress-bar.slots\";\nimport type { ProgressBarProps } from \"./progress-bar.types\";\nimport { extractStyleProps } from \"@/utils/extractStyleProps\";\n\n/**\n * ProgressBar\n * ============================================================\n * Displays progress towards completion of a task or process\n *\n * Features:\n *\n * - Supports both determinate (with value) and indeterminate (loading) states\n * - Two visual variants: solid (gradient) and contrast (monochromatic)\n * - Three layouts: minimal, inline, and stacked\n * - Configurable value formatting with internationalization support\n * - Full accessibility support with ARIA attributes\n * - Allows forwarding refs to the underlying DOM element\n * - Accepts all native HTML div attributes\n * - Supports variants, sizes, etc. configured in the recipe\n * - Allows overriding styles by using style-props\n */\nexport const ProgressBar = (props: ProgressBarProps) => {\n const {\n ref: forwardedRef,\n value,\n minValue = 0,\n maxValue = 100,\n isDynamic = true,\n isIndeterminate,\n label,\n formatOptions = { style: \"percent\" },\n variant = \"solid\",\n layout = \"stacked\",\n colorPalette = \"primary\",\n ...rest\n } = props;\n\n const recipe = useSlotRecipe({ key: \"progressBar\" });\n const [recipeProps, remainingProps] = recipe.splitVariantProps(props);\n const [styleProps, otherProps] = extractStyleProps(remainingProps);\n\n const localRef = useRef<HTMLDivElement>(null);\n const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\n\n return (\n <ProgressBarRootSlot\n {...recipeProps}\n {...styleProps}\n {...recipeProps}\n isDynamic={isDynamic}\n isIndeterminate={isIndeterminate}\n asChild\n >\n <RaProgressBar\n ref={ref}\n value={value}\n minValue={minValue}\n maxValue={maxValue}\n isIndeterminate={isIndeterminate}\n formatOptions={formatOptions}\n {...rest}\n >\n {({ percentage, valueText }) => (\n <>\n {layout === \"stacked\" && (\n <Flex>\n {label && (\n <ProgressBarLabelSlot asChild>\n <RaLabel>{label}</RaLabel>\n </ProgressBarLabelSlot>\n )}\n <Box flexGrow=\"1\" />\n {label && value && (\n <ProgressBarValueSlot>{valueText}</ProgressBarValueSlot>\n )}\n </Flex>\n )}\n\n {layout === \"inline\" && label && (\n <ProgressBarLabelSlot lineHeight=\"1\" asChild>\n <RaLabel>{label}</RaLabel>\n </ProgressBarLabelSlot>\n )}\n\n <ProgressBarTrackSlot>\n <ProgressBarFillSlot\n style={{ width: isIndeterminate ? \"40%\" : `${percentage}%` }}\n data-indeterminate={isIndeterminate}\n data-complete={\n !isIndeterminate &&\n percentage !== undefined &&\n percentage >= 100\n }\n />\n </ProgressBarTrackSlot>\n\n {layout === \"inline\" && value && (\n <ProgressBarValueSlot lineHeight=\"1\">\n {valueText}\n </ProgressBarValueSlot>\n )}\n </>\n )}\n </RaProgressBar>\n </ProgressBarRootSlot>\n );\n};\n\nProgressBar.displayName = \"ProgressBar\";\n"],"names":["withProvider","withContext","createSlotRecipeContext","ProgressBarRootSlot","ProgressBarTrackSlot","ProgressBarFillSlot","ProgressBarLabelSlot","ProgressBarValueSlot","ProgressBar","props","forwardedRef","value","minValue","maxValue","isDynamic","isIndeterminate","label","formatOptions","variant","layout","colorPalette","rest","recipe","useSlotRecipe","recipeProps","remainingProps","styleProps","otherProps","extractStyleProps","localRef","useRef","ref","useObjectRef","mergeRefs","jsx","RaProgressBar","percentage","valueText","jsxs","Fragment","Flex","RaLabel","Box"],"mappings":"mTA6BM,CAAE,aAAAA,EAAc,YAAAC,CAAA,EAAgBC,0BAAwB,CAC5D,IAAK,aACP,CAAC,EAGYC,EAAsBH,EAGjC,MAAO,MAAM,EAIFI,EAAuBH,EAGlC,MAAO,OAAO,EAIHI,EAAsBJ,EAGjC,MAAO,MAAM,EAGFK,EAAuBL,EAGlC,OAAQ,OAAO,EAIJM,EAAuBN,EAGlC,OAAQ,OAAO,EC7BJO,EAAeC,GAA4B,CACtD,KAAM,CACJ,IAAKC,EACL,MAAAC,EACA,SAAAC,EAAW,EACX,SAAAC,EAAW,IACX,UAAAC,EAAY,GACZ,gBAAAC,EACA,MAAAC,EACA,cAAAC,EAAgB,CAAE,MAAO,SAAA,EACzB,QAAAC,EAAU,QACV,OAAAC,EAAS,UACT,aAAAC,EAAe,UACf,GAAGC,CAAA,EACDZ,EAEEa,EAASC,EAAAA,cAAc,CAAE,IAAK,cAAe,EAC7C,CAACC,EAAaC,CAAc,EAAIH,EAAO,kBAAkBb,CAAK,EAC9D,CAACiB,EAAYC,CAAU,EAAIC,EAAAA,kBAAkBH,CAAc,EAE3DI,EAAWC,EAAAA,OAAuB,IAAI,EACtCC,EAAMC,EAAAA,0CAAaC,EAAAA,UAAUJ,EAAUnB,CAAY,CAAC,EAE1D,OACEwB,EAAAA,IAAC/B,EAAA,CACE,GAAGqB,EACH,GAAGE,EACH,GAAGF,EACJ,UAAAV,EACA,gBAAAC,EACA,QAAO,GAEP,SAAAmB,EAAAA,IAACC,EAAAA,0CAAA,CACC,IAAAJ,EACA,MAAApB,EACA,SAAAC,EACA,SAAAC,EACA,gBAAAE,EACA,cAAAE,EACC,GAAGI,EAEH,SAAA,CAAC,CAAE,WAAAe,EAAY,UAAAC,CAAA,IACdC,OAAAC,EAAAA,SAAA,CACG,SAAA,CAAApB,IAAW,kBACTqB,EAAAA,KAAA,CACE,SAAA,CAAAxB,SACEV,EAAA,CAAqB,QAAO,GAC3B,SAAA4B,EAAAA,IAACO,EAAAA,0CAAA,CAAS,WAAM,CAAA,CAClB,EAEFP,EAAAA,IAACQ,EAAAA,IAAA,CAAI,SAAS,GAAA,CAAI,EACjB1B,GAASL,GACRuB,EAAAA,IAAC3B,EAAA,CAAsB,SAAA8B,CAAA,CAAU,CAAA,EAErC,EAGDlB,IAAW,UAAYH,GACtBkB,EAAAA,IAAC5B,EAAA,CAAqB,WAAW,IAAI,QAAO,GAC1C,SAAA4B,EAAAA,IAACO,EAAAA,0CAAA,CAAS,SAAAzB,CAAA,CAAM,EAClB,QAGDZ,EAAA,CACC,SAAA8B,EAAAA,IAAC7B,EAAA,CACC,MAAO,CAAE,MAAOU,EAAkB,MAAQ,GAAGqB,CAAU,GAAA,EACvD,qBAAoBrB,EACpB,gBACE,CAACA,GACDqB,IAAe,QACfA,GAAc,GAAA,CAAA,EAGpB,EAECjB,IAAW,UAAYR,SACrBJ,EAAA,CAAqB,WAAW,IAC9B,SAAA8B,CAAA,CACH,CAAA,CAAA,CAEJ,CAAA,CAAA,CAEJ,CAAA,CAGN,EAEA7B,EAAY,YAAc"}

package/dist/chunks/progress-bar-VipTWl4r.es.js DELETED Viewed

@@ -1,71 +0,0 @@
-import { jsx as r, jsxs as d, Fragment as R } from "react/jsx-runtime";
-import { useRef as k } from "react";
-import { a as f } from "./Label-p7LXqne0.es.js";
-import { a as w } from "./ProgressBar-M-wNKpE5.es.js";
-import { createSlotRecipeContext as C, useSlotRecipe as V, mergeRefs as F, Flex as j } from "@chakra-ui/react";
-import { B as H } from "./box-DD4jYgS7.es.js";
-import { e as D } from "./extractStyleProps-CxgBrz3O.es.js";
-import { $ as G } from "./useObjectRef-CaJ5pgjX.es.js";
-const { withProvider: I, withContext: t } = /* @__PURE__ */ C({
-  key: "progressBar"
-}), L = /* @__PURE__ */ I("div", "root"), N = /* @__PURE__ */ t("div", "track"), O = /* @__PURE__ */ t("div", "fill"), m = /* @__PURE__ */ t("span", "label"), p = /* @__PURE__ */ t("span", "value"), q = (l) => {
-  const {
-    ref: h,
-    value: s,
-    minValue: P = 0,
-    maxValue: u = 100,
-    isDynamic: g = !0,
-    isIndeterminate: e,
-    label: o,
-    formatOptions: x = { style: "percent" },
-    variant: z = "solid",
-    layout: a = "stacked",
-    colorPalette: A = "primary",
-    ...b
-  } = l, B = V({ key: "progressBar" }), [n, $] = B.splitVariantProps(l), [y, E] = D($), S = k(null), v = G(F(S, h));
-  return /* @__PURE__ */ r(
-    L,
-    {
-      ...n,
-      ...y,
-      ...n,
-      isDynamic: g,
-      isIndeterminate: e,
-      asChild: !0,
-      children: /* @__PURE__ */ r(
-        w,
-        {
-          ref: v,
-          value: s,
-          minValue: P,
-          maxValue: u,
-          isIndeterminate: e,
-          formatOptions: x,
-          ...b,
-          children: ({ percentage: i, valueText: c }) => /* @__PURE__ */ d(R, { children: [
-            a === "stacked" && /* @__PURE__ */ d(j, { children: [
-              o && /* @__PURE__ */ r(m, { asChild: !0, children: /* @__PURE__ */ r(f, { children: o }) }),
-              /* @__PURE__ */ r(H, { flexGrow: "1" }),
-              o && s && /* @__PURE__ */ r(p, { children: c })
-            ] }),
-            a === "inline" && o && /* @__PURE__ */ r(m, { lineHeight: "1", asChild: !0, children: /* @__PURE__ */ r(f, { children: o }) }),
-            /* @__PURE__ */ r(N, { children: /* @__PURE__ */ r(
-              O,
-              {
-                style: { width: e ? "40%" : `${i}%` },
-                "data-indeterminate": e,
-                "data-complete": !e && i !== void 0 && i >= 100
-              }
-            ) }),
-            a === "inline" && s && /* @__PURE__ */ r(p, { lineHeight: "1", children: c })
-          ] })
-        }
-      )
-    }
-  );
-};
-q.displayName = "ProgressBar";
-export {
-  q as P
-};
-//# sourceMappingURL=progress-bar-VipTWl4r.es.js.map

package/dist/chunks/progress-bar-VipTWl4r.es.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"file":"progress-bar-VipTWl4r.es.js","sources":["../../src/components/progress-bar/progress-bar.slots.tsx","../../src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["import { createSlotRecipeContext } from \"@chakra-ui/react\";\nimport type {\n RecipeProps,\n UnstyledProp,\n HTMLChakraProps,\n RecipeVariantProps,\n} from \"@chakra-ui/react\";\nimport type { AriaProgressBarProps } from \"react-aria\";\nimport { progressBarSlotRecipe } from \"./progress-bar.recipe.tsx\";\n\n/**\n * Base recipe props interface that combines Chakra UI's recipe props\n * with the unstyled prop option for the div element.\n */\nexport interface ProgressBarRecipeProps\n extends RecipeProps<\"div\">,\n UnstyledProp {}\n\n/**\n * Root props interface that extends Chakra's HTML props with our recipe props,\n * aria props, and data attributes.\n */\nexport interface ProgressBarRootProps\n extends HTMLChakraProps<\"div\", ProgressBarRecipeProps>,\n Omit<RecipeVariantProps<typeof progressBarSlotRecipe>, \"isIndeterminate\">,\n AriaProgressBarProps {\n [key: `data-${string}`]: string;\n}\n\nconst { withProvider, withContext } = createSlotRecipeContext({\n key: \"progressBar\",\n});\n\n// ProgressBar Root - Main container\nexport const ProgressBarRootSlot = withProvider<\n HTMLDivElement,\n ProgressBarRootProps\n>(\"div\", \"root\");\n\n// ProgressBar Track - Background bar\nexport interface ProgressBarTrackSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const ProgressBarTrackSlot = withContext<\n HTMLDivElement,\n ProgressBarTrackSlotProps\n>(\"div\", \"track\");\n\n// ProgressBar Fill - Progress indicator\nexport interface ProgressBarFillSlotProps extends HTMLChakraProps<\"div\"> {}\nexport const ProgressBarFillSlot = withContext<\n HTMLDivElement,\n ProgressBarFillSlotProps\n>(\"div\", \"fill\");\n// ProgressBar Label - Label text\nexport interface ProgressBarLabelSlotProps extends HTMLChakraProps<\"span\"> {}\nexport const ProgressBarLabelSlot = withContext<\n HTMLSpanElement,\n ProgressBarLabelSlotProps\n>(\"span\", \"label\");\n\n// ProgressBar Value - Value text\nexport interface ProgressBarValueSlotProps extends HTMLChakraProps<\"span\"> {}\nexport const ProgressBarValueSlot = withContext<\n HTMLSpanElement,\n ProgressBarValueSlotProps\n>(\"span\", \"value\");\n","import { useRef } from \"react\";\nimport {\n ProgressBar as RaProgressBar,\n Label as RaLabel,\n} from \"react-aria-components\";\nimport { useObjectRef } from \"react-aria\";\nimport { mergeRefs, useSlotRecipe } from \"@chakra-ui/react\";\nimport { Flex, Box } from \"@/components\";\nimport {\n ProgressBarRootSlot,\n ProgressBarTrackSlot,\n ProgressBarFillSlot,\n ProgressBarLabelSlot,\n ProgressBarValueSlot,\n} from \"./progress-bar.slots\";\nimport type { ProgressBarProps } from \"./progress-bar.types\";\nimport { extractStyleProps } from \"@/utils/extractStyleProps\";\n\n/**\n * ProgressBar\n * ============================================================\n * Displays progress towards completion of a task or process\n *\n * Features:\n *\n * - Supports both determinate (with value) and indeterminate (loading) states\n * - Two visual variants: solid (gradient) and contrast (monochromatic)\n * - Three layouts: minimal, inline, and stacked\n * - Configurable value formatting with internationalization support\n * - Full accessibility support with ARIA attributes\n * - Allows forwarding refs to the underlying DOM element\n * - Accepts all native HTML div attributes\n * - Supports variants, sizes, etc. configured in the recipe\n * - Allows overriding styles by using style-props\n */\nexport const ProgressBar = (props: ProgressBarProps) => {\n const {\n ref: forwardedRef,\n value,\n minValue = 0,\n maxValue = 100,\n isDynamic = true,\n isIndeterminate,\n label,\n formatOptions = { style: \"percent\" },\n variant = \"solid\",\n layout = \"stacked\",\n colorPalette = \"primary\",\n ...rest\n } = props;\n\n const recipe = useSlotRecipe({ key: \"progressBar\" });\n const [recipeProps, remainingProps] = recipe.splitVariantProps(props);\n const [styleProps, otherProps] = extractStyleProps(remainingProps);\n\n const localRef = useRef<HTMLDivElement>(null);\n const ref = useObjectRef(mergeRefs(localRef, forwardedRef));\n\n return (\n <ProgressBarRootSlot\n {...recipeProps}\n {...styleProps}\n {...recipeProps}\n isDynamic={isDynamic}\n isIndeterminate={isIndeterminate}\n asChild\n >\n <RaProgressBar\n ref={ref}\n value={value}\n minValue={minValue}\n maxValue={maxValue}\n isIndeterminate={isIndeterminate}\n formatOptions={formatOptions}\n {...rest}\n >\n {({ percentage, valueText }) => (\n <>\n {layout === \"stacked\" && (\n <Flex>\n {label && (\n <ProgressBarLabelSlot asChild>\n <RaLabel>{label}</RaLabel>\n </ProgressBarLabelSlot>\n )}\n <Box flexGrow=\"1\" />\n {label && value && (\n <ProgressBarValueSlot>{valueText}</ProgressBarValueSlot>\n )}\n </Flex>\n )}\n\n {layout === \"inline\" && label && (\n <ProgressBarLabelSlot lineHeight=\"1\" asChild>\n <RaLabel>{label}</RaLabel>\n </ProgressBarLabelSlot>\n )}\n\n <ProgressBarTrackSlot>\n <ProgressBarFillSlot\n style={{ width: isIndeterminate ? \"40%\" : `${percentage}%` }}\n data-indeterminate={isIndeterminate}\n data-complete={\n !isIndeterminate &&\n percentage !== undefined &&\n percentage >= 100\n }\n />\n </ProgressBarTrackSlot>\n\n {layout === \"inline\" && value && (\n <ProgressBarValueSlot lineHeight=\"1\">\n {valueText}\n </ProgressBarValueSlot>\n )}\n </>\n )}\n </RaProgressBar>\n </ProgressBarRootSlot>\n );\n};\n\nProgressBar.displayName = \"ProgressBar\";\n"],"names":["withProvider","withContext","createSlotRecipeContext","ProgressBarRootSlot","ProgressBarTrackSlot","ProgressBarFillSlot","ProgressBarLabelSlot","ProgressBarValueSlot","ProgressBar","props","forwardedRef","value","minValue","maxValue","isDynamic","isIndeterminate","label","formatOptions","variant","layout","colorPalette","rest","recipe","useSlotRecipe","recipeProps","remainingProps","styleProps","otherProps","extractStyleProps","localRef","useRef","ref","useObjectRef","mergeRefs","jsx","RaProgressBar","percentage","valueText","jsxs","Fragment","Flex","RaLabel","Box"],"mappings":";;;;;;;;AA6BA,MAAM,EAAE,cAAAA,GAAc,aAAAC,EAAA,IAAgB,gBAAAC,EAAwB;AAAA,EAC5D,KAAK;AACP,CAAC,GAGYC,IAAsB,gBAAAH,EAGjC,OAAO,MAAM,GAIFI,IAAuB,gBAAAH,EAGlC,OAAO,OAAO,GAIHI,IAAsB,gBAAAJ,EAGjC,OAAO,MAAM,GAGFK,IAAuB,gBAAAL,EAGlC,QAAQ,OAAO,GAIJM,IAAuB,gBAAAN,EAGlC,QAAQ,OAAO,GC7BJO,IAAc,CAACC,MAA4B;AACtD,QAAM;AAAA,IACJ,KAAKC;AAAA,IACL,OAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,iBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,eAAAC,IAAgB,EAAE,OAAO,UAAA;AAAA,IACzB,SAAAC,IAAU;AAAA,IACV,QAAAC,IAAS;AAAA,IACT,cAAAC,IAAe;AAAA,IACf,GAAGC;AAAA,EAAA,IACDZ,GAEEa,IAASC,EAAc,EAAE,KAAK,eAAe,GAC7C,CAACC,GAAaC,CAAc,IAAIH,EAAO,kBAAkBb,CAAK,GAC9D,CAACiB,GAAYC,CAAU,IAAIC,EAAkBH,CAAc,GAE3DI,IAAWC,EAAuB,IAAI,GACtCC,IAAMC,EAAaC,EAAUJ,GAAUnB,CAAY,CAAC;AAE1D,SACE,gBAAAwB;AAAA,IAAC/B;AAAA,IAAA;AAAA,MACE,GAAGqB;AAAA,MACH,GAAGE;AAAA,MACH,GAAGF;AAAA,MACJ,WAAAV;AAAA,MACA,iBAAAC;AAAA,MACA,SAAO;AAAA,MAEP,UAAA,gBAAAmB;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,KAAAJ;AAAA,UACA,OAAApB;AAAA,UACA,UAAAC;AAAA,UACA,UAAAC;AAAA,UACA,iBAAAE;AAAA,UACA,eAAAE;AAAA,UACC,GAAGI;AAAA,UAEH,UAAA,CAAC,EAAE,YAAAe,GAAY,WAAAC,EAAA,MACd,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,YAAApB,MAAW,+BACTqB,GAAA,EACE,UAAA;AAAA,cAAAxB,uBACEV,GAAA,EAAqB,SAAO,IAC3B,UAAA,gBAAA4B,EAACO,GAAA,EAAS,aAAM,EAAA,CAClB;AAAA,cAEF,gBAAAP,EAACQ,GAAA,EAAI,UAAS,IAAA,CAAI;AAAA,cACjB1B,KAASL,KACR,gBAAAuB,EAAC3B,GAAA,EAAsB,UAAA8B,EAAA,CAAU;AAAA,YAAA,GAErC;AAAA,YAGDlB,MAAW,YAAYH,KACtB,gBAAAkB,EAAC5B,GAAA,EAAqB,YAAW,KAAI,SAAO,IAC1C,UAAA,gBAAA4B,EAACO,GAAA,EAAS,UAAAzB,EAAA,CAAM,GAClB;AAAA,8BAGDZ,GAAA,EACC,UAAA,gBAAA8B;AAAA,cAAC7B;AAAA,cAAA;AAAA,gBACC,OAAO,EAAE,OAAOU,IAAkB,QAAQ,GAAGqB,CAAU,IAAA;AAAA,gBACvD,sBAAoBrB;AAAA,gBACpB,iBACE,CAACA,KACDqB,MAAe,UACfA,KAAc;AAAA,cAAA;AAAA,YAAA,GAGpB;AAAA,YAECjB,MAAW,YAAYR,uBACrBJ,GAAA,EAAqB,YAAW,KAC9B,UAAA8B,EAAA,CACH;AAAA,UAAA,EAAA,CAEJ;AAAA,QAAA;AAAA,MAAA;AAAA,IAEJ;AAAA,EAAA;AAGN;AAEA7B,EAAY,cAAc;"}