npm - @nuka-ui/core - Versions diffs - 1.1.0 → 1.1.2 - Mend

@nuka-ui/core 1.1.0 → 1.1.2

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 (1101) hide show

package/dist/components/DatePicker/DatePickerCalendar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePickerCalendar.js","names":[],"sources":["../../../src/components/DatePicker/DatePickerCalendar.tsx"],"sourcesContent":["\"use client\";\n// Exceeds 200 lines: calendar grid JSX is inseparable from the hooks that feed it.\n// Hook calls, Intl formatters, memos, and selectDay/navigateToDate callbacks all\n// close over the same display state and cannot be moved to a sibling file.\nimport * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Portal } from \"@nuka/utils/portal\";\nimport { Button } from \"@nuka/components/Button\";\nimport { Icon } from \"@nuka/components/Icon\";\nimport { Text } from \"@nuka/components/Text\";\nimport { useDatePickerContext } from \"@nuka/components/DatePicker/DatePicker.context\";\nimport {\n isSameDay,\n isDateDisabled,\n buildMonthGrid,\n} from \"@nuka/components/DatePicker/DatePicker.utils\";\nimport {\n useCalendarNavigation,\n useCalendarFocus,\n useCalendarKeyboard,\n} from \"@nuka/components/DatePicker/DatePicker.hooks\";\n\nexport interface DatePickerCalendarProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst DatePickerCalendar = React.forwardRef<\n HTMLDivElement,\n DatePickerCalendarProps\n>(({ className, ...props }, ref) => {\n const ctx = useDatePickerContext();\n const contentRef = React.useRef<HTMLDivElement>(null);\n const composedRef = composeRefs(\n ref,\n contentRef,\n ctx.refs.setFloating as React.Ref<HTMLDivElement>,\n );\n\n const {\n displayedYear,\n setDisplayedYear,\n displayedMonth,\n setDisplayedMonth,\n canGoPrev,\n canGoNext,\n goToPrevMonth,\n goToNextMonth,\n } = useCalendarNavigation(ctx);\n\n const { focusedDayRef } = useCalendarFocus(\n ctx,\n displayedYear,\n displayedMonth,\n );\n\n const labelFormatter = React.useMemo(\n () =>\n new Intl.DateTimeFormat(ctx.locale, {\n weekday: \"long\",\n year: \"numeric\",\n month: \"long\",\n day: \"numeric\",\n }),\n [ctx.locale],\n );\n\n const headerFormatter = React.useMemo(\n () =>\n new Intl.DateTimeFormat(ctx.locale, {\n month: \"long\",\n year: \"numeric\",\n }),\n [ctx.locale],\n );\n\n const weekdayLabels = React.useMemo(() => {\n const shortFmt = new Intl.DateTimeFormat(ctx.locale, { weekday: \"short\" });\n const longFmt = new Intl.DateTimeFormat(ctx.locale, { weekday: \"long\" });\n return Array.from({ length: 7 }, (_, i) => {\n const date = new Date(2026, 0, 5 + i);\n return {\n short: shortFmt.format(date),\n long: longFmt.format(date),\n };\n });\n }, [ctx.locale]);\n\n const weeks = React.useMemo(\n () => buildMonthGrid(displayedYear, displayedMonth),\n [displayedYear, displayedMonth],\n );\n\n const headerLabel = React.useMemo(\n () => headerFormatter.format(new Date(displayedYear, displayedMonth, 1)),\n [displayedYear, displayedMonth, headerFormatter],\n );\n\n const selectDay = React.useCallback(\n (date: Date) => {\n if (isDateDisabled(date, ctx.min, ctx.max)) return;\n ctx.onSelectedDateChange(date);\n ctx.onOpenChange(false);\n requestAnimationFrame(() => {\n ctx.triggerButtonRef.current?.focus();\n });\n },\n [ctx],\n );\n\n const navigateToDate = React.useCallback(\n (candidate: Date, stepFn: (d: Date) => Date) => {\n let current = candidate;\n let attempts = 0;\n while (isDateDisabled(current, ctx.min, ctx.max) && attempts < 366) {\n current = stepFn(current);\n attempts++;\n }\n if (isDateDisabled(current, ctx.min, ctx.max)) return;\n\n ctx.setFocusedDate(current);\n if (\n current.getMonth() !== displayedMonth \|\|\n current.getFullYear() !== displayedYear\n ) {\n setDisplayedYear(current.getFullYear());\n setDisplayedMonth(current.getMonth());\n }\n },\n [ctx, displayedMonth, displayedYear, setDisplayedYear, setDisplayedMonth],\n );\n\n const { handleKeyDown } = useCalendarKeyboard(ctx, navigateToDate, selectDay);\n\n if (!ctx.open) return null;\n\n const floatingProps = ctx.getFloatingProps(props);\n const today = new Date();\n\n return (\n <Portal>\n <div\n ref={composedRef}\n style={ctx.floatingStyles}\n role=\"dialog\"\n aria-label=\"Date picker\"\n {...(floatingProps as React.HTMLAttributes<HTMLDivElement>)}\n className={cn(\n \"z-(--nuka-z-dropdown) rounded-(--radius-md) border border-(--nuka-border-base)\",\n \"bg-(--nuka-bg-base) shadow-md p-(--space-3)\",\n \"focus-visible:outline-none\",\n className,\n )}\n >\n <div className=\"flex items-center justify-between mb-(--space-2)\">\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={goToPrevMonth}\n disabled={!canGoPrev}\n aria-label=\"Previous month\"\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <polyline points=\"15 18 9 12 15 6\" />\n </svg>\n </Icon>\n </Button>\n <Text as=\"span\" size=\"sm\" weight=\"medium\">\n {headerLabel}\n </Text>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={goToNextMonth}\n disabled={!canGoNext}\n aria-label=\"Next month\"\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <polyline points=\"9 18 15 12 9 6\" />\n </svg>\n </Icon>\n </Button>\n </div>\n\n <div\n role=\"grid\"\n aria-label={headerLabel}\n id={`${ctx.baseId}-grid`}\n onKeyDown={handleKeyDown}\n >\n <div\n role=\"row\"\n aria-hidden=\"true\"\n className=\"grid grid-cols-7 mb-(--space-1)\"\n >\n {weekdayLabels.map((day) => (\n <abbr\n key={day.short}\n title={day.long}\n className=\"flex items-center justify-center text-xs text-(--nuka-text-muted) no-underline py-(--space-1)\"\n >\n {day.short}\n </abbr>\n ))}\n </div>\n\n {weeks.map((week, weekIndex) => (\n <div role=\"row\" key={weekIndex} className=\"grid grid-cols-7\">\n {week.map((day, dayIndex) => {\n if (day === null) {\n return (\n <div\n role=\"gridcell\"\n key={`empty-${String(dayIndex)}`}\n aria-hidden=\"true\"\n >\n <span className=\"block size-9\" />\n </div>\n );\n }\n\n const date = new Date(displayedYear, displayedMonth, day);\n const disabled = isDateDisabled(date, ctx.min, ctx.max);\n const isSelected =\n ctx.selectedDate !== undefined &&\n isSameDay(date, ctx.selectedDate);\n const isFocused = isSameDay(date, ctx.focusedDate);\n const isToday = isSameDay(date, today);\n const dayLabel = labelFormatter.format(date);\n\n return (\n <div role=\"gridcell\" key={day}>\n <button\n ref={isFocused ? focusedDayRef : undefined}\n type=\"button\"\n tabIndex={isFocused ? 0 : -1}\n aria-label={dayLabel}\n aria-selected={isSelected}\n aria-disabled={disabled \|\| undefined}\n disabled={disabled}\n onClick={() => selectDay(date)}\n className={cn(\n \"flex items-center justify-center size-9 rounded-(--radius-md) text-sm\",\n \"focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--nuka-border-focus)\",\n \"cursor-pointer\",\n isSelected &&\n \"bg-(--nuka-accent-bg) text-(--nuka-accent-fg)\",\n !isSelected &&\n !disabled &&\n \"hover:bg-(--nuka-bg-muted)\",\n isToday &&\n !isSelected &&\n \"ring-1 ring-(--nuka-border-strong)\",\n disabled && \"opacity-50 cursor-default\",\n )}\n >\n {day}\n </button>\n </div>\n );\n })}\n </div>\n ))}\n </div>\n </div>\n </Portal>\n );\n});\n\nDatePickerCalendar.displayName = \"DatePickerCalendar\";\n\nexport { DatePickerCalendar };\n"],"mappings":"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"}
1	+ {"version":3,"file":"DatePickerCalendar.js","names":[],"sources":["../../../src/components/DatePicker/DatePickerCalendar.tsx"],"sourcesContent":["\"use client\";\n// Exceeds 200 lines: calendar grid JSX is inseparable from the hooks that feed it.\n// Hook calls, Intl formatters, memos, and selectDay/navigateToDate callbacks all\n// close over the same display state and cannot be moved to a sibling file.\nimport * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Portal } from \"@nuka/utils/portal\";\nimport { Button } from \"@nuka/components/Button\";\nimport { Icon } from \"@nuka/components/Icon\";\nimport { Text } from \"@nuka/components/Text\";\nimport { useDatePickerContext } from \"@nuka/components/DatePicker/DatePicker.context\";\nimport {\n isSameDay,\n isDateDisabled,\n buildMonthGrid,\n} from \"@nuka/components/DatePicker/DatePicker.utils\";\nimport {\n useCalendarNavigation,\n useCalendarFocus,\n useCalendarKeyboard,\n} from \"@nuka/components/DatePicker/DatePicker.hooks\";\n\nexport interface DatePickerCalendarProps extends React.HTMLAttributes<HTMLDivElement> {\n ref?: React.Ref<HTMLDivElement> \| undefined;\n}\n\nfunction DatePickerCalendar({\n ref,\n className,\n ...props\n}: DatePickerCalendarProps) {\n const ctx = useDatePickerContext();\n const contentRef = React.useRef<HTMLDivElement>(null);\n const composedRef = composeRefs(\n ref,\n contentRef,\n ctx.refs.setFloating as React.Ref<HTMLDivElement>,\n );\n\n const {\n displayedYear,\n setDisplayedYear,\n displayedMonth,\n setDisplayedMonth,\n canGoPrev,\n canGoNext,\n goToPrevMonth,\n goToNextMonth,\n } = useCalendarNavigation(ctx);\n\n const { focusedDayRef } = useCalendarFocus(\n ctx,\n displayedYear,\n displayedMonth,\n );\n\n const labelFormatter = React.useMemo(\n () =>\n new Intl.DateTimeFormat(ctx.locale, {\n weekday: \"long\",\n year: \"numeric\",\n month: \"long\",\n day: \"numeric\",\n }),\n [ctx.locale],\n );\n\n const headerFormatter = React.useMemo(\n () =>\n new Intl.DateTimeFormat(ctx.locale, {\n month: \"long\",\n year: \"numeric\",\n }),\n [ctx.locale],\n );\n\n const weekdayLabels = React.useMemo(() => {\n const shortFmt = new Intl.DateTimeFormat(ctx.locale, { weekday: \"short\" });\n const longFmt = new Intl.DateTimeFormat(ctx.locale, { weekday: \"long\" });\n return Array.from({ length: 7 }, (_, i) => {\n const date = new Date(2026, 0, 5 + i);\n return {\n short: shortFmt.format(date),\n long: longFmt.format(date),\n };\n });\n }, [ctx.locale]);\n\n const weeks = React.useMemo(\n () => buildMonthGrid(displayedYear, displayedMonth),\n [displayedYear, displayedMonth],\n );\n\n const headerLabel = React.useMemo(\n () => headerFormatter.format(new Date(displayedYear, displayedMonth, 1)),\n [displayedYear, displayedMonth, headerFormatter],\n );\n\n const selectDay = React.useCallback(\n (date: Date) => {\n if (isDateDisabled(date, ctx.min, ctx.max)) return;\n ctx.onSelectedDateChange(date);\n ctx.onOpenChange(false);\n requestAnimationFrame(() => {\n ctx.triggerButtonRef.current?.focus();\n });\n },\n [ctx],\n );\n\n const navigateToDate = React.useCallback(\n (candidate: Date, stepFn: (d: Date) => Date) => {\n let current = candidate;\n let attempts = 0;\n while (isDateDisabled(current, ctx.min, ctx.max) && attempts < 366) {\n current = stepFn(current);\n attempts++;\n }\n if (isDateDisabled(current, ctx.min, ctx.max)) return;\n\n ctx.setFocusedDate(current);\n if (\n current.getMonth() !== displayedMonth \|\|\n current.getFullYear() !== displayedYear\n ) {\n setDisplayedYear(current.getFullYear());\n setDisplayedMonth(current.getMonth());\n }\n },\n [ctx, displayedMonth, displayedYear, setDisplayedYear, setDisplayedMonth],\n );\n\n const { handleKeyDown } = useCalendarKeyboard(ctx, navigateToDate, selectDay);\n\n if (!ctx.open) return null;\n\n const floatingProps = ctx.getFloatingProps(props);\n const today = new Date();\n\n return (\n <Portal>\n <div\n ref={composedRef}\n style={ctx.floatingStyles}\n role=\"dialog\"\n aria-label=\"Date picker\"\n {...(floatingProps as React.HTMLAttributes<HTMLDivElement>)}\n className={cn(\n \"z-(--nuka-z-dropdown) rounded-(--radius-md) border border-(--nuka-border-base)\",\n \"bg-(--nuka-bg-base) shadow-md p-(--space-3)\",\n \"focus-visible:outline-none\",\n className,\n )}\n >\n <div className=\"flex items-center justify-between mb-(--space-2)\">\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={goToPrevMonth}\n disabled={!canGoPrev}\n aria-label=\"Previous month\"\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <polyline points=\"15 18 9 12 15 6\" />\n </svg>\n </Icon>\n </Button>\n <Text as=\"span\" size=\"sm\" weight=\"medium\">\n {headerLabel}\n </Text>\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={goToNextMonth}\n disabled={!canGoNext}\n aria-label=\"Next month\"\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <polyline points=\"9 18 15 12 9 6\" />\n </svg>\n </Icon>\n </Button>\n </div>\n\n <div\n role=\"grid\"\n aria-label={headerLabel}\n id={`${ctx.baseId}-grid`}\n onKeyDown={handleKeyDown}\n >\n <div\n role=\"row\"\n aria-hidden=\"true\"\n className=\"grid grid-cols-7 mb-(--space-1)\"\n >\n {weekdayLabels.map((day) => (\n <abbr\n key={day.short}\n title={day.long}\n className=\"flex items-center justify-center text-xs text-(--nuka-text-muted) no-underline py-(--space-1)\"\n >\n {day.short}\n </abbr>\n ))}\n </div>\n\n {weeks.map((week, weekIndex) => (\n <div role=\"row\" key={weekIndex} className=\"grid grid-cols-7\">\n {week.map((day, dayIndex) => {\n if (day === null) {\n return (\n <div\n role=\"gridcell\"\n key={`empty-${String(dayIndex)}`}\n aria-hidden=\"true\"\n >\n <span className=\"block size-9\" />\n </div>\n );\n }\n\n const date = new Date(displayedYear, displayedMonth, day);\n const disabled = isDateDisabled(date, ctx.min, ctx.max);\n const isSelected =\n ctx.selectedDate !== undefined &&\n isSameDay(date, ctx.selectedDate);\n const isFocused = isSameDay(date, ctx.focusedDate);\n const isToday = isSameDay(date, today);\n const dayLabel = labelFormatter.format(date);\n\n return (\n <div role=\"gridcell\" key={day}>\n <button\n ref={isFocused ? focusedDayRef : undefined}\n type=\"button\"\n tabIndex={isFocused ? 0 : -1}\n aria-label={dayLabel}\n aria-selected={isSelected}\n aria-disabled={disabled \|\| undefined}\n disabled={disabled}\n onClick={() => selectDay(date)}\n className={cn(\n \"flex items-center justify-center size-9 rounded-(--radius-md) text-sm\",\n \"focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-(--nuka-border-focus)\",\n \"cursor-pointer\",\n isSelected &&\n \"bg-(--nuka-accent-bg) text-(--nuka-accent-fg)\",\n !isSelected &&\n !disabled &&\n \"hover:bg-(--nuka-bg-muted)\",\n isToday &&\n !isSelected &&\n \"ring-1 ring-(--nuka-border-strong)\",\n disabled && \"opacity-50 cursor-default\",\n )}\n >\n {day}\n </button>\n </div>\n );\n })}\n </div>\n ))}\n </div>\n </div>\n </Portal>\n );\n}\n\nDatePickerCalendar.displayName = \"DatePickerCalendar\";\n\nexport { DatePickerCalendar };\n"],"mappings":"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"}

