vunor 0.3.2 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/README.md +6 -1
  2. package/dist/AppLayout.mjs +17 -68
  3. package/dist/AppToasts.d.mts +3 -0
  4. package/dist/AppToasts.mjs +59 -76
  5. package/dist/Button.d.mts +26 -10
  6. package/dist/Button.mjs +95 -60
  7. package/dist/ButtonBase.mjs +26 -40
  8. package/dist/Calendar.d.mts +14 -2
  9. package/dist/Calendar.mjs +37 -85
  10. package/dist/Card.mjs +6 -25
  11. package/dist/CardHeader.mjs +3 -12
  12. package/dist/Checkbox.d.mts +7 -2
  13. package/dist/Checkbox.mjs +37 -45
  14. package/dist/Combobox.d.mts +24 -8
  15. package/dist/Combobox.mjs +274 -350
  16. package/dist/DatePicker.d.mts +18 -4
  17. package/dist/DatePicker.mjs +93 -216
  18. package/dist/DatePickerBase.d.mts +21 -8
  19. package/dist/DatePickerBase.mjs +108 -257
  20. package/dist/DatePickerPopup.d.mts +27 -2
  21. package/dist/DatePickerPopup.mjs +62 -13
  22. package/dist/DelayedSwitch.mjs +3 -14
  23. package/dist/DevTools.mjs +377 -388
  24. package/dist/Dialog.d.mts +8 -3
  25. package/dist/Dialog.mjs +77 -107
  26. package/dist/Icon.mjs +1 -4
  27. package/dist/InnerLoading.mjs +1 -4
  28. package/dist/Input.mjs +35 -126
  29. package/dist/InputBase.mjs +28 -93
  30. package/dist/LoadingIndicator.mjs +1 -5
  31. package/dist/Menu.mjs +44 -65
  32. package/dist/MenuItem.mjs +4 -16
  33. package/dist/OverflowContainer.mjs +9 -11
  34. package/dist/Pagination.mjs +11 -29
  35. package/dist/Popover.d.mts +39 -11
  36. package/dist/Popover.mjs +80 -99
  37. package/dist/ProgressBar.d.mts +9 -2
  38. package/dist/ProgressBar.mjs +11 -27
  39. package/dist/RadioGroup.d.mts +2 -1
  40. package/dist/RadioGroup.mjs +33 -47
  41. package/dist/Select.d.mts +24 -7
  42. package/dist/Select.mjs +94 -186
  43. package/dist/SelectBase.d.mts +26 -11
  44. package/dist/SelectBase.mjs +59 -83
  45. package/dist/Slider.d.mts +6 -1
  46. package/dist/Slider.mjs +34 -103
  47. package/dist/Tabs.mjs +13 -49
  48. package/dist/forward-root-DPGTBptG.js +125 -0
  49. package/dist/nuxt.mjs +36 -1
  50. package/dist/theme.d.mts +1 -1
  51. package/dist/theme.mjs +15 -4
  52. package/dist/{utils-6bTTIoaw.js → utils-BCBGEM10.js} +30 -1
  53. package/dist/utils.mjs +1 -1
  54. package/dist/vite.d.mts +13 -4
  55. package/dist/vite.mjs +5 -0
  56. package/package.json +24 -9
  57. package/dist/utils-Z0nPSAzb.js +0 -42
