@kuzenbo/core 0.0.2 → 0.0.3

package/dist/ui/range-slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"range-slider.js","names":["SliderPrimitive","SliderValuePrimitive"],"sources":["../../src/ui/range-slider/range-slider-helpers.ts","../../src/ui/range-slider/math/normalize-range-slider-value.ts","../../src/ui/range-slider/use-range-slider-state.ts","../../src/ui/range-slider/range-slider.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\n\nconst MIN_STEP_TOLERANCE_MULTIPLIER = 10;\n\nexport const getMinStepsBetweenValues = ({\n  minRange,\n  restrictToMarks,\n  step,\n}: {\n  minRange: number;\n  restrictToMarks: boolean;\n  step: number;\n}) => {\n  if (restrictToMarks || step <= 0 || !Number.isFinite(minRange)) {\n    return;\n  }\n\n  const steps = minRange / step;\n  if (!Number.isFinite(steps) || steps < 0) {\n    return;\n  }\n\n  const roundedSteps = Math.round(steps);\n  return Math.abs(steps - roundedSteps) <\n    Number.EPSILON * MIN_STEP_TOLERANCE_MULTIPLIER\n    ? roundedSteps\n    : undefined;\n};\n\nexport const getThumbChildrenByIndex = (\n  thumbChildren: ReactNode | [ReactNode, ReactNode] | undefined,\n  index: 0 | 1\n) => {\n  if (!Array.isArray(thumbChildren)) {\n    return thumbChildren;\n  }\n\n  return thumbChildren[index];\n};\n","import type { SliderMark } from \"../../slider/shared/slider-types\";\n\nimport {\n  clampNumber,\n  getFirstMarkValue,\n  getLastMarkValue,\n  getNearestMarkValue,\n  getNextMarkValue,\n  getPreviousMarkValue,\n  getSortedSelectableMarks,\n  isKeyboardLikeReason,\n  toFloatingValue,\n} from \"../../slider/math/slider-math-utils\";\n\ninterface NormalizeRangeSliderValueOptions {\n  activeThumbIndex?: number;\n  current: readonly number[];\n  domainMax: number;\n  domainMin: number;\n  marks?: readonly SliderMark[];\n  max: number;\n  maxRange: number;\n  min: number;\n  minRange: number;\n  precision: number;\n  pushOnOverlap: boolean;\n  raw: readonly number[];\n  reason?: string;\n  restrictToMarks?: boolean;\n}\n\nconst getResolvedActiveThumbIndex = (\n  current: readonly number[],\n  raw: readonly number[],\n  activeThumbIndex?: number\n) => {\n  if (activeThumbIndex === 0 || activeThumbIndex === 1) {\n    return activeThumbIndex;\n  }\n\n  const currentFrom = current[0] ?? 0;\n  const currentTo = current[1] ?? 0;\n  const rawFrom = raw[0] ?? currentFrom;\n  const rawTo = raw[1] ?? currentTo;\n\n  return Math.abs(rawFrom - currentFrom) >= Math.abs(rawTo - currentTo) ? 0 : 1;\n};\n\nexport const normalizeRangeSliderValue = ({\n  activeThumbIndex,\n  current,\n  domainMax,\n  domainMin,\n  marks,\n  max,\n  maxRange,\n  min,\n  minRange,\n  precision,\n  pushOnOverlap,\n  raw,\n  reason,\n  restrictToMarks,\n}: NormalizeRangeSliderValueOptions): [number, number] => {\n  const currentFrom = clampNumber(current[0] ?? min, min, max);\n  const currentTo = clampNumber(current[1] ?? max, min, max);\n  const currentValues: [number, number] = [currentFrom, currentTo];\n\n  const clampedRawFrom = clampNumber(\n    raw[0] ?? currentFrom,\n    domainMin,\n    domainMax\n  );\n  const clampedRawTo = clampNumber(raw[1] ?? currentTo, domainMin, domainMax);\n\n  const resolvedActiveIndex = getResolvedActiveThumbIndex(\n    [currentFrom, currentTo],\n    [clampedRawFrom, clampedRawTo],\n    activeThumbIndex\n  );\n\n  const clone: [number, number] = [\n    clampNumber(clampedRawFrom, min, max),\n    clampNumber(clampedRawTo, min, max),\n  ];\n\n  if (restrictToMarks) {\n    const selectableMarks = getSortedSelectableMarks(marks, min, max);\n    if (selectableMarks.length) {\n      const firstMarkValue = getFirstMarkValue(selectableMarks, min);\n      const lastMarkValue = getLastMarkValue(selectableMarks, max);\n      const index = resolvedActiveIndex;\n      const otherIndex = index === 0 ? 1 : 0;\n      const currentAtIndex = currentValues[index];\n      const rawAtIndex = index === 0 ? clampedRawFrom : clampedRawTo;\n\n      if (isKeyboardLikeReason(reason)) {\n        if (rawAtIndex <= min) {\n          clone[index] = firstMarkValue;\n        } else if (rawAtIndex >= max) {\n          clone[index] = lastMarkValue;\n        } else if (rawAtIndex > currentAtIndex) {\n          clone[index] = getNextMarkValue(currentAtIndex, selectableMarks);\n        } else if (rawAtIndex < currentAtIndex) {\n          clone[index] = getPreviousMarkValue(currentAtIndex, selectableMarks);\n        } else {\n          clone[index] = getNearestMarkValue(rawAtIndex, selectableMarks);\n        }\n      } else {\n        clone[index] = getNearestMarkValue(rawAtIndex, selectableMarks);\n      }\n\n      if (\n        clone[index] === lastMarkValue &&\n        clone[otherIndex] === lastMarkValue\n      ) {\n        clone[index] = currentAtIndex;\n      } else if (\n        clone[index] === firstMarkValue &&\n        clone[otherIndex] === firstMarkValue\n      ) {\n        clone[index] = currentAtIndex;\n      } else if (clone[index] === clone[otherIndex]) {\n        if (currentAtIndex > clone[otherIndex]) {\n          clone[otherIndex] = getPreviousMarkValue(\n            clone[index],\n            selectableMarks\n          );\n        } else {\n          clone[otherIndex] = getNextMarkValue(clone[index], selectableMarks);\n        }\n      }\n    }\n  } else {\n    const safeMinRange = Number.isFinite(minRange) ? Math.max(minRange, 0) : 0;\n    const safeMaxRange = Number.isFinite(maxRange)\n      ? Math.max(maxRange, safeMinRange)\n      : Number.POSITIVE_INFINITY;\n\n    if (resolvedActiveIndex === 0) {\n      const [clamped] = clone;\n\n      if (clamped > clone[1] - (safeMinRange - 1e-9)) {\n        if (pushOnOverlap) {\n          clone[1] = Math.min(clamped + safeMinRange, max);\n        } else {\n          clone[0] = currentFrom;\n        }\n      }\n\n      if (clamped > clone[1] - (safeMinRange - 1e-9)) {\n        if (pushOnOverlap) {\n          clone[0] = clone[1] - safeMinRange;\n        } else {\n          clone[0] = currentFrom;\n        }\n      }\n\n      if (clone[1] - clamped > safeMaxRange) {\n        if (pushOnOverlap) {\n          clone[1] = clamped + safeMaxRange;\n        } else {\n          clone[0] = currentFrom;\n        }\n      }\n    }\n\n    if (resolvedActiveIndex === 1) {\n      const [, clamped] = clone;\n\n      if (clamped < clone[0] + safeMinRange) {\n        if (pushOnOverlap) {\n          clone[0] = Math.max(clamped - safeMinRange, min);\n        } else {\n          clone[1] = currentTo;\n        }\n      }\n\n      if (clamped < clone[0] + safeMinRange) {\n        if (pushOnOverlap) {\n          clone[1] = clone[0] + safeMinRange;\n        } else {\n          clone[1] = currentTo;\n        }\n      }\n\n      if (clamped - clone[0] > safeMaxRange) {\n        if (pushOnOverlap) {\n          clone[0] = clamped - safeMaxRange;\n        } else {\n          clone[1] = currentTo;\n        }\n      }\n    }\n  }\n\n  const rounded: [number, number] = [\n    toFloatingValue(clampNumber(clone[0], min, max), precision),\n    toFloatingValue(clampNumber(clone[1], min, max), precision),\n  ];\n\n  if (rounded[0] > rounded[1]) {\n    return [rounded[1], rounded[0]];\n  }\n\n  return rounded;\n};\n","\"use client\";\n\nimport type { Slider as SliderPrimitive } from \"@base-ui/react/slider\";\n\nimport { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\n\nimport type { SliderMark } from \"../slider/shared/slider-types\";\nimport type { RangeSliderValue } from \"./range-slider-types\";\n\nimport { normalizeRangeSliderValue } from \"./math/normalize-range-slider-value\";\n\ninterface UseRangeSliderStateOptions {\n  defaultValue?: RangeSliderValue;\n  domainMax: number;\n  domainMin: number;\n  marks?: readonly SliderMark[];\n  max: number;\n  maxRange: number;\n  min: number;\n  minRange: number;\n  onChange?: ((value: RangeSliderValue) => void) | undefined;\n  onChangeEnd?: ((value: RangeSliderValue) => void) | undefined;\n  precision: number;\n  pushOnOverlap: boolean;\n  restrictToMarks: boolean;\n  value?: RangeSliderValue;\n}\n\nexport const useRangeSliderState = ({\n  defaultValue,\n  domainMax,\n  domainMin,\n  marks,\n  max,\n  maxRange,\n  min,\n  minRange,\n  onChange,\n  onChangeEnd,\n  precision,\n  pushOnOverlap,\n  restrictToMarks,\n  value,\n}: UseRangeSliderStateOptions) => {\n  const initialValue = useMemo(\n    () =>\n      normalizeRangeSliderValue({\n        current: [min, max],\n        domainMax,\n        domainMin,\n        marks,\n        max,\n        maxRange,\n        min,\n        minRange,\n        precision,\n        pushOnOverlap,\n        raw: defaultValue ?? [min, max],\n        restrictToMarks,\n      }),\n    [\n      defaultValue,\n      domainMax,\n      domainMin,\n      marks,\n      max,\n      maxRange,\n      min,\n      minRange,\n      precision,\n      pushOnOverlap,\n      restrictToMarks,\n    ]\n  );\n\n  const [uncontrolledValue, setUncontrolledValue] =\n    useState<RangeSliderValue>(initialValue);\n\n  const controlledValue = useMemo(() => {\n    if (value === undefined) {\n      return;\n    }\n\n    return normalizeRangeSliderValue({\n      current: uncontrolledValue,\n      domainMax,\n      domainMin,\n      marks,\n      max,\n      maxRange,\n      min,\n      minRange,\n      precision,\n      pushOnOverlap,\n      raw: value,\n      restrictToMarks,\n    });\n  }, [\n    domainMax,\n    domainMin,\n    marks,\n    max,\n    maxRange,\n    min,\n    minRange,\n    precision,\n    pushOnOverlap,\n    restrictToMarks,\n    uncontrolledValue,\n    value,\n  ]);\n\n  const rangeValue = controlledValue ?? uncontrolledValue;\n  const valueRef = useRef<RangeSliderValue>(rangeValue);\n\n  useEffect(() => {\n    valueRef.current = rangeValue;\n  }, [rangeValue]);\n\n  useEffect(() => {\n    if (value !== undefined) {\n      return;\n    }\n\n    setUncontrolledValue((previous) =>\n      normalizeRangeSliderValue({\n        current: previous,\n        domainMax,\n        domainMin,\n        marks,\n        max,\n        maxRange,\n        min,\n        minRange,\n        precision,\n        pushOnOverlap,\n        raw: previous,\n        restrictToMarks,\n      })\n    );\n  }, [\n    domainMax,\n    domainMin,\n    marks,\n    max,\n    maxRange,\n    min,\n    minRange,\n    precision,\n    pushOnOverlap,\n    restrictToMarks,\n    value,\n  ]);\n\n  const handleValueChange = useCallback(\n    (\n      nextValue: number | number[],\n      eventDetails: SliderPrimitive.Root.ChangeEventDetails\n    ) => {\n      const rawValues = Array.isArray(nextValue)\n        ? [\n            nextValue[0] ?? valueRef.current[0],\n            nextValue[1] ?? valueRef.current[1],\n          ]\n        : [nextValue, valueRef.current[1]];\n\n      const normalizedValue = normalizeRangeSliderValue({\n        activeThumbIndex: eventDetails.activeThumbIndex,\n        current: valueRef.current,\n        domainMax,\n        domainMin,\n        marks,\n        max,\n        maxRange,\n        min,\n        minRange,\n        precision,\n        pushOnOverlap,\n        raw: rawValues,\n        reason: eventDetails.reason,\n        restrictToMarks,\n      });\n\n      valueRef.current = normalizedValue;\n\n      if (value === undefined) {\n        setUncontrolledValue(normalizedValue);\n      }\n\n      onChange?.(normalizedValue);\n    },\n    [\n      domainMax,\n      domainMin,\n      marks,\n      max,\n      maxRange,\n      min,\n      minRange,\n      onChange,\n      precision,\n      pushOnOverlap,\n      restrictToMarks,\n      value,\n    ]\n  );\n\n  const handleValueCommitted = useCallback(() => {\n    onChangeEnd?.(valueRef.current);\n  }, [onChangeEnd]);\n\n  return {\n    handleValueChange,\n    handleValueCommitted,\n    rangeValue,\n  };\n};\n","\"use client\";\n\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { Slider as SliderPrimitive } from \"@base-ui/react/slider\";\n\nimport type {\n  SliderRadius,\n  SliderSize,\n} from \"../slider/shared/slider-style-tokens\";\nimport type { SliderLabelTransitionProps } from \"../slider/shared/slider-transition\";\nimport type {\n  SliderLabel,\n  SliderMark as SliderMarkType,\n} from \"../slider/shared/slider-types\";\nimport type { RangeSliderValue } from \"./range-slider-types\";\n\nimport { toFloatingValue } from \"../slider/math/slider-math-utils\";\nimport { SliderControl } from \"../slider/primitives/slider-control\";\nimport { SliderIndicator } from \"../slider/primitives/slider-indicator\";\nimport { SliderMark } from \"../slider/primitives/slider-mark\";\nimport { SliderMarks } from \"../slider/primitives/slider-marks\";\nimport {\n  SliderThumb,\n  type SliderThumbProps,\n} from \"../slider/primitives/slider-thumb\";\nimport { SliderThumbLabel } from \"../slider/primitives/slider-thumb-label\";\nimport { SliderTrack } from \"../slider/primitives/slider-track\";\nimport { SliderValue as SliderValuePrimitive } from \"../slider/primitives/slider-value\";\nimport { resolveSliderBounds } from \"../slider/shared/slider-bounds\";\nimport { resolveSliderLabel } from \"../slider/shared/slider-label\";\nimport {\n  mergeSliderRootStyle,\n  resolveSliderRootClassName,\n} from \"../slider/shared/slider-root-presentation\";\nimport {\n  getMinStepsBetweenValues,\n  getThumbChildrenByIndex,\n} from \"./range-slider-helpers\";\nimport { useRangeSliderState } from \"./use-range-slider-state\";\n\ntype RangeSliderRootProps = Omit<\n  SliderPrimitive.Root.Props<number[]>,\n  | \"defaultValue\"\n  | \"max\"\n  | \"min\"\n  | \"minStepsBetweenValues\"\n  | \"name\"\n  | \"onChange\"\n  | \"onValueChange\"\n  | \"onValueCommitted\"\n  | \"thumbAlignment\"\n  | \"thumbCollisionBehavior\"\n  | \"value\"\n>;\n\nexport interface RangeSliderProps extends RangeSliderRootProps {\n  color?: string;\n  defaultValue?: RangeSliderValue;\n  domain?: [number, number];\n  hiddenInputProps?: Omit<\n    ComponentPropsWithoutRef<\"input\">,\n    \"name\" | \"type\" | \"value\"\n  >;\n  inverted?: boolean;\n  label?: SliderLabel;\n  labelAlwaysOn?: boolean;\n  labelTransitionProps?: SliderLabelTransitionProps;\n  marks?: readonly SliderMarkType[];\n  max?: number;\n  maxRange?: number;\n  min?: number;\n  minRange?: number;\n  name?: string;\n  onChange?: ((value: RangeSliderValue) => void) | undefined;\n  onChangeEnd?: ((value: RangeSliderValue) => void) | undefined;\n  precision?: number;\n  pushOnOverlap?: boolean;\n  radius?: SliderRadius;\n  restrictToMarks?: boolean;\n  scale?: ((value: number) => number) | undefined;\n  size?: SliderSize;\n  showLabelOnHover?: boolean;\n  step?: number;\n  thumbChildren?: ReactNode | [ReactNode, ReactNode];\n  thumbFromLabel?: string;\n  thumbLabelOffset?: number | string;\n  thumbLabelOffsetVertical?: number | string;\n  thumbProps?:\n    | ((\n        index: 0 | 1\n      ) => Omit<SliderThumbProps, \"aria-label\" | \"children\" | \"index\">)\n    | undefined;\n  thumbSize?: number | string;\n  thumbToLabel?: string;\n  trackSize?: number | string;\n  markSize?: number | string;\n  value?: RangeSliderValue;\n}\n\ntype RangeSliderComponent = ((props: RangeSliderProps) => ReactNode) & {\n  Control: typeof SliderControl;\n  Indicator: typeof SliderIndicator;\n  Mark: typeof SliderMark;\n  Marks: typeof SliderMarks;\n  Thumb: typeof SliderThumb;\n  ThumbLabel: typeof SliderThumbLabel;\n  Track: typeof SliderTrack;\n  Value: typeof SliderValuePrimitive;\n};\n\nconst RangeSlider = (({\n  className,\n  children,\n  color,\n  defaultValue,\n  domain,\n  hiddenInputProps,\n  inverted = false,\n  label = (value) => value,\n  labelAlwaysOn = false,\n  labelTransitionProps,\n  marks,\n  max = 100,\n  maxRange = Number.POSITIVE_INFINITY,\n  min = 0,\n  minRange = 10,\n  name,\n  onChange,\n  onChangeEnd,\n  precision: precisionProp,\n  pushOnOverlap = true,\n  radius,\n  restrictToMarks = false,\n  scale = (value) => value,\n  size,\n  showLabelOnHover = true,\n  step = 1,\n  style,\n  thumbChildren,\n  thumbFromLabel,\n  thumbLabelOffset,\n  thumbLabelOffsetVertical,\n  thumbProps,\n  thumbSize,\n  thumbToLabel,\n  trackSize,\n  markSize,\n  value,\n  ...props\n}: RangeSliderProps) => {\n  const resolvedBounds = resolveSliderBounds({\n    domain,\n    max,\n    min,\n    precision: precisionProp,\n    step,\n  });\n\n  const {\n    domainMax,\n    domainMin,\n    max: normalizedMax,\n    min: normalizedMin,\n    precision,\n  } = resolvedBounds;\n\n  const { handleValueChange, handleValueCommitted, rangeValue } =\n    useRangeSliderState({\n      defaultValue,\n      domainMax,\n      domainMin,\n      marks,\n      max: normalizedMax,\n      maxRange,\n      min: normalizedMin,\n      minRange,\n      onChange,\n      onChangeEnd,\n      precision,\n      pushOnOverlap,\n      restrictToMarks,\n      value,\n    });\n\n  const firstThumbProps = thumbProps?.(0) ?? {};\n  const secondThumbProps = thumbProps?.(1) ?? {};\n\n  const minStepsBetweenValues = getMinStepsBetweenValues({\n    minRange,\n    restrictToMarks,\n    step,\n  });\n\n  const displayedFromValue = toFloatingValue(scale(rangeValue[0]), precision);\n  const displayedToValue = toFloatingValue(scale(rangeValue[1]), precision);\n\n  return (\n    <SliderPrimitive.Root\n      {...props}\n      className={resolveSliderRootClassName(className, inverted)}\n      data-slot=\"slider\"\n      max={domainMax}\n      min={domainMin}\n      minStepsBetweenValues={minStepsBetweenValues}\n      onValueChange={handleValueChange}\n      onValueCommitted={handleValueCommitted}\n      step={step}\n      style={mergeSliderRootStyle(\n        {\n          color,\n          markSize,\n          radius,\n          size,\n          thumbLabelOffset,\n          thumbLabelOffsetVertical,\n          thumbSize,\n          trackSize,\n        },\n        style\n      )}\n      thumbAlignment=\"center\"\n      thumbCollisionBehavior={pushOnOverlap ? \"push\" : \"none\"}\n      value={rangeValue}\n    >\n      {children ?? (\n        <SliderControl>\n          <SliderTrack>\n            <SliderIndicator />\n            <SliderMarks\n              disabled={props.disabled}\n              inverted={inverted}\n              marks={marks}\n              max={domainMax}\n              min={domainMin}\n              orientation={props.orientation}\n              values={rangeValue}\n            />\n          </SliderTrack>\n          <SliderThumb\n            {...firstThumbProps}\n            aria-label={thumbFromLabel}\n            index={0}\n          >\n            {getThumbChildrenByIndex(thumbChildren, 0)}\n            <SliderThumbLabel\n              label={resolveSliderLabel(label, displayedFromValue)}\n              labelAlwaysOn={labelAlwaysOn}\n              orientation={props.orientation}\n              showLabelOnHover={showLabelOnHover}\n              transitionProps={labelTransitionProps}\n            />\n          </SliderThumb>\n          <SliderThumb\n            {...secondThumbProps}\n            aria-label={thumbToLabel}\n            index={1}\n          >\n            {getThumbChildrenByIndex(thumbChildren, 1)}\n            <SliderThumbLabel\n              label={resolveSliderLabel(label, displayedToValue)}\n              labelAlwaysOn={labelAlwaysOn}\n              orientation={props.orientation}\n              showLabelOnHover={showLabelOnHover}\n              transitionProps={labelTransitionProps}\n            />\n          </SliderThumb>\n        </SliderControl>\n      )}\n      {name ? (\n        <>\n          <input\n            {...hiddenInputProps}\n            name={`${name}_from`}\n            type=\"hidden\"\n            value={String(displayedFromValue)}\n          />\n          <input\n            {...hiddenInputProps}\n            name={`${name}_to`}\n            type=\"hidden\"\n            value={String(displayedToValue)}\n          />\n        </>\n      ) : null}\n    </SliderPrimitive.Root>\n  );\n}) as RangeSliderComponent;\n\nRangeSlider.Control = SliderControl;\nRangeSlider.Indicator = SliderIndicator;\nRangeSlider.Mark = SliderMark;\nRangeSlider.Marks = SliderMarks;\nRangeSlider.Thumb = SliderThumb;\nRangeSlider.ThumbLabel = SliderThumbLabel;\nRangeSlider.Track = SliderTrack;\nRangeSlider.Value = SliderValuePrimitive;\n\nexport { RangeSlider };\n"],"mappings":"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"}