package/dist/components/DatePicker/DatePickerInput.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../../utils/cn.cjs`),n=require(`../../utils/slot.cjs`),r=require(`../Icon/Icon.cjs`),i=require(`../../hooks/use-form-field-props.cjs`),a=require(`../Input/Input.cjs`),o=require(`./DatePicker.context.cjs`),s=require(`./DatePicker.utils.cjs`);let c=require(`react`);c=e.__toESM(c,1);let l=require(`react/jsx-runtime`);var u=c.forwardRef(({className:e,placeholder:u=`YYYY-MM-DD`,size:d,id:f,"aria-invalid":p,"aria-describedby":m,"aria-required":h,...g},_)=>{let v=o.useDatePickerContext(),y=n.composeRefs(_,c.useCallback(e=>{e&&v.refs.setPositionReference(e)},[v.refs])),b=i.useFormFieldProps({id:f,"aria-invalid":p,"aria-describedby":m,"aria-required":h}),{selectedDate:x,open:S,formatDate:C}=v,[w,T]=c.useState(x===void 0?``:C(x));c.useEffect(()=>{S||T(x===void 0?``:C(x))},[x,S,C]);let E=b.ariaInvalid??void 0,D=c.useCallback(()=>{!v.disabled&&!v.open&&(v.focusCalendarOnOpen.current=!1,v.onOpenChange(!0))},[v]),O=c.useCallback(()=>{let e=v.parseDate(w);e!==null&&!s.isDateDisabled(e,v.min,v.max)?v.onSelectedDateChange(e):T(v.selectedDate===void 0?``:v.formatDate(v.selectedDate))},[w,v]),k=c.useCallback(e=>{e.key===`Enter`?(e.preventDefault(),O()):e.key===`Escape`?v.open?(e.preventDefault(),v.onOpenChange(!1)):T(v.selectedDate===void 0?``:v.formatDate(v.selectedDate)):e.key===`Tab`&&v.open&&v.onOpenChange(!1)},[O,v]),A=c.useCallback(e=>{let t=e.relatedTarget;t&&v.refs.floating.current?.contains(t)||O()},[O,v.refs.floating]),j=c.useCallback(()=>{v.disabled||(v.focusCalendarOnOpen.current=!v.open,v.onOpenChange(!v.open))},[v]),M=v.getReferenceProps({});return(0,l.jsxs)(`div`,{ref:y,className:t.cn(`relative inline-flex w-full items-center`,e),...g,children:[(0,l.jsx)(a.Input,{type:`text`,value:w,onChange:e=>T(e.target.value),onClick:D,onKeyDown:k,onBlur:A,placeholder:u,size:d,id:b.resolvedId,disabled:v.disabled||b.resolvedDisabled,"aria-invalid":E,"aria-describedby":b.ariaDescribedBy,"aria-required":b.ariaRequired,className:`pr-(--space-10)`,autoComplete:`off`}),(0,l.jsx)(`button`,{ref:n.composeRefs(v.triggerButtonRef,v.refs.setReference),type:`button`,...M,onClick:j,disabled:v.disabled,"aria-label":`Open calendar`,className:t.cn(`absolute right-0 top-0 bottom-0 flex items-center justify-center`,`px-(--space-3) text-(--nuka-text-muted) hover:text-(--nuka-text-base)`,`disabled:pointer-events-none disabled:opacity-50`,`cursor-pointer`),children:(0,l.jsx)(r.Icon,{size:`sm`,children:(0,l.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,l.jsx)(`rect`,{x:`3`,y:`4`,width:`18`,height:`18`,rx:`2`,ry:`2`}),(0,l.jsx)(`line`,{x1:`16`,y1:`2`,x2:`16`,y2:`6`}),(0,l.jsx)(`line`,{x1:`8`,y1:`2`,x2:`8`,y2:`6`}),(0,l.jsx)(`line`,{x1:`3`,y1:`10`,x2:`21`,y2:`10`})]})})})]})});u.displayName=`DatePickerInput`,exports.DatePickerInput=u;
+"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../../utils/cn.cjs`),n=require(`../../utils/slot.cjs`),r=require(`../Icon/Icon.cjs`),i=require(`../../hooks/use-form-field-props.cjs`),a=require(`../Input/Input.cjs`),o=require(`./DatePicker.context.cjs`),s=require(`./DatePicker.utils.cjs`);let c=require(`react`);c=e.__toESM(c,1);let l=require(`react/jsx-runtime`);function u({ref:e,className:u,placeholder:d=`YYYY-MM-DD`,size:f,id:p,"aria-invalid":m,"aria-describedby":h,"aria-required":g,..._}){let v=o.useDatePickerContext(),y=n.composeRefs(e,c.useCallback(e=>{e&&v.refs.setPositionReference(e)},[v.refs])),b=i.useFormFieldProps({id:p,"aria-invalid":m,"aria-describedby":h,"aria-required":g}),{selectedDate:x,open:S,formatDate:C}=v,[w,T]=c.useState(x===void 0?``:C(x));c.useEffect(()=>{S||T(x===void 0?``:C(x))},[x,S,C]);let E=b.ariaInvalid??void 0,D=c.useCallback(()=>{!v.disabled&&!v.open&&(v.focusCalendarOnOpen.current=!1,v.onOpenChange(!0))},[v]),O=c.useCallback(()=>{let e=v.parseDate(w);e!==null&&!s.isDateDisabled(e,v.min,v.max)?v.onSelectedDateChange(e):T(v.selectedDate===void 0?``:v.formatDate(v.selectedDate))},[w,v]),k=c.useCallback(e=>{e.key===`Enter`?(e.preventDefault(),O()):e.key===`Escape`?v.open?(e.preventDefault(),v.onOpenChange(!1)):T(v.selectedDate===void 0?``:v.formatDate(v.selectedDate)):e.key===`Tab`&&v.open&&v.onOpenChange(!1)},[O,v]),A=c.useCallback(e=>{let t=e.relatedTarget;t&&v.refs.floating.current?.contains(t)||O()},[O,v.refs.floating]),j=c.useCallback(()=>{v.disabled||(v.focusCalendarOnOpen.current=!v.open,v.onOpenChange(!v.open))},[v]),M=v.getReferenceProps({});return(0,l.jsxs)(`div`,{ref:y,className:t.cn(`relative inline-flex w-full items-center`,u),..._,children:[(0,l.jsx)(a.Input,{type:`text`,value:w,onChange:e=>T(e.target.value),onClick:D,onKeyDown:k,onBlur:A,placeholder:d,size:f,id:b.resolvedId,disabled:v.disabled||b.resolvedDisabled,"aria-invalid":E,"aria-describedby":b.ariaDescribedBy,"aria-required":b.ariaRequired,className:`pr-(--space-10)`,autoComplete:`off`}),(0,l.jsx)(`button`,{ref:n.composeRefs(v.triggerButtonRef,v.refs.setReference),type:`button`,...M,onClick:j,disabled:v.disabled,"aria-label":`Open calendar`,className:t.cn(`absolute right-0 top-0 bottom-0 flex items-center justify-center`,`px-(--space-3) text-(--nuka-text-muted) hover:text-(--nuka-text-base)`,`disabled:pointer-events-none disabled:opacity-50`,`cursor-pointer`),children:(0,l.jsx)(r.Icon,{size:`sm`,children:(0,l.jsxs)(`svg`,{xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:`2`,strokeLinecap:`round`,strokeLinejoin:`round`,children:[(0,l.jsx)(`rect`,{x:`3`,y:`4`,width:`18`,height:`18`,rx:`2`,ry:`2`}),(0,l.jsx)(`line`,{x1:`16`,y1:`2`,x2:`16`,y2:`6`}),(0,l.jsx)(`line`,{x1:`8`,y1:`2`,x2:`8`,y2:`6`}),(0,l.jsx)(`line`,{x1:`3`,y1:`10`,x2:`21`,y2:`10`})]})})})]})}u.displayName=`DatePickerInput`,exports.DatePickerInput=u;
 //# sourceMappingURL=DatePickerInput.cjs.map