package/dist/DevTools.mjs CHANGED
@@ -350,10 +350,7 @@ const _hoisted_9 = {
350
350
  //#region src/components/DevTools/DevTools.vue
351
351
  var DevTools_default = /* @__PURE__ */ defineComponent({
352
352
  __name: "DevTools",
353
- props: /* @__PURE__ */ mergeModels({ defaultOpen: {
354
- type: Boolean,
355
- required: false
356
- } }, {
353
+ props: /* @__PURE__ */ mergeModels({ defaultOpen: { type: Boolean } }, {
357
354
  "open": {},
358
355
  "openModifiers": {}
359
356
  }),
@@ -629,439 +626,431 @@ var DevTools_default = /* @__PURE__ */ defineComponent({
629
626
  "w-[34em] h-[44em]": modelValue.value,
630
627
  "w-[3em] h-[3em]": !modelValue.value
631
628
  }])
632
- }, [
633
- createVNode(unref(VuCard$1), {
634
- "no-padding": "",
635
- rounded: "",
636
- level: "h6",
637
- class: normalizeClass(["layer-0 transition-all-200 w-[34em] h-[44em] border border-grey-500/50 overflow-clip flex flex-col transform-origin-tl", {
638
- "scale-100 shadow-md opacity-50 hover:opacity-100": modelValue.value,
639
- "scale-20 opacity-0 pointer-events-none": !modelValue.value
640
- }])
641
- }, {
642
- default: withCtx(() => [
643
- createVNode(unref(VuCardInner), {
644
- onMousedown: onMouseDown,
645
- class: normalizeClass([{
646
- "cursor-grab": !down.value,
647
- "cursor-grabbing": down.value
648
- }, "layer-2 flex justify-between items-center fingertip-[1em] select-none"])
649
- }, {
650
- default: withCtx(() => [createVNode(unref(VuCardHeader$1), { class: "text-mb-0 text-mt-0" }, {
651
- default: withCtx(() => [..._cache[27] || (_cache[27] = [createTextVNode("Vunor Palette Sandbox", -1)])]),
652
- _: 1
653
- }), createVNode(unref(VuButton$1), {
654
- icon: "i--clear",
655
- class: "c8-flat btn-square rounded",
656
- onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"])),
657
- onClick: _cache[1] || (_cache[1] = withModifiers(($event) => modelValue.value = !modelValue.value, ["stop"]))
658
- })]),
659
- _: 1
660
- }, 8, ["class"]),
661
- createVNode(unref(VuCardInner), { class: "layer-0 border-b" }, {
662
- default: withCtx(() => [createVNode(VuTabs, {
663
- "default-value": "colors",
664
- modelValue: tab.value,
665
- "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => tab.value = $event),
666
- tabs: [
667
- {
668
- value: "colors",
669
- label: "Colors"
670
- },
671
- {
672
- value: "main",
673
- label: "Main"
674
- },
675
- {
676
- value: "layers",
677
- label: "Layers"
678
- },
679
- {
680
- value: "misc",
681
- label: "Misc"
682
- }
683
- ]
684
- }, null, 8, ["modelValue"])]),
629
+ }, [createVNode(unref(VuCard$1), {
630
+ "no-padding": "",
631
+ rounded: "",
632
+ level: "h6",
633
+ class: normalizeClass(["layer-0 transition-all-200 w-[34em] h-[44em] border border-grey-500/50 overflow-clip flex flex-col transform-origin-tl", {
634
+ "scale-100 shadow-md opacity-50 hover:opacity-100": modelValue.value,
635
+ "scale-20 opacity-0 pointer-events-none": !modelValue.value
636
+ }])
637
+ }, {
638
+ default: withCtx(() => [
639
+ createVNode(unref(VuCardInner), {
640
+ onMousedown: onMouseDown,
641
+ class: normalizeClass([{
642
+ "cursor-grab": !down.value,
643
+ "cursor-grabbing": down.value
644
+ }, "layer-2 flex justify-between items-center fingertip-[1em] select-none"])
645
+ }, {
646
+ default: withCtx(() => [createVNode(unref(VuCardHeader$1), { class: "text-mb-0 text-mt-0" }, {
647
+ default: withCtx(() => [..._cache[27] || (_cache[27] = [createTextVNode("Vunor Palette Sandbox", -1)])]),
685
648
  _: 1
686
- }),
687
- createVNode(unref(VuCardInner), { class: "layer-0 flex-grow overflow-auto pt-$l" }, {
688
- default: withCtx(() => [
689
- createCommentVNode(" COLORS TAB "),
690
- tab.value === "colors" ? (openBlock(), createElementBlock("div", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(colors.value, (c) => {
691
- return openBlock(), createElementBlock("div", {
692
- key: c.name,
693
- class: "border-b border-grey-500/30 pb-$xs mb-$xs"
694
- }, [createElementVNode("div", _hoisted_2, [
695
- withDirectives(createElementVNode("input", {
696
- type: "color",
697
- id: `vunor-color-${c.name}`,
698
- "onUpdate:modelValue": ($event) => c.color = $event,
699
- class: "p-0 size-[2em] bg-transparent border-0",
700
- onInput: _cache[3] || (_cache[3] = (...args) => unref(apply) && unref(apply)(...args))
701
- }, null, 40, _hoisted_3), [[vModelText, c.color]]),
702
- withDirectives(createElementVNode("input", {
703
- "onUpdate:modelValue": ($event) => c.color = $event,
704
- onInput: _cache[4] || (_cache[4] = (...args) => unref(apply) && unref(apply)(...args)),
705
- class: "flex-grow bg-transparent border border-grey-500/30 px-$xs py-1 rounded text-mono"
706
- }, null, 40, _hoisted_4), [[vModelText, c.color]]),
707
- createElementVNode("strong", _hoisted_5, toDisplayString(c.name), 1),
708
- createVNode(unref(VuButton$1), {
709
- icon: expandedColor.value === c.name ? "i--chevron-up" : "i--chevron-down",
710
- class: "c8-flat btn-square rounded",
711
- onClick: ($event) => expandedColor.value = expandedColor.value === c.name ? null : c.name
712
- }, null, 8, ["icon", "onClick"])
713
- ]), expandedColor.value === c.name ? (openBlock(), createElementBlock("div", _hoisted_6, [
714
- createVNode(VuSlider, {
715
- label: `saturate.dark ${fmt(c.saturateDark[0])}`,
716
- min: -1,
717
- max: 1,
718
- step: .05,
719
- modelValue: c.saturateDark,
720
- "onUpdate:modelValue": [($event) => c.saturateDark = $event, unref(apply)]
721
- }, null, 8, [
722
- "label",
723
- "modelValue",
724
- "onUpdate:modelValue"
725
- ]),
726
- createVNode(VuSlider, {
727
- label: `saturate.light ${fmt(c.saturateLight[0])}`,
728
- min: -1,
729
- max: 1,
730
- step: .05,
731
- modelValue: c.saturateLight,
732
- "onUpdate:modelValue": [($event) => c.saturateLight = $event, unref(apply)]
733
- }, null, 8, [
734
- "label",
735
- "modelValue",
736
- "onUpdate:modelValue"
737
- ]),
738
- createVNode(VuSlider, {
739
- label: `vivid.dark ${fmt(c.vividDark[0])}`,
740
- min: 0,
741
- max: 1,
742
- step: .05,
743
- modelValue: c.vividDark,
744
- "onUpdate:modelValue": [($event) => c.vividDark = $event, unref(apply)]
745
- }, null, 8, [
746
- "label",
747
- "modelValue",
748
- "onUpdate:modelValue"
749
- ]),
750
- createVNode(VuSlider, {
751
- label: `vivid.light ${fmt(c.vividLight[0])}`,
752
- min: 0,
753
- max: 1,
754
- step: .05,
755
- modelValue: c.vividLight,
756
- "onUpdate:modelValue": [($event) => c.vividLight = $event, unref(apply)]
757
- }, null, 8, [
758
- "label",
759
- "modelValue",
760
- "onUpdate:modelValue"
761
- ]),
762
- createVNode(VuSlider, {
763
- label: `flatness ${fmt(c.flatness[0])}`,
764
- min: 0,
765
- max: 1,
766
- step: .01,
767
- modelValue: c.flatness,
768
- "onUpdate:modelValue": [($event) => c.flatness = $event, unref(apply)]
769
- }, null, 8, [
770
- "label",
771
- "modelValue",
772
- "onUpdate:modelValue"
773
- ]),
774
- createVNode(VuCheckbox, {
775
- modelValue: c.preserveInputColor[0],
776
- "onUpdate:modelValue": [($event) => c.preserveInputColor[0] = $event, unref(apply)],
777
- label: "preserveInputColor"
778
- }, null, 8, ["modelValue", "onUpdate:modelValue"])
779
- ])) : createCommentVNode("v-if", true)]);
780
- }), 128))])) : createCommentVNode("v-if", true),
781
- createCommentVNode(" MAIN PALETTE TAB "),
782
- tab.value === "main" && main.value ? (openBlock(), createElementBlock("div", _hoisted_7, [
783
- createVNode(VuSlider, {
784
- label: `luminance.dark ${fmt(main.value.lumDark[0])}`,
785
- min: 0,
786
- max: 1,
787
- step: .01,
788
- modelValue: main.value.lumDark,
789
- "onUpdate:modelValue": [_cache[5] || (_cache[5] = ($event) => main.value.lumDark = $event), unref(apply)]
790
- }, null, 8, [
791
- "label",
792
- "modelValue",
793
- "onUpdate:modelValue"
794
- ]),
649
+ }), createVNode(unref(VuButton$1), {
650
+ icon: "i--clear",
651
+ class: "c8-flat btn-square rounded",
652
+ onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"])),
653
+ onClick: _cache[1] || (_cache[1] = withModifiers(($event) => modelValue.value = !modelValue.value, ["stop"]))
654
+ })]),
655
+ _: 1
656
+ }, 8, ["class"]),
657
+ createVNode(unref(VuCardInner), { class: "layer-0 border-b" }, {
658
+ default: withCtx(() => [createVNode(VuTabs, {
659
+ "default-value": "colors",
660
+ modelValue: tab.value,
661
+ "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => tab.value = $event),
662
+ tabs: [
663
+ {
664
+ value: "colors",
665
+ label: "Colors"
666
+ },
667
+ {
668
+ value: "main",
669
+ label: "Main"
670
+ },
671
+ {
672
+ value: "layers",
673
+ label: "Layers"
674
+ },
675
+ {
676
+ value: "misc",
677
+ label: "Misc"
678
+ }
679
+ ]
680
+ }, null, 8, ["modelValue"])]),
681
+ _: 1
682
+ }),
683
+ createVNode(unref(VuCardInner), { class: "layer-0 flex-grow overflow-auto pt-$l" }, {
684
+ default: withCtx(() => [
685
+ tab.value === "colors" ? (openBlock(), createElementBlock("div", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(colors.value, (c) => {
686
+ return openBlock(), createElementBlock("div", {
687
+ key: c.name,
688
+ class: "border-b border-grey-500/30 pb-$xs mb-$xs"
689
+ }, [createElementVNode("div", _hoisted_2, [
690
+ withDirectives(createElementVNode("input", {
691
+ type: "color",
692
+ id: `vunor-color-${c.name}`,
693
+ "onUpdate:modelValue": ($event) => c.color = $event,
694
+ class: "p-0 size-[2em] bg-transparent border-0",
695
+ onInput: _cache[3] || (_cache[3] = (...args) => unref(apply) && unref(apply)(...args))
696
+ }, null, 40, _hoisted_3), [[vModelText, c.color]]),
697
+ withDirectives(createElementVNode("input", {
698
+ "onUpdate:modelValue": ($event) => c.color = $event,
699
+ onInput: _cache[4] || (_cache[4] = (...args) => unref(apply) && unref(apply)(...args)),
700
+ class: "flex-grow bg-transparent border border-grey-500/30 px-$xs py-1 rounded text-mono"
701
+ }, null, 40, _hoisted_4), [[vModelText, c.color]]),
702
+ createElementVNode("strong", _hoisted_5, toDisplayString(c.name), 1),
703
+ createVNode(unref(VuButton$1), {
704
+ icon: expandedColor.value === c.name ? "i--chevron-up" : "i--chevron-down",
705
+ class: "c8-flat btn-square rounded",
706
+ onClick: ($event) => expandedColor.value = expandedColor.value === c.name ? null : c.name
707
+ }, null, 8, ["icon", "onClick"])
708
+ ]), expandedColor.value === c.name ? (openBlock(), createElementBlock("div", _hoisted_6, [
795
709
  createVNode(VuSlider, {
796
- label: `luminance.light ${fmt(main.value.lumLight[0])}`,
797
- min: 0,
798
- max: 1,
799
- step: .01,
800
- modelValue: main.value.lumLight,
801
- "onUpdate:modelValue": [_cache[6] || (_cache[6] = ($event) => main.value.lumLight = $event), unref(apply)]
802
- }, null, 8, [
803
- "label",
804
- "modelValue",
805
- "onUpdate:modelValue"
806
- ]),
807
- createVNode(VuSlider, {
808
- label: `luminance.middle ${fmt(main.value.lumMiddle[0])}`,
809
- min: 0,
810
- max: 1,
811
- step: .01,
812
- modelValue: main.value.lumMiddle,
813
- "onUpdate:modelValue": [_cache[7] || (_cache[7] = ($event) => main.value.lumMiddle = $event), unref(apply)]
814
- }, null, 8, [
815
- "label",
816
- "modelValue",
817
- "onUpdate:modelValue"
818
- ]),
819
- createVNode(VuCheckbox, {
820
- modelValue: main.value.useMiddle[0],
821
- "onUpdate:modelValue": [_cache[8] || (_cache[8] = ($event) => main.value.useMiddle[0] = $event), unref(apply)],
822
- label: "luminance.useMiddle"
823
- }, null, 8, ["modelValue", "onUpdate:modelValue"]),
824
- createVNode(VuSlider, {
825
- label: `saturate.dark ${fmt(main.value.saturateDark[0])}`,
710
+ label: `saturate.dark ${fmt(c.saturateDark[0])}`,
826
711
  min: -1,
827
712
  max: 1,
828
713
  step: .05,
829
- modelValue: main.value.saturateDark,
830
- "onUpdate:modelValue": [_cache[9] || (_cache[9] = ($event) => main.value.saturateDark = $event), unref(apply)]
714
+ modelValue: c.saturateDark,
715
+ "onUpdate:modelValue": [($event) => c.saturateDark = $event, unref(apply)]
831
716
  }, null, 8, [
832
717
  "label",
833
718
  "modelValue",
834
719
  "onUpdate:modelValue"
835
720
  ]),
836
721
  createVNode(VuSlider, {
837
- label: `saturate.light ${fmt(main.value.saturateLight[0])}`,
722
+ label: `saturate.light ${fmt(c.saturateLight[0])}`,
838
723
  min: -1,
839
724
  max: 1,
840
725
  step: .05,
841
- modelValue: main.value.saturateLight,
842
- "onUpdate:modelValue": [_cache[10] || (_cache[10] = ($event) => main.value.saturateLight = $event), unref(apply)]
726
+ modelValue: c.saturateLight,
727
+ "onUpdate:modelValue": [($event) => c.saturateLight = $event, unref(apply)]
843
728
  }, null, 8, [
844
729
  "label",
845
730
  "modelValue",
846
731
  "onUpdate:modelValue"
847
732
  ]),
848
733
  createVNode(VuSlider, {
849
- label: `vivid.dark ${fmt(main.value.vividDark[0])}`,
734
+ label: `vivid.dark ${fmt(c.vividDark[0])}`,
850
735
  min: 0,
851
736
  max: 1,
852
737
  step: .05,
853
- modelValue: main.value.vividDark,
854
- "onUpdate:modelValue": [_cache[11] || (_cache[11] = ($event) => main.value.vividDark = $event), unref(apply)]
738
+ modelValue: c.vividDark,
739
+ "onUpdate:modelValue": [($event) => c.vividDark = $event, unref(apply)]
855
740
  }, null, 8, [
856
741
  "label",
857
742
  "modelValue",
858
743
  "onUpdate:modelValue"
859
744
  ]),
860
745
  createVNode(VuSlider, {
861
- label: `vivid.light ${fmt(main.value.vividLight[0])}`,
746
+ label: `vivid.light ${fmt(c.vividLight[0])}`,
862
747
  min: 0,
863
748
  max: 1,
864
749
  step: .05,
865
- modelValue: main.value.vividLight,
866
- "onUpdate:modelValue": [_cache[12] || (_cache[12] = ($event) => main.value.vividLight = $event), unref(apply)]
750
+ modelValue: c.vividLight,
751
+ "onUpdate:modelValue": [($event) => c.vividLight = $event, unref(apply)]
867
752
  }, null, 8, [
868
753
  "label",
869
754
  "modelValue",
870
755
  "onUpdate:modelValue"
871
756
  ]),
872
757
  createVNode(VuSlider, {
873
- label: `flatness ${fmt(main.value.flatness[0])}`,
758
+ label: `flatness ${fmt(c.flatness[0])}`,
874
759
  min: 0,
875
760
  max: 1,
876
761
  step: .01,
877
- modelValue: main.value.flatness,
878
- "onUpdate:modelValue": [_cache[13] || (_cache[13] = ($event) => main.value.flatness = $event), unref(apply)]
762
+ modelValue: c.flatness,
763
+ "onUpdate:modelValue": [($event) => c.flatness = $event, unref(apply)]
879
764
  }, null, 8, [
880
765
  "label",
881
766
  "modelValue",
882
767
  "onUpdate:modelValue"
883
768
  ]),
884
769
  createVNode(VuCheckbox, {
885
- modelValue: main.value.preserveInputColor[0],
886
- "onUpdate:modelValue": [_cache[14] || (_cache[14] = ($event) => main.value.preserveInputColor[0] = $event), unref(apply)],
770
+ modelValue: c.preserveInputColor[0],
771
+ "onUpdate:modelValue": [($event) => c.preserveInputColor[0] = $event, unref(apply)],
887
772
  label: "preserveInputColor"
888
773
  }, null, 8, ["modelValue", "onUpdate:modelValue"])
889
- ])) : createCommentVNode("v-if", true),
890
- createCommentVNode(" LAYERS PALETTE TAB "),
891
- tab.value === "layers" && layer.value ? (openBlock(), createElementBlock("div", _hoisted_8, [
892
- createVNode(VuSlider, {
893
- label: `desaturate ${fmt(layer.value.desaturate[0])}`,
894
- min: 0,
895
- max: 1,
896
- step: .05,
897
- modelValue: layer.value.desaturate,
898
- "onUpdate:modelValue": [_cache[15] || (_cache[15] = ($event) => layer.value.desaturate = $event), unref(apply)]
899
- }, null, 8, [
900
- "label",
901
- "modelValue",
902
- "onUpdate:modelValue"
903
- ]),
904
- createVNode(VuSlider, {
905
- label: `flatness ${fmt(layer.value.flatness[0])}`,
906
- min: 0,
907
- max: 1,
908
- step: .01,
909
- modelValue: layer.value.flatness,
910
- "onUpdate:modelValue": [_cache[16] || (_cache[16] = ($event) => layer.value.flatness = $event), unref(apply)]
911
- }, null, 8, [
912
- "label",
913
- "modelValue",
914
- "onUpdate:modelValue"
915
- ]),
916
- createVNode(VuSlider, {
917
- label: `luminance.dark ${fmt(layer.value.lumDark[0])}`,
918
- min: 0,
919
- max: 1,
920
- step: .01,
921
- modelValue: layer.value.lumDark,
922
- "onUpdate:modelValue": [_cache[17] || (_cache[17] = ($event) => layer.value.lumDark = $event), unref(apply)]
923
- }, null, 8, [
924
- "label",
925
- "modelValue",
926
- "onUpdate:modelValue"
927
- ]),
928
- createVNode(VuSlider, {
929
- label: `luminance.light ${fmt(layer.value.lumLight[0])}`,
930
- min: 0,
931
- max: 1,
932
- step: .01,
933
- modelValue: layer.value.lumLight,
934
- "onUpdate:modelValue": [_cache[18] || (_cache[18] = ($event) => layer.value.lumLight = $event), unref(apply)]
935
- }, null, 8, [
936
- "label",
937
- "modelValue",
938
- "onUpdate:modelValue"
939
- ]),
940
- createVNode(VuSlider, {
941
- label: `saturate.dark ${fmt(layer.value.saturateDark[0])}`,
942
- min: -1,
943
- max: 1,
944
- step: .05,
945
- modelValue: layer.value.saturateDark,
946
- "onUpdate:modelValue": [_cache[19] || (_cache[19] = ($event) => layer.value.saturateDark = $event), unref(apply)]
947
- }, null, 8, [
948
- "label",
949
- "modelValue",
950
- "onUpdate:modelValue"
951
- ]),
952
- createVNode(VuSlider, {
953
- label: `saturate.light ${fmt(layer.value.saturateLight[0])}`,
954
- min: -1,
955
- max: 1,
956
- step: .05,
957
- modelValue: layer.value.saturateLight,
958
- "onUpdate:modelValue": [_cache[20] || (_cache[20] = ($event) => layer.value.saturateLight = $event), unref(apply)]
959
- }, null, 8, [
960
- "label",
961
- "modelValue",
962
- "onUpdate:modelValue"
963
- ]),
964
- createVNode(VuSlider, {
965
- label: `vivid.dark ${fmt(layer.value.vividDark[0])}`,
966
- min: 0,
967
- max: 1,
968
- step: .05,
969
- modelValue: layer.value.vividDark,
970
- "onUpdate:modelValue": [_cache[21] || (_cache[21] = ($event) => layer.value.vividDark = $event), unref(apply)]
971
- }, null, 8, [
972
- "label",
973
- "modelValue",
974
- "onUpdate:modelValue"
975
- ]),
976
- createVNode(VuSlider, {
977
- label: `vivid.light ${fmt(layer.value.vividLight[0])}`,
978
- min: 0,
979
- max: 1,
980
- step: .05,
981
- modelValue: layer.value.vividLight,
982
- "onUpdate:modelValue": [_cache[22] || (_cache[22] = ($event) => layer.value.vividLight = $event), unref(apply)]
983
- }, null, 8, [
984
- "label",
985
- "modelValue",
986
- "onUpdate:modelValue"
987
- ])
988
- ])) : createCommentVNode("v-if", true),
989
- createCommentVNode(" MISC TAB "),
990
- tab.value === "misc" && misc.value ? (openBlock(), createElementBlock("div", _hoisted_9, [
991
- createVNode(VuSlider, {
992
- label: `darkest ${fmt(misc.value.darkest[0])}`,
993
- min: 0,
994
- max: 1,
995
- step: .01,
996
- modelValue: misc.value.darkest,
997
- "onUpdate:modelValue": [_cache[23] || (_cache[23] = ($event) => misc.value.darkest = $event), unref(apply)]
998
- }, null, 8, [
999
- "label",
1000
- "modelValue",
1001
- "onUpdate:modelValue"
1002
- ]),
1003
- createVNode(VuSlider, {
1004
- label: `lightest ${fmt(misc.value.lightest[0])}`,
1005
- min: 0,
1006
- max: 1,
1007
- step: .01,
1008
- modelValue: misc.value.lightest,
1009
- "onUpdate:modelValue": [_cache[24] || (_cache[24] = ($event) => misc.value.lightest = $event), unref(apply)]
1010
- }, null, 8, [
1011
- "label",
1012
- "modelValue",
1013
- "onUpdate:modelValue"
1014
- ]),
1015
- createVNode(VuSlider, {
1016
- label: `layersDepth ${fmt(misc.value.layersDepth[0])}`,
1017
- min: 0,
1018
- max: .5,
1019
- step: .01,
1020
- modelValue: misc.value.layersDepth,
1021
- "onUpdate:modelValue": [_cache[25] || (_cache[25] = ($event) => misc.value.layersDepth = $event), unref(apply)]
1022
- }, null, 8, [
1023
- "label",
1024
- "modelValue",
1025
- "onUpdate:modelValue"
1026
- ]),
1027
- createVNode(VuSlider, {
1028
- label: `flatness (top-level) ${fmt(misc.value.flatness[0])}`,
1029
- min: 0,
1030
- max: 1,
1031
- step: .01,
1032
- modelValue: misc.value.flatness,
1033
- "onUpdate:modelValue": [_cache[26] || (_cache[26] = ($event) => misc.value.flatness = $event), unref(apply)]
1034
- }, null, 8, [
1035
- "label",
1036
- "modelValue",
1037
- "onUpdate:modelValue"
1038
- ])
1039
- ])) : createCommentVNode("v-if", true)
1040
- ]),
1041
- _: 1
1042
- }),
1043
- createVNode(unref(VuCardInner), { class: "layer-2 flex justify-center" }, {
1044
- default: withCtx(() => [createVNode(unref(VuButton$1), {
1045
- label: "Reset All",
1046
- onClick: reset,
1047
- class: "c8-flat"
1048
- })]),
1049
- _: 1
1050
- })
1051
- ]),
1052
- _: 1
1053
- }, 8, ["class"]),
1054
- createCommentVNode(" prettier-ignore-attribute class "),
1055
- createElementVNode("div", {
1056
- class: normalizeClass(["absolute shadow-[0_0_5px_2px_rgb(var(--scope-color-500))] left-0 top-0 size-[3em] rounded-full transition-opacity-200 surface-500 flex justify-center items-center current-outline-primary-700 outline-current outline-[2px] outline-solid hover:opacity-100 cursor-pointer select-none", {
1057
- "opacity-0 pointer-events-none": modelValue.value,
1058
- "opacity-50": !modelValue.value,
1059
- "cursor-grabbing": down.value
1060
- }]),
1061
- title: "Vunor Palette Sandbox",
1062
- onMousedown: onMouseDown
1063
- }, [..._cache[28] || (_cache[28] = [createElementVNode("strong", { class: "text-16px text-mb-0" }, "V", -1)])], 34)
1064
- ], 6)) : createCommentVNode("v-if", true);
774
+ ])) : createCommentVNode("", true)]);
775
+ }), 128))])) : createCommentVNode("", true),
776
+ tab.value === "main" && main.value ? (openBlock(), createElementBlock("div", _hoisted_7, [
777
+ createVNode(VuSlider, {
778
+ label: `luminance.dark ${fmt(main.value.lumDark[0])}`,
779
+ min: 0,
780
+ max: 1,
781
+ step: .01,
782
+ modelValue: main.value.lumDark,
783
+ "onUpdate:modelValue": [_cache[5] || (_cache[5] = ($event) => main.value.lumDark = $event), unref(apply)]
784
+ }, null, 8, [
785
+ "label",
786
+ "modelValue",
787
+ "onUpdate:modelValue"
788
+ ]),
789
+ createVNode(VuSlider, {
790
+ label: `luminance.light ${fmt(main.value.lumLight[0])}`,
791
+ min: 0,
792
+ max: 1,
793
+ step: .01,
794
+ modelValue: main.value.lumLight,
795
+ "onUpdate:modelValue": [_cache[6] || (_cache[6] = ($event) => main.value.lumLight = $event), unref(apply)]
796
+ }, null, 8, [
797
+ "label",
798
+ "modelValue",
799
+ "onUpdate:modelValue"
800
+ ]),
801
+ createVNode(VuSlider, {
802
+ label: `luminance.middle ${fmt(main.value.lumMiddle[0])}`,
803
+ min: 0,
804
+ max: 1,
805
+ step: .01,
806
+ modelValue: main.value.lumMiddle,
807
+ "onUpdate:modelValue": [_cache[7] || (_cache[7] = ($event) => main.value.lumMiddle = $event), unref(apply)]
808
+ }, null, 8, [
809
+ "label",
810
+ "modelValue",
811
+ "onUpdate:modelValue"
812
+ ]),
813
+ createVNode(VuCheckbox, {
814
+ modelValue: main.value.useMiddle[0],
815
+ "onUpdate:modelValue": [_cache[8] || (_cache[8] = ($event) => main.value.useMiddle[0] = $event), unref(apply)],
816
+ label: "luminance.useMiddle"
817
+ }, null, 8, ["modelValue", "onUpdate:modelValue"]),
818
+ createVNode(VuSlider, {
819
+ label: `saturate.dark ${fmt(main.value.saturateDark[0])}`,
820
+ min: -1,
821
+ max: 1,
822
+ step: .05,
823
+ modelValue: main.value.saturateDark,
824
+ "onUpdate:modelValue": [_cache[9] || (_cache[9] = ($event) => main.value.saturateDark = $event), unref(apply)]
825
+ }, null, 8, [
826
+ "label",
827
+ "modelValue",
828
+ "onUpdate:modelValue"
829
+ ]),
830
+ createVNode(VuSlider, {
831
+ label: `saturate.light ${fmt(main.value.saturateLight[0])}`,
832
+ min: -1,
833
+ max: 1,
834
+ step: .05,
835
+ modelValue: main.value.saturateLight,
836
+ "onUpdate:modelValue": [_cache[10] || (_cache[10] = ($event) => main.value.saturateLight = $event), unref(apply)]
837
+ }, null, 8, [
838
+ "label",
839
+ "modelValue",
840
+ "onUpdate:modelValue"
841
+ ]),
842
+ createVNode(VuSlider, {
843
+ label: `vivid.dark ${fmt(main.value.vividDark[0])}`,
844
+ min: 0,
845
+ max: 1,
846
+ step: .05,
847
+ modelValue: main.value.vividDark,
848
+ "onUpdate:modelValue": [_cache[11] || (_cache[11] = ($event) => main.value.vividDark = $event), unref(apply)]
849
+ }, null, 8, [
850
+ "label",
851
+ "modelValue",
852
+ "onUpdate:modelValue"
853
+ ]),
854
+ createVNode(VuSlider, {
855
+ label: `vivid.light ${fmt(main.value.vividLight[0])}`,
856
+ min: 0,
857
+ max: 1,
858
+ step: .05,
859
+ modelValue: main.value.vividLight,
860
+ "onUpdate:modelValue": [_cache[12] || (_cache[12] = ($event) => main.value.vividLight = $event), unref(apply)]
861
+ }, null, 8, [
862
+ "label",
863
+ "modelValue",
864
+ "onUpdate:modelValue"
865
+ ]),
866
+ createVNode(VuSlider, {
867
+ label: `flatness ${fmt(main.value.flatness[0])}`,
868
+ min: 0,
869
+ max: 1,
870
+ step: .01,
871
+ modelValue: main.value.flatness,
872
+ "onUpdate:modelValue": [_cache[13] || (_cache[13] = ($event) => main.value.flatness = $event), unref(apply)]
873
+ }, null, 8, [
874
+ "label",
875
+ "modelValue",
876
+ "onUpdate:modelValue"
877
+ ]),
878
+ createVNode(VuCheckbox, {
879
+ modelValue: main.value.preserveInputColor[0],
880
+ "onUpdate:modelValue": [_cache[14] || (_cache[14] = ($event) => main.value.preserveInputColor[0] = $event), unref(apply)],
881
+ label: "preserveInputColor"
882
+ }, null, 8, ["modelValue", "onUpdate:modelValue"])
883
+ ])) : createCommentVNode("", true),
884
+ tab.value === "layers" && layer.value ? (openBlock(), createElementBlock("div", _hoisted_8, [
885
+ createVNode(VuSlider, {
886
+ label: `desaturate ${fmt(layer.value.desaturate[0])}`,
887
+ min: 0,
888
+ max: 1,
889
+ step: .05,
890
+ modelValue: layer.value.desaturate,
891
+ "onUpdate:modelValue": [_cache[15] || (_cache[15] = ($event) => layer.value.desaturate = $event), unref(apply)]
892
+ }, null, 8, [
893
+ "label",
894
+ "modelValue",
895
+ "onUpdate:modelValue"
896
+ ]),
897
+ createVNode(VuSlider, {
898
+ label: `flatness ${fmt(layer.value.flatness[0])}`,
899
+ min: 0,
900
+ max: 1,
901
+ step: .01,
902
+ modelValue: layer.value.flatness,
903
+ "onUpdate:modelValue": [_cache[16] || (_cache[16] = ($event) => layer.value.flatness = $event), unref(apply)]
904
+ }, null, 8, [
905
+ "label",
906
+ "modelValue",
907
+ "onUpdate:modelValue"
908
+ ]),
909
+ createVNode(VuSlider, {
910
+ label: `luminance.dark ${fmt(layer.value.lumDark[0])}`,
911
+ min: 0,
912
+ max: 1,
913
+ step: .01,
914
+ modelValue: layer.value.lumDark,
915
+ "onUpdate:modelValue": [_cache[17] || (_cache[17] = ($event) => layer.value.lumDark = $event), unref(apply)]
916
+ }, null, 8, [
917
+ "label",
918
+ "modelValue",
919
+ "onUpdate:modelValue"
920
+ ]),
921
+ createVNode(VuSlider, {
922
+ label: `luminance.light ${fmt(layer.value.lumLight[0])}`,
923
+ min: 0,
924
+ max: 1,
925
+ step: .01,
926
+ modelValue: layer.value.lumLight,
927
+ "onUpdate:modelValue": [_cache[18] || (_cache[18] = ($event) => layer.value.lumLight = $event), unref(apply)]
928
+ }, null, 8, [
929
+ "label",
930
+ "modelValue",
931
+ "onUpdate:modelValue"
932
+ ]),
933
+ createVNode(VuSlider, {
934
+ label: `saturate.dark ${fmt(layer.value.saturateDark[0])}`,
935
+ min: -1,
936
+ max: 1,
937
+ step: .05,
938
+ modelValue: layer.value.saturateDark,
939
+ "onUpdate:modelValue": [_cache[19] || (_cache[19] = ($event) => layer.value.saturateDark = $event), unref(apply)]
940
+ }, null, 8, [
941
+ "label",
942
+ "modelValue",
943
+ "onUpdate:modelValue"
944
+ ]),
945
+ createVNode(VuSlider, {
946
+ label: `saturate.light ${fmt(layer.value.saturateLight[0])}`,
947
+ min: -1,
948
+ max: 1,
949
+ step: .05,
950
+ modelValue: layer.value.saturateLight,
951
+ "onUpdate:modelValue": [_cache[20] || (_cache[20] = ($event) => layer.value.saturateLight = $event), unref(apply)]
952
+ }, null, 8, [
953
+ "label",
954
+ "modelValue",
955
+ "onUpdate:modelValue"
956
+ ]),
957
+ createVNode(VuSlider, {
958
+ label: `vivid.dark ${fmt(layer.value.vividDark[0])}`,
959
+ min: 0,
960
+ max: 1,
961
+ step: .05,
962
+ modelValue: layer.value.vividDark,
963
+ "onUpdate:modelValue": [_cache[21] || (_cache[21] = ($event) => layer.value.vividDark = $event), unref(apply)]
964
+ }, null, 8, [
965
+ "label",
966
+ "modelValue",
967
+ "onUpdate:modelValue"
968
+ ]),
969
+ createVNode(VuSlider, {
970
+ label: `vivid.light ${fmt(layer.value.vividLight[0])}`,
971
+ min: 0,
972
+ max: 1,
973
+ step: .05,
974
+ modelValue: layer.value.vividLight,
975
+ "onUpdate:modelValue": [_cache[22] || (_cache[22] = ($event) => layer.value.vividLight = $event), unref(apply)]
976
+ }, null, 8, [
977
+ "label",
978
+ "modelValue",
979
+ "onUpdate:modelValue"
980
+ ])
981
+ ])) : createCommentVNode("", true),
982
+ tab.value === "misc" && misc.value ? (openBlock(), createElementBlock("div", _hoisted_9, [
983
+ createVNode(VuSlider, {
984
+ label: `darkest ${fmt(misc.value.darkest[0])}`,
985
+ min: 0,
986
+ max: 1,
987
+ step: .01,
988
+ modelValue: misc.value.darkest,
989
+ "onUpdate:modelValue": [_cache[23] || (_cache[23] = ($event) => misc.value.darkest = $event), unref(apply)]
990
+ }, null, 8, [
991
+ "label",
992
+ "modelValue",
993
+ "onUpdate:modelValue"
994
+ ]),
995
+ createVNode(VuSlider, {
996
+ label: `lightest ${fmt(misc.value.lightest[0])}`,
997
+ min: 0,
998
+ max: 1,
999
+ step: .01,
1000
+ modelValue: misc.value.lightest,
1001
+ "onUpdate:modelValue": [_cache[24] || (_cache[24] = ($event) => misc.value.lightest = $event), unref(apply)]
1002
+ }, null, 8, [
1003
+ "label",
1004
+ "modelValue",
1005
+ "onUpdate:modelValue"
1006
+ ]),
1007
+ createVNode(VuSlider, {
1008
+ label: `layersDepth ${fmt(misc.value.layersDepth[0])}`,
1009
+ min: 0,
1010
+ max: .5,
1011
+ step: .01,
1012
+ modelValue: misc.value.layersDepth,
1013
+ "onUpdate:modelValue": [_cache[25] || (_cache[25] = ($event) => misc.value.layersDepth = $event), unref(apply)]
1014
+ }, null, 8, [
1015
+ "label",
1016
+ "modelValue",
1017
+ "onUpdate:modelValue"
1018
+ ]),
1019
+ createVNode(VuSlider, {
1020
+ label: `flatness (top-level) ${fmt(misc.value.flatness[0])}`,
1021
+ min: 0,
1022
+ max: 1,
1023
+ step: .01,
1024
+ modelValue: misc.value.flatness,
1025
+ "onUpdate:modelValue": [_cache[26] || (_cache[26] = ($event) => misc.value.flatness = $event), unref(apply)]
1026
+ }, null, 8, [
1027
+ "label",
1028
+ "modelValue",
1029
+ "onUpdate:modelValue"
1030
+ ])
1031
+ ])) : createCommentVNode("", true)
1032
+ ]),
1033
+ _: 1
1034
+ }),
1035
+ createVNode(unref(VuCardInner), { class: "layer-2 flex justify-center" }, {
1036
+ default: withCtx(() => [createVNode(unref(VuButton$1), {
1037
+ label: "Reset All",
1038
+ onClick: reset,
1039
+ class: "c8-flat"
1040
+ })]),
1041
+ _: 1
1042
+ })
1043
+ ]),
1044
+ _: 1
1045
+ }, 8, ["class"]), createElementVNode("div", {
1046
+ class: normalizeClass(["absolute shadow-[0_0_5px_2px_rgb(var(--scope-color-500))] left-0 top-0 size-[3em] rounded-full transition-opacity-200 surface-500 flex justify-center items-center current-outline-primary-700 outline-current outline-[2px] outline-solid hover:opacity-100 cursor-pointer select-none", {
1047
+ "opacity-0 pointer-events-none": modelValue.value,
1048
+ "opacity-50": !modelValue.value,
1049
+ "cursor-grabbing": down.value
1050
+ }]),
1051
+ title: "Vunor Palette Sandbox",
1052
+ onMousedown: onMouseDown
1053
+ }, [..._cache[28] || (_cache[28] = [createElementVNode("strong", { class: "text-16px text-mb-0" }, "V", -1)])], 34)], 6)) : createCommentVNode("", true);
1065
1054
  };
1066
1055
  }
1067
1056
  });