package/dist/ui/rating.d.ts

@@ -0,0 +1,149 @@
+import { ComponentProps } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as tailwind_variants0 from "tailwind-variants";
+import { VariantProps } from "tailwind-variants";
+
+//#region src/ui/rating/rating-star.d.ts
+declare const ratingStarVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+  editable: {
+    true: string[];
+    false: string[];
+  };
+}, undefined, string[], {
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+  editable: {
+    true: string[];
+    false: string[];
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+  editable: {
+    true: string[];
+    false: string[];
+  };
+}, undefined, string[], unknown, unknown, undefined>>;
+type RatingStarVariants = VariantProps<typeof ratingStarVariants>;
+type RatingStarProps = RatingStarVariants & ComponentProps<"button"> & {
+  filled?: boolean;
+  halfFilled?: boolean;
+  active?: boolean;
+  starClassName?: string;
+};
+declare const RatingStar: ({
+  className,
+  size,
+  filled,
+  halfFilled,
+  active,
+  editable,
+  starClassName,
+  onClick,
+  ...props
+}: RatingStarProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/rating/rating.d.ts
+declare const ratingVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+}, undefined, string[], {
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+}, undefined, string[], unknown, unknown, undefined>>;
+declare const ratingValueVariants: tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+}, undefined, string[], {
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+}, undefined, tailwind_variants0.TVReturnType<{
+  size: {
+    xs: string[];
+    sm: string[];
+    md: string[];
+    lg: string[];
+    xl: string[];
+  };
+}, undefined, string[], unknown, unknown, undefined>>;
+type RatingVariants = VariantProps<typeof ratingVariants>;
+type RatingProps = RatingVariants & Omit<ComponentProps<"div">, "onClick"> & {
+  rating: number;
+  maxRating?: number;
+  showValue?: boolean;
+  editable?: boolean;
+  onRatingChange?: (rating: number) => void;
+  starClassName?: string;
+};
+declare const Rating: {
+  ({
+    className,
+    size,
+    rating,
+    maxRating,
+    showValue,
+    editable,
+    onRatingChange,
+    starClassName,
+    ...props
+  }: RatingProps): react_jsx_runtime0.JSX.Element;
+  Star: ({
+    className,
+    size,
+    filled,
+    halfFilled,
+    active,
+    editable,
+    starClassName,
+    onClick,
+    ...props
+  }: RatingStarProps) => react_jsx_runtime0.JSX.Element;
+};
+//#endregion
+export { Rating, RatingProps, RatingStar, type RatingStarProps, ratingValueVariants, ratingVariants };
+//# sourceMappingURL=rating.d.ts.map