package/dist/components/DatePicker/DatePickerInput.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePickerInput.cjs","names":[],"sources":["../../../src/components/DatePicker/DatePickerInput.tsx"],"sourcesContent":["\"use client\";\n// Exceeds 200 lines: single forwardRef component with input handling, blur/keydown/click\n// callbacks, form field integration, and calendar toggle. Cannot split without violating\n// single-component-per-file.\nimport * as React from \"react\";\nimport { useFormFieldProps } from \"@nuka/hooks/use-form-field-props\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Input } from \"@nuka/components/Input\";\nimport { Icon } from \"@nuka/components/Icon\";\nimport { useDatePickerContext } from \"@nuka/components/DatePicker/DatePicker.context\";\nimport { isDateDisabled } from \"@nuka/components/DatePicker/DatePicker.utils\";\n\nexport interface DatePickerInputProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n \"id\"\n> {\n placeholder?: string;\n size?: \"sm\" \| \"md\" \| \"lg\";\n id?: string;\n \"aria-invalid\"?: React.AriaAttributes[\"aria-invalid\"];\n \"aria-describedby\"?: string;\n \"aria-required\"?: React.AriaAttributes[\"aria-required\"];\n}\n\~~nconst~~ DatePickerInput ~~= React.forwardRef<HTMLDivElement, DatePickerInputProps>~~(\n (\n ~~{\n~~ className,\n placeholder = \"YYYY-MM-DD\",\n size,\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n ...props\n }~~,\n ref,\n~~ ) => {\n const ctx = useDatePickerContext();\n const setPositionRef = React.useCallback(\n (node: HTMLDivElement \| null) => {\n if (node) {\n ctx.refs.setPositionReference(node);\n }\n },\n [ctx.refs],\n );\n const composedRef = composeRefs(ref, setPositionRef);\n\n const field = useFormFieldProps({\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n });\n\n const { selectedDate, open, formatDate: ctxFormatDate } = ctx;\n\n const [inputText, setInputText] = React.useState(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n\n React.useEffect(() => {\n if (!open) {\n setInputText(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n }\n }, [selectedDate, open, ctxFormatDate]);\n\n const ariaInvalid = field.ariaInvalid ?? undefined;\n\n const handleInputClick = React.useCallback(() => {\n if (!ctx.disabled && !ctx.open) {\n ctx.focusCalendarOnOpen.current = false;\n ctx.onOpenChange(true);\n }\n }, [ctx]);\n\n const commitValue = React.useCallback(() => {\n const parsed = ctx.parseDate(inputText);\n if (parsed !== null && !isDateDisabled(parsed, ctx.min, ctx.max)) {\n ctx.onSelectedDateChange(parsed);\n } else {\n setInputText(\n ctx.selectedDate !== undefined\n ? ctx.formatDate(ctx.selectedDate)\n : \"\",\n );\n }\n }, [inputText, ctx]);\n\n const handleInputKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n commitValue();\n } else if (e.key === \"Escape\") {\n if (ctx.open) {\n e.preventDefault();\n ctx.onOpenChange(false);\n } else {\n setInputText(\n ctx.selectedDate !== undefined\n ? ctx.formatDate(ctx.selectedDate)\n : \"\",\n );\n }\n } else if (e.key === \"Tab\") {\n if (ctx.open) {\n ctx.onOpenChange(false);\n }\n }\n },\n [commitValue, ctx],\n );\n\n const handleInputBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n const relatedTarget = e.relatedTarget as Node \| null;\n if (\n relatedTarget ~~&&\n~~ ctx.refs.floating.current?.contains(relatedTarget)\n ) {\n return;\n }\n commitValue();\n },\n [commitValue, ctx.refs.floating],\n );\n\n const handleToggle = React.useCallback(() => {\n if (!ctx.disabled) {\n ctx.focusCalendarOnOpen.current = !ctx.open;\n ctx.onOpenChange(!ctx.open);\n }\n }, [ctx]);\n\n const referenceProps = ctx.getReferenceProps({});\n\n return (\n <div\n ref={composedRef}\n className={cn(\"relative inline-flex w-full items-center\", className)}\n {...props}\n >\n <Input\n type=\"text\"\n value={inputText}\n onChange={(e) => setInputText(e.target.value)}\n onClick={handleInputClick}\n onKeyDown={handleInputKeyDown}\n onBlur={handleInputBlur}\n placeholder={placeholder}\n size={size}\n id={field.resolvedId}\n disabled={ctx.disabled \|\| field.resolvedDisabled}\n aria-invalid={ariaInvalid}\n aria-describedby={field.ariaDescribedBy}\n aria-required={field.ariaRequired}\n className=\"pr-(--space-10)\"\n autoComplete=\"off\"\n />\n <button\n ref={composeRefs(\n ctx.triggerButtonRef,\n ctx.refs.setReference as React.Ref<HTMLButtonElement>,\n )}\n type=\"button\"\n {...(referenceProps as React.ButtonHTMLAttributes<HTMLButtonElement>)}\n onClick={handleToggle}\n disabled={ctx.disabled}\n aria-label=\"Open calendar\"\n className={cn(\n \"absolute right-0 top-0 bottom-0 flex items-center justify-center\",\n \"px-(--space-3) text-(--nuka-text-muted) hover:text-(--nuka-text-base)\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"cursor-pointer\",\n )}\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\" />\n <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\" />\n <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\" />\n <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\" />\n </svg>\n </Icon>\n </button>\n </div>\n );\n },\n~~);\n~~\nDatePickerInput.displayName = \"DatePickerInput\";\n\nexport { DatePickerInput };\n"],"mappings":"~~4YAyBA~~,~~IAAM~~,~~EAAkB~~,~~EAAM~~,~~YAE1B~~,~~CACE,~~YACA,cAAc,aACd,OACA,KACA,eAAgB,EAChB,mBAAoB,EACpB,gBAAiB,EACjB,GAAG,~~GAEL~~,~~IACG~~,~~CACH,~~IAAM,EAAM,EAAA,sBAAsB,CAS5B,EAAc,EAAA,YAAY,EART,EAAM,YAC1B,GAAgC,CAC3B,GACF,EAAI,KAAK,qBAAqB,EAAK,EAGvC,CAAC,EAAI,KAAK,CACX,CACmD,CAE9C,EAAQ,EAAA,kBAAkB,CAC9B,KACA,eAAgB,EAChB,mBAAoB,EACpB,gBAAiB,EAClB,CAAC,CAEI,CAAE,eAAc,OAAM,WAAY,GAAkB,EAEpD,CAAC,EAAW,GAAgB,EAAM,SACtC,IAAiB,IAAA,GAA0C,GAA9B,EAAc,EAAa,CACzD,CAED,EAAM,cAAgB,CACf,GACH,EACE,IAAiB,IAAA,GAA0C,GAA9B,EAAc,EAAa,CACzD,EAEF,CAAC,EAAc,EAAM,EAAc,CAAC,CAEvC,IAAM,EAAc,EAAM,aAAe,IAAA,GAEnC,EAAmB,EAAM,gBAAkB,CAC3C,CAAC,EAAI,UAAY,CAAC,EAAI,OACxB,EAAI,oBAAoB,QAAU,GAClC,EAAI,aAAa,GAAK,GAEvB,CAAC,EAAI,CAAC,CAEH,EAAc,EAAM,gBAAkB,CAC1C,IAAM,EAAS,EAAI,UAAU,EAAU,CACnC,IAAW,MAAQ,CAAC,EAAA,eAAe,EAAQ,EAAI,IAAK,EAAI,IAAI,CAC9D,EAAI,qBAAqB,EAAO,CAEhC,EACE,EAAI,eAAiB,IAAA,~~GAEjB~~,~~GADA~~,EAAI,WAAW,EAAI,aAAa,~~CAErC~~,EAEF,CAAC,EAAW,EAAI,CAAC,CAEd,EAAqB,EAAM,YAC9B,GAA6C,CACxC,EAAE,MAAQ,SACZ,EAAE,gBAAgB,CAClB,GAAa,EACJ,EAAE,MAAQ,SACf,EAAI,MACN,EAAE,gBAAgB,CAClB,EAAI,aAAa,GAAM,EAEvB,EACE,EAAI,eAAiB,IAAA,GAEjB,GADA,EAAI,WAAW,EAAI,aAAa,CAErC,CAEM,EAAE,MAAQ,OACf,EAAI,MACN,EAAI,aAAa,GAAM,EAI7B,CAAC,EAAa,EAAI,CACnB,CAEK,EAAkB,EAAM,YAC3B,GAA0C,CACzC,IAAM,EAAgB,EAAE,~~cAEtB~~,~~GACA~~,EAAI,KAAK,SAAS,SAAS,SAAS,EAAc,~~EAIpD~~,GAAa,EAEf,CAAC,EAAa,EAAI,KAAK,SAAS,CACjC,CAEK,EAAe,EAAM,gBAAkB,CACtC,EAAI,WACP,EAAI,oBAAoB,QAAU,CAAC,EAAI,KACvC,EAAI,aAAa,CAAC,EAAI,KAAK,GAE5B,CAAC,EAAI,CAAC,CAEH,EAAiB,EAAI,kBAAkB,EAAE,CAAC,CAEhD,OACE,EAAA,EAAA,MAAC,MAAD,CACE,IAAK,EACL,UAAW,EAAA,GAAG,2CAA4C,EAAU,CACpE,GAAI,WAHN,EAKE,EAAA,EAAA,KAAC,EAAA,MAAD,CACE,KAAK,OACL,MAAO,EACP,SAAW,GAAM,EAAa,EAAE,OAAO,MAAM,CAC7C,QAAS,EACT,UAAW,EACX,OAAQ,EACK,cACP,OACN,GAAI,EAAM,WACV,SAAU,EAAI,UAAY,EAAM,iBAChC,eAAc,EACd,mBAAkB,EAAM,gBACxB,gBAAe,EAAM,aACrB,UAAU,kBACV,aAAa,MACb,CAAA,EACF,EAAA,EAAA,KAAC,SAAD,CACE,IAAK,EAAA,YACH,EAAI,iBACJ,EAAI,KAAK,aACV,CACD,KAAK,SACL,GAAK,EACL,QAAS,EACT,SAAU,EAAI,SACd,aAAW,gBACX,UAAW,EAAA,GACT,mEACA,wEACA,mDACA,iBACD,WAED,EAAA,EAAA,KAAC,EAAA,KAAD,CAAM,KAAK,eACT,EAAA,EAAA,MAAC,MAAD,CACE,MAAM,6BACN,QAAQ,YACR,KAAK,OACL,OAAO,eACP,YAAY,IACZ,cAAc,QACd,eAAe,iBAPjB,EASE,EAAA,EAAA,KAAC,OAAD,CAAM,EAAE,IAAI,EAAE,IAAI,MAAM,KAAK,OAAO,KAAK,GAAG,IAAI,GAAG,IAAM,CAAA,EACzD,EAAA,EAAA,KAAC,OAAD,CAAM,GAAG,KAAK,GAAG,IAAI,GAAG,KAAK,GAAG,IAAM,CAAA,EACtC,EAAA,EAAA,KAAC,OAAD,CAAM,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAM,CAAA,EACpC,EAAA,EAAA,KAAC,OAAD,CAAM,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,KAAO,CAAA,CACnC,GACD,CAAA,CACA,CAAA,CACL,~~IAGX~~,~~CAED,~~EAAgB,YAAc"}
1	+ {"version":3,"file":"DatePickerInput.cjs","names":[],"sources":["../../../src/components/DatePicker/DatePickerInput.tsx"],"sourcesContent":["\"use client\";\n// Exceeds 200 lines: single forwardRef component with input handling, blur/keydown/click\n// callbacks, form field integration, and calendar toggle. Cannot split without violating\n// single-component-per-file.\nimport * as React from \"react\";\nimport { useFormFieldProps } from \"@nuka/hooks/use-form-field-props\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Input } from \"@nuka/components/Input\";\nimport { Icon } from \"@nuka/components/Icon\";\nimport { useDatePickerContext } from \"@nuka/components/DatePicker/DatePicker.context\";\nimport { isDateDisabled } from \"@nuka/components/DatePicker/DatePicker.utils\";\n\nexport interface DatePickerInputProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n \"id\"\n> {\n ref?: React.Ref<HTMLDivElement> \| undefined;\n placeholder?: string;\n size?: \"sm\" \| \"md\" \| \"lg\";\n id?: string;\n \"aria-invalid\"?: React.AriaAttributes[\"aria-invalid\"];\n \"aria-describedby\"?: string;\n \"aria-required\"?: React.AriaAttributes[\"aria-required\"];\n}\n\nfunction DatePickerInput({\n ref,\n className,\n placeholder = \"YYYY-MM-DD\",\n size,\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n ...props\n}: DatePickerInputProps) {\n const ctx = useDatePickerContext();\n const setPositionRef = React.useCallback(\n (node: HTMLDivElement \| null) => {\n if (node) {\n ctx.refs.setPositionReference(node);\n }\n },\n [ctx.refs],\n );\n const composedRef = composeRefs(ref, setPositionRef);\n\n const field = useFormFieldProps({\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n });\n\n const { selectedDate, open, formatDate: ctxFormatDate } = ctx;\n\n const [inputText, setInputText] = React.useState(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n\n React.useEffect(() => {\n if (!open) {\n setInputText(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n }\n }, [selectedDate, open, ctxFormatDate]);\n\n const ariaInvalid = field.ariaInvalid ?? undefined;\n\n const handleInputClick = React.useCallback(() => {\n if (!ctx.disabled && !ctx.open) {\n ctx.focusCalendarOnOpen.current = false;\n ctx.onOpenChange(true);\n }\n }, [ctx]);\n\n const commitValue = React.useCallback(() => {\n const parsed = ctx.parseDate(inputText);\n if (parsed !== null && !isDateDisabled(parsed, ctx.min, ctx.max)) {\n ctx.onSelectedDateChange(parsed);\n } else {\n setInputText(\n ctx.selectedDate !== undefined ? ctx.formatDate(ctx.selectedDate) : \"\",\n );\n }\n }, [inputText, ctx]);\n\n const handleInputKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n commitValue();\n } else if (e.key === \"Escape\") {\n if (ctx.open) {\n e.preventDefault();\n ctx.onOpenChange(false);\n } else {\n setInputText(\n ctx.selectedDate !== undefined\n ? ctx.formatDate(ctx.selectedDate)\n : \"\",\n );\n }\n } else if (e.key === \"Tab\") {\n if (ctx.open) {\n ctx.onOpenChange(false);\n }\n }\n },\n [commitValue, ctx],\n );\n\n const handleInputBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n const relatedTarget = e.relatedTarget as Node \| null;\n if (relatedTarget && ctx.refs.floating.current?.contains(relatedTarget)) {\n return;\n }\n commitValue();\n },\n [commitValue, ctx.refs.floating],\n );\n\n const handleToggle = React.useCallback(() => {\n if (!ctx.disabled) {\n ctx.focusCalendarOnOpen.current = !ctx.open;\n ctx.onOpenChange(!ctx.open);\n }\n }, [ctx]);\n\n const referenceProps = ctx.getReferenceProps({});\n\n return (\n <div\n ref={composedRef}\n className={cn(\"relative inline-flex w-full items-center\", className)}\n {...props}\n >\n <Input\n type=\"text\"\n value={inputText}\n onChange={(e) => setInputText(e.target.value)}\n onClick={handleInputClick}\n onKeyDown={handleInputKeyDown}\n onBlur={handleInputBlur}\n placeholder={placeholder}\n size={size}\n id={field.resolvedId}\n disabled={ctx.disabled \|\| field.resolvedDisabled}\n aria-invalid={ariaInvalid}\n aria-describedby={field.ariaDescribedBy}\n aria-required={field.ariaRequired}\n className=\"pr-(--space-10)\"\n autoComplete=\"off\"\n />\n <button\n ref={composeRefs(\n ctx.triggerButtonRef,\n ctx.refs.setReference as React.Ref<HTMLButtonElement>,\n )}\n type=\"button\"\n {...(referenceProps as React.ButtonHTMLAttributes<HTMLButtonElement>)}\n onClick={handleToggle}\n disabled={ctx.disabled}\n aria-label=\"Open calendar\"\n className={cn(\n \"absolute right-0 top-0 bottom-0 flex items-center justify-center\",\n \"px-(--space-3) text-(--nuka-text-muted) hover:text-(--nuka-text-base)\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"cursor-pointer\",\n )}\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\" />\n <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\" />\n <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\" />\n <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\" />\n </svg>\n </Icon>\n </button>\n </div>\n );\n}\n\nDatePickerInput.displayName = \"DatePickerInput\";\n\nexport { DatePickerInput };\n"],"mappings":"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"}

package/dist/components/DatePicker/DatePickerInput.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import * as React from "react";
 export interface DatePickerInputProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "id"> {
+    ref?: React.Ref<HTMLDivElement> | undefined;
     placeholder?: string;
     size?: "sm" | "md" | "lg";
     id?: string;
@@ -7,6 +8,9 @@ export interface DatePickerInputProps extends Omit<React.HTMLAttributes<HTMLDivE
     "aria-describedby"?: string;
     "aria-required"?: React.AriaAttributes["aria-required"];
 }
-declare const DatePickerInput: React.ForwardRefExoticComponent<DatePickerInputProps & React.RefAttributes<HTMLDivElement>>;
+declare function DatePickerInput({ ref, className, placeholder, size, id, "aria-invalid": ariaInvalidProp, "aria-describedby": ariaDescribedByProp, "aria-required": ariaRequiredProp, ...props }: DatePickerInputProps): import("react/jsx-runtime").JSX.Element;
+declare namespace DatePickerInput {
+    var displayName: string;
+}
 export { DatePickerInput };
 //# sourceMappingURL=DatePickerInput.d.ts.map

