@orvui/vue 0.0.0-stage → 0.1.0

package/dist/color-picker-oBOAYuFD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-picker-oBOAYuFD.js","names":["$attrs","_openBlock","_createBlock","_unref","_normalizeStyle","_withCtx","_createElementVNode","_mergeProps","_createVNode","_createCommentVNode","_sfc_main","_openBlock","_createBlock","_unref","_normalizeClass","_normalizeStyle","_withCtx","_createCommentVNode","_createElementVNode","_createVNode","ColorThumb","_sfc_main","_openBlock","_createElementBlock","_normalizeClass","_unref","_normalizeStyle","_createElementVNode","_createVNode","ColorThumb","_sfc_main","_openBlock","_createBlock","ChannelSlider","_unref","_sfc_main","_unref","_openBlock","_createBlock","ChannelSlider","_createCommentVNode","_sfc_main","$attrs","_hoisted_1","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_mergeProps","_unref","_withKeys","_withModifiers","_sfc_main","_openBlock","_createElementBlock","_normalizeStyle","_unref","_createElementVNode","_sfc_main","_hoisted_1","_hoisted_2","_hoisted_3","_openBlock","_createElementBlock","_normalizeClass","_renderSlot","_createVNode","ColorPickerArea","ColorPickerHue","ColorPickerAlpha","_createElementVNode","ColorPickerSwatch","ColorPickerHexInput","_createCommentVNode","_sfc_main","_hoisted_1","_hoisted_2","_openBlock","_createElementBlock","_Fragment","_renderList","_createElementVNode","_unref","_toDisplayString","_sfc_main","_openBlock","_createBlock","_unref","_withCtx","_renderSlot","_createVNode","_createCommentVNode","_sfc_main","_openBlock","_createElementBlock","_createBlock","_unref","_normalizeStyle","_createCommentVNode","_renderSlot","_sfc_main","_hoisted_1","_openBlock","_createBlock","_unref","_withCtx","_createElementBlock","_createCommentVNode","_createElementVNode","_normalizeStyle","_sfc_main","_openBlock","_createElementBlock","_unref","_createElementVNode","_createBlock","_normalizeStyle","_withCtx","_createCommentVNode","_renderSlot","_createVNode","_createTextVNode","_toDisplayString","_sfc_main","ColorPickerArea","_sfc_main","useFloatingLayer","useReducedMotion","resolveElement","SPRING_GLIDE","SPRING_PRESS","SPRING_LAYOUT","EASE_OUT","cn","hsvaToRgba","brightness","color","chroma","sector","secondary","channels","floor","r","g","b","channel","rgbaToHsva","light","span","hue","previous","dominant","parseHex","digits","input","bytes","digit","pair","formatHex","components","component","hsvToHsl","value","lightness","range","hslToHsv","l","s","CHECKERBOARD","COLOR_MORPH","usePicker","state","inject","useGlide","reduced","source","motionValue","target","spring","useSpring","offset","useTransform","watch","onBeforeUnmount","useColorDrag","rail","ref","thumb","dragging","contact","clamp","sample","box","onPoint","event","release","down","disabled","element","move","end","onEnd","blocked","keyStep","big","ColorThumb_default","defineComponent","props","__props","velocity","useVelocity","leaning","tilt","lifted","computed","openBlock","createBlock","unref","motion","normalizeStyle","withCtx","createElementVNode","mergeProps","_ctx","node","createVNode","AnimatePresence","createCommentVNode","ColorPickerArea_default","morph","morphing","drag","saturation","darkness","horizontal","vertical","rgb","key","step","normalizeClass","_cache","ChannelSlider_default","__emit","emit","fraction","glide","createElementBlock","args","ColorPickerHue_default","change","ColorPickerAlpha_default","percent","_hoisted_1$4","ColorPickerHexInput_default","draft","root","feedback","settle","parsed","animate","text","withKeys","withModifiers","ColorPickerSwatch_default","_hoisted_1$3","_hoisted_2$2","_hoisted_3$1","ColorPicker_default","id","useId","supplied","draftCode","editing","expanded","anchor","open","next","reconcile","incoming","displayHsva","rgba","hex","update","limits","patch","code","changed","commit","setColor","provide","renderSlot","_hoisted_1$2","_hoisted_2$1","_hoisted_3","ColorPickerChannels_default","hsv","hsl","result","name","max","drafts","delta","Fragment","renderList","$event","toDisplayString","ColorPickerEyeDropper_default","supported","request","disposed","pick","controller","Pipette","createPresetArc","curvature","to","from","horizontalTravel","bend","normalX","normalY","side","bow","progress","ColorPickerPresets_default","visible","x","y","width","height","entries","arc","animation","observer","revision","measure","container","selected","left","top","curve","point","phase","schedule","version","nextTick","onMounted","_hoisted_1$1","ColorPickerPreset_default","normalized","group","detach","synchronize","choose","_hoisted_1","_hoisted_2","ColorPickerTrigger_default","alpha","toggle","createTextVNode","flatten","nodes","ColorPickerContent_default","panel","layer","position","outside","escape","opened","active","rows","ordinal","slots","child","delay","h","index","attrs","useColorPicker"],"sources":["../src/motion/color-picker/src/color.ts","../src/motion/color-picker/src/context.ts","../src/motion/color-picker/src/ColorThumb.vue","../src/motion/color-picker/src/ColorThumb.vue","../src/motion/color-picker/src/ColorPickerArea.vue","../src/motion/color-picker/src/ColorPickerArea.vue","../src/motion/color-picker/src/ChannelSlider.vue","../src/motion/color-picker/src/ChannelSlider.vue","../src/motion/color-picker/src/ColorPickerHue.vue","../src/motion/color-picker/src/ColorPickerHue.vue","../src/motion/color-picker/src/ColorPickerAlpha.vue","../src/motion/color-picker/src/ColorPickerAlpha.vue","../src/motion/color-picker/src/ColorPickerHexInput.vue","../src/motion/color-picker/src/ColorPickerHexInput.vue","../src/motion/color-picker/src/ColorPickerSwatch.vue","../src/motion/color-picker/src/ColorPickerSwatch.vue","../src/motion/color-picker/src/ColorPicker.vue","../src/motion/color-picker/src/ColorPicker.vue","../src/motion/color-picker/src/ColorPickerChannels.vue","../src/motion/color-picker/src/ColorPickerChannels.vue","../src/motion/color-picker/src/ColorPickerEyeDropper.vue","../src/motion/color-picker/src/ColorPickerEyeDropper.vue","../src/motion/color-picker/src/preset-motion.ts","../src/motion/color-picker/src/ColorPickerPresets.vue","../src/motion/color-picker/src/ColorPickerPresets.vue","../src/motion/color-picker/src/ColorPickerPreset.vue","../src/motion/color-picker/src/ColorPickerPreset.vue","../src/motion/color-picker/src/ColorPickerTrigger.vue","../src/motion/color-picker/src/ColorPickerTrigger.vue","../src/motion/color-picker/src/ColorPickerContent.vue","../src/motion/color-picker/src/ColorPickerContent.vue","../src/motion/color-picker/src/useColorPicker.ts"],"sourcesContent":["/** Hue in degrees, saturation/value in percent, and opacity in [0, 1]. */\nexport type Hsva = { h: number; s: number; v: number; a: number };\n/** Red, green and blue in [0, 255], and opacity in [0, 1]. */\nexport type Rgba = { r: number; g: number; b: number; a: number };\n\nexport function hsvaToRgba(color: Hsva): Rgba {\n  const brightness = color.v / 100;\n  const chroma = brightness * color.s / 100;\n  const sector = ((color.h % 360) + 360) % 360 / 60;\n  const secondary = chroma * (1 - Math.abs(sector % 2 - 1));\n  const channels = sector < 1 ? [chroma, secondary, 0]\n    : sector < 2 ? [secondary, chroma, 0]\n    : sector < 3 ? [0, chroma, secondary]\n    : sector < 4 ? [0, secondary, chroma]\n    : sector < 5 ? [secondary, 0, chroma] : [chroma, 0, secondary];\n  const floor = brightness - chroma;\n  const [r, g, b] = channels.map(channel => Math.round((channel + floor) * 255));\n  return { r: r!, g: g!, b: b!, a: color.a };\n}\n\n/** Achromatic colors retain the otherwise unrepresentable editing channels. */\nexport function rgbaToHsva(color: Rgba, previous?: Hsva): Hsva {\n  const channels = [color.r, color.g, color.b];\n  const light = Math.max(...channels), dark = Math.min(...channels), span = light - dark;\n  let hue = previous?.h ?? 0;\n  if (span > 0) {\n    const dominant = channels.indexOf(light);\n    const angles = [\n      (color.g - color.b) / span,\n      (color.b - color.r) / span + 2,\n      (color.r - color.g) / span + 4,\n    ];\n    hue = (angles[dominant]! * 60 + 360) % 360;\n  }\n  return {\n    h: hue,\n    s: light === 0 ? (previous?.s ?? 0) : 100 * span / light,\n    v: 100 * light / 255,\n    a: color.a,\n  };\n}\n\nexport function parseHex(input: string): Rgba | null {\n  const digits = input.trim().replace(/^#/, \"\");\n  if (![3, 4, 6, 8].includes(digits.length) || /[^0-9a-f]/i.test(digits)) return null;\n  const expanded = digits.length < 5 ? Array.from(digits, digit => digit.repeat(2)).join(\"\") : digits;\n  const bytes = expanded.match(/../g)!.map(pair => Number.parseInt(pair, 16));\n  return { r: bytes[0]!, g: bytes[1]!, b: bytes[2]!, a: bytes.length === 4 ? Math.round(bytes[3]! / 255 * 100) / 100 : 1 };\n}\n\nexport function formatHex(color: Rgba): string {\n  const components = [color.r, color.g, color.b];\n  if (color.a < 1) components.push(color.a * 255);\n  return \"#\" + components.map(component => Math.round(component).toString(16).padStart(2, \"0\")).join(\"\");\n}\n\nexport function hsvToHsl(color: Hsva) {\n  const value = color.v / 100;\n  const low = value * (1 - color.s / 100);\n  const lightness = (value + low) / 2;\n  const range = Math.min(lightness, 1 - lightness);\n  return { h: color.h, s: range === 0 ? 0 : 100 * (value - lightness) / range, l: 100 * lightness };\n}\n\nexport function hslToHsv(h: number, s: number, l: number, previous: Hsva, a: number): Hsva {\n  const lightness = l / 100;\n  const chroma = (1 - Math.abs(2 * lightness - 1)) * s / 100;\n  const value = lightness + chroma / 2;\n  return { h, s: value === 0 ? previous.s : chroma / value * 100, v: value * 100, a };\n}\n","import { computed, inject, onBeforeUnmount, ref, watch, type Ref } from \"vue\";\nimport { motionValue, useSpring, useTransform } from \"motion-v\";\nimport { useReducedMotion, resolveElement } from \"../../../lib/composables\";\nimport { SPRING_GLIDE } from \"../../../lib/ease\";\nimport type { Hsva, Rgba } from \"./color\";\nexport const CHECKERBOARD =\n  \"repeating-conic-gradient(#d4d4d8 0% 25%, #fafafa 0% 50%) 0 0 / 8px 8px\";\nexport const COLOR_MORPH = {\n  type: \"spring\",\n  duration: 0.5,\n  bounce: 0.2,\n} as const;\nexport interface ColorContext {\n  id: string;\n  hsva: Ref<Hsva>;\n  rgba: Ref<Rgba>;\n  hex: Ref<string>;\n  open: Ref<boolean>;\n  anchor: Ref<HTMLElement | null>;\n  alpha: Ref<boolean>;\n  disabled: Ref<boolean>;\n  update: (next: Partial<Hsva>) => void;\n  setColor: (value: string) => void;\n  commit: () => void;\n}\nexport function usePicker() {\n  const state = inject<ColorContext>(\"orvui-color-picker\");\n  if (!state) throw Error(\"Color picker parts must be inside ColorPicker\");\n  return state;\n}\nexport function useGlide(target: Ref<number>) {\n  const reduced = useReducedMotion();\n  const source = motionValue(target.value);\n  const spring = useSpring(source, SPRING_GLIDE);\n  const offset = useTransform(spring, (value) => `${value}%`);\n  watch(\n    [target, reduced],\n    ([value, reduced]) => {\n      if (reduced) {\n        source.jump(value);\n        spring.jump(value);\n      } else source.set(value);\n    },\n    { immediate: true },\n  );\n  onBeforeUnmount(() => {\n    offset.destroy();\n    spring.destroy();\n    source.destroy();\n  });\n  return { spring, offset };\n}\nexport function useColorDrag(\n  onPoint: (x: number, y: number) => void,\n  onEnd: () => void,\n  disabled: Ref<boolean>,\n) {\n  const rail = ref<unknown>(null);\n  const thumb = ref<HTMLElement | null>(null);\n  const dragging = ref(false);\n  let contact: { id: number; element: HTMLElement } | undefined;\n  const clamp = (value: number) => Math.min(1, Math.max(0, value));\n  function sample(event: PointerEvent) {\n    const box = resolveElement<HTMLElement>(\n      rail.value,\n    )?.getBoundingClientRect();\n    if (box?.width && box.height)\n      onPoint(\n        clamp((event.clientX - box.left) / box.width),\n        clamp((event.clientY - box.top) / box.height),\n      );\n  }\n  function release() {\n    const previous = contact;\n    contact = undefined;\n    dragging.value = false;\n    if (previous)\n      try {\n        previous.element.releasePointerCapture(previous.id);\n      } catch {\n        /* Capture may already be lost. */\n      }\n  }\n  function down(event: PointerEvent) {\n    if (disabled.value || event.button !== 0 || contact) return;\n    const element = event.currentTarget as HTMLElement;\n    contact = { id: event.pointerId, element };\n    dragging.value = true;\n    try {\n      element.setPointerCapture(event.pointerId);\n    } catch {\n      /* Synthetic pointer event. */\n    }\n    thumb.value?.focus({ preventScroll: true });\n    sample(event);\n  }\n  function move(event: PointerEvent) {\n    if (!disabled.value && contact?.id === event.pointerId) sample(event);\n  }\n  function end(event: PointerEvent) {\n    if (contact?.id !== event.pointerId) return;\n    release();\n    if (!disabled.value) onEnd();\n  }\n  watch(disabled, (blocked) => {\n    if (blocked) release();\n  });\n  onBeforeUnmount(release);\n  return { rail, thumb, dragging, down, move, end };\n}\nexport function keyStep(\n  event: KeyboardEvent,\n  big = 10,\n): { axis: \"x\" | \"y\"; delta: number } | \"min\" | \"max\" | null {\n  if (event.key === \"Home\") return \"min\";\n  if (event.key === \"End\") return \"max\";\n  const move = (\n    {\n      ArrowRight: [\"x\", 1],\n      ArrowLeft: [\"x\", -1],\n      ArrowUp: [\"y\", 1],\n      ArrowDown: [\"y\", -1],\n      PageUp: [\"y\", 1],\n      PageDown: [\"y\", -1],\n    } as const\n  )[event.key as \"ArrowRight\"];\n  return move\n    ? {\n        axis: move[0],\n        delta:\n          move[1] * (event.shiftKey || event.key.startsWith(\"Page\") ? big : 1),\n      }\n    : null;\n}\n","<script setup lang=\"ts\">\ndefineOptions({ inheritAttrs: false });\nimport { computed, onBeforeUnmount } from \"vue\";\nimport {\n  motion,\n  AnimatePresence,\n  useVelocity,\n  useSpring,\n  useTransform,\n  type MotionValue,\n} from \"motion-v\";\nimport { SPRING_PRESS, EASE_OUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { CHECKERBOARD } from \"./context\";\nconst props = defineProps<{\n  dragging: boolean;\n  color: string;\n  glide: MotionValue<number>;\n  x: MotionValue<string>;\n  y?: MotionValue<string>;\n  setThumb?: (node: HTMLElement | null) => void;\n}>();\nconst reduced = useReducedMotion();\nconst velocity = useVelocity(props.glide);\nconst leaning = useTransform(velocity, (value) =>\n  Math.max(-16, Math.min(16, -value * 0.04)),\n);\nconst tilt = useSpring(leaning, SPRING_PRESS);\nconst lifted = computed(() => props.dragging && !reduced.value);\nonBeforeUnmount(() => {\n  tilt.destroy();\n  leaning.destroy();\n  velocity.destroy();\n});\n</script>\n<template>\n  <motion.div class=\"pointer-events-none absolute inset-0\" :style=\"y ? { x, y } : { x }\"\n    ><div\n      v-bind=\"$attrs\"\n      :ref=\"(node) => setThumb?.(node as HTMLElement | null)\"\n      :class=\"[\n        'absolute left-0 size-[18px] -translate-x-1/2 -translate-y-1/2 rounded-full outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-foreground',\n        y ? 'top-0' : 'top-1/2',\n      ]\"\n    >\n      <motion.span\n        aria-hidden=\"true\"\n        :animate=\"{ scale: lifted ? 0.78 : 1 }\"\n        :transition=\"SPRING_PRESS\"\n        class=\"block size-full rounded-full border-[2px] border-white shadow-[0_0_0_1px_rgb(0_0_0/0.12),0_2px_6px_rgb(0_0_0/0.25)]\"\n        :style=\"{ backgroundColor: color }\"\n      /><AnimatePresence\n        ><motion.span\n          v-if=\"lifted\"\n          aria-hidden=\"true\"\n          data-color-picker-loupe=\"\"\n          class=\"pointer-events-none absolute bottom-[calc(100%+12px)] left-1/2 z-10 -ml-5 block size-10\"\n          :style=\"{ rotate: tilt, originX: 0.5, originY: 1.3 }\"\n          :initial=\"{ opacity: 0, scale: 0.3, y: 16 }\"\n          :animate=\"{\n            opacity: 1,\n            scale: 1,\n            y: 0,\n            transition: {\n              type: 'spring',\n              stiffness: 520,\n              damping: 24,\n              mass: 0.6,\n            },\n          }\"\n          :exit=\"{\n            opacity: 0,\n            scale: 0.3,\n            y: 16,\n            transition: { duration: 0.12, ease: EASE_OUT },\n          }\"\n          ><span\n            class=\"absolute inset-0 -rotate-45 overflow-hidden rounded-[50%_50%_50%_0] border-[3px] border-white shadow-[0_0_0_1px_rgb(0_0_0/0.1),0_6px_16px_rgb(0_0_0/0.28)]\"\n            :style=\"{ background: CHECKERBOARD }\"\n            ><span\n              class=\"absolute inset-0\"\n              :style=\"{ background: color }\" /></span></motion.span\n      ></AnimatePresence></div\n  ></motion.div>\n</template>\n","<script setup lang=\"ts\">\ndefineOptions({ inheritAttrs: false });\nimport { computed, onBeforeUnmount } from \"vue\";\nimport {\n  motion,\n  AnimatePresence,\n  useVelocity,\n  useSpring,\n  useTransform,\n  type MotionValue,\n} from \"motion-v\";\nimport { SPRING_PRESS, EASE_OUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { CHECKERBOARD } from \"./context\";\nconst props = defineProps<{\n  dragging: boolean;\n  color: string;\n  glide: MotionValue<number>;\n  x: MotionValue<string>;\n  y?: MotionValue<string>;\n  setThumb?: (node: HTMLElement | null) => void;\n}>();\nconst reduced = useReducedMotion();\nconst velocity = useVelocity(props.glide);\nconst leaning = useTransform(velocity, (value) =>\n  Math.max(-16, Math.min(16, -value * 0.04)),\n);\nconst tilt = useSpring(leaning, SPRING_PRESS);\nconst lifted = computed(() => props.dragging && !reduced.value);\nonBeforeUnmount(() => {\n  tilt.destroy();\n  leaning.destroy();\n  velocity.destroy();\n});\n</script>\n<template>\n  <motion.div class=\"pointer-events-none absolute inset-0\" :style=\"y ? { x, y } : { x }\"\n    ><div\n      v-bind=\"$attrs\"\n      :ref=\"(node) => setThumb?.(node as HTMLElement | null)\"\n      :class=\"[\n        'absolute left-0 size-[18px] -translate-x-1/2 -translate-y-1/2 rounded-full outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-foreground',\n        y ? 'top-0' : 'top-1/2',\n      ]\"\n    >\n      <motion.span\n        aria-hidden=\"true\"\n        :animate=\"{ scale: lifted ? 0.78 : 1 }\"\n        :transition=\"SPRING_PRESS\"\n        class=\"block size-full rounded-full border-[2px] border-white shadow-[0_0_0_1px_rgb(0_0_0/0.12),0_2px_6px_rgb(0_0_0/0.25)]\"\n        :style=\"{ backgroundColor: color }\"\n      /><AnimatePresence\n        ><motion.span\n          v-if=\"lifted\"\n          aria-hidden=\"true\"\n          data-color-picker-loupe=\"\"\n          class=\"pointer-events-none absolute bottom-[calc(100%+12px)] left-1/2 z-10 -ml-5 block size-10\"\n          :style=\"{ rotate: tilt, originX: 0.5, originY: 1.3 }\"\n          :initial=\"{ opacity: 0, scale: 0.3, y: 16 }\"\n          :animate=\"{\n            opacity: 1,\n            scale: 1,\n            y: 0,\n            transition: {\n              type: 'spring',\n              stiffness: 520,\n              damping: 24,\n              mass: 0.6,\n            },\n          }\"\n          :exit=\"{\n            opacity: 0,\n            scale: 0.3,\n            y: 16,\n            transition: { duration: 0.12, ease: EASE_OUT },\n          }\"\n          ><span\n            class=\"absolute inset-0 -rotate-45 overflow-hidden rounded-[50%_50%_50%_0] border-[3px] border-white shadow-[0_0_0_1px_rgb(0_0_0/0.1),0_6px_16px_rgb(0_0_0/0.28)]\"\n            :style=\"{ background: CHECKERBOARD }\"\n            ><span\n              class=\"absolute inset-0\"\n              :style=\"{ background: color }\" /></span></motion.span\n      ></AnimatePresence></div\n  ></motion.div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { EASE_OUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport {\n  usePicker,\n  useGlide,\n  useColorDrag,\n  keyStep,\n  COLOR_MORPH,\n} from \"./context\";\nimport ColorThumb from \"./ColorThumb.vue\";\nwithDefaults(defineProps<{ label?: string }>(), {\n  label: \"Saturation and brightness\",\n});\nconst state = usePicker();\nconst morph = inject(\"orvui-color-morph\", false);\nconst reduced = useReducedMotion();\nconst morphing = computed(() => morph && !reduced.value);\nconst drag = useColorDrag(\n  (saturation, darkness) =>\n    state.update({ s: saturation * 100, v: 100 - darkness * 100 }),\n  state.commit,\n  state.disabled,\n);\nconst rail = drag.rail;\nconst horizontal = useGlide(computed(() => state.hsva.value.s));\nconst vertical = useGlide(computed(() => 100 - state.hsva.value.v));\nconst rgb = computed(\n  () =>\n    `rgb(${state.rgba.value.r} ${state.rgba.value.g} ${state.rgba.value.b})`,\n);\nfunction key(event: KeyboardEvent) {\n  const step = keyStep(event);\n  if (!step || state.disabled.value) return;\n  event.preventDefault();\n  state.update(\n    step === \"min\"\n      ? { s: 0 }\n      : step === \"max\"\n        ? { s: 100 }\n        : step.axis === \"x\"\n          ? { s: state.hsva.value.s + step.delta }\n          : { v: state.hsva.value.v + step.delta },\n  );\n  state.commit();\n}\n</script>\n<template>\n  <motion.div\n    ref=\"rail\"\n    :layout-id=\"morphing ? `${state.id}-chip` : undefined\"\n    :layout-dependency=\"state.open.value\"\n    :transition=\"COLOR_MORPH\"\n    :class=\"[\n      'relative h-40 w-full touch-none select-none',\n      state.disabled.value ? 'cursor-not-allowed' : 'cursor-crosshair',\n    ]\"\n    :style=\"{\n      borderRadius: '12px',\n      background: `linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, hsl(${state.hsva.value.h} 100% 50%))`,\n    }\"\n    @pointerdown=\"drag.down\"\n    @pointermove=\"drag.move\"\n    @pointerup=\"drag.end\"\n    @pointercancel=\"drag.end\"\n    ><motion.div\n      v-if=\"morphing\"\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute inset-0 rounded-[inherit]\"\n      :style=\"{ backgroundColor: state.hex.value }\"\n      :initial=\"{ opacity: 1 }\"\n      :animate=\"{ opacity: 0 }\"\n      :transition=\"{ duration: 0.4, ease: EASE_OUT, delay: 0.06 }\" />\n    <div\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute inset-0 rounded-[inherit] ring-1 ring-black/10 ring-inset\" />\n    <motion.div\n      class=\"absolute inset-0\"\n      :initial=\"morphing ? { opacity: 0 } : false\"\n      :animate=\"{ opacity: 1 }\"\n      :transition=\"{ duration: 0.2, delay: 0.22 }\"\n      ><ColorThumb\n        :dragging=\"drag.dragging.value\"\n        :color=\"rgb\"\n        :glide=\"horizontal.spring\"\n        :x=\"horizontal.offset\"\n        :y=\"vertical.offset\"\n        :set-thumb=\"(node) => (drag.thumb.value = node)\"\n        role=\"slider\"\n        :tabindex=\"state.disabled.value ? -1 : 0\"\n        :aria-label=\"label\"\n        aria-roledescription=\"2D slider\"\n        :aria-valuemin=\"0\"\n        :aria-valuemax=\"100\"\n        :aria-valuenow=\"Math.round(state.hsva.value.s)\"\n        :aria-valuetext=\"`Saturation ${Math.round(state.hsva.value.s)}%, brightness ${Math.round(state.hsva.value.v)}%`\"\n        :aria-disabled=\"state.disabled.value || undefined\"\n        @keydown=\"key\" /></motion.div\n  ></motion.div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { EASE_OUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport {\n  usePicker,\n  useGlide,\n  useColorDrag,\n  keyStep,\n  COLOR_MORPH,\n} from \"./context\";\nimport ColorThumb from \"./ColorThumb.vue\";\nwithDefaults(defineProps<{ label?: string }>(), {\n  label: \"Saturation and brightness\",\n});\nconst state = usePicker();\nconst morph = inject(\"orvui-color-morph\", false);\nconst reduced = useReducedMotion();\nconst morphing = computed(() => morph && !reduced.value);\nconst drag = useColorDrag(\n  (saturation, darkness) =>\n    state.update({ s: saturation * 100, v: 100 - darkness * 100 }),\n  state.commit,\n  state.disabled,\n);\nconst rail = drag.rail;\nconst horizontal = useGlide(computed(() => state.hsva.value.s));\nconst vertical = useGlide(computed(() => 100 - state.hsva.value.v));\nconst rgb = computed(\n  () =>\n    `rgb(${state.rgba.value.r} ${state.rgba.value.g} ${state.rgba.value.b})`,\n);\nfunction key(event: KeyboardEvent) {\n  const step = keyStep(event);\n  if (!step || state.disabled.value) return;\n  event.preventDefault();\n  state.update(\n    step === \"min\"\n      ? { s: 0 }\n      : step === \"max\"\n        ? { s: 100 }\n        : step.axis === \"x\"\n          ? { s: state.hsva.value.s + step.delta }\n          : { v: state.hsva.value.v + step.delta },\n  );\n  state.commit();\n}\n</script>\n<template>\n  <motion.div\n    ref=\"rail\"\n    :layout-id=\"morphing ? `${state.id}-chip` : undefined\"\n    :layout-dependency=\"state.open.value\"\n    :transition=\"COLOR_MORPH\"\n    :class=\"[\n      'relative h-40 w-full touch-none select-none',\n      state.disabled.value ? 'cursor-not-allowed' : 'cursor-crosshair',\n    ]\"\n    :style=\"{\n      borderRadius: '12px',\n      background: `linear-gradient(to top, #000, transparent), linear-gradient(to right, #fff, hsl(${state.hsva.value.h} 100% 50%))`,\n    }\"\n    @pointerdown=\"drag.down\"\n    @pointermove=\"drag.move\"\n    @pointerup=\"drag.end\"\n    @pointercancel=\"drag.end\"\n    ><motion.div\n      v-if=\"morphing\"\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute inset-0 rounded-[inherit]\"\n      :style=\"{ backgroundColor: state.hex.value }\"\n      :initial=\"{ opacity: 1 }\"\n      :animate=\"{ opacity: 0 }\"\n      :transition=\"{ duration: 0.4, ease: EASE_OUT, delay: 0.06 }\" />\n    <div\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute inset-0 rounded-[inherit] ring-1 ring-black/10 ring-inset\" />\n    <motion.div\n      class=\"absolute inset-0\"\n      :initial=\"morphing ? { opacity: 0 } : false\"\n      :animate=\"{ opacity: 1 }\"\n      :transition=\"{ duration: 0.2, delay: 0.22 }\"\n      ><ColorThumb\n        :dragging=\"drag.dragging.value\"\n        :color=\"rgb\"\n        :glide=\"horizontal.spring\"\n        :x=\"horizontal.offset\"\n        :y=\"vertical.offset\"\n        :set-thumb=\"(node) => (drag.thumb.value = node)\"\n        role=\"slider\"\n        :tabindex=\"state.disabled.value ? -1 : 0\"\n        :aria-label=\"label\"\n        aria-roledescription=\"2D slider\"\n        :aria-valuemin=\"0\"\n        :aria-valuemax=\"100\"\n        :aria-valuenow=\"Math.round(state.hsva.value.s)\"\n        :aria-valuetext=\"`Saturation ${Math.round(state.hsva.value.s)}%, brightness ${Math.round(state.hsva.value.v)}%`\"\n        :aria-disabled=\"state.disabled.value || undefined\"\n        @keydown=\"key\" /></motion.div\n  ></motion.div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { usePicker, useGlide, useColorDrag, keyStep } from \"./context\";\nimport ColorThumb from \"./ColorThumb.vue\";\nconst props = defineProps<{\n  value: number;\n  max: number;\n  label: string;\n  valueText: string;\n  background: string;\n  thumbColor: string;\n}>();\nconst emit = defineEmits<{ value: [value: number] }>();\nconst state = usePicker();\nconst drag = useColorDrag(\n  (fraction) => emit(\"value\", fraction * props.max),\n  state.commit,\n  state.disabled,\n);\nconst rail = drag.rail;\nconst glide = useGlide(computed(() => (props.value / props.max) * 100));\nfunction key(event: KeyboardEvent) {\n  const step = keyStep(event);\n  if (state.disabled.value || !step) return;\n  event.preventDefault();\n  emit(\n    \"value\",\n    step === \"min\"\n      ? 0\n      : step === \"max\"\n        ? props.max\n        : Math.round(props.value) + step.delta,\n  );\n  state.commit();\n}\n</script>\n<template>\n  <div\n    :class=\"[\n      'relative h-3.5 w-full touch-none select-none rounded-full',\n      state.disabled.value ? 'cursor-not-allowed' : 'cursor-pointer',\n    ]\"\n    :style=\"{ background }\"\n    @pointerdown=\"drag.down\"\n    @pointermove=\"drag.move\"\n    @pointerup=\"drag.end\"\n    @pointercancel=\"drag.end\"\n  >\n    <div\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute inset-0 rounded-full ring-1 ring-black/10 ring-inset\"\n    />\n    <div ref=\"rail\" class=\"absolute inset-y-0 right-[9px] left-[9px]\">\n      <ColorThumb\n        :dragging=\"drag.dragging.value\"\n        :color=\"thumbColor\"\n        :glide=\"glide.spring\"\n        :x=\"glide.offset\"\n        :set-thumb=\"(node) => (drag.thumb.value = node)\"\n        role=\"slider\"\n        :tabindex=\"state.disabled.value ? -1 : 0\"\n        :aria-label=\"label\"\n        aria-orientation=\"horizontal\"\n        :aria-valuemin=\"0\"\n        :aria-valuemax=\"max\"\n        :aria-valuenow=\"Math.round(value)\"\n        :aria-valuetext=\"valueText\"\n        :aria-disabled=\"state.disabled.value || undefined\"\n        @keydown=\"key\"\n      />\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { usePicker, useGlide, useColorDrag, keyStep } from \"./context\";\nimport ColorThumb from \"./ColorThumb.vue\";\nconst props = defineProps<{\n  value: number;\n  max: number;\n  label: string;\n  valueText: string;\n  background: string;\n  thumbColor: string;\n}>();\nconst emit = defineEmits<{ value: [value: number] }>();\nconst state = usePicker();\nconst drag = useColorDrag(\n  (fraction) => emit(\"value\", fraction * props.max),\n  state.commit,\n  state.disabled,\n);\nconst rail = drag.rail;\nconst glide = useGlide(computed(() => (props.value / props.max) * 100));\nfunction key(event: KeyboardEvent) {\n  const step = keyStep(event);\n  if (state.disabled.value || !step) return;\n  event.preventDefault();\n  emit(\n    \"value\",\n    step === \"min\"\n      ? 0\n      : step === \"max\"\n        ? props.max\n        : Math.round(props.value) + step.delta,\n  );\n  state.commit();\n}\n</script>\n<template>\n  <div\n    :class=\"[\n      'relative h-3.5 w-full touch-none select-none rounded-full',\n      state.disabled.value ? 'cursor-not-allowed' : 'cursor-pointer',\n    ]\"\n    :style=\"{ background }\"\n    @pointerdown=\"drag.down\"\n    @pointermove=\"drag.move\"\n    @pointerup=\"drag.end\"\n    @pointercancel=\"drag.end\"\n  >\n    <div\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute inset-0 rounded-full ring-1 ring-black/10 ring-inset\"\n    />\n    <div ref=\"rail\" class=\"absolute inset-y-0 right-[9px] left-[9px]\">\n      <ColorThumb\n        :dragging=\"drag.dragging.value\"\n        :color=\"thumbColor\"\n        :glide=\"glide.spring\"\n        :x=\"glide.offset\"\n        :set-thumb=\"(node) => (drag.thumb.value = node)\"\n        role=\"slider\"\n        :tabindex=\"state.disabled.value ? -1 : 0\"\n        :aria-label=\"label\"\n        aria-orientation=\"horizontal\"\n        :aria-valuemin=\"0\"\n        :aria-valuemax=\"max\"\n        :aria-valuenow=\"Math.round(value)\"\n        :aria-valuetext=\"valueText\"\n        :aria-disabled=\"state.disabled.value || undefined\"\n        @keydown=\"key\"\n      />\n    </div>\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { usePicker } from \"./context\";\nimport ChannelSlider from \"./ChannelSlider.vue\";\nwithDefaults(defineProps<{ label?: string }>(), { label: \"Hue\" });\nconst state = usePicker();\nfunction change(hue: number) {\n  state.update({ h: hue });\n}\n</script>\n<template>\n  <ChannelSlider\n    :value=\"state.hsva.value.h\"\n    :max=\"360\"\n    :label=\"label\"\n    :value-text=\"`${Math.round(state.hsva.value.h)} degrees`\"\n    background=\"linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)\"\n    :thumb-color=\"`hsl(${state.hsva.value.h} 100% 50%)`\"\n    @value=\"change\"\n  />\n</template>\n","<script setup lang=\"ts\">\nimport { usePicker } from \"./context\";\nimport ChannelSlider from \"./ChannelSlider.vue\";\nwithDefaults(defineProps<{ label?: string }>(), { label: \"Hue\" });\nconst state = usePicker();\nfunction change(hue: number) {\n  state.update({ h: hue });\n}\n</script>\n<template>\n  <ChannelSlider\n    :value=\"state.hsva.value.h\"\n    :max=\"360\"\n    :label=\"label\"\n    :value-text=\"`${Math.round(state.hsva.value.h)} degrees`\"\n    background=\"linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)\"\n    :thumb-color=\"`hsl(${state.hsva.value.h} 100% 50%)`\"\n    @value=\"change\"\n  />\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { usePicker, CHECKERBOARD } from \"./context\";\nimport ChannelSlider from \"./ChannelSlider.vue\";\nwithDefaults(defineProps<{ label?: string }>(), { label: \"Opacity\" });\nconst state = usePicker();\nconst rgb = computed(\n  () => `${state.rgba.value.r} ${state.rgba.value.g} ${state.rgba.value.b}`,\n);\nfunction change(percent: number) {\n  state.update({ a: Math.round(percent) / 100 });\n}\n</script>\n<template>\n  <ChannelSlider\n    v-if=\"state.alpha.value\"\n    :value=\"state.hsva.value.a * 100\"\n    :max=\"100\"\n    :label=\"label\"\n    :value-text=\"`${Math.round(state.hsva.value.a * 100)}%`\"\n    :background=\"`linear-gradient(to right, rgb(${rgb} / 0), rgb(${rgb})), ${CHECKERBOARD}`\"\n    :thumb-color=\"`rgb(${rgb} / ${state.hsva.value.a})`\"\n    @value=\"change\"\n  />\n</template>\n","<script setup lang=\"ts\">\nimport { computed } from \"vue\";\nimport { usePicker, CHECKERBOARD } from \"./context\";\nimport ChannelSlider from \"./ChannelSlider.vue\";\nwithDefaults(defineProps<{ label?: string }>(), { label: \"Opacity\" });\nconst state = usePicker();\nconst rgb = computed(\n  () => `${state.rgba.value.r} ${state.rgba.value.g} ${state.rgba.value.b}`,\n);\nfunction change(percent: number) {\n  state.update({ a: Math.round(percent) / 100 });\n}\n</script>\n<template>\n  <ChannelSlider\n    v-if=\"state.alpha.value\"\n    :value=\"state.hsva.value.a * 100\"\n    :max=\"100\"\n    :label=\"label\"\n    :value-text=\"`${Math.round(state.hsva.value.a * 100)}%`\"\n    :background=\"`linear-gradient(to right, rgb(${rgb} / 0), rgb(${rgb})), ${CHECKERBOARD}`\"\n    :thumb-color=\"`rgb(${rgb} / ${state.hsva.value.a})`\"\n    @value=\"change\"\n  />\n</template>\n","<script setup lang=\"ts\">\ndefineOptions({ inheritAttrs: false });\nimport { onBeforeUnmount, ref } from \"vue\";\nimport { animate } from \"motion-v\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { parseHex, rgbaToHsva } from \"./color\";\nimport { usePicker } from \"./context\";\nconst state = usePicker();\nconst draft = ref<string | null>(null);\nconst root = ref<HTMLElement | null>(null);\nconst reduced = useReducedMotion();\nlet feedback: ReturnType<typeof animate> | undefined;\nfunction settle() {\n  if (draft.value === null) return;\n  const parsed = parseHex(draft.value);\n  if (parsed) {\n    state.update(rgbaToHsva(parsed, state.hsva.value));\n    state.commit();\n  } else if (!reduced.value && root.value) {\n    feedback?.stop();\n    feedback = animate(\n      root.value,\n      { x: [0, -5, 5, -3, 3, 0] },\n      { duration: 0.3 },\n    );\n  }\n  draft.value = null;\n}\nfunction input(event: Event) {\n  const text = (event.target as HTMLInputElement).value.replace(/^#/, \"\");\n  draft.value = text;\n  if (text.length !== 6 && text.length !== 8) return;\n  const parsed = parseHex(text);\n  if (parsed) state.update(rgbaToHsva(parsed, state.hsva.value));\n}\nonBeforeUnmount(() => feedback?.stop());\n</script>\n<template>\n  <div ref=\"root\" :class=\"['relative min-w-0 flex-1', $attrs.class]\">\n    <span\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute top-1/2 left-3 -translate-y-1/2 text-sm text-muted-foreground\"\n      >#</span\n    ><input\n      v-bind=\"$attrs\"\n      type=\"text\"\n      inputmode=\"text\"\n      autocomplete=\"off\"\n      :spellcheck=\"false\"\n      :maxlength=\"9\"\n      :disabled=\"state.disabled.value\"\n      :aria-label=\"String($attrs['aria-label'] ?? 'Hex color')\"\n      :value=\"draft ?? state.hex.value.slice(1).toUpperCase()\"\n      @input=\"input\"\n      @blur=\"settle\"\n      @keydown.enter=\"settle\"\n      @keydown.esc.prevent=\"draft = null\"\n      class=\"h-9 w-full min-w-0 rounded-lg border border-border bg-background pr-3 pl-6 font-mono text-sm uppercase tabular-nums text-foreground outline-none transition-colors focus-visible:border-foreground/40 focus-visible:ring-2 focus-visible:ring-ring/30 disabled:cursor-not-allowed\"\n    />\n  </div>\n</template>\n","<script setup lang=\"ts\">\ndefineOptions({ inheritAttrs: false });\nimport { onBeforeUnmount, ref } from \"vue\";\nimport { animate } from \"motion-v\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { parseHex, rgbaToHsva } from \"./color\";\nimport { usePicker } from \"./context\";\nconst state = usePicker();\nconst draft = ref<string | null>(null);\nconst root = ref<HTMLElement | null>(null);\nconst reduced = useReducedMotion();\nlet feedback: ReturnType<typeof animate> | undefined;\nfunction settle() {\n  if (draft.value === null) return;\n  const parsed = parseHex(draft.value);\n  if (parsed) {\n    state.update(rgbaToHsva(parsed, state.hsva.value));\n    state.commit();\n  } else if (!reduced.value && root.value) {\n    feedback?.stop();\n    feedback = animate(\n      root.value,\n      { x: [0, -5, 5, -3, 3, 0] },\n      { duration: 0.3 },\n    );\n  }\n  draft.value = null;\n}\nfunction input(event: Event) {\n  const text = (event.target as HTMLInputElement).value.replace(/^#/, \"\");\n  draft.value = text;\n  if (text.length !== 6 && text.length !== 8) return;\n  const parsed = parseHex(text);\n  if (parsed) state.update(rgbaToHsva(parsed, state.hsva.value));\n}\nonBeforeUnmount(() => feedback?.stop());\n</script>\n<template>\n  <div ref=\"root\" :class=\"['relative min-w-0 flex-1', $attrs.class]\">\n    <span\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute top-1/2 left-3 -translate-y-1/2 text-sm text-muted-foreground\"\n      >#</span\n    ><input\n      v-bind=\"$attrs\"\n      type=\"text\"\n      inputmode=\"text\"\n      autocomplete=\"off\"\n      :spellcheck=\"false\"\n      :maxlength=\"9\"\n      :disabled=\"state.disabled.value\"\n      :aria-label=\"String($attrs['aria-label'] ?? 'Hex color')\"\n      :value=\"draft ?? state.hex.value.slice(1).toUpperCase()\"\n      @input=\"input\"\n      @blur=\"settle\"\n      @keydown.enter=\"settle\"\n      @keydown.esc.prevent=\"draft = null\"\n      class=\"h-9 w-full min-w-0 rounded-lg border border-border bg-background pr-3 pl-6 font-mono text-sm uppercase tabular-nums text-foreground outline-none transition-colors focus-visible:border-foreground/40 focus-visible:ring-2 focus-visible:ring-ring/30 disabled:cursor-not-allowed\"\n    />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { usePicker, CHECKERBOARD } from \"./context\";\nconst state = usePicker();\n</script>\n<template>\n  <span\n    aria-hidden=\"true\"\n    class=\"relative block size-9 shrink-0 overflow-hidden rounded-lg\"\n    :style=\"{ background: CHECKERBOARD }\"\n    ><span\n      class=\"absolute inset-0 rounded-[inherit] shadow-[inset_0_0_0_1px_rgb(0_0_0/0.1)] transition-colors duration-150\"\n      :style=\"{ backgroundColor: state.hex.value }\"\n  /></span>\n</template>\n","<script setup lang=\"ts\">\nimport { usePicker, CHECKERBOARD } from \"./context\";\nconst state = usePicker();\n</script>\n<template>\n  <span\n    aria-hidden=\"true\"\n    class=\"relative block size-9 shrink-0 overflow-hidden rounded-lg\"\n    :style=\"{ background: CHECKERBOARD }\"\n    ><span\n      class=\"absolute inset-0 rounded-[inherit] shadow-[inset_0_0_0_1px_rgb(0_0_0/0.1)] transition-colors duration-150\"\n      :style=\"{ backgroundColor: state.hex.value }\"\n  /></span>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, provide, ref, useId, watch } from \"vue\";\nimport {\n  parseHex,\n  formatHex,\n  rgbaToHsva,\n  hsvaToRgba,\n  type Hsva,\n} from \"./color\";\nimport type { ColorContext } from \"./context\";\nimport ColorPickerArea from \"./ColorPickerArea.vue\";\nimport ColorPickerHue from \"./ColorPickerHue.vue\";\nimport ColorPickerAlpha from \"./ColorPickerAlpha.vue\";\nimport ColorPickerHexInput from \"./ColorPickerHexInput.vue\";\nimport ColorPickerSwatch from \"./ColorPickerSwatch.vue\";\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    value?: string;\n    defaultValue?: string;\n    open?: boolean;\n    defaultOpen?: boolean;\n    alpha?: boolean;\n    disabled?: boolean;\n    name?: string;\n    form?: string;\n  }>(),\n  { open: undefined, defaultValue: \"#3478f6\", defaultOpen: false, alpha: true },\n);\nconst emit = defineEmits([\n  \"update:modelValue\",\n  \"valueChange\",\n  \"change\",\n  \"valueCommit\",\n  \"update:open\",\n  \"openChange\",\n]);\nconst id = useId();\nconst supplied = computed(() => props.modelValue ?? props.value);\nconst draftCode = ref(supplied.value ?? props.defaultValue);\nconst editing = ref(\n  rgbaToHsva(parseHex(draftCode.value) ?? { r: 0, g: 0, b: 0, a: 1 }),\n);\nconst expanded = ref(props.defaultOpen);\nconst anchor = ref<HTMLElement | null>(null);\nconst open = computed({\n  get: () => props.open ?? expanded.value,\n  set: (next: boolean) => {\n    if (next === open.value) return;\n    if (props.open === undefined) expanded.value = next;\n    emit(\"update:open\", next);\n    emit(\"openChange\", next);\n  },\n});\nfunction reconcile() {\n  const incoming = supplied.value;\n  if (incoming === undefined || incoming === draftCode.value) return;\n  const parsed = parseHex(incoming);\n  if (parsed) editing.value = rgbaToHsva(parsed, editing.value);\n  draftCode.value = incoming;\n}\nwatch(supplied, reconcile, { flush: \"sync\" });\nwatch(draftCode, reconcile, { flush: \"post\" });\nconst displayHsva = computed(() =>\n  !props.alpha && editing.value.a !== 1\n    ? { ...editing.value, a: 1 }\n    : editing.value,\n);\nconst rgba = computed(() => hsvaToRgba(displayHsva.value));\nconst hex = computed(() => formatHex(rgba.value));\nfunction update(patch: Partial<Hsva>) {\n  if (props.disabled) return;\n  const limits: Record<keyof Hsva, number> = { h: 360, s: 100, v: 100, a: 1 };\n  const next = Object.fromEntries(\n    (Object.keys(limits) as (keyof Hsva)[]).map((key) => [\n      key,\n      Math.min(\n        limits[key],\n        Math.max(\n          0,\n          Number.isFinite(patch[key]) ? patch[key]! : editing.value[key],\n        ),\n      ),\n    ]),\n  ) as Hsva;\n  if (!props.alpha) next.a = 1;\n  const code = formatHex(hsvaToRgba(next));\n  const changed = code !== hex.value;\n  editing.value = next;\n  draftCode.value = code;\n  if (changed) {\n    emit(\"update:modelValue\", code);\n    emit(\"valueChange\", code);\n    emit(\"change\", code);\n  }\n}\nfunction commit() {\n  if (!props.disabled) emit(\"valueCommit\", hex.value);\n}\nfunction setColor(code: string) {\n  const parsed = parseHex(code);\n  if (parsed) {\n    update(rgbaToHsva(parsed, editing.value));\n    commit();\n  }\n}\nprovide<ColorContext>(\"orvui-color-picker\", {\n  id,\n  hsva: displayHsva,\n  rgba,\n  hex,\n  open,\n  anchor,\n  alpha: computed(() => props.alpha),\n  disabled: computed(() => props.disabled),\n  update,\n  setColor,\n  commit,\n});\n</script>\n<template>\n  <fieldset\n    :disabled=\"disabled\"\n    :form=\"form\"\n    :class=\"[\n      'relative flex w-full min-w-0 max-w-72 flex-col gap-3 border-0 p-0 has-[>[data-color-picker-trigger]]:w-fit has-[>[data-color-picker-trigger]]:self-start',\n      disabled && 'opacity-50',\n    ]\"\n  >\n    <slot :hex=\"hex\" :hsva=\"displayHsva\" :set-color=\"setColor\"\n      ><ColorPickerArea /><ColorPickerHue /><ColorPickerAlpha />\n      <div class=\"flex gap-2\">\n        <ColorPickerSwatch /><ColorPickerHexInput /></div></slot\n    ><input v-if=\"name\" type=\"hidden\" :name=\"name\" :value=\"hex\" :form=\"form\" />\n  </fieldset>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, provide, ref, useId, watch } from \"vue\";\nimport {\n  parseHex,\n  formatHex,\n  rgbaToHsva,\n  hsvaToRgba,\n  type Hsva,\n} from \"./color\";\nimport type { ColorContext } from \"./context\";\nimport ColorPickerArea from \"./ColorPickerArea.vue\";\nimport ColorPickerHue from \"./ColorPickerHue.vue\";\nimport ColorPickerAlpha from \"./ColorPickerAlpha.vue\";\nimport ColorPickerHexInput from \"./ColorPickerHexInput.vue\";\nimport ColorPickerSwatch from \"./ColorPickerSwatch.vue\";\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string;\n    value?: string;\n    defaultValue?: string;\n    open?: boolean;\n    defaultOpen?: boolean;\n    alpha?: boolean;\n    disabled?: boolean;\n    name?: string;\n    form?: string;\n  }>(),\n  { open: undefined, defaultValue: \"#3478f6\", defaultOpen: false, alpha: true },\n);\nconst emit = defineEmits([\n  \"update:modelValue\",\n  \"valueChange\",\n  \"change\",\n  \"valueCommit\",\n  \"update:open\",\n  \"openChange\",\n]);\nconst id = useId();\nconst supplied = computed(() => props.modelValue ?? props.value);\nconst draftCode = ref(supplied.value ?? props.defaultValue);\nconst editing = ref(\n  rgbaToHsva(parseHex(draftCode.value) ?? { r: 0, g: 0, b: 0, a: 1 }),\n);\nconst expanded = ref(props.defaultOpen);\nconst anchor = ref<HTMLElement | null>(null);\nconst open = computed({\n  get: () => props.open ?? expanded.value,\n  set: (next: boolean) => {\n    if (next === open.value) return;\n    if (props.open === undefined) expanded.value = next;\n    emit(\"update:open\", next);\n    emit(\"openChange\", next);\n  },\n});\nfunction reconcile() {\n  const incoming = supplied.value;\n  if (incoming === undefined || incoming === draftCode.value) return;\n  const parsed = parseHex(incoming);\n  if (parsed) editing.value = rgbaToHsva(parsed, editing.value);\n  draftCode.value = incoming;\n}\nwatch(supplied, reconcile, { flush: \"sync\" });\nwatch(draftCode, reconcile, { flush: \"post\" });\nconst displayHsva = computed(() =>\n  !props.alpha && editing.value.a !== 1\n    ? { ...editing.value, a: 1 }\n    : editing.value,\n);\nconst rgba = computed(() => hsvaToRgba(displayHsva.value));\nconst hex = computed(() => formatHex(rgba.value));\nfunction update(patch: Partial<Hsva>) {\n  if (props.disabled) return;\n  const limits: Record<keyof Hsva, number> = { h: 360, s: 100, v: 100, a: 1 };\n  const next = Object.fromEntries(\n    (Object.keys(limits) as (keyof Hsva)[]).map((key) => [\n      key,\n      Math.min(\n        limits[key],\n        Math.max(\n          0,\n          Number.isFinite(patch[key]) ? patch[key]! : editing.value[key],\n        ),\n      ),\n    ]),\n  ) as Hsva;\n  if (!props.alpha) next.a = 1;\n  const code = formatHex(hsvaToRgba(next));\n  const changed = code !== hex.value;\n  editing.value = next;\n  draftCode.value = code;\n  if (changed) {\n    emit(\"update:modelValue\", code);\n    emit(\"valueChange\", code);\n    emit(\"change\", code);\n  }\n}\nfunction commit() {\n  if (!props.disabled) emit(\"valueCommit\", hex.value);\n}\nfunction setColor(code: string) {\n  const parsed = parseHex(code);\n  if (parsed) {\n    update(rgbaToHsva(parsed, editing.value));\n    commit();\n  }\n}\nprovide<ColorContext>(\"orvui-color-picker\", {\n  id,\n  hsva: displayHsva,\n  rgba,\n  hex,\n  open,\n  anchor,\n  alpha: computed(() => props.alpha),\n  disabled: computed(() => props.disabled),\n  update,\n  setColor,\n  commit,\n});\n</script>\n<template>\n  <fieldset\n    :disabled=\"disabled\"\n    :form=\"form\"\n    :class=\"[\n      'relative flex w-full min-w-0 max-w-72 flex-col gap-3 border-0 p-0 has-[>[data-color-picker-trigger]]:w-fit has-[>[data-color-picker-trigger]]:self-start',\n      disabled && 'opacity-50',\n    ]\"\n  >\n    <slot :hex=\"hex\" :hsva=\"displayHsva\" :set-color=\"setColor\"\n      ><ColorPickerArea /><ColorPickerHue /><ColorPickerAlpha />\n      <div class=\"flex gap-2\">\n        <ColorPickerSwatch /><ColorPickerHexInput /></div></slot\n    ><input v-if=\"name\" type=\"hidden\" :name=\"name\" :value=\"hex\" :form=\"form\" />\n  </fieldset>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport { rgbaToHsva, hsvToHsl, hslToHsv, type Hsva, type Rgba } from \"./color\";\nimport { usePicker } from \"./context\";\nconst props = withDefaults(defineProps<{ format?: \"rgb\" | \"hsl\" }>(), {\n  format: \"rgb\",\n});\nconst state = usePicker();\ntype Channel = {\n  key: string;\n  short: string;\n  name: string;\n  max: number;\n  value: number;\n  set: (value: number) => Hsva;\n};\nconst channels = computed<Channel[]>(() => {\n  const hsv = state.hsva.value;\n  const rgba = state.rgba.value;\n  const hsl = hsvToHsl(hsv);\n  const schema: Array<[string, string, number]> =\n    props.format === \"hsl\"\n      ? [\n          [\"h\", \"Hue\", 360],\n          [\"s\", \"Saturation\", 100],\n          [\"l\", \"Lightness\", 100],\n        ]\n      : [\n          [\"r\", \"Red\", 255],\n          [\"g\", \"Green\", 255],\n          [\"b\", \"Blue\", 255],\n        ];\n  const result = schema.map(([key, name, max]) => ({\n    key,\n    short: key.toUpperCase(),\n    name,\n    max,\n    value:\n      props.format === \"hsl\"\n        ? hsl[key as keyof typeof hsl]\n        : rgba[key as keyof Rgba],\n    set: (value: number) =>\n      props.format === \"hsl\"\n        ? hslToHsv(\n            key === \"h\" ? value : hsl.h,\n            key === \"s\" ? value : hsl.s,\n            key === \"l\" ? value : hsl.l,\n            hsv,\n            hsv.a,\n          )\n        : rgbaToHsva({ ...rgba, [key]: value }, hsv),\n  }));\n  if (state.alpha.value)\n    result.push({\n      key: \"a\",\n      short: \"A\",\n      name: \"Opacity percent\",\n      max: 100,\n      value: hsv.a * 100,\n      set: (value) => ({ ...hsv, a: value / 100 }),\n    });\n  return result;\n});\nconst drafts = ref<Record<string, string | undefined>>({});\nwatch(\n  () => props.format,\n  () => {\n    drafts.value = {};\n  },\n);\nconst clamp = (channel: Channel, value: number) =>\n  Math.min(channel.max, Math.max(0, value));\nfunction input(channel: Channel, event: Event) {\n  const text = (event.target as HTMLInputElement).value\n    .replace(/\\D/g, \"\")\n    .slice(0, 3);\n  drafts.value[channel.key] = text;\n  if (text) state.update(channel.set(clamp(channel, Number(text))));\n}\nfunction settle(channel: Channel) {\n  if (drafts.value[channel.key] !== undefined) state.commit();\n  delete drafts.value[channel.key];\n}\nfunction key(channel: Channel, event: KeyboardEvent) {\n  const delta =\n    event.key === \"ArrowUp\" ? 1 : event.key === \"ArrowDown\" ? -1 : 0;\n  if (delta && !state.disabled.value) {\n    event.preventDefault();\n    delete drafts.value[channel.key];\n    state.update(\n      channel.set(\n        clamp(\n          channel,\n          Math.round(channel.value) + delta * (event.shiftKey ? 10 : 1),\n        ),\n      ),\n    );\n    state.commit();\n  } else if (event.key === \"Enter\") settle(channel);\n}\n</script>\n<template>\n  <div class=\"flex min-w-0 flex-1 gap-1.5\">\n    <label\n      v-for=\"channel in channels\"\n      :key=\"format + '-' + channel.key\"\n      class=\"flex min-w-0 flex-1 flex-col items-center gap-1\"\n      ><input\n        type=\"text\"\n        inputmode=\"numeric\"\n        autocomplete=\"off\"\n        :disabled=\"state.disabled.value\"\n        :aria-label=\"channel.name\"\n        :value=\"drafts[channel.key] ?? String(Math.round(channel.value))\"\n        @input=\"input(channel, $event)\"\n        @blur=\"settle(channel)\"\n        @keydown=\"key(channel, $event)\"\n        class=\"h-9 w-full min-w-0 rounded-lg border border-border bg-background px-1 text-center text-xs text-foreground outline-none focus:border-foreground/40 focus:ring-2 focus:ring-ring/40 disabled:opacity-50\"\n      /><span\n        aria-hidden=\"true\"\n        class=\"text-[11px] font-medium text-muted-foreground\"\n        >{{ channel.short }}</span\n      ></label\n    >\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, ref, watch } from \"vue\";\nimport { rgbaToHsva, hsvToHsl, hslToHsv, type Hsva, type Rgba } from \"./color\";\nimport { usePicker } from \"./context\";\nconst props = withDefaults(defineProps<{ format?: \"rgb\" | \"hsl\" }>(), {\n  format: \"rgb\",\n});\nconst state = usePicker();\ntype Channel = {\n  key: string;\n  short: string;\n  name: string;\n  max: number;\n  value: number;\n  set: (value: number) => Hsva;\n};\nconst channels = computed<Channel[]>(() => {\n  const hsv = state.hsva.value;\n  const rgba = state.rgba.value;\n  const hsl = hsvToHsl(hsv);\n  const schema: Array<[string, string, number]> =\n    props.format === \"hsl\"\n      ? [\n          [\"h\", \"Hue\", 360],\n          [\"s\", \"Saturation\", 100],\n          [\"l\", \"Lightness\", 100],\n        ]\n      : [\n          [\"r\", \"Red\", 255],\n          [\"g\", \"Green\", 255],\n          [\"b\", \"Blue\", 255],\n        ];\n  const result = schema.map(([key, name, max]) => ({\n    key,\n    short: key.toUpperCase(),\n    name,\n    max,\n    value:\n      props.format === \"hsl\"\n        ? hsl[key as keyof typeof hsl]\n        : rgba[key as keyof Rgba],\n    set: (value: number) =>\n      props.format === \"hsl\"\n        ? hslToHsv(\n            key === \"h\" ? value : hsl.h,\n            key === \"s\" ? value : hsl.s,\n            key === \"l\" ? value : hsl.l,\n            hsv,\n            hsv.a,\n          )\n        : rgbaToHsva({ ...rgba, [key]: value }, hsv),\n  }));\n  if (state.alpha.value)\n    result.push({\n      key: \"a\",\n      short: \"A\",\n      name: \"Opacity percent\",\n      max: 100,\n      value: hsv.a * 100,\n      set: (value) => ({ ...hsv, a: value / 100 }),\n    });\n  return result;\n});\nconst drafts = ref<Record<string, string | undefined>>({});\nwatch(\n  () => props.format,\n  () => {\n    drafts.value = {};\n  },\n);\nconst clamp = (channel: Channel, value: number) =>\n  Math.min(channel.max, Math.max(0, value));\nfunction input(channel: Channel, event: Event) {\n  const text = (event.target as HTMLInputElement).value\n    .replace(/\\D/g, \"\")\n    .slice(0, 3);\n  drafts.value[channel.key] = text;\n  if (text) state.update(channel.set(clamp(channel, Number(text))));\n}\nfunction settle(channel: Channel) {\n  if (drafts.value[channel.key] !== undefined) state.commit();\n  delete drafts.value[channel.key];\n}\nfunction key(channel: Channel, event: KeyboardEvent) {\n  const delta =\n    event.key === \"ArrowUp\" ? 1 : event.key === \"ArrowDown\" ? -1 : 0;\n  if (delta && !state.disabled.value) {\n    event.preventDefault();\n    delete drafts.value[channel.key];\n    state.update(\n      channel.set(\n        clamp(\n          channel,\n          Math.round(channel.value) + delta * (event.shiftKey ? 10 : 1),\n        ),\n      ),\n    );\n    state.commit();\n  } else if (event.key === \"Enter\") settle(channel);\n}\n</script>\n<template>\n  <div class=\"flex min-w-0 flex-1 gap-1.5\">\n    <label\n      v-for=\"channel in channels\"\n      :key=\"format + '-' + channel.key\"\n      class=\"flex min-w-0 flex-1 flex-col items-center gap-1\"\n      ><input\n        type=\"text\"\n        inputmode=\"numeric\"\n        autocomplete=\"off\"\n        :disabled=\"state.disabled.value\"\n        :aria-label=\"channel.name\"\n        :value=\"drafts[channel.key] ?? String(Math.round(channel.value))\"\n        @input=\"input(channel, $event)\"\n        @blur=\"settle(channel)\"\n        @keydown=\"key(channel, $event)\"\n        class=\"h-9 w-full min-w-0 rounded-lg border border-border bg-background px-1 text-center text-xs text-foreground outline-none focus:border-foreground/40 focus:ring-2 focus:ring-ring/40 disabled:opacity-50\"\n      /><span\n        aria-hidden=\"true\"\n        class=\"text-[11px] font-medium text-muted-foreground\"\n        >{{ channel.short }}</span\n      ></label\n    >\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, ref } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { Pipette } from \"lucide-vue-next\";\nimport { SPRING_PRESS } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { parseHex, rgbaToHsva } from \"./color\";\nimport { usePicker } from \"./context\";\nconst state = usePicker();\nconst reduced = useReducedMotion();\nconst supported = ref(false);\nlet request: AbortController | undefined;\nlet disposed = false;\nonMounted(() => {\n  supported.value = \"EyeDropper\" in window;\n});\nasync function pick(event: MouseEvent) {\n  if (event.defaultPrevented || state.disabled.value || !supported.value)\n    return;\n  request?.abort();\n  const controller = new AbortController();\n  request = controller;\n  try {\n    const result = await new (window as any).EyeDropper().open({\n      signal: controller.signal,\n    });\n    if (disposed || controller.signal.aborted) return;\n    const parsed = parseHex(result.sRGBHex);\n    if (parsed) {\n      state.update(\n        rgbaToHsva({ ...parsed, a: state.hsva.value.a }, state.hsva.value),\n      );\n      state.commit();\n    }\n  } catch {\n    /* Escape/cancellation keeps the editing value. */\n  }\n}\nonBeforeUnmount(() => {\n  disposed = true;\n  request?.abort();\n});\n</script>\n<template>\n  <motion.button\n    v-if=\"supported\"\n    type=\"button\"\n    aria-label=\"Pick a color from your screen\"\n    :disabled=\"state.disabled.value\"\n    :while-press=\"reduced || state.disabled.value ? undefined : { scale: 0.92 }\"\n    :transition=\"SPRING_PRESS\"\n    @click=\"pick\"\n    class=\"inline-flex size-9 shrink-0 items-center justify-center rounded-lg border border-border bg-background text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed\"\n    ><slot><Pipette aria-hidden=\"true\" class=\"size-4\" /></slot\n  ></motion.button>\n</template>\n","<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, ref } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { Pipette } from \"lucide-vue-next\";\nimport { SPRING_PRESS } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { parseHex, rgbaToHsva } from \"./color\";\nimport { usePicker } from \"./context\";\nconst state = usePicker();\nconst reduced = useReducedMotion();\nconst supported = ref(false);\nlet request: AbortController | undefined;\nlet disposed = false;\nonMounted(() => {\n  supported.value = \"EyeDropper\" in window;\n});\nasync function pick(event: MouseEvent) {\n  if (event.defaultPrevented || state.disabled.value || !supported.value)\n    return;\n  request?.abort();\n  const controller = new AbortController();\n  request = controller;\n  try {\n    const result = await new (window as any).EyeDropper().open({\n      signal: controller.signal,\n    });\n    if (disposed || controller.signal.aborted) return;\n    const parsed = parseHex(result.sRGBHex);\n    if (parsed) {\n      state.update(\n        rgbaToHsva({ ...parsed, a: state.hsva.value.a }, state.hsva.value),\n      );\n      state.commit();\n    }\n  } catch {\n    /* Escape/cancellation keeps the editing value. */\n  }\n}\nonBeforeUnmount(() => {\n  disposed = true;\n  request?.abort();\n});\n</script>\n<template>\n  <motion.button\n    v-if=\"supported\"\n    type=\"button\"\n    aria-label=\"Pick a color from your screen\"\n    :disabled=\"state.disabled.value\"\n    :while-press=\"reduced || state.disabled.value ? undefined : { scale: 0.92 }\"\n    :transition=\"SPRING_PRESS\"\n    @click=\"pick\"\n    class=\"inline-flex size-9 shrink-0 items-center justify-center rounded-lg border border-border bg-background text-muted-foreground outline-none transition-colors hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed\"\n    ><slot><Pipette aria-hidden=\"true\" class=\"size-4\" /></slot\n  ></motion.button>\n</template>\n","type Point = { x: number; y: number };\n\n/** Keep consecutive preset transitions curving toward the same visual side. */\nexport function createPresetArc() {\n  let curvature: number | undefined;\n  return (from: Point, to: Point) => {\n    const horizontal = to.x - from.x;\n    const vertical = to.y - from.y;\n    const horizontalTravel = Math.abs(horizontal) >= Math.abs(vertical);\n    const dominant = horizontalTravel ? horizontal : vertical;\n    let bend = dominant < 0 ? 0.3 : -0.3;\n    let normalX = -vertical * bend;\n    let normalY = horizontal * bend;\n    const side = Math.sign(horizontalTravel ? normalY : normalX);\n    if (curvature === undefined && side !== 0) curvature = side;\n    else if (side !== 0 && curvature !== side) {\n      normalX = -normalX;\n      normalY = -normalY;\n    }\n    return (progress: number): Point => {\n      const bow = 2 * progress * (1 - progress);\n      return {\n        x: from.x + horizontal * progress + normalX * bow,\n        y: from.y + vertical * progress + normalY * bow,\n      };\n    };\n  };\n}\n","<script setup lang=\"ts\">\nimport { nextTick, onBeforeUnmount, onMounted, provide, ref, watch } from \"vue\";\nimport { animate, motion, motionValue } from \"motion-v\";\nimport { SPRING_LAYOUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { usePicker } from \"./context\";\nimport { createPresetArc } from \"./preset-motion\";\nconst state = usePicker();\nconst reduced = useReducedMotion();\nconst root = ref<HTMLElement | null>(null);\nconst visible = ref(false);\nconst x = motionValue(0),\n  y = motionValue(0),\n  width = motionValue(30),\n  height = motionValue(30);\nconst entries = new Map<HTMLElement, string>();\nconst arc = createPresetArc();\nlet animation: ReturnType<typeof animate> | undefined;\nlet observer: ResizeObserver | undefined;\nlet disposed = false;\nlet revision = 0;\nfunction measure() {\n  const container = root.value;\n  const selected = [...entries].find(\n    ([, value]) => value === state.hex.value,\n  )?.[0];\n  if (!container || !selected || disposed) {\n    visible.value = false;\n    return;\n  }\n  let left = -3,\n    top = -3;\n  for (\n    let element: HTMLElement | null = selected;\n    element && element !== container;\n    element = element.offsetParent as HTMLElement | null\n  ) {\n    left += element.offsetLeft;\n    top += element.offsetTop;\n  }\n  animation?.stop();\n  width.set(selected.offsetWidth + 6);\n  height.set(selected.offsetHeight + 6);\n  if (!visible.value || reduced.value) {\n    x.jump(left);\n    y.jump(top);\n  } else {\n    const curve = arc({ x: x.get(), y: y.get() }, { x: left, y: top });\n    animation = animate(0, 1, {\n      ...SPRING_LAYOUT,\n      onUpdate: (phase) => {\n        const point = curve(phase);\n        x.set(point.x);\n        y.set(point.y);\n      },\n      onComplete: () => {\n        if (!disposed) {\n          x.set(left);\n          y.set(top);\n        }\n      },\n    });\n  }\n  visible.value = true;\n}\nasync function schedule() {\n  const version = ++revision;\n  await nextTick();\n  if (!disposed && version === revision) measure();\n}\nprovide(\"orvui-color-presets\", {\n  register(node: HTMLElement, value: string) {\n    entries.set(node, value);\n    void schedule();\n    return () => {\n      entries.delete(node);\n      void schedule();\n    };\n  },\n});\nwatch([state.hex, reduced], schedule);\nonMounted(() => {\n  if (root.value && typeof ResizeObserver !== \"undefined\") {\n    observer = new ResizeObserver(measure);\n    observer.observe(root.value);\n  }\n  void schedule();\n});\nonBeforeUnmount(() => {\n  disposed = true;\n  ++revision;\n  observer?.disconnect();\n  animation?.stop();\n  for (const value of [x, y, width, height]) value.destroy();\n});\n</script>\n<template>\n  <div ref=\"root\" class=\"relative flex flex-wrap gap-2\">\n    <motion.span\n      v-if=\"visible\"\n      aria-hidden=\"true\"\n      data-color-picker-preset-ring=\"\"\n      class=\"pointer-events-none absolute left-0 top-0 rounded-full border-2 border-foreground/70\"\n      :style=\"{ x, y, width, height }\"\n    /><slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { nextTick, onBeforeUnmount, onMounted, provide, ref, watch } from \"vue\";\nimport { animate, motion, motionValue } from \"motion-v\";\nimport { SPRING_LAYOUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { usePicker } from \"./context\";\nimport { createPresetArc } from \"./preset-motion\";\nconst state = usePicker();\nconst reduced = useReducedMotion();\nconst root = ref<HTMLElement | null>(null);\nconst visible = ref(false);\nconst x = motionValue(0),\n  y = motionValue(0),\n  width = motionValue(30),\n  height = motionValue(30);\nconst entries = new Map<HTMLElement, string>();\nconst arc = createPresetArc();\nlet animation: ReturnType<typeof animate> | undefined;\nlet observer: ResizeObserver | undefined;\nlet disposed = false;\nlet revision = 0;\nfunction measure() {\n  const container = root.value;\n  const selected = [...entries].find(\n    ([, value]) => value === state.hex.value,\n  )?.[0];\n  if (!container || !selected || disposed) {\n    visible.value = false;\n    return;\n  }\n  let left = -3,\n    top = -3;\n  for (\n    let element: HTMLElement | null = selected;\n    element && element !== container;\n    element = element.offsetParent as HTMLElement | null\n  ) {\n    left += element.offsetLeft;\n    top += element.offsetTop;\n  }\n  animation?.stop();\n  width.set(selected.offsetWidth + 6);\n  height.set(selected.offsetHeight + 6);\n  if (!visible.value || reduced.value) {\n    x.jump(left);\n    y.jump(top);\n  } else {\n    const curve = arc({ x: x.get(), y: y.get() }, { x: left, y: top });\n    animation = animate(0, 1, {\n      ...SPRING_LAYOUT,\n      onUpdate: (phase) => {\n        const point = curve(phase);\n        x.set(point.x);\n        y.set(point.y);\n      },\n      onComplete: () => {\n        if (!disposed) {\n          x.set(left);\n          y.set(top);\n        }\n      },\n    });\n  }\n  visible.value = true;\n}\nasync function schedule() {\n  const version = ++revision;\n  await nextTick();\n  if (!disposed && version === revision) measure();\n}\nprovide(\"orvui-color-presets\", {\n  register(node: HTMLElement, value: string) {\n    entries.set(node, value);\n    void schedule();\n    return () => {\n      entries.delete(node);\n      void schedule();\n    };\n  },\n});\nwatch([state.hex, reduced], schedule);\nonMounted(() => {\n  if (root.value && typeof ResizeObserver !== \"undefined\") {\n    observer = new ResizeObserver(measure);\n    observer.observe(root.value);\n  }\n  void schedule();\n});\nonBeforeUnmount(() => {\n  disposed = true;\n  ++revision;\n  observer?.disconnect();\n  animation?.stop();\n  for (const value of [x, y, width, height]) value.destroy();\n});\n</script>\n<template>\n  <div ref=\"root\" class=\"relative flex flex-wrap gap-2\">\n    <motion.span\n      v-if=\"visible\"\n      aria-hidden=\"true\"\n      data-color-picker-preset-ring=\"\"\n      class=\"pointer-events-none absolute left-0 top-0 rounded-full border-2 border-foreground/70\"\n      :style=\"{ x, y, width, height }\"\n    /><slot />\n  </div>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { SPRING_PRESS } from \"../../../lib/ease\";\nimport { resolveElement, useReducedMotion } from \"../../../lib/composables\";\nimport { parseHex, formatHex } from \"./color\";\nimport { usePicker, CHECKERBOARD } from \"./context\";\nconst props = defineProps<{ value: string; label?: string }>();\nconst state = usePicker();\nconst reduced = useReducedMotion();\nconst root = ref<unknown>(null);\nconst parsed = computed(() => parseHex(props.value));\nconst normalized = computed(() =>\n  parsed.value ? formatHex(parsed.value) : props.value,\n);\nconst selected = computed(() => state.hex.value === normalized.value);\nconst group = inject<{\n  register(node: HTMLElement, value: string): () => void;\n} | null>(\"orvui-color-presets\", null);\nlet detach: (() => void) | undefined;\nfunction synchronize() {\n  detach?.();\n  detach = undefined;\n  const element = resolveElement<HTMLElement>(root.value);\n  if (group && element) detach = group.register(element, normalized.value);\n}\nonMounted(synchronize);\nwatch(normalized, synchronize);\nonBeforeUnmount(() => detach?.());\nfunction choose() {\n  if (parsed.value && !state.disabled.value) state.setColor(props.value);\n}\n</script>\n<template>\n  <motion.button\n    ref=\"root\"\n    type=\"button\"\n    :disabled=\"state.disabled.value\"\n    :aria-label=\"label ?? normalized\"\n    :aria-pressed=\"selected\"\n    :while-press=\"reduced || state.disabled.value ? undefined : { scale: 0.88 }\"\n    :transition=\"SPRING_PRESS\"\n    @click=\"choose\"\n    class=\"relative size-6 shrink-0 rounded-full outline-none focus-visible:outline-2 focus-visible:outline-offset-3 focus-visible:outline-foreground disabled:cursor-not-allowed\"\n    ><span\n      v-if=\"selected && !group\"\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute -inset-[3px] rounded-full border-2 border-foreground/70\" /><span\n      aria-hidden=\"true\"\n      class=\"absolute inset-0 overflow-hidden rounded-full\"\n      :style=\"{ background: CHECKERBOARD }\"\n      ><span\n        class=\"absolute inset-0 rounded-full shadow-[inset_0_0_0_1px_rgb(0_0_0/0.1)]\"\n        :style=\"{ backgroundColor: normalized }\" /></span\n  ></motion.button>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { SPRING_PRESS } from \"../../../lib/ease\";\nimport { resolveElement, useReducedMotion } from \"../../../lib/composables\";\nimport { parseHex, formatHex } from \"./color\";\nimport { usePicker, CHECKERBOARD } from \"./context\";\nconst props = defineProps<{ value: string; label?: string }>();\nconst state = usePicker();\nconst reduced = useReducedMotion();\nconst root = ref<unknown>(null);\nconst parsed = computed(() => parseHex(props.value));\nconst normalized = computed(() =>\n  parsed.value ? formatHex(parsed.value) : props.value,\n);\nconst selected = computed(() => state.hex.value === normalized.value);\nconst group = inject<{\n  register(node: HTMLElement, value: string): () => void;\n} | null>(\"orvui-color-presets\", null);\nlet detach: (() => void) | undefined;\nfunction synchronize() {\n  detach?.();\n  detach = undefined;\n  const element = resolveElement<HTMLElement>(root.value);\n  if (group && element) detach = group.register(element, normalized.value);\n}\nonMounted(synchronize);\nwatch(normalized, synchronize);\nonBeforeUnmount(() => detach?.());\nfunction choose() {\n  if (parsed.value && !state.disabled.value) state.setColor(props.value);\n}\n</script>\n<template>\n  <motion.button\n    ref=\"root\"\n    type=\"button\"\n    :disabled=\"state.disabled.value\"\n    :aria-label=\"label ?? normalized\"\n    :aria-pressed=\"selected\"\n    :while-press=\"reduced || state.disabled.value ? undefined : { scale: 0.88 }\"\n    :transition=\"SPRING_PRESS\"\n    @click=\"choose\"\n    class=\"relative size-6 shrink-0 rounded-full outline-none focus-visible:outline-2 focus-visible:outline-offset-3 focus-visible:outline-foreground disabled:cursor-not-allowed\"\n    ><span\n      v-if=\"selected && !group\"\n      aria-hidden=\"true\"\n      class=\"pointer-events-none absolute -inset-[3px] rounded-full border-2 border-foreground/70\" /><span\n      aria-hidden=\"true\"\n      class=\"absolute inset-0 overflow-hidden rounded-full\"\n      :style=\"{ background: CHECKERBOARD }\"\n      ><span\n        class=\"absolute inset-0 rounded-full shadow-[inset_0_0_0_1px_rgb(0_0_0/0.1)]\"\n        :style=\"{ backgroundColor: normalized }\" /></span\n  ></motion.button>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref } from \"vue\";\nimport { motion, AnimatePresence } from \"motion-v\";\nimport { SPRING_LAYOUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { usePicker, CHECKERBOARD, COLOR_MORPH } from \"./context\";\nconst state = usePicker();\nconst anchor = state.anchor;\nconst reduced = useReducedMotion();\nconst text = ref<HTMLElement | null>(null);\nconst width = ref<number | null>(null);\nconst alpha = computed(() => state.hex.value.slice(7));\nlet observer: ResizeObserver | undefined;\nfunction measure() {\n  if (text.value) width.value = text.value.offsetWidth;\n}\nonMounted(() => {\n  measure();\n  if (text.value && typeof ResizeObserver !== \"undefined\") {\n    observer = new ResizeObserver(measure);\n    observer.observe(text.value);\n  }\n});\nonBeforeUnmount(() => observer?.disconnect());\nfunction toggle() {\n  if (!state.disabled.value) state.open.value = !state.open.value;\n}\n</script>\n<template>\n  <button\n    ref=\"anchor\"\n    type=\"button\"\n    data-color-picker-trigger=\"\"\n    :disabled=\"state.disabled.value\"\n    aria-haspopup=\"dialog\"\n    :aria-expanded=\"state.open.value\"\n    :aria-controls=\"state.open.value ? `${state.id}-content` : undefined\"\n    @click=\"toggle\"\n    class=\"inline-flex h-10 w-fit items-center gap-2.5 rounded-xl border border-border bg-background pr-3.5 pl-2.5 text-sm text-foreground outline-none transition-colors hover:border-foreground/20 focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed\"\n  >\n    <span aria-hidden=\"true\" class=\"relative size-6 shrink-0\"\n      ><span\n        class=\"absolute inset-0 rounded-md border border-dashed border-foreground/20\" /><motion.span\n        v-if=\"!state.open.value\"\n        :layout-id=\"reduced ? undefined : `${state.id}-chip`\"\n        :transition=\"COLOR_MORPH\"\n        class=\"absolute inset-0 overflow-hidden\"\n        :style=\"{ borderRadius: '6px', background: CHECKERBOARD }\"\n        ><span\n          class=\"absolute inset-0 shadow-[inset_0_0_0_1px_rgb(0_0_0/0.1)]\"\n          :style=\"{\n            backgroundColor: state.hex.value,\n            borderRadius: '6px',\n          }\" /></motion.span></span\n    ><slot\n      ><motion.span\n        class=\"relative inline-flex overflow-hidden\"\n        :initial=\"false\"\n        :animate=\"{ width: width ?? 'auto' }\"\n        :transition=\"reduced ? { duration: 0 } : SPRING_LAYOUT\"\n        ><span\n          ref=\"text\"\n          class=\"relative inline-flex shrink-0 whitespace-nowrap font-mono uppercase tabular-nums\"\n          >{{ state.hex.value.slice(0, 7)\n          }}<AnimatePresence mode=\"popLayout\" :initial=\"false\"\n            ><motion.span\n              v-if=\"alpha\"\n              key=\"alpha\"\n              class=\"text-muted-foreground\"\n              :initial=\"{\n                opacity: 0,\n                x: reduced ? 0 : -4,\n                filter: reduced ? 'blur(0px)' : 'blur(3px)',\n              }\"\n              :animate=\"{ opacity: 1, x: 0, filter: 'blur(0px)' }\"\n              :exit=\"{\n                opacity: 0,\n                filter: reduced ? 'blur(0px)' : 'blur(3px)',\n                transition: { duration: 0.12 },\n              }\"\n              :transition=\"SPRING_LAYOUT\"\n              >{{ alpha }}</motion.span\n            ></AnimatePresence\n          ></span\n        ></motion.span\n      ></slot\n    >\n  </button>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref } from \"vue\";\nimport { motion, AnimatePresence } from \"motion-v\";\nimport { SPRING_LAYOUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { usePicker, CHECKERBOARD, COLOR_MORPH } from \"./context\";\nconst state = usePicker();\nconst anchor = state.anchor;\nconst reduced = useReducedMotion();\nconst text = ref<HTMLElement | null>(null);\nconst width = ref<number | null>(null);\nconst alpha = computed(() => state.hex.value.slice(7));\nlet observer: ResizeObserver | undefined;\nfunction measure() {\n  if (text.value) width.value = text.value.offsetWidth;\n}\nonMounted(() => {\n  measure();\n  if (text.value && typeof ResizeObserver !== \"undefined\") {\n    observer = new ResizeObserver(measure);\n    observer.observe(text.value);\n  }\n});\nonBeforeUnmount(() => observer?.disconnect());\nfunction toggle() {\n  if (!state.disabled.value) state.open.value = !state.open.value;\n}\n</script>\n<template>\n  <button\n    ref=\"anchor\"\n    type=\"button\"\n    data-color-picker-trigger=\"\"\n    :disabled=\"state.disabled.value\"\n    aria-haspopup=\"dialog\"\n    :aria-expanded=\"state.open.value\"\n    :aria-controls=\"state.open.value ? `${state.id}-content` : undefined\"\n    @click=\"toggle\"\n    class=\"inline-flex h-10 w-fit items-center gap-2.5 rounded-xl border border-border bg-background pr-3.5 pl-2.5 text-sm text-foreground outline-none transition-colors hover:border-foreground/20 focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed\"\n  >\n    <span aria-hidden=\"true\" class=\"relative size-6 shrink-0\"\n      ><span\n        class=\"absolute inset-0 rounded-md border border-dashed border-foreground/20\" /><motion.span\n        v-if=\"!state.open.value\"\n        :layout-id=\"reduced ? undefined : `${state.id}-chip`\"\n        :transition=\"COLOR_MORPH\"\n        class=\"absolute inset-0 overflow-hidden\"\n        :style=\"{ borderRadius: '6px', background: CHECKERBOARD }\"\n        ><span\n          class=\"absolute inset-0 shadow-[inset_0_0_0_1px_rgb(0_0_0/0.1)]\"\n          :style=\"{\n            backgroundColor: state.hex.value,\n            borderRadius: '6px',\n          }\" /></motion.span></span\n    ><slot\n      ><motion.span\n        class=\"relative inline-flex overflow-hidden\"\n        :initial=\"false\"\n        :animate=\"{ width: width ?? 'auto' }\"\n        :transition=\"reduced ? { duration: 0 } : SPRING_LAYOUT\"\n        ><span\n          ref=\"text\"\n          class=\"relative inline-flex shrink-0 whitespace-nowrap font-mono uppercase tabular-nums\"\n          >{{ state.hex.value.slice(0, 7)\n          }}<AnimatePresence mode=\"popLayout\" :initial=\"false\"\n            ><motion.span\n              v-if=\"alpha\"\n              key=\"alpha\"\n              class=\"text-muted-foreground\"\n              :initial=\"{\n                opacity: 0,\n                x: reduced ? 0 : -4,\n                filter: reduced ? 'blur(0px)' : 'blur(3px)',\n              }\"\n              :animate=\"{ opacity: 1, x: 0, filter: 'blur(0px)' }\"\n              :exit=\"{\n                opacity: 0,\n                filter: reduced ? 'blur(0px)' : 'blur(3px)',\n                transition: { duration: 0.12 },\n              }\"\n              :transition=\"SPRING_LAYOUT\"\n              >{{ alpha }}</motion.span\n            ></AnimatePresence\n          ></span\n        ></motion.span\n      ></slot\n    >\n  </button>\n</template>\n","<script lang=\"ts\">\nimport {\n  Fragment,\n  defineComponent,\n  h,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  ref,\n  watch,\n  type VNode,\n  type Component,\n} from \"vue\";\nimport { AnimatePresence, motion } from \"motion-v\";\nimport { SPRING_LAYOUT, EASE_OUT } from \"../../../lib/ease\";\nimport {\n  resolveElement,\n  useFloatingLayer,\n  useReducedMotion,\n} from \"../../../lib/composables\";\nimport { cn } from \"../../../lib/utils\";\nimport { usePicker } from \"./context\";\nimport ColorPickerArea from \"./ColorPickerArea.vue\";\nconst flatten = (nodes: VNode[]): VNode[] =>\n  nodes.flatMap((node) =>\n    node.type === Fragment ? flatten(node.children as VNode[]) : [node],\n  );\nexport default defineComponent({\n  inheritAttrs: false,\n  props: { align: { type: String as () => \"start\" | \"end\", default: \"start\" } },\n  setup(props, { attrs, slots }) {\n    const state = usePicker();\n    const reduced = useReducedMotion();\n    const panel = ref<unknown>(null);\n    const layer = useFloatingLayer(state.open, panel);\n    provide(\"orvui-color-morph\", true);\n    let disposed = false;\n    let revision = 0;\n    const element = () => resolveElement<HTMLElement>(panel.value);\n    function position() {\n      const target = element();\n      if (!target || !state.open.value) return;\n      target.style.marginLeft = \"0px\";\n      const box = target.getBoundingClientRect();\n      const end = target.ownerDocument.documentElement.clientWidth - 8;\n      let delta = Math.min(0, end - box.right);\n      if (box.left + delta < 8) delta = 8 - box.left;\n      target.style.marginLeft = `${delta}px`;\n    }\n    const outside = (event: PointerEvent) => {\n      if (\n        state.open.value &&\n        event.target instanceof Node &&\n        !layer.containsHigher(event.target) &&\n        !element()?.contains(event.target) &&\n        !state.anchor.value?.contains(event.target)\n      )\n        state.open.value = false;\n    };\n    const escape = (event: KeyboardEvent) => {\n      if (layer.claimEscape(event)) state.open.value = false;\n    };\n    watch(\n      state.open,\n      async (opened, previous) => {\n        const version = ++revision;\n        const target = element();\n        if (target) {\n          target.inert = !opened;\n          target.style.pointerEvents = opened ? \"auto\" : \"none\";\n        }\n        await nextTick();\n        if (disposed || version !== revision) return;\n        if (opened) {\n          position();\n          if (previous !== undefined)\n            element()\n              ?.querySelector<HTMLElement>(\n                '[role=\"slider\"]:not([aria-disabled]),input:not(:disabled),button:not(:disabled)',\n              )\n              ?.focus({ preventScroll: true });\n        } else {\n          const active = document.activeElement;\n          if (\n            !active ||\n            active === document.body ||\n            element()?.contains(active)\n          )\n            state.anchor.value?.focus({ preventScroll: true });\n        }\n      },\n      { flush: \"post\" },\n    );\n    onMounted(() => {\n      document.addEventListener(\"pointerdown\", outside);\n      document.addEventListener(\"keydown\", escape);\n      window.addEventListener(\"resize\", position);\n      void nextTick(() => {\n        if (!disposed) position();\n      });\n    });\n    onBeforeUnmount(() => {\n      disposed = true;\n      ++revision;\n      document.removeEventListener(\"pointerdown\", outside);\n      document.removeEventListener(\"keydown\", escape);\n      window.removeEventListener(\"resize\", position);\n    });\n    function rows() {\n      let ordinal = 0;\n      return flatten(slots.default?.() ?? []).map((child, index) => {\n        if (child.type === ColorPickerArea) return child;\n        const delay = 0.1 + ++ordinal * 0.035;\n        return h(\n          motion.div as Component,\n          {\n            key: child.key ?? index,\n            initial: reduced.value\n              ? { opacity: 0 }\n              : { opacity: 0, y: -6, filter: \"blur(4px)\" },\n            animate: reduced.value\n              ? { opacity: 1 }\n              : { opacity: 1, y: 0, filter: \"blur(0px)\" },\n            exit: { opacity: 0, transition: { duration: 0.1 } },\n            transition: { ...SPRING_LAYOUT, delay },\n          },\n          () => child,\n        );\n      });\n    }\n    return () =>\n      h(AnimatePresence, null, {\n        default: () =>\n          state.open.value\n            ? [\n                h(\n                  motion.div as Component,\n                  {\n                    ...attrs,\n                    ref: panel,\n                    id: `${state.id}-content`,\n                    role: \"dialog\",\n                    \"aria-label\": String(attrs[\"aria-label\"] ?? \"Color picker\"),\n                    inert: !state.open.value,\n                    class: cn(\n                      \"absolute top-full z-50 mt-2 flex w-72 flex-col gap-3 p-3\",\n                      props.align === \"end\" ? \"right-0\" : \"left-0\",\n                      attrs.class as string,\n                    ),\n                  },\n                  () => [\n                    h(motion.div as Component, {\n                      \"aria-hidden\": true,\n                      class:\n                        \"absolute inset-0 -z-10 rounded-2xl border border-border bg-background shadow-[0_12px_32px_-8px_rgb(0_0_0/0.25)]\",\n                      initial: { opacity: 0 },\n                      animate: { opacity: 1 },\n                      exit: { opacity: 0 },\n                      transition: {\n                        duration: 0.16,\n                        ease: EASE_OUT,\n                        delay: 0.1,\n                      },\n                    }),\n                    ...rows(),\n                  ],\n                ),\n              ]\n            : [],\n      });\n  },\n});\n</script>\n","<script lang=\"ts\">\nimport {\n  Fragment,\n  defineComponent,\n  h,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  provide,\n  ref,\n  watch,\n  type VNode,\n  type Component,\n} from \"vue\";\nimport { AnimatePresence, motion } from \"motion-v\";\nimport { SPRING_LAYOUT, EASE_OUT } from \"../../../lib/ease\";\nimport {\n  resolveElement,\n  useFloatingLayer,\n  useReducedMotion,\n} from \"../../../lib/composables\";\nimport { cn } from \"../../../lib/utils\";\nimport { usePicker } from \"./context\";\nimport ColorPickerArea from \"./ColorPickerArea.vue\";\nconst flatten = (nodes: VNode[]): VNode[] =>\n  nodes.flatMap((node) =>\n    node.type === Fragment ? flatten(node.children as VNode[]) : [node],\n  );\nexport default defineComponent({\n  inheritAttrs: false,\n  props: { align: { type: String as () => \"start\" | \"end\", default: \"start\" } },\n  setup(props, { attrs, slots }) {\n    const state = usePicker();\n    const reduced = useReducedMotion();\n    const panel = ref<unknown>(null);\n    const layer = useFloatingLayer(state.open, panel);\n    provide(\"orvui-color-morph\", true);\n    let disposed = false;\n    let revision = 0;\n    const element = () => resolveElement<HTMLElement>(panel.value);\n    function position() {\n      const target = element();\n      if (!target || !state.open.value) return;\n      target.style.marginLeft = \"0px\";\n      const box = target.getBoundingClientRect();\n      const end = target.ownerDocument.documentElement.clientWidth - 8;\n      let delta = Math.min(0, end - box.right);\n      if (box.left + delta < 8) delta = 8 - box.left;\n      target.style.marginLeft = `${delta}px`;\n    }\n    const outside = (event: PointerEvent) => {\n      if (\n        state.open.value &&\n        event.target instanceof Node &&\n        !layer.containsHigher(event.target) &&\n        !element()?.contains(event.target) &&\n        !state.anchor.value?.contains(event.target)\n      )\n        state.open.value = false;\n    };\n    const escape = (event: KeyboardEvent) => {\n      if (layer.claimEscape(event)) state.open.value = false;\n    };\n    watch(\n      state.open,\n      async (opened, previous) => {\n        const version = ++revision;\n        const target = element();\n        if (target) {\n          target.inert = !opened;\n          target.style.pointerEvents = opened ? \"auto\" : \"none\";\n        }\n        await nextTick();\n        if (disposed || version !== revision) return;\n        if (opened) {\n          position();\n          if (previous !== undefined)\n            element()\n              ?.querySelector<HTMLElement>(\n                '[role=\"slider\"]:not([aria-disabled]),input:not(:disabled),button:not(:disabled)',\n              )\n              ?.focus({ preventScroll: true });\n        } else {\n          const active = document.activeElement;\n          if (\n            !active ||\n            active === document.body ||\n            element()?.contains(active)\n          )\n            state.anchor.value?.focus({ preventScroll: true });\n        }\n      },\n      { flush: \"post\" },\n    );\n    onMounted(() => {\n      document.addEventListener(\"pointerdown\", outside);\n      document.addEventListener(\"keydown\", escape);\n      window.addEventListener(\"resize\", position);\n      void nextTick(() => {\n        if (!disposed) position();\n      });\n    });\n    onBeforeUnmount(() => {\n      disposed = true;\n      ++revision;\n      document.removeEventListener(\"pointerdown\", outside);\n      document.removeEventListener(\"keydown\", escape);\n      window.removeEventListener(\"resize\", position);\n    });\n    function rows() {\n      let ordinal = 0;\n      return flatten(slots.default?.() ?? []).map((child, index) => {\n        if (child.type === ColorPickerArea) return child;\n        const delay = 0.1 + ++ordinal * 0.035;\n        return h(\n          motion.div as Component,\n          {\n            key: child.key ?? index,\n            initial: reduced.value\n              ? { opacity: 0 }\n              : { opacity: 0, y: -6, filter: \"blur(4px)\" },\n            animate: reduced.value\n              ? { opacity: 1 }\n              : { opacity: 1, y: 0, filter: \"blur(0px)\" },\n            exit: { opacity: 0, transition: { duration: 0.1 } },\n            transition: { ...SPRING_LAYOUT, delay },\n          },\n          () => child,\n        );\n      });\n    }\n    return () =>\n      h(AnimatePresence, null, {\n        default: () =>\n          state.open.value\n            ? [\n                h(\n                  motion.div as Component,\n                  {\n                    ...attrs,\n                    ref: panel,\n                    id: `${state.id}-content`,\n                    role: \"dialog\",\n                    \"aria-label\": String(attrs[\"aria-label\"] ?? \"Color picker\"),\n                    inert: !state.open.value,\n                    class: cn(\n                      \"absolute top-full z-50 mt-2 flex w-72 flex-col gap-3 p-3\",\n                      props.align === \"end\" ? \"right-0\" : \"left-0\",\n                      attrs.class as string,\n                    ),\n                  },\n                  () => [\n                    h(motion.div as Component, {\n                      \"aria-hidden\": true,\n                      class:\n                        \"absolute inset-0 -z-10 rounded-2xl border border-border bg-background shadow-[0_12px_32px_-8px_rgb(0_0_0/0.25)]\",\n                      initial: { opacity: 0 },\n                      animate: { opacity: 1 },\n                      exit: { opacity: 0 },\n                      transition: {\n                        duration: 0.16,\n                        ease: EASE_OUT,\n                        delay: 0.1,\n                      },\n                    }),\n                    ...rows(),\n                  ],\n                ),\n              ]\n            : [],\n      });\n  },\n});\n</script>\n","import { usePicker } from \"./context\";\n/** Public context accessor for custom color-picker parts. */\nexport const useColorPicker = () => usePicker();\n"],"mappings":"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"}

package/dist/color-selector-BUCIKQKf.js

@@ -0,0 +1,221 @@
+import { s as e } from "./composables-BJ1sih_H.js";
+import { n as t } from "./state-DWNDjqAL.js";
+import { l as n, o as r } from "./ease-rIvCM4O3.js";
+import { t as i } from "./utils-DIrLOK2M.js";
+import { computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createElementVNode as l, defineComponent as u, h as d, inject as f, mergeProps as p, nextTick as m, normalizeClass as h, normalizeStyle as g, onBeforeUnmount as _, onMounted as v, openBlock as y, provide as b, ref as x, renderSlot as S, unref as C, useId as w, watch as T, withCtx as E } from "vue";
+import { animate as D, motion as O } from "motion-v";
+// src/motion/color-selector/src/ColorSelector.vue?vue&type=script&setup=true&lang.ts
+var k = ["disabled", "form"], A = /* @__PURE__ */ u({
+	__name: "ColorSelector",
+	props: {
+		modelValue: {},
+		defaultValue: { default: "" },
+		name: {},
+		form: {},
+		disabled: { type: Boolean },
+		required: { type: Boolean }
+	},
+	emits: ["update:modelValue", "change"],
+	setup(n, { emit: i }) {
+		let o = n, u = t(o, i, "modelValue", o.defaultValue), d = w(), f = e(), p = x(null), h = x(null), C = x(!1), E = x({
+			x: 0,
+			y: 0,
+			width: 52,
+			height: 52,
+			color: "transparent"
+		}), O = /* @__PURE__ */ new Map(), A, j, M = !1;
+		function N(e = !1) {
+			if (M) return;
+			let t = O.get(u.value), n = h.value ?? p.value;
+			if (!t || !n) {
+				C.value = !1;
+				return;
+			}
+			let i = n.getBoundingClientRect(), a = t.element.getBoundingClientRect(), o = {
+				x: a.left - i.left - 4,
+				y: a.top - i.top - 4,
+				width: a.width + 8,
+				height: a.height + 8,
+				color: t.color
+			}, s = E.value;
+			if (j?.stop(), !C.value || e || f.value) {
+				E.value = o, C.value = !0;
+				return;
+			}
+			let c = Math.hypot(o.x - s.x, o.y - s.y) * .4;
+			j = D(0, 1, {
+				...r,
+				onUpdate(e) {
+					if (M) return;
+					let t = Math.max(0, Math.min(1, e)), n = (t) => s[t] + e * (o[t] - s[t]);
+					E.value = {
+						x: n("x"),
+						y: n("y") - c * t * (1 - t),
+						width: n("width"),
+						height: n("height"),
+						color: o.color
+					};
+				}
+			});
+		}
+		let P = {
+			value: u,
+			name: a(() => o.name ?? d),
+			form: a(() => o.form),
+			disabled: a(() => o.disabled),
+			required: a(() => o.required),
+			placed: C,
+			register(e, t) {
+				let n = O.get(e);
+				n?.element !== t.element && n && A?.unobserve(n.element), O.set(e, t), A?.observe(t.element), m(() => N(!0));
+			},
+			unregister(e) {
+				let t = O.get(e);
+				t && A?.unobserve(t.element), O.delete(e), m(() => N(!0));
+			},
+			select(e) {
+				!o.disabled && e !== u.value && (u.value = e), m(() => {
+					M || p.value?.querySelectorAll("input[type=\"radio\"]").forEach((e) => {
+						e.checked = e.value === u.value;
+					});
+				});
+			}
+		};
+		return b("orvui-color-selector", P), T(u, () => void m(() => N())), T(f, () => N(!0)), v(() => {
+			typeof ResizeObserver < "u" && (A = new ResizeObserver(() => N(!0)), p.value && A.observe(p.value), O.forEach((e) => A.observe(e.element))), N(!0);
+		}), _(() => {
+			M = !0, j?.stop(), A?.disconnect(), O.clear();
+		}), (e, t) => (y(), c("fieldset", {
+			ref_key: "root",
+			ref: p,
+			disabled: n.disabled,
+			form: n.form,
+			class: "relative min-w-0 border-0 p-0"
+		}, [
+			S(e.$slots, "default"),
+			l("span", {
+				ref_key: "origin",
+				ref: h,
+				"aria-hidden": "true",
+				class: "pointer-events-none absolute left-0 top-0 size-0"
+			}, null, 512),
+			C.value ? (y(), c("span", {
+				key: 0,
+				"aria-hidden": "true",
+				"data-color-selection": "",
+				class: "pointer-events-none absolute rounded-full border-2",
+				style: g({
+					left: 0,
+					top: 0,
+					width: `${E.value.width}px`,
+					height: `${E.value.height}px`,
+					transform: `translate(${E.value.x}px,${E.value.y}px)`,
+					borderColor: `color-mix(in srgb, ${E.value.color} 85%, transparent)`
+				})
+			}, null, 4)) : s("", !0)
+		], 8, k));
+	}
+}), j = /* @__PURE__ */ u({
+	__name: "ColorSelectorLabel",
+	setup(e) {
+		let t = u({
+			name: "ColorSelectorLabel",
+			setup(e, { slots: t }) {
+				return () => d("legend", { class: "mb-3 p-0 text-sm font-medium text-muted-foreground" }, t.default?.());
+			}
+		});
+		return (e, n) => (y(), o(C(t), null, {
+			default: E(() => [S(e.$slots, "default")]),
+			_: 3
+		}));
+	}
+}), M = /* @__PURE__ */ u({
+	__name: "ColorSelectorList",
+	setup(e) {
+		let t = u({
+			name: "ColorSelectorList",
+			setup(e, { slots: t }) {
+				return () => d("div", { class: "flex flex-wrap items-center gap-3 p-1" }, t.default?.());
+			}
+		});
+		return (e, n) => (y(), o(C(t), null, {
+			default: E(() => [S(e.$slots, "default")]),
+			_: 3
+		}));
+	}
+}), N = [
+	"name",
+	"value",
+	"checked",
+	"disabled",
+	"required",
+	"form",
+	"aria-label"
+], P = /* @__PURE__ */ u({
+	inheritAttrs: !1,
+	__name: "ColorSelectorItem",
+	props: {
+		value: {},
+		color: {},
+		label: {},
+		disabled: { type: Boolean }
+	},
+	setup(t) {
+		let r = t, u = f("orvui-color-selector");
+		if (!u) throw Error("ColorSelectorItem must be inside ColorSelector");
+		let d = x(null), b = e(), S = a(() => u.value.value === r.value), w = a(() => r.disabled || u.disabled.value), D = !1;
+		function k() {
+			!D && d.value && u.register(r.value, {
+				element: d.value,
+				color: r.color
+			});
+		}
+		function A(e) {
+			!w.value && !e.defaultPrevented && u.select(r.value);
+		}
+		return v(k), T(() => [r.value, r.color], (e, t) => {
+			u.unregister(t[0]), m(k);
+		}), _(() => {
+			D = !0, u.unregister(r.value);
+		}), (e, r) => (y(), o(C(O).label, {
+			tabindex: -1,
+			"while-press": C(b) || w.value ? void 0 : { scale: .94 },
+			transition: C(n),
+			class: h(C(i)("relative inline-flex shrink-0 rounded-full", w.value ? "cursor-not-allowed opacity-40" : "cursor-pointer"))
+		}, {
+			default: E(() => [l("input", p(e.$attrs, {
+				type: "radio",
+				name: C(u).name.value,
+				value: t.value,
+				checked: S.value,
+				disabled: w.value,
+				required: C(u).required.value,
+				form: C(u).form.value,
+				"aria-label": t.label,
+				onChange: A,
+				class: "peer sr-only"
+			}), null, 16, N), l("span", {
+				ref_key: "surface",
+				ref: d,
+				"aria-hidden": "true",
+				style: g(e.$attrs.style),
+				class: h(C(i)("relative flex size-11 items-center justify-center rounded-full border border-foreground/10 bg-muted/60 peer-focus-visible:outline-2 peer-focus-visible:outline-offset-4 peer-focus-visible:outline-foreground", e.$attrs.class))
+			}, [S.value && !C(u).placed.value ? (y(), c("span", {
+				key: 0,
+				class: "pointer-events-none absolute -inset-1 rounded-full border-2",
+				style: g({ borderColor: `color-mix(in srgb, ${t.color} 85%, transparent)` })
+			}, null, 4)) : s("", !0), l("span", {
+				class: "size-5 rounded-full border border-black/5",
+				style: g({ backgroundColor: t.color })
+			}, null, 4)], 6)]),
+			_: 1
+		}, 8, [
+			"while-press",
+			"transition",
+			"class"
+		]));
+	}
+});
+export { A as i, M as n, j as r, P as t };
+
+//# sourceMappingURL=color-selector-BUCIKQKf.js.map

package/dist/color-selector-BUCIKQKf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"color-selector-BUCIKQKf.js","names":["_hoisted_1","emit","_openBlock","_createElementBlock","_renderSlot","_createElementVNode","_normalizeStyle","_createCommentVNode","_sfc_main","_openBlock","_createBlock","_unref","_withCtx","_renderSlot","_sfc_main","_openBlock","_createBlock","_unref","_withCtx","_renderSlot","_sfc_main","$attrs","_openBlock","_createBlock","_unref","_normalizeClass","_withCtx","_createElementVNode","_mergeProps","_normalizeStyle","_createElementBlock","_createCommentVNode","_sfc_main","useReducedMotion","useMotionState","SPRING_PRESS","SPRING_LAYOUT","cn","_hoisted_1$1","ColorSelector_default","defineComponent","__emit","props","__props","selected","instanceId","useId","reduced","root","ref","origin","placed","ring","options","observer","animation","disposed","measure","option","anchor","bounds","target","to","from","immediate","lift","animate","bounded","progress","interpolate","key","context","computed","previous","nextTick","input","provide","watch","onMounted","onBeforeUnmount","openBlock","createElementBlock","renderSlot","_ctx","createElementVNode","normalizeStyle","createCommentVNode","ColorSelectorLabel_default","Surface","h","slots","createBlock","unref","withCtx","ColorSelectorList_default","_hoisted_1","ColorSelectorItem_default","group","inject","surface","disabled","register","choose","event","motion","normalizeClass","mergeProps"],"sources":["../src/motion/color-selector/src/ColorSelector.vue","../src/motion/color-selector/src/ColorSelector.vue","../src/motion/color-selector/src/ColorSelectorLabel.vue","../src/motion/color-selector/src/ColorSelectorLabel.vue","../src/motion/color-selector/src/ColorSelectorList.vue","../src/motion/color-selector/src/ColorSelectorList.vue","../src/motion/color-selector/src/ColorSelectorItem.vue","../src/motion/color-selector/src/ColorSelectorItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, onMounted, provide, ref, useId, watch } from \"vue\";\nimport { animate } from \"motion-v\";\nimport { SPRING_LAYOUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { useMotionState } from \"../../state\";\nimport type { ColorSelectorContext } from \"./context\";\nconst props = withDefaults(defineProps<{ modelValue?: string; defaultValue?: string; name?: string; form?: string; disabled?: boolean; required?: boolean }>(), { defaultValue: \"\" });\nconst emit = defineEmits([\"update:modelValue\", \"change\"]);\nconst selected = useMotionState(props, emit, \"modelValue\", props.defaultValue);\nconst instanceId = useId(), reduced = useReducedMotion();\nconst root = ref<HTMLElement | null>(null), origin = ref<HTMLElement | null>(null), placed = ref(false);\nconst ring = ref({ x: 0, y: 0, width: 52, height: 52, color: \"transparent\" });\nconst options = new Map<string, { element: HTMLElement; color: string }>();\nlet observer: ResizeObserver | undefined;\nlet animation: ReturnType<typeof animate> | undefined;\nlet disposed = false;\nfunction measure(immediate = false) {\n  if (disposed) return;\n  const option = options.get(selected.value), anchor = origin.value ?? root.value;\n  if (!option || !anchor) { placed.value = false; return; }\n  const bounds = anchor.getBoundingClientRect(), target = option.element.getBoundingClientRect();\n  const to = { x: target.left - bounds.left - 4, y: target.top - bounds.top - 4, width: target.width + 8, height: target.height + 8, color: option.color };\n  const from = ring.value;\n  animation?.stop();\n  if (!placed.value || immediate || reduced.value) { ring.value = to; placed.value = true; return; }\n  const lift = Math.hypot(to.x - from.x, to.y - from.y) * 0.4;\n  animation = animate(0, 1, { ...SPRING_LAYOUT, onUpdate(progress) {\n    if (disposed) return;\n    const bounded = Math.max(0, Math.min(1, progress));\n    const interpolate = (key: \"x\" | \"y\" | \"width\" | \"height\") => from[key] + progress * (to[key] - from[key]);\n    ring.value = { x: interpolate(\"x\"), y: interpolate(\"y\") - lift * bounded * (1 - bounded), width: interpolate(\"width\"), height: interpolate(\"height\"), color: to.color };\n  } });\n}\nconst context: ColorSelectorContext = {\n  value: selected, name: computed(() => props.name ?? instanceId), form: computed(() => props.form),\n  disabled: computed(() => props.disabled), required: computed(() => props.required), placed,\n  register(key, option) {\n    const previous = options.get(key);\n    if (previous?.element !== option.element && previous) observer?.unobserve(previous.element);\n    options.set(key, option);\n    observer?.observe(option.element);\n    void nextTick(() => measure(true));\n  },\n  unregister(key) {\n    const option = options.get(key);\n    if (option) observer?.unobserve(option.element);\n    options.delete(key);\n    void nextTick(() => measure(true));\n  },\n  select(key) {\n    if (!props.disabled && key !== selected.value) selected.value = key;\n    void nextTick(() => {\n      if (disposed) return;\n      root.value?.querySelectorAll<HTMLInputElement>('input[type=\"radio\"]').forEach(input => { input.checked = input.value === selected.value; });\n    });\n  },\n};\nprovide(\"orvui-color-selector\", context);\nwatch(selected, () => void nextTick(() => measure()));\nwatch(reduced, () => measure(true));\nonMounted(() => {\n  if (typeof ResizeObserver !== \"undefined\") {\n    observer = new ResizeObserver(() => measure(true));\n    if (root.value) observer.observe(root.value);\n    options.forEach(option => observer!.observe(option.element));\n  }\n  measure(true);\n});\nonBeforeUnmount(() => { disposed = true; animation?.stop(); observer?.disconnect(); options.clear(); });\n</script>\n<template>\n  <fieldset ref=\"root\" :disabled=\"disabled\" :form=\"form\" class=\"relative min-w-0 border-0 p-0\">\n    <slot /><span ref=\"origin\" aria-hidden=\"true\" class=\"pointer-events-none absolute left-0 top-0 size-0\" />\n    <span v-if=\"placed\" aria-hidden=\"true\" data-color-selection=\"\" class=\"pointer-events-none absolute rounded-full border-2\"\n      :style=\"{ left: 0, top: 0, width: `${ring.width}px`, height: `${ring.height}px`, transform: `translate(${ring.x}px,${ring.y}px)`, borderColor: `color-mix(in srgb, ${ring.color} 85%, transparent)` }\" />\n  </fieldset>\n</template>\n","<script setup lang=\"ts\">\nimport { computed, nextTick, onBeforeUnmount, onMounted, provide, ref, useId, watch } from \"vue\";\nimport { animate } from \"motion-v\";\nimport { SPRING_LAYOUT } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport { useMotionState } from \"../../state\";\nimport type { ColorSelectorContext } from \"./context\";\nconst props = withDefaults(defineProps<{ modelValue?: string; defaultValue?: string; name?: string; form?: string; disabled?: boolean; required?: boolean }>(), { defaultValue: \"\" });\nconst emit = defineEmits([\"update:modelValue\", \"change\"]);\nconst selected = useMotionState(props, emit, \"modelValue\", props.defaultValue);\nconst instanceId = useId(), reduced = useReducedMotion();\nconst root = ref<HTMLElement | null>(null), origin = ref<HTMLElement | null>(null), placed = ref(false);\nconst ring = ref({ x: 0, y: 0, width: 52, height: 52, color: \"transparent\" });\nconst options = new Map<string, { element: HTMLElement; color: string }>();\nlet observer: ResizeObserver | undefined;\nlet animation: ReturnType<typeof animate> | undefined;\nlet disposed = false;\nfunction measure(immediate = false) {\n  if (disposed) return;\n  const option = options.get(selected.value), anchor = origin.value ?? root.value;\n  if (!option || !anchor) { placed.value = false; return; }\n  const bounds = anchor.getBoundingClientRect(), target = option.element.getBoundingClientRect();\n  const to = { x: target.left - bounds.left - 4, y: target.top - bounds.top - 4, width: target.width + 8, height: target.height + 8, color: option.color };\n  const from = ring.value;\n  animation?.stop();\n  if (!placed.value || immediate || reduced.value) { ring.value = to; placed.value = true; return; }\n  const lift = Math.hypot(to.x - from.x, to.y - from.y) * 0.4;\n  animation = animate(0, 1, { ...SPRING_LAYOUT, onUpdate(progress) {\n    if (disposed) return;\n    const bounded = Math.max(0, Math.min(1, progress));\n    const interpolate = (key: \"x\" | \"y\" | \"width\" | \"height\") => from[key] + progress * (to[key] - from[key]);\n    ring.value = { x: interpolate(\"x\"), y: interpolate(\"y\") - lift * bounded * (1 - bounded), width: interpolate(\"width\"), height: interpolate(\"height\"), color: to.color };\n  } });\n}\nconst context: ColorSelectorContext = {\n  value: selected, name: computed(() => props.name ?? instanceId), form: computed(() => props.form),\n  disabled: computed(() => props.disabled), required: computed(() => props.required), placed,\n  register(key, option) {\n    const previous = options.get(key);\n    if (previous?.element !== option.element && previous) observer?.unobserve(previous.element);\n    options.set(key, option);\n    observer?.observe(option.element);\n    void nextTick(() => measure(true));\n  },\n  unregister(key) {\n    const option = options.get(key);\n    if (option) observer?.unobserve(option.element);\n    options.delete(key);\n    void nextTick(() => measure(true));\n  },\n  select(key) {\n    if (!props.disabled && key !== selected.value) selected.value = key;\n    void nextTick(() => {\n      if (disposed) return;\n      root.value?.querySelectorAll<HTMLInputElement>('input[type=\"radio\"]').forEach(input => { input.checked = input.value === selected.value; });\n    });\n  },\n};\nprovide(\"orvui-color-selector\", context);\nwatch(selected, () => void nextTick(() => measure()));\nwatch(reduced, () => measure(true));\nonMounted(() => {\n  if (typeof ResizeObserver !== \"undefined\") {\n    observer = new ResizeObserver(() => measure(true));\n    if (root.value) observer.observe(root.value);\n    options.forEach(option => observer!.observe(option.element));\n  }\n  measure(true);\n});\nonBeforeUnmount(() => { disposed = true; animation?.stop(); observer?.disconnect(); options.clear(); });\n</script>\n<template>\n  <fieldset ref=\"root\" :disabled=\"disabled\" :form=\"form\" class=\"relative min-w-0 border-0 p-0\">\n    <slot /><span ref=\"origin\" aria-hidden=\"true\" class=\"pointer-events-none absolute left-0 top-0 size-0\" />\n    <span v-if=\"placed\" aria-hidden=\"true\" data-color-selection=\"\" class=\"pointer-events-none absolute rounded-full border-2\"\n      :style=\"{ left: 0, top: 0, width: `${ring.width}px`, height: `${ring.height}px`, transform: `translate(${ring.x}px,${ring.y}px)`, borderColor: `color-mix(in srgb, ${ring.color} 85%, transparent)` }\" />\n  </fieldset>\n</template>\n","<script setup lang=\"ts\">\nimport { defineComponent, h } from \"vue\";\nconst Surface = defineComponent({ name: \"ColorSelectorLabel\", setup(_, { slots }) {\n  return () => h(\"legend\", { class: \"mb-3 p-0 text-sm font-medium text-muted-foreground\" }, slots.default?.());\n} });\ndefineSlots<{ default?: () => any }>();\n</script>\n<template><Surface><slot /></Surface></template>\n","<script setup lang=\"ts\">\nimport { defineComponent, h } from \"vue\";\nconst Surface = defineComponent({ name: \"ColorSelectorLabel\", setup(_, { slots }) {\n  return () => h(\"legend\", { class: \"mb-3 p-0 text-sm font-medium text-muted-foreground\" }, slots.default?.());\n} });\ndefineSlots<{ default?: () => any }>();\n</script>\n<template><Surface><slot /></Surface></template>\n","<script setup lang=\"ts\">\nimport { defineComponent, h } from \"vue\";\nconst Surface = defineComponent({ name: \"ColorSelectorList\", setup(_, { slots }) {\n  return () => h(\"div\", { class: \"flex flex-wrap items-center gap-3 p-1\" }, slots.default?.());\n} });\ndefineSlots<{ default?: () => any }>();\n</script>\n<template><Surface><slot /></Surface></template>\n","<script setup lang=\"ts\">\nimport { defineComponent, h } from \"vue\";\nconst Surface = defineComponent({ name: \"ColorSelectorList\", setup(_, { slots }) {\n  return () => h(\"div\", { class: \"flex flex-wrap items-center gap-3 p-1\" }, slots.default?.());\n} });\ndefineSlots<{ default?: () => any }>();\n</script>\n<template><Surface><slot /></Surface></template>\n","<script setup lang=\"ts\">\ndefineOptions({ inheritAttrs: false });\nimport { computed, inject, nextTick, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { cn } from \"../../../lib/utils\";\nimport { SPRING_PRESS } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport type { ColorSelectorContext } from \"./context\";\nconst props = defineProps<{ value: string; color: string; label: string; disabled?: boolean }>();\nconst group = inject<ColorSelectorContext>(\"orvui-color-selector\");\nif (!group) throw new Error(\"ColorSelectorItem must be inside ColorSelector\");\nconst surface = ref<HTMLElement | null>(null), reduced = useReducedMotion();\nconst selected = computed(() => group.value.value === props.value);\nconst disabled = computed(() => props.disabled || group.disabled.value);\nlet disposed = false;\nfunction register() { if (!disposed && surface.value) group!.register(props.value, { element: surface.value, color: props.color }); }\nfunction choose(event: Event) { if (!disabled.value && !event.defaultPrevented) group!.select(props.value); }\nonMounted(register);\nwatch(() => [props.value, props.color] as const, (_, previous) => { group.unregister(previous[0]); void nextTick(register); });\nonBeforeUnmount(() => { disposed = true; group.unregister(props.value); });\n</script>\n<template>\n  <motion.label :tabindex=\"-1\" :while-press=\"reduced || disabled ? undefined : { scale: 0.94 }\" :transition=\"SPRING_PRESS\"\n    :class=\"cn('relative inline-flex shrink-0 rounded-full', disabled ? 'cursor-not-allowed opacity-40' : 'cursor-pointer')\">\n    <input v-bind=\"$attrs\" type=\"radio\" :name=\"group.name.value\" :value=\"value\" :checked=\"selected\" :disabled=\"disabled\"\n      :required=\"group.required.value\" :form=\"group.form.value\" :aria-label=\"label\" @change=\"choose\" class=\"peer sr-only\" />\n    <span ref=\"surface\" aria-hidden=\"true\" :style=\"$attrs.style as any\"\n      :class=\"cn('relative flex size-11 items-center justify-center rounded-full border border-foreground/10 bg-muted/60 peer-focus-visible:outline-2 peer-focus-visible:outline-offset-4 peer-focus-visible:outline-foreground', $attrs.class as string)\">\n      <span v-if=\"selected && !group.placed.value\" class=\"pointer-events-none absolute -inset-1 rounded-full border-2\" :style=\"{ borderColor: `color-mix(in srgb, ${color} 85%, transparent)` }\" />\n      <span class=\"size-5 rounded-full border border-black/5\" :style=\"{ backgroundColor: color }\" />\n    </span>\n  </motion.label>\n</template>\n","<script setup lang=\"ts\">\ndefineOptions({ inheritAttrs: false });\nimport { computed, inject, nextTick, onBeforeUnmount, onMounted, ref, watch } from \"vue\";\nimport { motion } from \"motion-v\";\nimport { cn } from \"../../../lib/utils\";\nimport { SPRING_PRESS } from \"../../../lib/ease\";\nimport { useReducedMotion } from \"../../../lib/composables\";\nimport type { ColorSelectorContext } from \"./context\";\nconst props = defineProps<{ value: string; color: string; label: string; disabled?: boolean }>();\nconst group = inject<ColorSelectorContext>(\"orvui-color-selector\");\nif (!group) throw new Error(\"ColorSelectorItem must be inside ColorSelector\");\nconst surface = ref<HTMLElement | null>(null), reduced = useReducedMotion();\nconst selected = computed(() => group.value.value === props.value);\nconst disabled = computed(() => props.disabled || group.disabled.value);\nlet disposed = false;\nfunction register() { if (!disposed && surface.value) group!.register(props.value, { element: surface.value, color: props.color }); }\nfunction choose(event: Event) { if (!disabled.value && !event.defaultPrevented) group!.select(props.value); }\nonMounted(register);\nwatch(() => [props.value, props.color] as const, (_, previous) => { group.unregister(previous[0]); void nextTick(register); });\nonBeforeUnmount(() => { disposed = true; group.unregister(props.value); });\n</script>\n<template>\n  <motion.label :tabindex=\"-1\" :while-press=\"reduced || disabled ? undefined : { scale: 0.94 }\" :transition=\"SPRING_PRESS\"\n    :class=\"cn('relative inline-flex shrink-0 rounded-full', disabled ? 'cursor-not-allowed opacity-40' : 'cursor-pointer')\">\n    <input v-bind=\"$attrs\" type=\"radio\" :name=\"group.name.value\" :value=\"value\" :checked=\"selected\" :disabled=\"disabled\"\n      :required=\"group.required.value\" :form=\"group.form.value\" :aria-label=\"label\" @change=\"choose\" class=\"peer sr-only\" />\n    <span ref=\"surface\" aria-hidden=\"true\" :style=\"$attrs.style as any\"\n      :class=\"cn('relative flex size-11 items-center justify-center rounded-full border border-foreground/10 bg-muted/60 peer-focus-visible:outline-2 peer-focus-visible:outline-offset-4 peer-focus-visible:outline-foreground', $attrs.class as string)\">\n      <span v-if=\"selected && !group.placed.value\" class=\"pointer-events-none absolute -inset-1 rounded-full border-2\" :style=\"{ borderColor: `color-mix(in srgb, ${color} 85%, transparent)` }\" />\n      <span class=\"size-5 rounded-full border border-black/5\" :style=\"{ backgroundColor: color }\" />\n    </span>\n  </motion.label>\n</template>\n"],"mappings":"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"}