package/dist/ui/rating.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"rating.d.ts","names":[],"sources":["../../src/ui/rating/rating-star.tsx","../../src/ui/rating/rating.tsx"],"mappings":";;;;;;cAQa,kBAAA,EA+CX,kBAAA,CA/C6B,YAAA;;;;;;;;;;;;;;;;;;;;;;;;cA+C7B,kBAAA,CAAA,YAAA;;;;;;;;;;;;;KA0EG,kBAAA,GAAqB,YAAA,QAAoB,kBAAA;AAAA,KAElC,eAAA,GAAkB,kBAAA,GAC5B,cAAA;EACE,MAAA;EACA,UAAA;EACA,MAAA;EACA,aAAA;AAAA;AAAA,cAGS,UAAA;EAAc,SAAA;EAAA,IAAA;EAAA,MAAA;EAAA,UAAA;EAAA,MAAA;EAAA,QAAA;EAAA,aAAA;EAAA,OAAA;EAAA,GAAA;AAAA,GAUxB,eAAA,KAAe,kBAAA,CAAA,GAAA,CAAA,OAAA;;;cC5IL,cAAA,EAgCX,kBAAA,CAhCyB,YAAA;;;;;;;;;;;;;;;;cAgCzB,kBAAA,CAAA,YAAA;;;;;;;;;cAEW,mBAAA,EAgCX,kBAAA,CAhC8B,YAAA;;;;;;;;;;;;;;;;cAgC9B,kBAAA,CAAA,YAAA;;;;;;;;;KAEG,cAAA,GAAiB,YAAA,QAAoB,cAAA;AAAA,KAE9B,WAAA,GAAc,cAAA,GACxB,IAAA,CAAK,cAAA;EACH,MAAA;EACA,SAAA;EACA,SAAA;EACA,QAAA;EACA,cAAA,IAAkB,MAAA;EAClB,aAAA;AAAA;AAAA,cAGE,MAAA;EAAA;;;;;;;;;;KAUH,WAAA,GAAW,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/ui/rating.js