package/dist/components/DatePicker/DatePickerInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/DatePickerInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAChD,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,IAAI,CACL;IACC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;IACtD,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,eAAe,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;CACzD;AAED,~~QAAA~~,~~MAAM~~,eAAe,~~6FAgLpB~~,~~CAAC~~;~~AAIF~~,OAAO,EAAE,eAAe,EAAE,CAAC"}
1	+ {"version":3,"file":"DatePickerInput.d.ts","sourceRoot":"","sources":["../../../src/components/DatePicker/DatePickerInput.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,MAAM,WAAW,oBAAqB,SAAQ,IAAI,CAChD,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,EACpC,IAAI,CACL;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,GAAG,SAAS,CAAC;IAC5C,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,cAAc,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC;IACtD,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,eAAe,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,eAAe,CAAC,CAAC;CACzD;AAED,iBAAS,eAAe,CAAC,EACvB,GAAG,EACH,SAAS,EACT,WAA0B,EAC1B,IAAI,EACJ,EAAE,EACF,cAAc,EAAE,eAAe,EAC/B,kBAAkB,EAAE,mBAAmB,EACvC,eAAe,EAAE,gBAAgB,EACjC,GAAG,KAAK,EACT,EAAE,oBAAoB,2CA6JtB;kBAvKQ,eAAe;;;AA2KxB,OAAO,EAAE,eAAe,EAAE,CAAC"}

package/dist/components/DatePicker/DatePickerInput.js CHANGED Viewed

@@ -9,14 +9,14 @@ import { isDateDisabled as o } from "./DatePicker.utils.js";
 import * as s from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/DatePicker/DatePickerInput.tsx
-var u = s.forwardRef(({ className: u, placeholder: d = "YYYY-MM-DD", size: f, id: p, "aria-invalid": m, "aria-describedby": h, "aria-required": g, ..._ }, v) => {
-	let y = a(), b = t(v, s.useCallback((e) => {
+function u({ ref: u, className: d, placeholder: f = "YYYY-MM-DD", size: p, id: m, "aria-invalid": h, "aria-describedby": g, "aria-required": _, ...v }) {
+	let y = a(), b = t(u, s.useCallback((e) => {
 		e && y.refs.setPositionReference(e);
 	}, [y.refs])), x = r({
-		id: p,
-		"aria-invalid": m,
-		"aria-describedby": h,
-		"aria-required": g
+		id: m,
+		"aria-invalid": h,
+		"aria-describedby": g,
+		"aria-required": _
 	}), { selectedDate: S, open: C, formatDate: w } = y, [T, E] = s.useState(S === void 0 ? "" : w(S));
 	s.useEffect(() => {
 		C || E(S === void 0 ? "" : w(S));
@@ -40,8 +40,8 @@ var u = s.forwardRef(({ className: u, placeholder: d = "YYYY-MM-DD", size: f, id
 	}, [y]), N = y.getReferenceProps({});
 	return /* @__PURE__ */ l("div", {
 		ref: b,
-		className: e("relative inline-flex w-full items-center", u),
-		..._,
+		className: e("relative inline-flex w-full items-center", d),
+		...v,
 		children: [/* @__PURE__ */ c(i, {
 			type: "text",
 			value: T,
@@ -49,8 +49,8 @@ var u = s.forwardRef(({ className: u, placeholder: d = "YYYY-MM-DD", size: f, id
 			onClick: O,
 			onKeyDown: A,
 			onBlur: j,
-			placeholder: d,
-			size: f,
+			placeholder: f,
+			size: p,
 			id: x.resolvedId,
 			disabled: y.disabled || x.resolvedDisabled,
 			"aria-invalid": D,
@@ -108,7 +108,7 @@ var u = s.forwardRef(({ className: u, placeholder: d = "YYYY-MM-DD", size: f, id
 			})
 		})]
 	});
-});
+}
 u.displayName = "DatePickerInput";
 //#endregion
 export { u as DatePickerInput };

package/dist/components/DatePicker/DatePickerInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DatePickerInput.js","names":[],"sources":["../../../src/components/DatePicker/DatePickerInput.tsx"],"sourcesContent":["\"use client\";\n// Exceeds 200 lines: single forwardRef component with input handling, blur/keydown/click\n// callbacks, form field integration, and calendar toggle. Cannot split without violating\n// single-component-per-file.\nimport * as React from \"react\";\nimport { useFormFieldProps } from \"@nuka/hooks/use-form-field-props\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Input } from \"@nuka/components/Input\";\nimport { Icon } from \"@nuka/components/Icon\";\nimport { useDatePickerContext } from \"@nuka/components/DatePicker/DatePicker.context\";\nimport { isDateDisabled } from \"@nuka/components/DatePicker/DatePicker.utils\";\n\nexport interface DatePickerInputProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n \"id\"\n> {\n placeholder?: string;\n size?: \"sm\" \| \"md\" \| \"lg\";\n id?: string;\n \"aria-invalid\"?: React.AriaAttributes[\"aria-invalid\"];\n \"aria-describedby\"?: string;\n \"aria-required\"?: React.AriaAttributes[\"aria-required\"];\n}\n\~~nconst~~ DatePickerInput ~~= React.forwardRef<HTMLDivElement, DatePickerInputProps>~~(\n (\n ~~{\n~~ className,\n placeholder = \"YYYY-MM-DD\",\n size,\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n ...props\n }~~,\n ref,\n~~ ) => {\n const ctx = useDatePickerContext();\n const setPositionRef = React.useCallback(\n (node: HTMLDivElement \| null) => {\n if (node) {\n ctx.refs.setPositionReference(node);\n }\n },\n [ctx.refs],\n );\n const composedRef = composeRefs(ref, setPositionRef);\n\n const field = useFormFieldProps({\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n });\n\n const { selectedDate, open, formatDate: ctxFormatDate } = ctx;\n\n const [inputText, setInputText] = React.useState(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n\n React.useEffect(() => {\n if (!open) {\n setInputText(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n }\n }, [selectedDate, open, ctxFormatDate]);\n\n const ariaInvalid = field.ariaInvalid ?? undefined;\n\n const handleInputClick = React.useCallback(() => {\n if (!ctx.disabled && !ctx.open) {\n ctx.focusCalendarOnOpen.current = false;\n ctx.onOpenChange(true);\n }\n }, [ctx]);\n\n const commitValue = React.useCallback(() => {\n const parsed = ctx.parseDate(inputText);\n if (parsed !== null && !isDateDisabled(parsed, ctx.min, ctx.max)) {\n ctx.onSelectedDateChange(parsed);\n } else {\n setInputText(\n ctx.selectedDate !== undefined\n ? ctx.formatDate(ctx.selectedDate)\n : \"\",\n );\n }\n }, [inputText, ctx]);\n\n const handleInputKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n commitValue();\n } else if (e.key === \"Escape\") {\n if (ctx.open) {\n e.preventDefault();\n ctx.onOpenChange(false);\n } else {\n setInputText(\n ctx.selectedDate !== undefined\n ? ctx.formatDate(ctx.selectedDate)\n : \"\",\n );\n }\n } else if (e.key === \"Tab\") {\n if (ctx.open) {\n ctx.onOpenChange(false);\n }\n }\n },\n [commitValue, ctx],\n );\n\n const handleInputBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n const relatedTarget = e.relatedTarget as Node \| null;\n if (\n relatedTarget ~~&&\n~~ ctx.refs.floating.current?.contains(relatedTarget)\n ) {\n return;\n }\n commitValue();\n },\n [commitValue, ctx.refs.floating],\n );\n\n const handleToggle = React.useCallback(() => {\n if (!ctx.disabled) {\n ctx.focusCalendarOnOpen.current = !ctx.open;\n ctx.onOpenChange(!ctx.open);\n }\n }, [ctx]);\n\n const referenceProps = ctx.getReferenceProps({});\n\n return (\n <div\n ref={composedRef}\n className={cn(\"relative inline-flex w-full items-center\", className)}\n {...props}\n >\n <Input\n type=\"text\"\n value={inputText}\n onChange={(e) => setInputText(e.target.value)}\n onClick={handleInputClick}\n onKeyDown={handleInputKeyDown}\n onBlur={handleInputBlur}\n placeholder={placeholder}\n size={size}\n id={field.resolvedId}\n disabled={ctx.disabled \|\| field.resolvedDisabled}\n aria-invalid={ariaInvalid}\n aria-describedby={field.ariaDescribedBy}\n aria-required={field.ariaRequired}\n className=\"pr-(--space-10)\"\n autoComplete=\"off\"\n />\n <button\n ref={composeRefs(\n ctx.triggerButtonRef,\n ctx.refs.setReference as React.Ref<HTMLButtonElement>,\n )}\n type=\"button\"\n {...(referenceProps as React.ButtonHTMLAttributes<HTMLButtonElement>)}\n onClick={handleToggle}\n disabled={ctx.disabled}\n aria-label=\"Open calendar\"\n className={cn(\n \"absolute right-0 top-0 bottom-0 flex items-center justify-center\",\n \"px-(--space-3) text-(--nuka-text-muted) hover:text-(--nuka-text-base)\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"cursor-pointer\",\n )}\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\" />\n <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\" />\n <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\" />\n <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\" />\n </svg>\n </Icon>\n </button>\n </div>\n );\n },\n~~);\n~~\nDatePickerInput.displayName = \"DatePickerInput\";\n\nexport { DatePickerInput };\n"],"mappings":";;;;;;;;;;;~~AAyBA~~,~~IAAM~~,~~IAAkB~~,~~EAAM~~,~~YAE1B~~,~~EACE,~~cACA,iBAAc,cACd,SACA,OACA,gBAAgB,GAChB,oBAAoB,GACpB,iBAAiB,GACjB,GAAG,~~KAEL,MACG~~;~~CACH~~,IAAM,IAAM,GAAsB,EAS5B,IAAc,EAAY,GART,EAAM,aAC1B,MAAgC;AAC/B,EAAI,KACF,EAAI,KAAK,qBAAqB,EAAK;IAGvC,CAAC,EAAI,KAAK,CACX,CACmD,EAE9C,IAAQ,EAAkB;EAC9B;EACA,gBAAgB;EAChB,oBAAoB;EACpB,iBAAiB;EAClB,CAAC,EAEI,EAAE,iBAAc,SAAM,YAAY,MAAkB,GAEpD,CAAC,GAAW,KAAgB,EAAM,SACtC,MAAiB,KAAA,IAA0C,KAA9B,EAAc,EAAa,CACzD;AAED,GAAM,gBAAgB;AACpB,EAAK,KACH,EACE,MAAiB,KAAA,IAA0C,KAA9B,EAAc,EAAa,CACzD;IAEF;EAAC;EAAc;EAAM;EAAc,CAAC;CAEvC,IAAM,IAAc,EAAM,eAAe,KAAA,GAEnC,IAAmB,EAAM,kBAAkB;AAC/C,EAAI,CAAC,EAAI,YAAY,CAAC,EAAI,SACxB,EAAI,oBAAoB,UAAU,IAClC,EAAI,aAAa,GAAK;IAEvB,CAAC,EAAI,CAAC,EAEH,IAAc,EAAM,kBAAkB;EAC1C,IAAM,IAAS,EAAI,UAAU,EAAU;AACvC,EAAI,MAAW,QAAQ,CAAC,EAAe,GAAQ,EAAI,KAAK,EAAI,IAAI,GAC9D,EAAI,qBAAqB,EAAO,GAEhC,EACE,EAAI,iBAAiB,KAAA,~~IAEjB~~,~~KADA~~,EAAI,WAAW,EAAI,aAAa,~~CAErC~~;IAEF,CAAC,GAAW,EAAI,CAAC,EAEd,IAAqB,EAAM,aAC9B,MAA6C;AAC5C,EAAI,EAAE,QAAQ,WACZ,EAAE,gBAAgB,EAClB,GAAa,IACJ,EAAE,QAAQ,WACf,EAAI,QACN,EAAE,gBAAgB,EAClB,EAAI,aAAa,GAAM,IAEvB,EACE,EAAI,iBAAiB,KAAA,IAEjB,KADA,EAAI,WAAW,EAAI,aAAa,CAErC,GAEM,EAAE,QAAQ,SACf,EAAI,QACN,EAAI,aAAa,GAAM;IAI7B,CAAC,GAAa,EAAI,CACnB,EAEK,IAAkB,EAAM,aAC3B,MAA0C;EACzC,IAAM,IAAgB,EAAE;~~AAEtB~~,~~OACA~~,EAAI,KAAK,SAAS,SAAS,SAAS,EAAc,~~IAIpD~~,GAAa;IAEf,CAAC,GAAa,EAAI,KAAK,SAAS,CACjC,EAEK,IAAe,EAAM,kBAAkB;AAC3C,EAAK,EAAI,aACP,EAAI,oBAAoB,UAAU,CAAC,EAAI,MACvC,EAAI,aAAa,CAAC,EAAI,KAAK;IAE5B,CAAC,EAAI,CAAC,EAEH,IAAiB,EAAI,kBAAkB,EAAE,CAAC;AAEhD,QACE,kBAAC,OAAD;EACE,KAAK;EACL,WAAW,EAAG,4CAA4C,EAAU;EACpE,GAAI;YAHN,CAKE,kBAAC,GAAD;GACE,MAAK;GACL,OAAO;GACP,WAAW,MAAM,EAAa,EAAE,OAAO,MAAM;GAC7C,SAAS;GACT,WAAW;GACX,QAAQ;GACK;GACP;GACN,IAAI,EAAM;GACV,UAAU,EAAI,YAAY,EAAM;GAChC,gBAAc;GACd,oBAAkB,EAAM;GACxB,iBAAe,EAAM;GACrB,WAAU;GACV,cAAa;GACb,CAAA,EACF,kBAAC,UAAD;GACE,KAAK,EACH,EAAI,kBACJ,EAAI,KAAK,aACV;GACD,MAAK;GACL,GAAK;GACL,SAAS;GACT,UAAU,EAAI;GACd,cAAW;GACX,WAAW,EACT,oEACA,yEACA,oDACA,iBACD;aAED,kBAAC,GAAD;IAAM,MAAK;cACT,kBAAC,OAAD;KACE,OAAM;KACN,SAAQ;KACR,MAAK;KACL,QAAO;KACP,aAAY;KACZ,eAAc;KACd,gBAAe;eAPjB;MASE,kBAAC,QAAD;OAAM,GAAE;OAAI,GAAE;OAAI,OAAM;OAAK,QAAO;OAAK,IAAG;OAAI,IAAG;OAAM,CAAA;MACzD,kBAAC,QAAD;OAAM,IAAG;OAAK,IAAG;OAAI,IAAG;OAAK,IAAG;OAAM,CAAA;MACtC,kBAAC,QAAD;OAAM,IAAG;OAAI,IAAG;OAAI,IAAG;OAAI,IAAG;OAAM,CAAA;MACpC,kBAAC,QAAD;OAAM,IAAG;OAAI,IAAG;OAAK,IAAG;OAAK,IAAG;OAAO,CAAA;MACnC;;IACD,CAAA;GACA,CAAA,CACL~~;;EAGX;AAED~~,EAAgB,cAAc"}
1	+ {"version":3,"file":"DatePickerInput.js","names":[],"sources":["../../../src/components/DatePicker/DatePickerInput.tsx"],"sourcesContent":["\"use client\";\n// Exceeds 200 lines: single forwardRef component with input handling, blur/keydown/click\n// callbacks, form field integration, and calendar toggle. Cannot split without violating\n// single-component-per-file.\nimport * as React from \"react\";\nimport { useFormFieldProps } from \"@nuka/hooks/use-form-field-props\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Input } from \"@nuka/components/Input\";\nimport { Icon } from \"@nuka/components/Icon\";\nimport { useDatePickerContext } from \"@nuka/components/DatePicker/DatePicker.context\";\nimport { isDateDisabled } from \"@nuka/components/DatePicker/DatePicker.utils\";\n\nexport interface DatePickerInputProps extends Omit<\n React.HTMLAttributes<HTMLDivElement>,\n \"id\"\n> {\n ref?: React.Ref<HTMLDivElement> \| undefined;\n placeholder?: string;\n size?: \"sm\" \| \"md\" \| \"lg\";\n id?: string;\n \"aria-invalid\"?: React.AriaAttributes[\"aria-invalid\"];\n \"aria-describedby\"?: string;\n \"aria-required\"?: React.AriaAttributes[\"aria-required\"];\n}\n\nfunction DatePickerInput({\n ref,\n className,\n placeholder = \"YYYY-MM-DD\",\n size,\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n ...props\n}: DatePickerInputProps) {\n const ctx = useDatePickerContext();\n const setPositionRef = React.useCallback(\n (node: HTMLDivElement \| null) => {\n if (node) {\n ctx.refs.setPositionReference(node);\n }\n },\n [ctx.refs],\n );\n const composedRef = composeRefs(ref, setPositionRef);\n\n const field = useFormFieldProps({\n id,\n \"aria-invalid\": ariaInvalidProp,\n \"aria-describedby\": ariaDescribedByProp,\n \"aria-required\": ariaRequiredProp,\n });\n\n const { selectedDate, open, formatDate: ctxFormatDate } = ctx;\n\n const [inputText, setInputText] = React.useState(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n\n React.useEffect(() => {\n if (!open) {\n setInputText(\n selectedDate !== undefined ? ctxFormatDate(selectedDate) : \"\",\n );\n }\n }, [selectedDate, open, ctxFormatDate]);\n\n const ariaInvalid = field.ariaInvalid ?? undefined;\n\n const handleInputClick = React.useCallback(() => {\n if (!ctx.disabled && !ctx.open) {\n ctx.focusCalendarOnOpen.current = false;\n ctx.onOpenChange(true);\n }\n }, [ctx]);\n\n const commitValue = React.useCallback(() => {\n const parsed = ctx.parseDate(inputText);\n if (parsed !== null && !isDateDisabled(parsed, ctx.min, ctx.max)) {\n ctx.onSelectedDateChange(parsed);\n } else {\n setInputText(\n ctx.selectedDate !== undefined ? ctx.formatDate(ctx.selectedDate) : \"\",\n );\n }\n }, [inputText, ctx]);\n\n const handleInputKeyDown = React.useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.key === \"Enter\") {\n e.preventDefault();\n commitValue();\n } else if (e.key === \"Escape\") {\n if (ctx.open) {\n e.preventDefault();\n ctx.onOpenChange(false);\n } else {\n setInputText(\n ctx.selectedDate !== undefined\n ? ctx.formatDate(ctx.selectedDate)\n : \"\",\n );\n }\n } else if (e.key === \"Tab\") {\n if (ctx.open) {\n ctx.onOpenChange(false);\n }\n }\n },\n [commitValue, ctx],\n );\n\n const handleInputBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n const relatedTarget = e.relatedTarget as Node \| null;\n if (relatedTarget && ctx.refs.floating.current?.contains(relatedTarget)) {\n return;\n }\n commitValue();\n },\n [commitValue, ctx.refs.floating],\n );\n\n const handleToggle = React.useCallback(() => {\n if (!ctx.disabled) {\n ctx.focusCalendarOnOpen.current = !ctx.open;\n ctx.onOpenChange(!ctx.open);\n }\n }, [ctx]);\n\n const referenceProps = ctx.getReferenceProps({});\n\n return (\n <div\n ref={composedRef}\n className={cn(\"relative inline-flex w-full items-center\", className)}\n {...props}\n >\n <Input\n type=\"text\"\n value={inputText}\n onChange={(e) => setInputText(e.target.value)}\n onClick={handleInputClick}\n onKeyDown={handleInputKeyDown}\n onBlur={handleInputBlur}\n placeholder={placeholder}\n size={size}\n id={field.resolvedId}\n disabled={ctx.disabled \|\| field.resolvedDisabled}\n aria-invalid={ariaInvalid}\n aria-describedby={field.ariaDescribedBy}\n aria-required={field.ariaRequired}\n className=\"pr-(--space-10)\"\n autoComplete=\"off\"\n />\n <button\n ref={composeRefs(\n ctx.triggerButtonRef,\n ctx.refs.setReference as React.Ref<HTMLButtonElement>,\n )}\n type=\"button\"\n {...(referenceProps as React.ButtonHTMLAttributes<HTMLButtonElement>)}\n onClick={handleToggle}\n disabled={ctx.disabled}\n aria-label=\"Open calendar\"\n className={cn(\n \"absolute right-0 top-0 bottom-0 flex items-center justify-center\",\n \"px-(--space-3) text-(--nuka-text-muted) hover:text-(--nuka-text-base)\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"cursor-pointer\",\n )}\n >\n <Icon size=\"sm\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <rect x=\"3\" y=\"4\" width=\"18\" height=\"18\" rx=\"2\" ry=\"2\" />\n <line x1=\"16\" y1=\"2\" x2=\"16\" y2=\"6\" />\n <line x1=\"8\" y1=\"2\" x2=\"8\" y2=\"6\" />\n <line x1=\"3\" y1=\"10\" x2=\"21\" y2=\"10\" />\n </svg>\n </Icon>\n </button>\n </div>\n );\n}\n\nDatePickerInput.displayName = \"DatePickerInput\";\n\nexport { DatePickerInput };\n"],"mappings":"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"}

package/dist/components/Dialog/Dialog.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../../utils/cn.cjs`),n=require(`../../utils/slot.cjs`),r=require(`../../utils/dismiss-button.cjs`),i=require(`../../utils/portal.cjs`),a=require(`../../hooks/use-scroll-lock.cjs`),o=require(`../../hooks/use-escape-key.cjs`),s=require(`../../hooks/use-focus-trap.cjs`),c=require(`../../utils/modal-primitive.cjs`),l=require(`./Dialog.context.cjs`);let u=require(`react`);u=e.__toESM(u,1);let d=require(`react/jsx-runtime`);var{Root:f,Trigger:p,Title:m,Description:h,Close:g}=c.createModalPrimitive({displayNamePrefix:`Dialog`,closeLabel:`Close dialog`,Context:l.DialogContext,useContext:l.useDialogContext}),_=u.forwardRef(({className:e,children:f,...p},m)=>{let h=l.useDialogContext(),g=u.useRef(null),_=n.composeRefs(m,g);return s.useFocusTrap(g,h.open),a.useScrollLock(h.open),c.useModalTitleWarning(`Dialog`,h.titleId,h.open),o.useEscapeKey(()=>h.onOpenChange(!1),h.open),h.open?(0,d.jsxs)(i.Portal,{children:[(0,d.jsx)(`div`,{className:t.cn(`fixed inset-0 z-(--nuka-z-modal)`,`bg-(--nuka-bg-overlay)`,`data-[state=open]:animate-[nuka-dialog-overlay-enter_150ms_ease-out]`),"data-state":`open`,onClick:()=>h.onOpenChange(!1),"aria-hidden":`true`}),(0,d.jsxs)(`div`,{ref:_,role:`dialog`,"aria-modal":`true`,"aria-labelledby":h.titleId,"aria-describedby":h.hasDescription?h.descriptionId:void 0,tabIndex:-1,"data-state":`open`,className:t.cn(`fixed z-(--nuka-z-modal)`,`left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2`,`w-full max-w-lg`,`rounded-(--radius-xl) border border-(--nuka-border-base)`,`bg-(--nuka-bg-base) shadow-md`,`p-(--space-6)`,`data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]`,`focus-visible:outline-none`,e),...p,children:[(0,d.jsx)(r.DismissButton,{onClick:()=>h.onOpenChange(!1),label:`Close dialog`,className:`absolute top-(--space-4) right-(--space-4) text-(--nuka-text-muted)`}),f]})]}):null});_.displayName=`DialogContent`,exports.Dialog=f,exports.DialogClose=g,exports.DialogContent=_,exports.DialogDescription=h,exports.DialogTitle=m,exports.DialogTrigger=p;
+"use client";const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../../utils/cn.cjs`),n=require(`../../utils/slot.cjs`),r=require(`../../utils/dismiss-button.cjs`),i=require(`../../utils/portal.cjs`),a=require(`../../hooks/use-scroll-lock.cjs`),o=require(`../../hooks/use-escape-key.cjs`),s=require(`../../hooks/use-focus-trap.cjs`),c=require(`../../utils/modal-primitive.cjs`),l=require(`../../hooks/use-modal-title-warning.cjs`),u=require(`./Dialog.context.cjs`);let d=require(`react`);d=e.__toESM(d,1);let f=require(`react/jsx-runtime`);var{Root:p,Trigger:m,Title:h,Description:g,Close:_}=c.createModalPrimitive({displayNamePrefix:`Dialog`,closeLabel:`Close dialog`,Context:u.DialogContext,useContext:u.useDialogContext});function v({ref:e,className:c,children:p,...m}){let h=u.useDialogContext(),g=d.useRef(null),_=n.composeRefs(e,g);return s.useFocusTrap(g,h.open),a.useScrollLock(h.open),l.useModalTitleWarning(`Dialog`,h.titleId,h.open),o.useEscapeKey(()=>h.onOpenChange(!1),h.open),h.open?(0,f.jsxs)(i.Portal,{children:[(0,f.jsx)(`div`,{className:t.cn(`fixed inset-0 z-(--nuka-z-modal)`,`bg-(--nuka-bg-overlay)`,`data-[state=open]:animate-[nuka-dialog-overlay-enter_150ms_ease-out]`),"data-state":`open`,onClick:()=>h.onOpenChange(!1),"aria-hidden":`true`}),(0,f.jsxs)(`div`,{ref:_,role:`dialog`,"aria-modal":`true`,"aria-labelledby":h.titleId,"aria-describedby":h.hasDescription?h.descriptionId:void 0,tabIndex:-1,"data-state":`open`,className:t.cn(`fixed z-(--nuka-z-modal)`,`left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2`,`w-full max-w-lg`,`rounded-(--radius-xl) border border-(--nuka-border-base)`,`bg-(--nuka-bg-base) shadow-md`,`p-(--space-6)`,`data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]`,`focus-visible:outline-none`,c),...m,children:[(0,f.jsx)(r.DismissButton,{onClick:()=>h.onOpenChange(!1),label:`Close dialog`,className:`absolute top-(--space-4) right-(--space-4) text-(--nuka-text-muted)`}),p]})]}):null}v.displayName=`DialogContent`,exports.Dialog=p,exports.DialogClose=_,exports.DialogContent=v,exports.DialogDescription=g,exports.DialogTitle=h,exports.DialogTrigger=m;
 //# sourceMappingURL=Dialog.cjs.map

package/dist/components/Dialog/Dialog.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.cjs","names":[],"sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\nimport * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Portal } from \"@nuka/utils/portal\";\nimport { DismissButton } from \"@nuka/utils/dismiss-button\";\nimport { useFocusTrap } from \"@nuka/hooks/use-focus-trap\";\nimport { useScrollLock } from \"@nuka/hooks/use-scroll-lock\";\nimport {\n createModalPrimitive,\n useEscapeKey,\n ~~useModalTitleWarning,\n~~} from \"@nuka/utils/modal-primitive\";\nimport type {\n ModalRootProps,\n ModalTriggerProps,\n ModalTitleProps,\n ModalDescriptionProps,\n ModalCloseProps,\n} from \"@nuka/utils/modal-primitive\";\nimport {\n DialogContext,\n useDialogContext,\n} from \"@nuka/components/Dialog/Dialog.context\";\n\nconst {\n Root: Dialog,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n} = createModalPrimitive({\n displayNamePrefix: \"Dialog\",\n closeLabel: \"Close dialog\",\n Context: DialogContext,\n useContext: useDialogContext,\n});\n\nexport type DialogProps = ModalRootProps;\nexport type DialogTriggerProps = ModalTriggerProps;\nexport type DialogTitleProps = ModalTitleProps;\nexport type DialogDescriptionProps = ModalDescriptionProps;\nexport type DialogCloseProps = ModalCloseProps;\n\nexport interface DialogContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n~~\nconst~~ ~~DialogContent =~~ React.~~forwardRef~~<HTMLDivElement, ~~DialogContentProps>~~(\n ({ className, children, ...props }, ~~ref~~) => {\n const ctx = useDialogContext();\n const panelRef = React.useRef<HTMLDivElement>(null);\n const composedRef = composeRefs(ref, panelRef);\n\n useFocusTrap(panelRef, ctx.open);\n useScrollLock(ctx.open);\n useModalTitleWarning(\"Dialog\", ctx.titleId, ctx.open);\n useEscapeKey(() => ctx.onOpenChange(false), ctx.open);\n\n if (!ctx.open) return null;\n\n return (\n <Portal>\n <div\n className={cn(\n \"fixed inset-0 z-(--nuka-z-modal)\",\n \"bg-(--nuka-bg-overlay)\",\n \"data-[state=open]:animate-[nuka-dialog-overlay-enter_150ms_ease-out]\",\n )}\n data-state=\"open\"\n onClick={() => ctx.onOpenChange(false)}\n aria-hidden=\"true\"\n />\n <div\n ref={composedRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={ctx.titleId}\n aria-describedby={ctx.hasDescription ? ctx.descriptionId : undefined}\n tabIndex={-1}\n data-state=\"open\"\n className={cn(\n \"fixed z-(--nuka-z-modal)\",\n \"left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2\",\n \"w-full max-w-lg\",\n \"rounded-(--radius-xl) border border-(--nuka-border-base)\",\n \"bg-(--nuka-bg-base) shadow-md\",\n \"p-(--space-6)\",\n \"data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]\",\n // Programmatic focus via useFocusTrap; :focus-visible does not activate, so this is inert\n \"focus-visible:outline-none\",\n className,\n )}\n {...props}\n >\n <DismissButton\n onClick={() => ctx.onOpenChange(false)}\n label=\"Close dialog\"\n className=\"absolute top-(--space-4) right-(--space-4) text-(--nuka-text-muted)\"\n />\n {children}\n </div>\n </Portal>\n );\n },\n~~);\n~~\nDialogContent.displayName = \"DialogContent\";\n\nexport {\n Dialog,\n DialogTrigger,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"mappings":"~~sfAyBA~~,GAAM,CACJ,KAAM,EACN,QAAS,EACT,MAAO,EACP,YAAa,EACb,MAAO,GACL,EAAA,qBAAqB,CACvB,kBAAmB,SACnB,WAAY,eACZ,QAAS,EAAA,cACT,WAAY,EAAA,iBACb,CAAC,~~CAUI~~,~~EAAgB~~,~~EAAM~~,~~YACzB~~,~~CAAE~~,~~YAAW~~,~~WAAU~~,GAAG,~~GAAS~~,~~IAAQ~~,~~CAC1C,~~IAAM,EAAM,EAAA,kBAAkB,CACxB,EAAW,EAAM,OAAuB,KAAK,CAC7C,EAAc,EAAA,YAAY,EAAK,EAAS,CAS9C,OAPA,EAAA,aAAa,EAAU,EAAI,KAAK,CAChC,EAAA,cAAc,EAAI,KAAK,CACvB,EAAA,qBAAqB,SAAU,EAAI,QAAS,EAAI,KAAK,CACrD,EAAA,iBAAmB,EAAI,aAAa,GAAM,CAAE,EAAI,KAAK,CAEhD,EAAI,MAGP,EAAA,EAAA,MAAC,EAAA,OAAD,CAAA,SAAA,EACE,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,GACT,mCACA,yBACA,uEACD,CACD,aAAW,OACX,YAAe,EAAI,aAAa,GAAM,CACtC,cAAY,OACZ,CAAA,EACF,EAAA,EAAA,MAAC,MAAD,CACE,IAAK,EACL,KAAK,SACL,aAAW,OACX,kBAAiB,EAAI,QACrB,mBAAkB,EAAI,eAAiB,EAAI,cAAgB,IAAA,GAC3D,SAAU,GACV,aAAW,OACX,UAAW,EAAA,GACT,2BACA,qDACA,kBACA,2DACA,gCACA,gBACA,+DAEA,6BACA,EACD,CACD,GAAI,WApBN,EAsBE,EAAA,EAAA,KAAC,EAAA,cAAD,CACE,YAAe,EAAI,aAAa,GAAM,CACtC,MAAM,eACN,UAAU,sEACV,CAAA,CACD,EACG,GACC,CAAA,CAAA,CA3CW,~~MA8CzB~~,~~CAED,~~EAAc,YAAc"}
1	+ {"version":3,"file":"Dialog.cjs","names":[],"sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\nimport * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Portal } from \"@nuka/utils/portal\";\nimport { DismissButton } from \"@nuka/utils/dismiss-button\";\nimport { useFocusTrap } from \"@nuka/hooks/use-focus-trap\";\nimport { useScrollLock } from \"@nuka/hooks/use-scroll-lock\";\nimport {\n createModalPrimitive,\n useEscapeKey,\n} from \"@nuka/utils/modal-primitive\";\nimport { useModalTitleWarning } from \"@nuka/hooks/use-modal-title-warning\";\nimport type {\n ModalRootProps,\n ModalTriggerProps,\n ModalTitleProps,\n ModalDescriptionProps,\n ModalCloseProps,\n} from \"@nuka/utils/modal-primitive\";\nimport {\n DialogContext,\n useDialogContext,\n} from \"@nuka/components/Dialog/Dialog.context\";\n\nconst {\n Root: Dialog,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n} = createModalPrimitive({\n displayNamePrefix: \"Dialog\",\n closeLabel: \"Close dialog\",\n Context: DialogContext,\n useContext: useDialogContext,\n});\n\nexport type DialogProps = ModalRootProps;\nexport type DialogTriggerProps = ModalTriggerProps;\nexport type DialogTitleProps = ModalTitleProps;\nexport type DialogDescriptionProps = ModalDescriptionProps;\nexport type DialogCloseProps = ModalCloseProps;\n\nexport interface DialogContentProps extends React.HTMLAttributes<HTMLDivElement> {\n ref?: React.Ref<HTMLDivElement> \| undefined;\n}\n\nfunction DialogContent({\n ref,\n className,\n children,\n ...props\n}: DialogContentProps) {\n const ctx = useDialogContext();\n const panelRef = React.useRef<HTMLDivElement>(null);\n const composedRef = composeRefs(ref, panelRef);\n\n useFocusTrap(panelRef, ctx.open);\n useScrollLock(ctx.open);\n useModalTitleWarning(\"Dialog\", ctx.titleId, ctx.open);\n useEscapeKey(() => ctx.onOpenChange(false), ctx.open);\n\n if (!ctx.open) return null;\n\n return (\n <Portal>\n <div\n className={cn(\n \"fixed inset-0 z-(--nuka-z-modal)\",\n \"bg-(--nuka-bg-overlay)\",\n \"data-[state=open]:animate-[nuka-dialog-overlay-enter_150ms_ease-out]\",\n )}\n data-state=\"open\"\n onClick={() => ctx.onOpenChange(false)}\n aria-hidden=\"true\"\n />\n <div\n ref={composedRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={ctx.titleId}\n aria-describedby={ctx.hasDescription ? ctx.descriptionId : undefined}\n tabIndex={-1}\n data-state=\"open\"\n className={cn(\n \"fixed z-(--nuka-z-modal)\",\n \"left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2\",\n \"w-full max-w-lg\",\n \"rounded-(--radius-xl) border border-(--nuka-border-base)\",\n \"bg-(--nuka-bg-base) shadow-md\",\n \"p-(--space-6)\",\n \"data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]\",\n // Programmatic focus via useFocusTrap; :focus-visible does not activate, so this is inert\n \"focus-visible:outline-none\",\n className,\n )}\n {...props}\n >\n <DismissButton\n onClick={() => ctx.onOpenChange(false)}\n label=\"Close dialog\"\n className=\"absolute top-(--space-4) right-(--space-4) text-(--nuka-text-muted)\"\n />\n {children}\n </div>\n </Portal>\n );\n}\n\nDialogContent.displayName = \"DialogContent\";\n\nexport {\n Dialog,\n DialogTrigger,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"mappings":"2iBAyBA,GAAM,CACJ,KAAM,EACN,QAAS,EACT,MAAO,EACP,YAAa,EACb,MAAO,GACL,EAAA,qBAAqB,CACvB,kBAAmB,SACnB,WAAY,eACZ,QAAS,EAAA,cACT,WAAY,EAAA,iBACb,CAAC,CAYF,SAAS,EAAc,CACrB,MACA,YACA,WACA,GAAG,GACkB,CACrB,IAAM,EAAM,EAAA,kBAAkB,CACxB,EAAW,EAAM,OAAuB,KAAK,CAC7C,EAAc,EAAA,YAAY,EAAK,EAAS,CAS9C,OAPA,EAAA,aAAa,EAAU,EAAI,KAAK,CAChC,EAAA,cAAc,EAAI,KAAK,CACvB,EAAA,qBAAqB,SAAU,EAAI,QAAS,EAAI,KAAK,CACrD,EAAA,iBAAmB,EAAI,aAAa,GAAM,CAAE,EAAI,KAAK,CAEhD,EAAI,MAGP,EAAA,EAAA,MAAC,EAAA,OAAD,CAAA,SAAA,EACE,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,GACT,mCACA,yBACA,uEACD,CACD,aAAW,OACX,YAAe,EAAI,aAAa,GAAM,CACtC,cAAY,OACZ,CAAA,EACF,EAAA,EAAA,MAAC,MAAD,CACE,IAAK,EACL,KAAK,SACL,aAAW,OACX,kBAAiB,EAAI,QACrB,mBAAkB,EAAI,eAAiB,EAAI,cAAgB,IAAA,GAC3D,SAAU,GACV,aAAW,OACX,UAAW,EAAA,GACT,2BACA,qDACA,kBACA,2DACA,gCACA,gBACA,+DAEA,6BACA,EACD,CACD,GAAI,WApBN,EAsBE,EAAA,EAAA,KAAC,EAAA,cAAD,CACE,YAAe,EAAI,aAAa,GAAM,CACtC,MAAM,eACN,UAAU,sEACV,CAAA,CACD,EACG,GACC,CAAA,CAAA,CA3CW,KA+CxB,EAAc,YAAc"}

package/dist/components/Dialog/Dialog.d.ts CHANGED Viewed

@@ -1,13 +1,17 @@
 import { ModalRootProps, ModalTriggerProps, ModalTitleProps, ModalDescriptionProps, ModalCloseProps } from '../../utils/modal-primitive';
 import * as React from "react";
-declare const Dialog: React.FC<ModalRootProps>, DialogTrigger: React.ForwardRefExoticComponent<ModalTriggerProps & React.RefAttributes<HTMLButtonElement>>, DialogTitle: React.ForwardRefExoticComponent<ModalTitleProps & React.RefAttributes<HTMLElement>>, DialogDescription: React.ForwardRefExoticComponent<ModalDescriptionProps & React.RefAttributes<HTMLElement>>, DialogClose: React.ForwardRefExoticComponent<ModalCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Dialog: React.FC<ModalRootProps>, DialogTrigger: React.FC<ModalTriggerProps>, DialogTitle: React.FC<ModalTitleProps>, DialogDescription: React.FC<ModalDescriptionProps>, DialogClose: React.FC<ModalCloseProps>;
 export type DialogProps = ModalRootProps;
 export type DialogTriggerProps = ModalTriggerProps;
 export type DialogTitleProps = ModalTitleProps;
 export type DialogDescriptionProps = ModalDescriptionProps;
 export type DialogCloseProps = ModalCloseProps;
 export interface DialogContentProps extends React.HTMLAttributes<HTMLDivElement> {
+    ref?: React.Ref<HTMLDivElement> | undefined;
+}
+declare function DialogContent({ ref, className, children, ...props }: DialogContentProps): import("react/jsx-runtime").JSX.Element | null;
+declare namespace DialogContent {
+    var displayName: string;
 }
-declare const DialogContent: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;
 export { Dialog, DialogTrigger, DialogContent, DialogTitle, DialogDescription, DialogClose, };
 //# sourceMappingURL=Dialog.d.ts.map

package/dist/components/Dialog/Dialog.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,KAAK,EACV,cAAc,EACd,iBAAiB,EACjB,eAAe,EACf,qBAAqB,EACrB,eAAe,EAChB,MAAM,6BAA6B,CAAC;AAMrC,QAAA,MACQ,MAAM,4BACH,aAAa,+~~FACf~~,WAAW,~~uFACL~~,iBAAiB,~~6FACvB~~,WAAW,~~2FAMlB~~,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC;AACzC,MAAM,MAAM,kBAAkB,GAAG,iBAAiB,CAAC;AACnD,MAAM,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAC/C,MAAM,MAAM,sBAAsB,GAAG,qBAAqB,CAAC;AAC3D,MAAM,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAE/C,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;~~CAAG;AAEnF~~,~~QAAA~~,~~MAAM~~,~~aAAa~~,~~2FAyDlB~~,CAAC;~~AAIF~~,OAAO,EACL,MAAM,EACN,aAAa,EACb,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,WAAW,GACZ,CAAC"}
1	+ {"version":3,"file":"Dialog.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/Dialog.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,OAAO,KAAK,EACV,cAAc,EACd,iBAAiB,EACjB,eAAe,EACf,qBAAqB,EACrB,eAAe,EAChB,MAAM,6BAA6B,CAAC;AAMrC,QAAA,MACQ,MAAM,4BACH,aAAa,+BACf,WAAW,6BACL,iBAAiB,mCACvB,WAAW,2BAMlB,CAAC;AAEH,MAAM,MAAM,WAAW,GAAG,cAAc,CAAC;AACzC,MAAM,MAAM,kBAAkB,GAAG,iBAAiB,CAAC;AACnD,MAAM,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAC/C,MAAM,MAAM,sBAAsB,GAAG,qBAAqB,CAAC;AAC3D,MAAM,MAAM,gBAAgB,GAAG,eAAe,CAAC;AAE/C,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC9E,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,GAAG,SAAS,CAAC;CAC7C;AAED,iBAAS,aAAa,CAAC,EACrB,GAAG,EACH,SAAS,EACT,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,kBAAkB,kDAuDpB;kBA5DQ,aAAa;;;AAgEtB,OAAO,EACL,MAAM,EACN,aAAa,EACb,aAAa,EACb,WAAW,EACX,iBAAiB,EACjB,WAAW,GACZ,CAAC"}

package/dist/components/Dialog/Dialog.js CHANGED Viewed

@@ -6,7 +6,8 @@ import { Portal as r } from "../../utils/portal.js";
 import { useScrollLock as i } from "../../hooks/use-scroll-lock.js";
 import { useEscapeKey as a } from "../../hooks/use-escape-key.js";
 import { useFocusTrap as o } from "../../hooks/use-focus-trap.js";
-import { createModalPrimitive as s, useModalTitleWarning as c } from "../../utils/modal-primitive.js";
+import { createModalPrimitive as s } from "../../utils/modal-primitive.js";
+import { useModalTitleWarning as c } from "../../hooks/use-modal-title-warning.js";
 import { DialogContext as l, useDialogContext as u } from "./Dialog.context.js";
 import * as d from "react";
 import { jsx as f, jsxs as p } from "react/jsx-runtime";
@@ -16,8 +17,9 @@ var { Root: m, Trigger: h, Title: g, Description: _, Close: v } = s({
 	closeLabel: "Close dialog",
 	Context: l,
 	useContext: u
-}), y = d.forwardRef(({ className: s, children: l, ...m }, h) => {
-	let g = u(), _ = d.useRef(null), v = t(h, _);
+});
+function y({ ref: s, className: l, children: m, ...h }) {
+	let g = u(), _ = d.useRef(null), v = t(s, _);
 	return o(_, g.open), i(g.open), c("Dialog", g.titleId, g.open), a(() => g.onOpenChange(!1), g.open), g.open ? /* @__PURE__ */ p(r, { children: [/* @__PURE__ */ f("div", {
 		className: e("fixed inset-0 z-(--nuka-z-modal)", "bg-(--nuka-bg-overlay)", "data-[state=open]:animate-[nuka-dialog-overlay-enter_150ms_ease-out]"),
 		"data-state": "open",
@@ -31,15 +33,15 @@ var { Root: m, Trigger: h, Title: g, Description: _, Close: v } = s({
 		"aria-describedby": g.hasDescription ? g.descriptionId : void 0,
 		tabIndex: -1,
 		"data-state": "open",
-		className: e("fixed z-(--nuka-z-modal)", "left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2", "w-full max-w-lg", "rounded-(--radius-xl) border border-(--nuka-border-base)", "bg-(--nuka-bg-base) shadow-md", "p-(--space-6)", "data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]", "focus-visible:outline-none", s),
-		...m,
+		className: e("fixed z-(--nuka-z-modal)", "left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2", "w-full max-w-lg", "rounded-(--radius-xl) border border-(--nuka-border-base)", "bg-(--nuka-bg-base) shadow-md", "p-(--space-6)", "data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]", "focus-visible:outline-none", l),
+		...h,
 		children: [/* @__PURE__ */ f(n, {
 			onClick: () => g.onOpenChange(!1),
 			label: "Close dialog",
 			className: "absolute top-(--space-4) right-(--space-4) text-(--nuka-text-muted)"
-		}), l]
+		}), m]
 	})] }) : null;
-});
+}
 y.displayName = "DialogContent";
 //#endregion
 export { m as Dialog, v as DialogClose, y as DialogContent, _ as DialogDescription, g as DialogTitle, h as DialogTrigger };

package/dist/components/Dialog/Dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Dialog.js","names":[],"sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\nimport * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Portal } from \"@nuka/utils/portal\";\nimport { DismissButton } from \"@nuka/utils/dismiss-button\";\nimport { useFocusTrap } from \"@nuka/hooks/use-focus-trap\";\nimport { useScrollLock } from \"@nuka/hooks/use-scroll-lock\";\nimport {\n createModalPrimitive,\n useEscapeKey,\n ~~useModalTitleWarning,\n~~} from \"@nuka/utils/modal-primitive\";\nimport type {\n ModalRootProps,\n ModalTriggerProps,\n ModalTitleProps,\n ModalDescriptionProps,\n ModalCloseProps,\n} from \"@nuka/utils/modal-primitive\";\nimport {\n DialogContext,\n useDialogContext,\n} from \"@nuka/components/Dialog/Dialog.context\";\n\nconst {\n Root: Dialog,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n} = createModalPrimitive({\n displayNamePrefix: \"Dialog\",\n closeLabel: \"Close dialog\",\n Context: DialogContext,\n useContext: useDialogContext,\n});\n\nexport type DialogProps = ModalRootProps;\nexport type DialogTriggerProps = ModalTriggerProps;\nexport type DialogTitleProps = ModalTitleProps;\nexport type DialogDescriptionProps = ModalDescriptionProps;\nexport type DialogCloseProps = ModalCloseProps;\n\nexport interface DialogContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n~~\nconst~~ ~~DialogContent =~~ React.~~forwardRef~~<HTMLDivElement, ~~DialogContentProps>~~(\n ({ className, children, ...props }, ~~ref~~) => {\n const ctx = useDialogContext();\n const panelRef = React.useRef<HTMLDivElement>(null);\n const composedRef = composeRefs(ref, panelRef);\n\n useFocusTrap(panelRef, ctx.open);\n useScrollLock(ctx.open);\n useModalTitleWarning(\"Dialog\", ctx.titleId, ctx.open);\n useEscapeKey(() => ctx.onOpenChange(false), ctx.open);\n\n if (!ctx.open) return null;\n\n return (\n <Portal>\n <div\n className={cn(\n \"fixed inset-0 z-(--nuka-z-modal)\",\n \"bg-(--nuka-bg-overlay)\",\n \"data-[state=open]:animate-[nuka-dialog-overlay-enter_150ms_ease-out]\",\n )}\n data-state=\"open\"\n onClick={() => ctx.onOpenChange(false)}\n aria-hidden=\"true\"\n />\n <div\n ref={composedRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={ctx.titleId}\n aria-describedby={ctx.hasDescription ? ctx.descriptionId : undefined}\n tabIndex={-1}\n data-state=\"open\"\n className={cn(\n \"fixed z-(--nuka-z-modal)\",\n \"left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2\",\n \"w-full max-w-lg\",\n \"rounded-(--radius-xl) border border-(--nuka-border-base)\",\n \"bg-(--nuka-bg-base) shadow-md\",\n \"p-(--space-6)\",\n \"data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]\",\n // Programmatic focus via useFocusTrap; :focus-visible does not activate, so this is inert\n \"focus-visible:outline-none\",\n className,\n )}\n {...props}\n >\n <DismissButton\n onClick={() => ctx.onOpenChange(false)}\n label=\"Close dialog\"\n className=\"absolute top-(--space-4) right-(--space-4) text-(--nuka-text-muted)\"\n />\n {children}\n </div>\n </Portal>\n );\n },\n~~);\n~~\nDialogContent.displayName = \"DialogContent\";\n\nexport {\n Dialog,\n DialogTrigger,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"mappings":"~~;;;;;;;;;;;;;~~AAyBA,IAAM,EACJ,MAAM,GACN,SAAS,GACT,OAAO,GACP,aAAa,GACb,OAAO,MACL,EAAqB;CACvB,mBAAmB;CACnB,YAAY;CACZ,SAAS;CACT,YAAY;CACb,CAAC,~~EAUI~~,~~IAAgB~~,~~EAAM~~,~~YACzB~~,~~EAAE~~,~~cAAW~~,~~aAAU,~~GAAG,~~KAAS,MAAQ~~;~~CAC1C~~,IAAM,IAAM,GAAkB,EACxB,IAAW,EAAM,OAAuB,KAAK,EAC7C,IAAc,EAAY,GAAK,EAAS;AAS9C,QAPA,EAAa,GAAU,EAAI,KAAK,EAChC,EAAc,EAAI,KAAK,EACvB,EAAqB,UAAU,EAAI,SAAS,EAAI,KAAK,EACrD,QAAmB,EAAI,aAAa,GAAM,EAAE,EAAI,KAAK,EAEhD,EAAI,OAGP,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;EACE,WAAW,EACT,oCACA,0BACA,uEACD;EACD,cAAW;EACX,eAAe,EAAI,aAAa,GAAM;EACtC,eAAY;EACZ,CAAA,EACF,kBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAW;EACX,mBAAiB,EAAI;EACrB,oBAAkB,EAAI,iBAAiB,EAAI,gBAAgB,KAAA;EAC3D,UAAU;EACV,cAAW;EACX,WAAW,EACT,4BACA,sDACA,mBACA,4DACA,iCACA,iBACA,gEAEA,8BACA,EACD;EACD,GAAI;YApBN,CAsBE,kBAAC,GAAD;GACE,eAAe,EAAI,aAAa,GAAM;GACtC,OAAM;GACN,WAAU;GACV,CAAA,EACD,EACG;IACC,EAAA,CAAA,GA3CW~~;EA8CzB;AAED~~,EAAc,cAAc"}
1	+ {"version":3,"file":"Dialog.js","names":[],"sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["\"use client\";\nimport * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { composeRefs } from \"@nuka/utils/slot\";\nimport { Portal } from \"@nuka/utils/portal\";\nimport { DismissButton } from \"@nuka/utils/dismiss-button\";\nimport { useFocusTrap } from \"@nuka/hooks/use-focus-trap\";\nimport { useScrollLock } from \"@nuka/hooks/use-scroll-lock\";\nimport {\n createModalPrimitive,\n useEscapeKey,\n} from \"@nuka/utils/modal-primitive\";\nimport { useModalTitleWarning } from \"@nuka/hooks/use-modal-title-warning\";\nimport type {\n ModalRootProps,\n ModalTriggerProps,\n ModalTitleProps,\n ModalDescriptionProps,\n ModalCloseProps,\n} from \"@nuka/utils/modal-primitive\";\nimport {\n DialogContext,\n useDialogContext,\n} from \"@nuka/components/Dialog/Dialog.context\";\n\nconst {\n Root: Dialog,\n Trigger: DialogTrigger,\n Title: DialogTitle,\n Description: DialogDescription,\n Close: DialogClose,\n} = createModalPrimitive({\n displayNamePrefix: \"Dialog\",\n closeLabel: \"Close dialog\",\n Context: DialogContext,\n useContext: useDialogContext,\n});\n\nexport type DialogProps = ModalRootProps;\nexport type DialogTriggerProps = ModalTriggerProps;\nexport type DialogTitleProps = ModalTitleProps;\nexport type DialogDescriptionProps = ModalDescriptionProps;\nexport type DialogCloseProps = ModalCloseProps;\n\nexport interface DialogContentProps extends React.HTMLAttributes<HTMLDivElement> {\n ref?: React.Ref<HTMLDivElement> \| undefined;\n}\n\nfunction DialogContent({\n ref,\n className,\n children,\n ...props\n}: DialogContentProps) {\n const ctx = useDialogContext();\n const panelRef = React.useRef<HTMLDivElement>(null);\n const composedRef = composeRefs(ref, panelRef);\n\n useFocusTrap(panelRef, ctx.open);\n useScrollLock(ctx.open);\n useModalTitleWarning(\"Dialog\", ctx.titleId, ctx.open);\n useEscapeKey(() => ctx.onOpenChange(false), ctx.open);\n\n if (!ctx.open) return null;\n\n return (\n <Portal>\n <div\n className={cn(\n \"fixed inset-0 z-(--nuka-z-modal)\",\n \"bg-(--nuka-bg-overlay)\",\n \"data-[state=open]:animate-[nuka-dialog-overlay-enter_150ms_ease-out]\",\n )}\n data-state=\"open\"\n onClick={() => ctx.onOpenChange(false)}\n aria-hidden=\"true\"\n />\n <div\n ref={composedRef}\n role=\"dialog\"\n aria-modal=\"true\"\n aria-labelledby={ctx.titleId}\n aria-describedby={ctx.hasDescription ? ctx.descriptionId : undefined}\n tabIndex={-1}\n data-state=\"open\"\n className={cn(\n \"fixed z-(--nuka-z-modal)\",\n \"left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2\",\n \"w-full max-w-lg\",\n \"rounded-(--radius-xl) border border-(--nuka-border-base)\",\n \"bg-(--nuka-bg-base) shadow-md\",\n \"p-(--space-6)\",\n \"data-[state=open]:animate-[nuka-dialog-enter_150ms_ease-out]\",\n // Programmatic focus via useFocusTrap; :focus-visible does not activate, so this is inert\n \"focus-visible:outline-none\",\n className,\n )}\n {...props}\n >\n <DismissButton\n onClick={() => ctx.onOpenChange(false)}\n label=\"Close dialog\"\n className=\"absolute top-(--space-4) right-(--space-4) text-(--nuka-text-muted)\"\n />\n {children}\n </div>\n </Portal>\n );\n}\n\nDialogContent.displayName = \"DialogContent\";\n\nexport {\n Dialog,\n DialogTrigger,\n DialogContent,\n DialogTitle,\n DialogDescription,\n DialogClose,\n};\n"],"mappings":";;;;;;;;;;;;;;AAyBA,IAAM,EACJ,MAAM,GACN,SAAS,GACT,OAAO,GACP,aAAa,GACb,OAAO,MACL,EAAqB;CACvB,mBAAmB;CACnB,YAAY;CACZ,SAAS;CACT,YAAY;CACb,CAAC;AAYF,SAAS,EAAc,EACrB,QACA,cACA,aACA,GAAG,KACkB;CACrB,IAAM,IAAM,GAAkB,EACxB,IAAW,EAAM,OAAuB,KAAK,EAC7C,IAAc,EAAY,GAAK,EAAS;AAS9C,QAPA,EAAa,GAAU,EAAI,KAAK,EAChC,EAAc,EAAI,KAAK,EACvB,EAAqB,UAAU,EAAI,SAAS,EAAI,KAAK,EACrD,QAAmB,EAAI,aAAa,GAAM,EAAE,EAAI,KAAK,EAEhD,EAAI,OAGP,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,OAAD;EACE,WAAW,EACT,oCACA,0BACA,uEACD;EACD,cAAW;EACX,eAAe,EAAI,aAAa,GAAM;EACtC,eAAY;EACZ,CAAA,EACF,kBAAC,OAAD;EACE,KAAK;EACL,MAAK;EACL,cAAW;EACX,mBAAiB,EAAI;EACrB,oBAAkB,EAAI,iBAAiB,EAAI,gBAAgB,KAAA;EAC3D,UAAU;EACV,cAAW;EACX,WAAW,EACT,4BACA,sDACA,mBACA,4DACA,iCACA,iBACA,gEAEA,8BACA,EACD;EACD,GAAI;YApBN,CAsBE,kBAAC,GAAD;GACE,eAAe,EAAI,aAAa,GAAM;GACtC,OAAM;GACN,WAAU;GACV,CAAA,EACD,EACG;IACC,EAAA,CAAA,GA3CW;;AA+CxB,EAAc,cAAc"}

package/dist/components/Divider/Divider.cjs CHANGED Viewed

@@ -1,2 +1,2 @@
-const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../../utils/cn.cjs`),n=require(`../../utils/responsive.cjs`),r=require(`../Text/Text.cjs`);let i=require(`react`);i=e.__toESM(i,1);let a=require(`react/jsx-runtime`);function o(e){return typeof e==`string`?e:e.base??`horizontal`}function s(e){return typeof e==`string`?e===`vertical`:Object.values(e).some(e=>e===`vertical`)}var c=i.forwardRef(({className:e,orientation:i=`horizontal`,size:c=`md`,label:l,...u},d)=>{let f=o(i),p=l!=null,m=n.dividerOrientationClasses[c],h=n.resolveResponsiveClasses(i,m);return s(i)&&p?(process.env.NODE_ENV!==`production`&&console.warn('Divider: `label` is not supported with `orientation="vertical"`. The label will be ignored.'),(0,a.jsx)(`div`,{ref:d,role:`separator`,"aria-orientation":f,className:t.cn(`bg-(--nuka-border-base)`,...h,e),...u})):p?(0,a.jsxs)(`div`,{ref:d,role:`separator`,"aria-orientation":`horizontal`,className:t.cn(`flex items-center gap-(--space-3)`,e),...u,children:[(0,a.jsx)(`div`,{className:t.cn(`flex-1 bg-(--nuka-border-base)`,...h),"aria-hidden":`true`}),(0,a.jsx)(r.Text,{as:`span`,size:`xs`,color:`muted`,className:`shrink-0 px-(--space-2) whitespace-nowrap`,children:l}),(0,a.jsx)(`div`,{className:t.cn(`flex-1 bg-(--nuka-border-base)`,...h),"aria-hidden":`true`})]}):f===`vertical`?(0,a.jsx)(`div`,{ref:d,role:`separator`,"aria-orientation":`vertical`,className:t.cn(`bg-(--nuka-border-base)`,...h,e),...u}):(0,a.jsx)(`hr`,{ref:d,className:t.cn(`border-0 bg-(--nuka-border-base)`,...h,e),...u})});c.displayName=`Divider`,exports.Divider=c;
+const e=require(`../../_virtual/_rolldown/runtime.cjs`),t=require(`../../utils/cn.cjs`),n=require(`../../utils/responsive.cjs`),r=require(`../Text/Text.cjs`);let i=require(`react`);i=e.__toESM(i,1);let a=require(`react/jsx-runtime`);function o(e){return typeof e==`string`?e:e.base??`horizontal`}function s(e){return typeof e==`string`?e===`vertical`:Object.values(e).some(e=>e===`vertical`)}function c({ref:e,className:i,orientation:c=`horizontal`,size:l=`md`,label:u,...d}){let f=o(c),p=u!=null,m=n.dividerOrientationClasses[l],h=n.resolveResponsiveClasses(c,m);return s(c)&&p?(process.env.NODE_ENV!==`production`&&console.warn('Divider: `label` is not supported with `orientation="vertical"`. The label will be ignored.'),(0,a.jsx)(`div`,{ref:e,role:`separator`,"aria-orientation":f,className:t.cn(`bg-(--nuka-border-base)`,...h,i),...d})):p?(0,a.jsxs)(`div`,{ref:e,role:`separator`,"aria-orientation":`horizontal`,className:t.cn(`flex items-center gap-(--space-3)`,i),...d,children:[(0,a.jsx)(`div`,{className:t.cn(`flex-1 bg-(--nuka-border-base)`,...h),"aria-hidden":`true`}),(0,a.jsx)(r.Text,{as:`span`,size:`xs`,color:`muted`,className:`shrink-0 px-(--space-2) whitespace-nowrap`,children:u}),(0,a.jsx)(`div`,{className:t.cn(`flex-1 bg-(--nuka-border-base)`,...h),"aria-hidden":`true`})]}):f===`vertical`?(0,a.jsx)(`div`,{ref:e,role:`separator`,"aria-orientation":`vertical`,className:t.cn(`bg-(--nuka-border-base)`,...h,i),...d}):(0,a.jsx)(`hr`,{ref:e,className:t.cn(`border-0 bg-(--nuka-border-base)`,...h,i),...d})}c.displayName=`Divider`,exports.Divider=c;
 //# sourceMappingURL=Divider.cjs.map

package/dist/components/Divider/Divider.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Divider.cjs","names":[],"sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { Text } from \"@nuka/components/Text\";\nimport {\n resolveResponsiveClasses,\n dividerOrientationClasses,\n} from \"@nuka/utils/responsive\";\nimport type { Responsive, DividerOrientation } from \"@nuka/utils/responsive\";\nimport type { DividerVariantProps } from \"@nuka/components/Divider/Divider.variants\";\n\nexport type { DividerVariantProps };\n\nexport interface DividerProps\n extends React.ComponentPropsWithoutRef<\"div\">, DividerVariantProps {\n label?: React.ReactNode;\n}\n\nfunction resolveBaseOrientation(\n orientation: Responsive<DividerOrientation>,\n): DividerOrientation {\n if (typeof orientation === \"string\") return orientation;\n return orientation.base ?? \"horizontal\";\n}\n\nfunction hasVertical(orientation: Responsive<DividerOrientation>): boolean {\n if (typeof orientation === \"string\") return orientation === \"vertical\";\n return Object.values(orientation).some((v) => v === \"vertical\");\n}\n\n/*\n Ref type is HTMLElement because the root element varies between\n * HTMLHRElement (horizontal, no label) and HTMLDivElement (vertical or labeled).\n * HTMLElement is the correct common supertype.\n */\~~nconst~~ Divider ~~= React.forwardRef<HTMLElement, DividerProps>~~(\n (\n { className, orientation = \"horizontal\", size = \"md\"~~, label, ...props }~~,\n ~~ref~~,\n ) => {\n const baseOrientation = resolveBaseOrientation(orientation);\n const hasLabel = label != null;\n const lookup = dividerOrientationClasses[size];\n const orientationClasses = resolveResponsiveClasses(orientation, lookup);\n\n // Vertical + label is explicitly unsupported\n if (hasVertical(orientation) && hasLabel) {\n if (process.env.NODE_ENV !== \"production\") {\n console.warn(\n 'Divider: `label` is not supported with `orientation=\"vertical\"`. The label will be ignored.',\n );\n }\n\n return (\n <div\n ref={ref as React.Ref<HTMLDivElement>}\n role=\"separator\"\n aria-orientation={baseOrientation}\n className={cn(\n \"bg-(--nuka-border-base)\",\n ...orientationClasses,\n className,\n )}\n {...props}\n />\n );\n }\n\n // Horizontal with label: flex layout with two line segments\n if (hasLabel) {\n return (\n <div\n ref={ref as React.Ref<HTMLDivElement>}\n role=\"separator\"\n aria-orientation=\"horizontal\"\n className={cn(\"flex items-center gap-(--space-3)\", className)}\n {...props}\n >\n <div\n className={cn(\n \"flex-1 bg-(--nuka-border-base)\",\n ...orientationClasses,\n )}\n aria-hidden=\"true\"\n />\n <Text\n as=\"span\"\n size=\"xs\"\n color=\"muted\"\n className=\"shrink-0 px-(--space-2) whitespace-nowrap\"\n >\n {label}\n </Text>\n <div\n className={cn(\n \"flex-1 bg-(--nuka-border-base)\",\n ...orientationClasses,\n )}\n aria-hidden=\"true\"\n />\n </div>\n );\n }\n\n // Vertical: div with role=\"separator\"\n if (baseOrientation === \"vertical\") {\n return (\n <div\n ref={ref as React.Ref<HTMLDivElement>}\n role=\"separator\"\n aria-orientation=\"vertical\"\n className={cn(\n \"bg-(--nuka-border-base)\",\n ...orientationClasses,\n className,\n )}\n {...props}\n />\n );\n }\n\n // Horizontal without label: semantic <hr>\n return (\n <hr\n ref={ref as React.Ref<HTMLHRElement>}\n className={cn(\n \"border-0 bg-(--nuka-border-base)\",\n ...orientationClasses,\n className,\n )}\n {...(props as React.ComponentPropsWithoutRef<\"hr\">)}\n />\n );\n },\n~~);\n~~\nDivider.displayName = \"Divider\";\n\nexport { Divider };\n"],"mappings":"~~yOAiBA~~,SAAS,EACP,EACoB,CAEpB,OADI,OAAO,GAAgB,SAAiB,EACrC,EAAY,MAAQ,aAG7B,SAAS,EAAY,EAAsD,CAEzE,OADI,OAAO,GAAgB,SAAiB,IAAgB,WACrD,OAAO,OAAO,EAAY,CAAC,KAAM,GAAM,IAAM,WAAW,CAQjE,~~IAAM~~,~~EAAU~~,~~EAAM~~,~~YAElB~~,~~CAAE~~,~~YAAW,~~cAAc,~~aAAc~~,OAAO,~~KAAM~~,~~QAAO~~,GAAG,~~GAChE~~,~~IACG~~,~~CACH,~~IAAM,EAAkB,EAAuB,EAAY,CACrD,EAAW,GAAS,KACpB,EAAS,EAAA,0BAA0B,GACnC,EAAqB,EAAA,yBAAyB,EAAa,EAAO,CA+ExE,OA5EI,EAAY,EAAY,EAAI,GAC9B,QAAA,IAAA,WAA6B,cAC3B,QAAQ,KACN,8FACD,EAID,EAAA,EAAA,KAAC,MAAD,CACO,MACL,KAAK,YACL,mBAAkB,EAClB,UAAW,EAAA,GACT,0BACA,GAAG,EACH,EACD,CACD,GAAI,EACJ,CAAA,EAKF,GAEA,EAAA,EAAA,MAAC,MAAD,CACO,MACL,KAAK,YACL,mBAAiB,aACjB,UAAW,EAAA,GAAG,oCAAqC,EAAU,CAC7D,GAAI,WALN,EAOE,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,GACT,iCACA,GAAG,EACJ,CACD,cAAY,OACZ,CAAA,EACF,EAAA,EAAA,KAAC,EAAA,KAAD,CACE,GAAG,OACH,KAAK,KACL,MAAM,QACN,UAAU,qDAET,EACI,CAAA,EACP,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,GACT,iCACA,GAAG,EACJ,CACD,cAAY,OACZ,CAAA,CACE,GAKN,IAAoB,YAEpB,EAAA,EAAA,KAAC,MAAD,CACO,MACL,KAAK,YACL,mBAAiB,WACjB,UAAW,EAAA,GACT,0BACA,GAAG,EACH,EACD,CACD,GAAI,EACJ,CAAA,EAMJ,EAAA,EAAA,KAAC,KAAD,CACO,MACL,UAAW,EAAA,GACT,mCACA,GAAG,EACH,EACD,CACD,GAAK,EACL,CAAA,~~EAGP~~,~~CAED,~~EAAQ,YAAc"}
1	+ {"version":3,"file":"Divider.cjs","names":[],"sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"@nuka/utils/cn\";\nimport { Text } from \"@nuka/components/Text\";\nimport {\n resolveResponsiveClasses,\n dividerOrientationClasses,\n} from \"@nuka/utils/responsive\";\nimport type { Responsive, DividerOrientation } from \"@nuka/utils/responsive\";\nimport type { DividerVariantProps } from \"@nuka/components/Divider/Divider.variants\";\n\nexport type { DividerVariantProps };\n\nexport interface DividerProps\n extends React.ComponentPropsWithoutRef<\"div\">, DividerVariantProps {\n ref?: React.Ref<HTMLElement> \| undefined;\n label?: React.ReactNode;\n}\n\nfunction resolveBaseOrientation(\n orientation: Responsive<DividerOrientation>,\n): DividerOrientation {\n if (typeof orientation === \"string\") return orientation;\n return orientation.base ?? \"horizontal\";\n}\n\nfunction hasVertical(orientation: Responsive<DividerOrientation>): boolean {\n if (typeof orientation === \"string\") return orientation === \"vertical\";\n return Object.values(orientation).some((v) => v === \"vertical\");\n}\n\n/*\n Ref type is HTMLElement because the root element varies between\n * HTMLHRElement (horizontal, no label) and HTMLDivElement (vertical or labeled).\n * HTMLElement is the correct common supertype.\n */\nfunction Divider({\n ref,\n className,\n orientation = \"horizontal\",\n size = \"md\",\n label,\n ...props\n}: DividerProps) {\n const baseOrientation = resolveBaseOrientation(orientation);\n const hasLabel = label != null;\n const lookup = dividerOrientationClasses[size];\n const orientationClasses = resolveResponsiveClasses(orientation, lookup);\n\n // Vertical + label is explicitly unsupported\n if (hasVertical(orientation) && hasLabel) {\n if (process.env.NODE_ENV !== \"production\") {\n console.warn(\n 'Divider: `label` is not supported with `orientation=\"vertical\"`. The label will be ignored.',\n );\n }\n\n return (\n <div\n ref={ref as React.Ref<HTMLDivElement>}\n role=\"separator\"\n aria-orientation={baseOrientation}\n className={cn(\n \"bg-(--nuka-border-base)\",\n ...orientationClasses,\n className,\n )}\n {...props}\n />\n );\n }\n\n // Horizontal with label: flex layout with two line segments\n if (hasLabel) {\n return (\n <div\n ref={ref as React.Ref<HTMLDivElement>}\n role=\"separator\"\n aria-orientation=\"horizontal\"\n className={cn(\"flex items-center gap-(--space-3)\", className)}\n {...props}\n >\n <div\n className={cn(\n \"flex-1 bg-(--nuka-border-base)\",\n ...orientationClasses,\n )}\n aria-hidden=\"true\"\n />\n <Text\n as=\"span\"\n size=\"xs\"\n color=\"muted\"\n className=\"shrink-0 px-(--space-2) whitespace-nowrap\"\n >\n {label}\n </Text>\n <div\n className={cn(\n \"flex-1 bg-(--nuka-border-base)\",\n ...orientationClasses,\n )}\n aria-hidden=\"true\"\n />\n </div>\n );\n }\n\n // Vertical: div with role=\"separator\"\n if (baseOrientation === \"vertical\") {\n return (\n <div\n ref={ref as React.Ref<HTMLDivElement>}\n role=\"separator\"\n aria-orientation=\"vertical\"\n className={cn(\n \"bg-(--nuka-border-base)\",\n ...orientationClasses,\n className,\n )}\n {...props}\n />\n );\n }\n\n // Horizontal without label: semantic <hr>\n return (\n <hr\n ref={ref as React.Ref<HTMLHRElement>}\n className={cn(\n \"border-0 bg-(--nuka-border-base)\",\n ...orientationClasses,\n className,\n )}\n {...(props as React.ComponentPropsWithoutRef<\"hr\">)}\n />\n );\n}\n\nDivider.displayName = \"Divider\";\n\nexport { Divider };\n"],"mappings":"yOAkBA,SAAS,EACP,EACoB,CAEpB,OADI,OAAO,GAAgB,SAAiB,EACrC,EAAY,MAAQ,aAG7B,SAAS,EAAY,EAAsD,CAEzE,OADI,OAAO,GAAgB,SAAiB,IAAgB,WACrD,OAAO,OAAO,EAAY,CAAC,KAAM,GAAM,IAAM,WAAW,CAQjE,SAAS,EAAQ,CACf,MACA,YACA,cAAc,aACd,OAAO,KACP,QACA,GAAG,GACY,CACf,IAAM,EAAkB,EAAuB,EAAY,CACrD,EAAW,GAAS,KACpB,EAAS,EAAA,0BAA0B,GACnC,EAAqB,EAAA,yBAAyB,EAAa,EAAO,CA+ExE,OA5EI,EAAY,EAAY,EAAI,GAC9B,QAAA,IAAA,WAA6B,cAC3B,QAAQ,KACN,8FACD,EAID,EAAA,EAAA,KAAC,MAAD,CACO,MACL,KAAK,YACL,mBAAkB,EAClB,UAAW,EAAA,GACT,0BACA,GAAG,EACH,EACD,CACD,GAAI,EACJ,CAAA,EAKF,GAEA,EAAA,EAAA,MAAC,MAAD,CACO,MACL,KAAK,YACL,mBAAiB,aACjB,UAAW,EAAA,GAAG,oCAAqC,EAAU,CAC7D,GAAI,WALN,EAOE,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,GACT,iCACA,GAAG,EACJ,CACD,cAAY,OACZ,CAAA,EACF,EAAA,EAAA,KAAC,EAAA,KAAD,CACE,GAAG,OACH,KAAK,KACL,MAAM,QACN,UAAU,qDAET,EACI,CAAA,EACP,EAAA,EAAA,KAAC,MAAD,CACE,UAAW,EAAA,GACT,iCACA,GAAG,EACJ,CACD,cAAY,OACZ,CAAA,CACE,GAKN,IAAoB,YAEpB,EAAA,EAAA,KAAC,MAAD,CACO,MACL,KAAK,YACL,mBAAiB,WACjB,UAAW,EAAA,GACT,0BACA,GAAG,EACH,EACD,CACD,GAAI,EACJ,CAAA,EAMJ,EAAA,EAAA,KAAC,KAAD,CACO,MACL,UAAW,EAAA,GACT,mCACA,GAAG,EACH,EACD,CACD,GAAK,EACL,CAAA,CAIN,EAAQ,YAAc"}