@@ -0,0 +1,173 @@
+"use client";
+
+import { useCallback } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn, tv } from "tailwind-variants";
+import { StarIcon } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon } from "@hugeicons/react";
+
+//#region src/ui/rating/rating-star.tsx
+const ratingStarVariants = tv({
+	base: [
+		"relative inline-flex shrink-0",
+		"cursor-pointer",
+		"transition-colors duration-150"
+	],
+	variants: {
+		size: {
+			xs: ["size-3"],
+			sm: ["size-3.5"],
+			md: ["size-4"],
+			lg: ["size-5"],
+			xl: ["size-6"]
+		},
+		editable: {
+			true: ["hover:scale-110"],
+			false: ["cursor-default"]
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		editable: false
+	}
+});
+const ratingStarFilledVariants = tv({
+	base: ["absolute inset-0", "fill-warning-foreground text-warning-foreground"],
+	variants: { visible: {
+		true: ["opacity-100"],
+		false: ["opacity-0"]
+	} },
+	defaultVariants: { visible: true }
+});
+const ratingStarHalfVariants = tv({
+	base: ["absolute inset-0 overflow-hidden", "fill-warning-foreground text-warning-foreground"],
+	variants: { visible: {
+		true: ["opacity-100"],
+		false: ["opacity-0"]
+	} },
+	defaultVariants: { visible: true }
+});
+const ratingStarOutlineVariants = tv({
+	base: ["relative", "text-muted-foreground"],
+	variants: { active: {
+		true: ["opacity-30"],
+		false: ["opacity-100"]
+	} },
+	defaultVariants: { active: false }
+});
+const RatingStar = ({ className, size, filled = false, halfFilled = false, active = false, editable = false, starClassName, onClick, ...props }) => {
+	const getStarSize = () => {
+		if (size === "xs") return 12;
+		if (size === "sm") return 14;
+		if (size === "lg") return 20;
+		if (size === "xl") return 24;
+		return 16;
+	};
+	const getAriaLabel = () => {
+		if (filled) return "Filled star";
+		if (halfFilled) return "Half-filled star";
+		return "Empty star";
+	};
+	const starSize = getStarSize();
+	return /* @__PURE__ */ jsxs("button", {
+		"aria-label": getAriaLabel(),
+		className: cn(ratingStarVariants({
+			size,
+			editable
+		}), className),
+		disabled: !editable,
+		onClick,
+		type: "button",
+		...props,
+		children: [
+			/* @__PURE__ */ jsx("span", {
+				className: cn(ratingStarFilledVariants({ visible: filled }), starClassName),
+				children: /* @__PURE__ */ jsx(HugeiconsIcon, {
+					className: "fill-warning-foreground text-warning-foreground",
+					icon: StarIcon,
+					size: starSize,
+					strokeWidth: 1.5
+				})
+			}),
+			halfFilled && /* @__PURE__ */ jsx("span", {
+				className: cn(ratingStarHalfVariants({ visible: true }), starClassName),
+				children: /* @__PURE__ */ jsx("div", {
+					className: "w-1/2 overflow-hidden",
+					children: /* @__PURE__ */ jsx(HugeiconsIcon, {
+						className: "fill-warning-foreground text-warning-foreground",
+						icon: StarIcon,
+						size: starSize,
+						strokeWidth: 1.5
+					})
+				})
+			}),
+			/* @__PURE__ */ jsx("span", {
+				className: cn(ratingStarOutlineVariants({ active }), starClassName),
+				children: /* @__PURE__ */ jsx(HugeiconsIcon, {
+					icon: StarIcon,
+					size: starSize,
+					strokeWidth: 1.5
+				})
+			})
+		]
+	});
+};
+
+//#endregion
+//#region src/ui/rating/rating.tsx
+const ratingVariants = tv({
+	base: ["inline-flex items-center gap-1"],
+	variants: { size: {
+		xs: ["gap-0.5"],
+		sm: ["gap-0.5"],
+		md: ["gap-1"],
+		lg: ["gap-1.5"],
+		xl: ["gap-2"]
+	} },
+	defaultVariants: { size: "md" }
+});
+const ratingValueVariants = tv({
+	base: ["text-sm font-medium"],
+	variants: { size: {
+		xs: ["text-xs"],
+		sm: ["text-xs"],
+		md: ["text-sm"],
+		lg: ["text-base"],
+		xl: ["text-base"]
+	} },
+	defaultVariants: { size: "md" }
+});
+const Rating = ({ className, size, rating, maxRating = 5, showValue = false, editable = false, onRatingChange, starClassName, ...props }) => {
+	const handleStarClick = useCallback((e) => {
+		const value = Number(e.currentTarget.dataset.value);
+		if (editable && onRatingChange) onRatingChange(value);
+	}, [editable, onRatingChange]);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn(ratingVariants({ size }), className),
+		"data-slot": "rating",
+		...props,
+		children: [Array.from({ length: maxRating }, (_, index) => {
+			const starValue = index + 1;
+			const isFilled = starValue <= Math.floor(rating);
+			const isHalfFilled = !isFilled && starValue - .5 <= rating && rating < starValue;
+			return /* @__PURE__ */ jsx(RatingStar, {
+				active: starValue <= rating,
+				className: starClassName,
+				"data-value": starValue,
+				editable,
+				filled: isFilled,
+				halfFilled: isHalfFilled,
+				onClick: handleStarClick,
+				size
+			}, starValue);
+		}), showValue && /* @__PURE__ */ jsx("span", {
+			className: cn(ratingValueVariants({ size }), "ml-1"),
+			children: rating.toFixed(1)
+		})]
+	});
+};
+Rating.Star = RatingStar;
+
+//#endregion
+export { Rating, RatingStar, ratingValueVariants, ratingVariants };
+//# sourceMappingURL=rating.js.map

package/dist/ui/rating.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"rating.js","names":[],"sources":["../../src/ui/rating/rating-star.tsx","../../src/ui/rating/rating.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\n\nimport { StarIcon } from \"@hugeicons/core-free-icons\";\nimport { HugeiconsIcon } from \"@hugeicons/react\";\nimport { cn, tv, type VariantProps } from \"tailwind-variants\";\n\nexport const ratingStarVariants = tv({\n  base: [\n    // Layout: relative container for star\n    \"relative inline-flex shrink-0\",\n    // Cursor: clickable when editable\n    \"cursor-pointer\",\n    // Transitions: smooth color transitions\n    \"transition-colors duration-150\",\n  ],\n  variants: {\n    size: {\n      xs: [\n        // Extra small size: smallest star\n        \"size-3\",\n      ],\n      sm: [\n        // Small size: smaller star\n        \"size-3.5\",\n      ],\n      md: [\n        // Medium size: default star\n        \"size-4\",\n      ],\n      lg: [\n        // Large size: larger star\n        \"size-5\",\n      ],\n      xl: [\n        // Extra large size: largest star\n        \"size-6\",\n      ],\n    },\n    editable: {\n      true: [\n        // Hover: slight scale on hover when editable\n        \"hover:scale-110\",\n      ],\n      false: [\n        // Non-editable: no pointer cursor\n        \"cursor-default\",\n      ],\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n    editable: false,\n  },\n});\n\nexport const ratingStarFilledVariants = tv({\n  base: [\n    // Layout: absolute positioned filled star\n    \"absolute inset-0\",\n    // Fill: semantic warning token for filled stars\n    \"fill-warning-foreground text-warning-foreground\",\n  ],\n  variants: {\n    visible: {\n      true: [\n        // Visible: show filled star\n        \"opacity-100\",\n      ],\n      false: [\n        // Hidden: hide filled star\n        \"opacity-0\",\n      ],\n    },\n  },\n  defaultVariants: {\n    visible: true,\n  },\n});\n\nexport const ratingStarHalfVariants = tv({\n  base: [\n    // Layout: absolute positioned half-filled star\n    \"absolute inset-0 overflow-hidden\",\n    // Fill: semantic warning token for half-filled stars\n    \"fill-warning-foreground text-warning-foreground\",\n  ],\n  variants: {\n    visible: {\n      true: [\n        // Visible: show half-filled star\n        \"opacity-100\",\n      ],\n      false: [\n        // Hidden: hide half-filled star\n        \"opacity-0\",\n      ],\n    },\n  },\n  defaultVariants: {\n    visible: true,\n  },\n});\n\nexport const ratingStarOutlineVariants = tv({\n  base: [\n    // Layout: relative positioned outline star\n    \"relative\",\n    // Color: muted color for outline\n    \"text-muted-foreground\",\n  ],\n  variants: {\n    active: {\n      true: [\n        // Active: slightly visible outline\n        \"opacity-30\",\n      ],\n      false: [\n        // Inactive: more visible outline\n        \"opacity-100\",\n      ],\n    },\n  },\n  defaultVariants: {\n    active: false,\n  },\n});\n\ntype RatingStarVariants = VariantProps<typeof ratingStarVariants>;\n\nexport type RatingStarProps = RatingStarVariants &\n  ComponentProps<\"button\"> & {\n    filled?: boolean;\n    halfFilled?: boolean;\n    active?: boolean;\n    starClassName?: string;\n  };\n\nexport const RatingStar = ({\n  className,\n  size,\n  filled = false,\n  halfFilled = false,\n  active = false,\n  editable = false,\n  starClassName,\n  onClick,\n  ...props\n}: RatingStarProps) => {\n  const getStarSize = () => {\n    if (size === \"xs\") {\n      return 12;\n    }\n    if (size === \"sm\") {\n      return 14;\n    }\n    if (size === \"lg\") {\n      return 20;\n    }\n    if (size === \"xl\") {\n      return 24;\n    }\n    return 16;\n  };\n\n  const getAriaLabel = () => {\n    if (filled) {\n      return \"Filled star\";\n    }\n    if (halfFilled) {\n      return \"Half-filled star\";\n    }\n    return \"Empty star\";\n  };\n\n  const starSize = getStarSize();\n\n  return (\n    <button\n      aria-label={getAriaLabel()}\n      className={cn(ratingStarVariants({ size, editable }), className)}\n      disabled={!editable}\n      onClick={onClick}\n      type=\"button\"\n      {...props}\n    >\n      {/* Filled star overlay */}\n      <span\n        className={cn(\n          ratingStarFilledVariants({ visible: filled }),\n          starClassName\n        )}\n      >\n        <HugeiconsIcon\n          className=\"fill-warning-foreground text-warning-foreground\"\n          icon={StarIcon}\n          size={starSize}\n          strokeWidth={1.5}\n        />\n      </span>\n\n      {/* Half-filled star overlay */}\n      {halfFilled && (\n        <span\n          className={cn(\n            ratingStarHalfVariants({ visible: true }),\n            starClassName\n          )}\n        >\n          <div className=\"w-1/2 overflow-hidden\">\n            <HugeiconsIcon\n              className=\"fill-warning-foreground text-warning-foreground\"\n              icon={StarIcon}\n              size={starSize}\n              strokeWidth={1.5}\n            />\n          </div>\n        </span>\n      )}\n\n      {/* Outline star */}\n      <span\n        className={cn(ratingStarOutlineVariants({ active }), starClassName)}\n      >\n        <HugeiconsIcon icon={StarIcon} size={starSize} strokeWidth={1.5} />\n      </span>\n    </button>\n  );\n};\n","\"use client\";\n\nimport type { ComponentProps, MouseEvent } from \"react\";\n\nimport { useCallback } from \"react\";\nimport { cn, tv, type VariantProps } from \"tailwind-variants\";\n\nimport { RatingStar } from \"./rating-star\";\n\nexport const ratingVariants = tv({\n  base: [\n    // Layout: flex container with centered items\n    \"inline-flex items-center gap-1\",\n  ],\n  variants: {\n    size: {\n      xs: [\n        // Extra small size: compact gap\n        \"gap-0.5\",\n      ],\n      sm: [\n        // Small size: smaller gap and text\n        \"gap-0.5\",\n      ],\n      md: [\n        // Medium size: default gap\n        \"gap-1\",\n      ],\n      lg: [\n        // Large size: larger gap\n        \"gap-1.5\",\n      ],\n      xl: [\n        // Extra large size: largest spacing\n        \"gap-2\",\n      ],\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\nexport const ratingValueVariants = tv({\n  base: [\n    // Typography: rating value text styling\n    \"text-sm font-medium\",\n  ],\n  variants: {\n    size: {\n      xs: [\n        // Extra small size: smallest text\n        \"text-xs\",\n      ],\n      sm: [\n        // Small size: smaller text\n        \"text-xs\",\n      ],\n      md: [\n        // Medium size: default text\n        \"text-sm\",\n      ],\n      lg: [\n        // Large size: larger text\n        \"text-base\",\n      ],\n      xl: [\n        // Extra large size: largest text\n        \"text-base\",\n      ],\n    },\n  },\n  defaultVariants: {\n    size: \"md\",\n  },\n});\n\ntype RatingVariants = VariantProps<typeof ratingVariants>;\n\nexport type RatingProps = RatingVariants &\n  Omit<ComponentProps<\"div\">, \"onClick\"> & {\n    rating: number;\n    maxRating?: number;\n    showValue?: boolean;\n    editable?: boolean;\n    onRatingChange?: (rating: number) => void;\n    starClassName?: string;\n  };\n\nconst Rating = ({\n  className,\n  size,\n  rating,\n  maxRating = 5,\n  showValue = false,\n  editable = false,\n  onRatingChange,\n  starClassName,\n  ...props\n}: RatingProps) => {\n  const handleStarClick = useCallback(\n    (e: MouseEvent<HTMLButtonElement>) => {\n      const value = Number(e.currentTarget.dataset.value);\n      if (editable && onRatingChange) {\n        onRatingChange(value);\n      }\n    },\n    [editable, onRatingChange]\n  );\n\n  return (\n    <div\n      className={cn(ratingVariants({ size }), className)}\n      data-slot=\"rating\"\n      {...props}\n    >\n      {Array.from({ length: maxRating }, (_, index) => {\n        const starValue = index + 1;\n        const isFilled = starValue <= Math.floor(rating);\n        const isHalfFilled =\n          !isFilled && starValue - 0.5 <= rating && rating < starValue;\n        const isActive = starValue <= rating;\n\n        return (\n          <RatingStar\n            active={isActive}\n            className={starClassName}\n            data-value={starValue}\n            editable={editable}\n            filled={isFilled}\n            halfFilled={isHalfFilled}\n            key={starValue}\n            onClick={handleStarClick}\n            size={size}\n          />\n        );\n      })}\n      {showValue && (\n        <span className={cn(ratingValueVariants({ size }), \"ml-1\")}>\n          {rating.toFixed(1)}\n        </span>\n      )}\n    </div>\n  );\n};\n\nRating.Star = RatingStar;\n\nexport { Rating, RatingStar };\n\nexport type { RatingStarProps } from \"./rating-star\";\n"],"mappings":"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"}