package/dist/components/Divider/Divider.d.ts CHANGED Viewed

@@ -2,6 +2,7 @@ import { DividerVariantProps } from './Divider.variants';
 import * as React from "react";
 export type { DividerVariantProps };
 export interface DividerProps extends React.ComponentPropsWithoutRef<"div">, DividerVariantProps {
+    ref?: React.Ref<HTMLElement> | undefined;
     label?: React.ReactNode;
 }
 /**
@@ -9,6 +10,9 @@ export interface DividerProps extends React.ComponentPropsWithoutRef<"div">, Div
  * HTMLHRElement (horizontal, no label) and HTMLDivElement (vertical or labeled).
  * HTMLElement is the correct common supertype.
  */
-declare const Divider: React.ForwardRefExoticComponent<DividerProps & React.RefAttributes<HTMLElement>>;
+declare function Divider({ ref, className, orientation, size, label, ...props }: DividerProps): import("react/jsx-runtime").JSX.Element;
+declare namespace Divider {
+    var displayName: string;
+}
 export { Divider };
 //# sourceMappingURL=Divider.d.ts.map

package/dist/components/Divider/Divider.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../src/components/Divider/Divider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAErF,YAAY,EAAE,mBAAmB,EAAE,CAAC;AAEpC,MAAM,WAAW,YACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,mBAAmB;IAClE,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAcD;;;;GAIG;AACH,~~QAAA~~,~~MAAM,~~OAAO,~~kFAmGZ~~,~~CAAC~~;~~AAIF~~,OAAO,EAAE,OAAO,EAAE,CAAC"}
1	+ {"version":3,"file":"Divider.d.ts","sourceRoot":"","sources":["../../../src/components/Divider/Divider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,2CAA2C,CAAC;AAErF,YAAY,EAAE,mBAAmB,EAAE,CAAC;AAEpC,MAAM,WAAW,YACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,mBAAmB;IAClE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,GAAG,SAAS,CAAC;IACzC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACzB;AAcD;;;;GAIG;AACH,iBAAS,OAAO,CAAC,EACf,GAAG,EACH,SAAS,EACT,WAA0B,EAC1B,IAAW,EACX,KAAK,EACL,GAAG,KAAK,EACT,EAAE,YAAY,2CA8Fd;kBArGQ,OAAO;;;AAyGhB,OAAO,EAAE,OAAO,EAAE,CAAC"}