package/dist/ui/resizable.d.ts

@@ -0,0 +1,39 @@
+import { ComponentProps } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { Group, Panel, Separator } from "react-resizable-panels";
+
+//#region src/ui/resizable/resizable-handle.d.ts
+type ResizableHandleProps = ComponentProps<typeof Separator> & {
+  withHandle?: boolean;
+};
+declare const ResizableHandle: ({
+  withHandle,
+  className,
+  ...props
+}: ResizableHandleProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/resizable/resizable-panel.d.ts
+type ResizablePanelProps = ComponentProps<typeof Panel>;
+declare const ResizablePanel: ({
+  ...props
+}: ResizablePanelProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/resizable/resizable.d.ts
+type ResizablePanelGroupProps = ComponentProps<typeof Group>;
+declare const ResizablePanelGroup: {
+  ({
+    className,
+    ...props
+  }: ResizablePanelGroupProps): react_jsx_runtime0.JSX.Element;
+  Handle: ({
+    withHandle,
+    className,
+    ...props
+  }: ResizableHandleProps) => react_jsx_runtime0.JSX.Element;
+  Panel: ({
+    ...props
+  }: ResizablePanelProps) => react_jsx_runtime0.JSX.Element;
+};
+//#endregion
+export { ResizableHandle, type ResizableHandleProps, ResizablePanel, ResizablePanelGroup, ResizablePanelGroupProps, type ResizablePanelProps };
+//# sourceMappingURL=resizable.d.ts.map

package/dist/ui/resizable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resizable.d.ts","names":[],"sources":["../../src/ui/resizable/resizable-handle.tsx","../../src/ui/resizable/resizable-panel.tsx","../../src/ui/resizable/resizable.tsx"],"mappings":";;;;;KAMY,oBAAA,GAAuB,cAAA,QAAsB,SAAA;EACvD,UAAA;AAAA;AAAA,cAGI,eAAA;EAAmB,UAAA;EAAA,SAAA;EAAA,GAAA;AAAA,GAItB,oBAAA,KAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCTX,mBAAA,GAAsB,cAAA,QAAsB,KAAA;AAAA,cAElD,cAAA;EAAA,GAAkB;AAAA,GAAc,mBAAA,KAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCE7C,wBAAA,GAA2B,cAAA,QAAsB,KAAA;AAAA,cAEvD,mBAAA;EAAA;;;KAGH,wBAAA,GAAwB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/ui/resizable.js

@@ -0,0 +1,34 @@
+"use client";
+
+import { jsx } from "react/jsx-runtime";
+import { cn } from "tailwind-variants";
+import { Group, Panel, Separator } from "react-resizable-panels";
+
+//#region src/ui/resizable/resizable-handle.tsx
+const ResizableHandle = ({ withHandle, className, ...props }) => /* @__PURE__ */ jsx(Separator, {
+	className: cn("relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90", className),
+	"data-slot": "resizable-handle",
+	...props,
+	children: withHandle && /* @__PURE__ */ jsx("div", { className: "z-10 flex h-6 w-1 shrink-0 rounded-lg bg-border" })
+});
+
+//#endregion
+//#region src/ui/resizable/resizable-panel.tsx
+const ResizablePanel = ({ ...props }) => /* @__PURE__ */ jsx(Panel, {
+	"data-slot": "resizable-panel",
+	...props
+});
+
+//#endregion
+//#region src/ui/resizable/resizable.tsx
+const ResizablePanelGroup = ({ className, ...props }) => /* @__PURE__ */ jsx(Group, {
+	className: cn("flex h-full w-full data-[panel-group-direction=vertical]:flex-col", className),
+	"data-slot": "resizable-panel-group",
+	...props
+});
+ResizablePanelGroup.Handle = ResizableHandle;
+ResizablePanelGroup.Panel = ResizablePanel;
+
+//#endregion
+export { ResizableHandle, ResizablePanel, ResizablePanelGroup };
+//# sourceMappingURL=resizable.js.map

package/dist/ui/resizable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resizable.js","names":[],"sources":["../../src/ui/resizable/resizable-handle.tsx","../../src/ui/resizable/resizable-panel.tsx","../../src/ui/resizable/resizable.tsx"],"sourcesContent":["\"use client\";\n\nimport type { ComponentProps } from \"react\";\n\nimport { Separator } from \"react-resizable-panels\";\nimport { cn } from \"tailwind-variants\";\nexport type ResizableHandleProps = ComponentProps<typeof Separator> & {\n  withHandle?: boolean;\n};\n\nconst ResizableHandle = ({\n  withHandle,\n  className,\n  ...props\n}: ResizableHandleProps) => (\n  <Separator\n    className={cn(\n      \"relative flex w-px items-center justify-center bg-border after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90\",\n      className\n    )}\n    data-slot=\"resizable-handle\"\n    {...props}\n  >\n    {withHandle && (\n      <div className=\"z-10 flex h-6 w-1 shrink-0 rounded-lg bg-border\" />\n    )}\n  </Separator>\n);\n\nexport { ResizableHandle };\n","\"use client\";\n\nimport type { ComponentProps } from \"react\";\n\nimport { Panel } from \"react-resizable-panels\";\nexport type ResizablePanelProps = ComponentProps<typeof Panel>;\n\nconst ResizablePanel = ({ ...props }: ResizablePanelProps) => (\n  <Panel data-slot=\"resizable-panel\" {...props} />\n);\n\nexport { ResizablePanel };\n","\"use client\";\n\nimport type { ComponentProps } from \"react\";\n\nimport { Group } from \"react-resizable-panels\";\nimport { cn } from \"tailwind-variants\";\n\nimport { ResizableHandle } from \"./resizable-handle\";\nimport { ResizablePanel } from \"./resizable-panel\";\nexport type ResizablePanelGroupProps = ComponentProps<typeof Group>;\n\nconst ResizablePanelGroup = ({\n  className,\n  ...props\n}: ResizablePanelGroupProps) => (\n  <Group\n    className={cn(\n      \"flex h-full w-full data-[panel-group-direction=vertical]:flex-col\",\n      className\n    )}\n    data-slot=\"resizable-panel-group\"\n    {...props}\n  />\n);\n\nResizablePanelGroup.Handle = ResizableHandle;\nResizablePanelGroup.Panel = ResizablePanel;\n\nexport { ResizableHandle, ResizablePanel, ResizablePanelGroup };\n\nexport type { ResizableHandleProps } from \"./resizable-handle\";\nexport type { ResizablePanelProps } from \"./resizable-panel\";\n"],"mappings":";;;;;;;AAUA,MAAM,mBAAmB,EACvB,YACA,WACA,GAAG,YAEH,oBAAC;CACC,WAAW,GACT,6oBACA,UACD;CACD,aAAU;CACV,GAAI;WAEH,cACC,oBAAC,SAAI,WAAU,oDAAoD;EAE3D;;;;ACnBd,MAAM,kBAAkB,EAAE,GAAG,YAC3B,oBAAC;CAAM,aAAU;CAAkB,GAAI;EAAS;;;;ACGlD,MAAM,uBAAuB,EAC3B,WACA,GAAG,YAEH,oBAAC;CACC,WAAW,GACT,qEACA,UACD;CACD,aAAU;CACV,GAAI;EACJ;AAGJ,oBAAoB,SAAS;AAC7B,oBAAoB,QAAQ"}

package/dist/ui/scroll-area.d.ts

@@ -0,0 +1,80 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { ScrollArea as ScrollArea$1 } from "@base-ui/react/scroll-area";
+
+//#region src/ui/scroll-area/scroll-bar.d.ts
+type ScrollBarProps = ScrollArea$1.Scrollbar.Props;
+declare const ScrollBar: ({
+  className,
+  orientation,
+  children,
+  ...props
+}: ScrollBarProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/scroll-area/scroll-content.d.ts
+type ScrollAreaContentProps = ScrollArea$1.Content.Props;
+declare const ScrollAreaContent: ({
+  className,
+  ...props
+}: ScrollAreaContentProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/scroll-area/scroll-corner.d.ts
+type ScrollAreaCornerProps = ScrollArea$1.Corner.Props;
+declare const ScrollAreaCorner: ({
+  className,
+  ...props
+}: ScrollAreaCornerProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/scroll-area/scroll-thumb.d.ts
+type ScrollAreaThumbProps = ScrollArea$1.Thumb.Props;
+declare const ScrollAreaThumb: ({
+  className,
+  ...props
+}: ScrollAreaThumbProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/scroll-area/scroll-viewport.d.ts
+type ScrollAreaViewportProps = ScrollArea$1.Viewport.Props;
+declare const ScrollAreaViewport: ({
+  className,
+  ...props
+}: ScrollAreaViewportProps) => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/ui/scroll-area/scroll-area.d.ts
+type ScrollAreaProps = ScrollArea$1.Root.Props;
+declare const ScrollArea: {
+  ({
+    className,
+    children,
+    ...props
+  }: ScrollAreaProps): react_jsx_runtime0.JSX.Element;
+  Bar: ({
+    className,
+    orientation,
+    children,
+    ...props
+  }: ScrollBarProps) => react_jsx_runtime0.JSX.Element;
+  Content: ({
+    className,
+    ...props
+  }: ScrollAreaContentProps) => react_jsx_runtime0.JSX.Element;
+  Corner: ({
+    className,
+    ...props
+  }: ScrollAreaCornerProps) => react_jsx_runtime0.JSX.Element;
+  Scrollbar: ({
+    className,
+    orientation,
+    children,
+    ...props
+  }: ScrollBarProps) => react_jsx_runtime0.JSX.Element;
+  Thumb: ({
+    className,
+    ...props
+  }: ScrollAreaThumbProps) => react_jsx_runtime0.JSX.Element;
+  Viewport: ({
+    className,
+    ...props
+  }: ScrollAreaViewportProps) => react_jsx_runtime0.JSX.Element;
+};
+//#endregion
+export { ScrollArea, ScrollAreaContent, type ScrollAreaContentProps, ScrollAreaCorner, type ScrollAreaCornerProps, ScrollAreaProps, ScrollAreaThumb, type ScrollAreaThumbProps, ScrollAreaViewport, type ScrollAreaViewportProps, ScrollBar, type ScrollBarProps };
+//# sourceMappingURL=scroll-area.d.ts.map

package/dist/ui/scroll-area.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.d.ts","names":[],"sources":["../../src/ui/scroll-area/scroll-bar.tsx","../../src/ui/scroll-area/scroll-content.tsx","../../src/ui/scroll-area/scroll-corner.tsx","../../src/ui/scroll-area/scroll-thumb.tsx","../../src/ui/scroll-area/scroll-viewport.tsx","../../src/ui/scroll-area/scroll-area.tsx"],"mappings":";;;;KAKY,cAAA,GAAiB,YAAA,CAAoB,SAAA,CAAU,KAAA;AAAA,cAErD,SAAA;EAAa,SAAA;EAAA,WAAA;EAAA,QAAA;EAAA,GAAA;AAAA,GAKhB,cAAA,KAAc,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCTL,sBAAA,GAAyB,YAAA,CAAoB,OAAA,CAAQ,KAAA;AAAA,cAE3D,iBAAA;EAAqB,SAAA;EAAA,GAAA;AAAA,GAAyB,sBAAA,KAAsB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCF9D,qBAAA,GAAwB,YAAA,CAAoB,MAAA,CAAO,KAAA;AAAA,cAEzD,gBAAA;EAAoB,SAAA;EAAA,GAAA;AAAA,GAAyB,qBAAA,KAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCF5D,oBAAA,GAAuB,YAAA,CAAoB,KAAA,CAAM,KAAA;AAAA,cAEvD,eAAA;EAAmB,SAAA;EAAA,GAAA;AAAA,GAAyB,oBAAA,KAAoB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCF1D,uBAAA,GAA0B,YAAA,CAAoB,QAAA,CAAS,KAAA;AAAA,cAE7D,kBAAA;EAAsB,SAAA;EAAA,GAAA;AAAA,GAGzB,uBAAA,KAAuB,kBAAA,CAAA,GAAA,CAAA,OAAA;;;KCCd,eAAA,GAAkB,YAAA,CAAoB,IAAA,CAAK,KAAA;AAAA,cAEjD,UAAA;EAAA;;;;KAAiD,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/ui/scroll-area.js

@@ -0,0 +1,54 @@
+import { t as mergeBaseUIClassName } from "../merge-base-ui-class-name-HKsgjcXj.js";
+import { n as ScrollAreaThumb, t as ScrollBar } from "../scroll-bar-C4qEUKlT.js";
+import { Children, isValidElement } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { ScrollArea as ScrollArea$1 } from "@base-ui/react/scroll-area";
+
+//#region src/ui/scroll-area/scroll-content.tsx
+const ScrollAreaContent = ({ className, ...props }) => /* @__PURE__ */ jsx(ScrollArea$1.Content, {
+	className: mergeBaseUIClassName(void 0, className),
+	"data-slot": "scroll-area-content",
+	...props
+});
+
+//#endregion
+//#region src/ui/scroll-area/scroll-corner.tsx
+const ScrollAreaCorner = ({ className, ...props }) => /* @__PURE__ */ jsx(ScrollArea$1.Corner, {
+	className: mergeBaseUIClassName(void 0, className),
+	"data-slot": "scroll-area-corner",
+	...props
+});
+
+//#endregion
+//#region src/ui/scroll-area/scroll-viewport.tsx
+const ScrollAreaViewport = ({ className, ...props }) => /* @__PURE__ */ jsx(ScrollArea$1.Viewport, {
+	className: mergeBaseUIClassName("size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1", className),
+	"data-slot": "scroll-area-viewport",
+	...props
+});
+
+//#endregion
+//#region src/ui/scroll-area/scroll-area.tsx
+const ScrollArea = ({ className, children, ...props }) => /* @__PURE__ */ jsx(ScrollArea$1.Root, {
+	className: mergeBaseUIClassName("relative", className),
+	"data-slot": "scroll-area",
+	...props,
+	children: Children.toArray(children).some((child) => {
+		if (!isValidElement(child)) return false;
+		return child.type === ScrollArea$1.Viewport || child.type === ScrollAreaViewport;
+	}) ? children : /* @__PURE__ */ jsxs(Fragment, { children: [
+		/* @__PURE__ */ jsx(ScrollAreaViewport, { children: /* @__PURE__ */ jsx(ScrollAreaContent, { children }) }),
+		/* @__PURE__ */ jsx(ScrollBar, {}),
+		/* @__PURE__ */ jsx(ScrollAreaCorner, {})
+	] })
+});
+ScrollArea.Bar = ScrollBar;
+ScrollArea.Content = ScrollAreaContent;
+ScrollArea.Corner = ScrollAreaCorner;
+ScrollArea.Scrollbar = ScrollBar;
+ScrollArea.Thumb = ScrollAreaThumb;
+ScrollArea.Viewport = ScrollAreaViewport;
+
+//#endregion
+export { ScrollArea, ScrollAreaContent, ScrollAreaCorner, ScrollAreaThumb, ScrollAreaViewport, ScrollBar };
+//# sourceMappingURL=scroll-area.js.map

package/dist/ui/scroll-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.js","names":["ScrollAreaPrimitive","ScrollAreaPrimitive","ScrollAreaPrimitive","ScrollAreaPrimitive"],"sources":["../../src/ui/scroll-area/scroll-content.tsx","../../src/ui/scroll-area/scroll-corner.tsx","../../src/ui/scroll-area/scroll-viewport.tsx","../../src/ui/scroll-area/scroll-area.tsx"],"sourcesContent":["import { ScrollArea as ScrollAreaPrimitive } from \"@base-ui/react/scroll-area\";\n\nimport { mergeBaseUIClassName } from \"../../utils/merge-base-ui-class-name\";\nexport type ScrollAreaContentProps = ScrollAreaPrimitive.Content.Props;\n\nconst ScrollAreaContent = ({ className, ...props }: ScrollAreaContentProps) => (\n  <ScrollAreaPrimitive.Content\n    className={mergeBaseUIClassName<ScrollAreaPrimitive.Content.State>(\n      undefined,\n      className\n    )}\n    data-slot=\"scroll-area-content\"\n    {...props}\n  />\n);\n\nexport { ScrollAreaContent };\n","import { ScrollArea as ScrollAreaPrimitive } from \"@base-ui/react/scroll-area\";\n\nimport { mergeBaseUIClassName } from \"../../utils/merge-base-ui-class-name\";\nexport type ScrollAreaCornerProps = ScrollAreaPrimitive.Corner.Props;\n\nconst ScrollAreaCorner = ({ className, ...props }: ScrollAreaCornerProps) => (\n  <ScrollAreaPrimitive.Corner\n    className={mergeBaseUIClassName<ScrollAreaPrimitive.Corner.State>(\n      undefined,\n      className\n    )}\n    data-slot=\"scroll-area-corner\"\n    {...props}\n  />\n);\n\nexport { ScrollAreaCorner };\n","import { ScrollArea as ScrollAreaPrimitive } from \"@base-ui/react/scroll-area\";\n\nimport { mergeBaseUIClassName } from \"../../utils/merge-base-ui-class-name\";\nexport type ScrollAreaViewportProps = ScrollAreaPrimitive.Viewport.Props;\n\nconst ScrollAreaViewport = ({\n  className,\n  ...props\n}: ScrollAreaViewportProps) => (\n  <ScrollAreaPrimitive.Viewport\n    className={mergeBaseUIClassName<ScrollAreaPrimitive.Viewport.State>(\n      \"size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1\",\n      className\n    )}\n    data-slot=\"scroll-area-viewport\"\n    {...props}\n  />\n);\n\nexport { ScrollAreaViewport };\n","import { ScrollArea as ScrollAreaPrimitive } from \"@base-ui/react/scroll-area\";\nimport { Children, isValidElement } from \"react\";\n\nimport { mergeBaseUIClassName } from \"../../utils/merge-base-ui-class-name\";\nimport { ScrollBar } from \"./scroll-bar\";\nimport { ScrollAreaContent } from \"./scroll-content\";\nimport { ScrollAreaCorner } from \"./scroll-corner\";\nimport { ScrollAreaThumb } from \"./scroll-thumb\";\nimport { ScrollAreaViewport } from \"./scroll-viewport\";\nexport type ScrollAreaProps = ScrollAreaPrimitive.Root.Props;\n\nconst ScrollArea = ({ className, children, ...props }: ScrollAreaProps) => (\n  <ScrollAreaPrimitive.Root\n    className={mergeBaseUIClassName<ScrollAreaPrimitive.Root.State>(\n      \"relative\",\n      className\n    )}\n    data-slot=\"scroll-area\"\n    {...props}\n  >\n    {Children.toArray(children).some((child) => {\n      if (!isValidElement(child)) {\n        return false;\n      }\n      return (\n        child.type === ScrollAreaPrimitive.Viewport ||\n        child.type === ScrollAreaViewport\n      );\n    }) ? (\n      children\n    ) : (\n      <>\n        <ScrollAreaViewport>\n          <ScrollAreaContent>{children}</ScrollAreaContent>\n        </ScrollAreaViewport>\n        <ScrollBar />\n        <ScrollAreaCorner />\n      </>\n    )}\n  </ScrollAreaPrimitive.Root>\n);\n\nScrollArea.Bar = ScrollBar;\nScrollArea.Content = ScrollAreaContent;\nScrollArea.Corner = ScrollAreaCorner;\nScrollArea.Scrollbar = ScrollBar;\nScrollArea.Thumb = ScrollAreaThumb;\nScrollArea.Viewport = ScrollAreaViewport;\n\nexport {\n  ScrollArea,\n  ScrollAreaContent,\n  ScrollAreaCorner,\n  ScrollAreaThumb,\n  ScrollAreaViewport,\n  ScrollBar,\n};\n\nexport type { ScrollBarProps } from \"./scroll-bar\";\nexport type { ScrollAreaContentProps } from \"./scroll-content\";\nexport type { ScrollAreaCornerProps } from \"./scroll-corner\";\nexport type { ScrollAreaThumbProps } from \"./scroll-thumb\";\nexport type { ScrollAreaViewportProps } from \"./scroll-viewport\";\n"],"mappings":";;;;;;;AAKA,MAAM,qBAAqB,EAAE,WAAW,GAAG,YACzC,oBAACA,aAAoB;CACnB,WAAW,qBACT,QACA,UACD;CACD,aAAU;CACV,GAAI;EACJ;;;;ACRJ,MAAM,oBAAoB,EAAE,WAAW,GAAG,YACxC,oBAACC,aAAoB;CACnB,WAAW,qBACT,QACA,UACD;CACD,aAAU;CACV,GAAI;EACJ;;;;ACRJ,MAAM,sBAAsB,EAC1B,WACA,GAAG,YAEH,oBAACC,aAAoB;CACnB,WAAW,qBACT,sJACA,UACD;CACD,aAAU;CACV,GAAI;EACJ;;;;ACLJ,MAAM,cAAc,EAAE,WAAW,UAAU,GAAG,YAC5C,oBAACC,aAAoB;CACnB,WAAW,qBACT,YACA,UACD;CACD,aAAU;CACV,GAAI;WAEH,SAAS,QAAQ,SAAS,CAAC,MAAM,UAAU;AAC1C,MAAI,CAAC,eAAe,MAAM,CACxB,QAAO;AAET,SACE,MAAM,SAASA,aAAoB,YACnC,MAAM,SAAS;GAEjB,GACA,WAEA;EACE,oBAAC,gCACC,oBAAC,qBAAmB,WAA6B,GAC9B;EACrB,oBAAC,cAAY;EACb,oBAAC,qBAAmB;KACnB;EAEoB;AAG7B,WAAW,MAAM;AACjB,WAAW,UAAU;AACrB,WAAW,SAAS;AACpB,WAAW,YAAY;AACvB,WAAW,QAAQ;AACnB,WAAW,WAAW"}