ropav 0.0.6 → 0.0.8
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.
- package/dist/_plugin-vue_export-helper.js +1 -11
- package/dist/accordion.css +112 -0
- package/dist/accordion.js +358 -0
- package/dist/badge.css +169 -0
- package/dist/badge.js +101 -0
- package/dist/bem.js +9 -0
- package/dist/button-group.css +8 -8
- package/dist/button-group.js +2 -3
- package/dist/button.js +3 -4
- package/dist/card.css +40 -20
- package/dist/card.js +71 -39
- package/dist/checkbox.js +2 -3
- package/dist/collapse.css +32 -0
- package/dist/collapse.js +62 -0
- package/dist/componentColors.js +0 -2
- package/dist/components/accordion/accordion-item.d.ts +40 -0
- package/dist/components/accordion/accordion.d.ts +23 -0
- package/dist/components/accordion/index.d.ts +4 -0
- package/dist/components/accordion/index.js +2 -0
- package/dist/components/accordion/types.d.ts +100 -0
- package/dist/components/accordion/useAccordion.d.ts +3 -0
- package/dist/components/badge/badge.d.ts +25 -0
- package/dist/components/badge/index.d.ts +3 -0
- package/dist/components/badge/index.js +2 -0
- package/dist/components/badge/types.d.ts +16 -0
- package/dist/components/badge/useBadgeColor.d.ts +8 -0
- package/dist/components/card/card.d.ts +4 -0
- package/dist/components/card/types.d.ts +4 -0
- package/dist/components/collapse/collapse.d.ts +36 -0
- package/dist/components/collapse/index.d.ts +3 -0
- package/dist/components/collapse/index.js +3 -0
- package/dist/components/collapse/types.d.ts +74 -0
- package/dist/components/collapse/useCollapse.d.ts +2 -0
- package/dist/components/dropdown-menu/dropdown-menu-items.d.ts +16 -0
- package/dist/components/dropdown-menu/dropdown-menu-utils.d.ts +23 -0
- package/dist/components/dropdown-menu/dropdown-menu.d.ts +26 -0
- package/dist/components/dropdown-menu/index.d.ts +3 -0
- package/dist/components/dropdown-menu/index.js +2 -0
- package/dist/components/dropdown-menu/types.d.ts +104 -0
- package/dist/components/dropdown-menu/useDropdownMenu.d.ts +32 -0
- package/dist/components/dropdown-menu/useDropdownMenuDisclosure.d.ts +30 -0
- package/dist/components/dropdown-menu/useDropdownMenuDom.d.ts +28 -0
- package/dist/components/dropdown-menu/useDropdownMenuHoverIntent.d.ts +24 -0
- package/dist/components/dropdown-menu/useDropdownMenuInteractions.d.ts +51 -0
- package/dist/components/dropdown-menu/useDropdownMenuNavigation.d.ts +16 -0
- package/dist/components/dropdown-menu/useDropdownMenuRenderItems.d.ts +25 -0
- package/dist/components/dropdown-menu/useDropdownSubmenus.d.ts +18 -0
- package/dist/components/field/field.d.ts +2 -2
- package/dist/components/field/useField.d.ts +17 -0
- package/dist/components/input/useInput.d.ts +8 -0
- package/dist/components/modal/index.d.ts +2 -0
- package/dist/components/modal/index.js +2 -0
- package/dist/components/modal/modal.d.ts +42 -0
- package/dist/components/modal/types.d.ts +31 -0
- package/dist/components/modal/useModal.d.ts +29 -0
- package/dist/components/overlay/index.d.ts +2 -0
- package/dist/components/overlay/index.js +2 -0
- package/dist/components/overlay/overlay.d.ts +19 -0
- package/dist/components/overlay/types.d.ts +12 -0
- package/dist/components/overlay/useOverlay.d.ts +7 -0
- package/dist/components/popover/index.d.ts +2 -0
- package/dist/components/popover/index.js +2 -0
- package/dist/components/popover/popover.d.ts +43 -0
- package/dist/components/popover/types.d.ts +43 -0
- package/dist/components/popover/usePopover.d.ts +23 -0
- package/dist/components/tabs/index.d.ts +6 -0
- package/dist/components/tabs/index.js +2 -0
- package/dist/components/tabs/tabs-content.d.ts +24 -0
- package/dist/components/tabs/tabs-list.d.ts +26 -0
- package/dist/components/tabs/tabs-trigger.d.ts +29 -0
- package/dist/components/tabs/tabs.d.ts +31 -0
- package/dist/components/tabs/types.d.ts +160 -0
- package/dist/components/tabs/useTabs.d.ts +5 -0
- package/dist/dropdown-menu.css +159 -0
- package/dist/dropdown-menu.js +901 -0
- package/dist/field.css +11 -8
- package/dist/field.js +93 -52
- package/dist/icon-button.css +1 -1
- package/dist/icon-button.js +3 -4
- package/dist/index.d.ts +8 -0
- package/dist/index.js +12 -1
- package/dist/input.css +25 -25
- package/dist/input.js +57 -40
- package/dist/modal.css +134 -0
- package/dist/modal.js +427 -0
- package/dist/overlay.css +28 -0
- package/dist/overlay.js +82 -0
- package/dist/popover.css +75 -0
- package/dist/popover.js +377 -0
- package/dist/progress.js +2 -3
- package/dist/radio.js +4 -11
- package/dist/select.js +8 -39
- package/dist/slider.js +2 -3
- package/dist/switch.js +2 -3
- package/dist/tabs.css +279 -0
- package/dist/tabs.js +513 -0
- package/dist/textarea.js +2 -3
- package/dist/tooltip.js +2 -3
- package/dist/useButtonColor.js +0 -2
- package/dist/useClickOutside.js +24 -0
- package/dist/useCollapse.js +92 -0
- package/dist/useControlState.js +0 -2
- package/dist/useRequiredInject.js +9 -0
- package/dist/x.js +12 -0
- package/package.json +40 -4
- package/dist/_plugin-vue_export-helper.js.map +0 -1
- package/dist/button-group.js.map +0 -1
- package/dist/button.js.map +0 -1
- package/dist/card.js.map +0 -1
- package/dist/checkbox.js.map +0 -1
- package/dist/componentColors.js.map +0 -1
- package/dist/field.js.map +0 -1
- package/dist/icon-button.js.map +0 -1
- package/dist/input.js.map +0 -1
- package/dist/progress.js.map +0 -1
- package/dist/radio.js.map +0 -1
- package/dist/select.js.map +0 -1
- package/dist/slider.js.map +0 -1
- package/dist/switch.js.map +0 -1
- package/dist/textarea.js.map +0 -1
- package/dist/tooltip.js.map +0 -1
- package/dist/useButtonColor.js.map +0 -1
- package/dist/useControlState.js.map +0 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ropav",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.8",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"packageManager": "pnpm@11.10.0",
|
|
6
6
|
"engines": {
|
|
@@ -21,6 +21,14 @@
|
|
|
21
21
|
"types": "./dist/index.d.ts",
|
|
22
22
|
"import": "./dist/index.js"
|
|
23
23
|
},
|
|
24
|
+
"./accordion": {
|
|
25
|
+
"types": "./dist/components/accordion/index.d.ts",
|
|
26
|
+
"import": "./dist/components/accordion/index.js"
|
|
27
|
+
},
|
|
28
|
+
"./badge": {
|
|
29
|
+
"types": "./dist/components/badge/index.d.ts",
|
|
30
|
+
"import": "./dist/components/badge/index.js"
|
|
31
|
+
},
|
|
24
32
|
"./button": {
|
|
25
33
|
"types": "./dist/components/button/index.d.ts",
|
|
26
34
|
"import": "./dist/components/button/index.js"
|
|
@@ -37,6 +45,14 @@
|
|
|
37
45
|
"types": "./dist/components/checkbox/index.d.ts",
|
|
38
46
|
"import": "./dist/components/checkbox/index.js"
|
|
39
47
|
},
|
|
48
|
+
"./collapse": {
|
|
49
|
+
"types": "./dist/components/collapse/index.d.ts",
|
|
50
|
+
"import": "./dist/components/collapse/index.js"
|
|
51
|
+
},
|
|
52
|
+
"./dropdown-menu": {
|
|
53
|
+
"types": "./dist/components/dropdown-menu/index.d.ts",
|
|
54
|
+
"import": "./dist/components/dropdown-menu/index.js"
|
|
55
|
+
},
|
|
40
56
|
"./field": {
|
|
41
57
|
"types": "./dist/components/field/index.d.ts",
|
|
42
58
|
"import": "./dist/components/field/index.js"
|
|
@@ -49,6 +65,18 @@
|
|
|
49
65
|
"types": "./dist/components/input/index.d.ts",
|
|
50
66
|
"import": "./dist/components/input/index.js"
|
|
51
67
|
},
|
|
68
|
+
"./modal": {
|
|
69
|
+
"types": "./dist/components/modal/index.d.ts",
|
|
70
|
+
"import": "./dist/components/modal/index.js"
|
|
71
|
+
},
|
|
72
|
+
"./overlay": {
|
|
73
|
+
"types": "./dist/components/overlay/index.d.ts",
|
|
74
|
+
"import": "./dist/components/overlay/index.js"
|
|
75
|
+
},
|
|
76
|
+
"./popover": {
|
|
77
|
+
"types": "./dist/components/popover/index.d.ts",
|
|
78
|
+
"import": "./dist/components/popover/index.js"
|
|
79
|
+
},
|
|
52
80
|
"./progress": {
|
|
53
81
|
"types": "./dist/components/progress/index.d.ts",
|
|
54
82
|
"import": "./dist/components/progress/index.js"
|
|
@@ -69,6 +97,10 @@
|
|
|
69
97
|
"types": "./dist/components/switch/index.d.ts",
|
|
70
98
|
"import": "./dist/components/switch/index.js"
|
|
71
99
|
},
|
|
100
|
+
"./tabs": {
|
|
101
|
+
"types": "./dist/components/tabs/index.d.ts",
|
|
102
|
+
"import": "./dist/components/tabs/index.js"
|
|
103
|
+
},
|
|
72
104
|
"./textarea": {
|
|
73
105
|
"types": "./dist/components/textarea/index.d.ts",
|
|
74
106
|
"import": "./dist/components/textarea/index.js"
|
|
@@ -101,7 +133,9 @@
|
|
|
101
133
|
"preview": "vite preview",
|
|
102
134
|
"storybook": "pnpm run tokens:build && storybook dev -p 6006 --no-open",
|
|
103
135
|
"build-storybook": "pnpm run tokens:build && pnpm run tokens:check && pnpm run typecheck:storybook && storybook build",
|
|
104
|
-
"
|
|
136
|
+
"changelog": "conventional-changelog -p conventionalcommits -i CHANGELOG.md -o CHANGELOG.md",
|
|
137
|
+
"changelog:all": "conventional-changelog -p conventionalcommits -i CHANGELOG.md -o CHANGELOG.md -r 0",
|
|
138
|
+
"release": "bumpp --git-check --all --commit \"chore(release): v%s\" --tag \"v%s\" --execute \"pnpm run changelog\""
|
|
105
139
|
},
|
|
106
140
|
"peerDependencies": {
|
|
107
141
|
"vue": "^3.6.0-beta.4"
|
|
@@ -113,10 +147,12 @@
|
|
|
113
147
|
"@storybook/vue3-vite": "^10.4.6",
|
|
114
148
|
"@types/node": "^25.9.4",
|
|
115
149
|
"@vitejs/plugin-vue": "^6.0.7",
|
|
116
|
-
"@vitest/browser-playwright": "^4.1.
|
|
150
|
+
"@vitest/browser-playwright": "^4.1.10",
|
|
117
151
|
"@vue/compiler-vapor": "3.6.0-beta.17",
|
|
118
152
|
"@vue/tsconfig": "^0.9.1",
|
|
119
153
|
"bumpp": "^11.1.0",
|
|
154
|
+
"conventional-changelog": "^7.2.1",
|
|
155
|
+
"conventional-changelog-conventionalcommits": "^9.3.1",
|
|
120
156
|
"jsdom": "^29.1.1",
|
|
121
157
|
"oxfmt": "^0.57.0",
|
|
122
158
|
"oxlint": "^1.72.0",
|
|
@@ -128,7 +164,7 @@
|
|
|
128
164
|
"unplugin-icons": "^23.0.1",
|
|
129
165
|
"vite": "^8.1.3",
|
|
130
166
|
"vite-plugin-dts": "^5.0.3",
|
|
131
|
-
"vitest": "^4.1.
|
|
167
|
+
"vitest": "^4.1.10",
|
|
132
168
|
"vue": "beta",
|
|
133
169
|
"vue-tsc": "^3.3.6"
|
|
134
170
|
},
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"_plugin-vue_export-helper.js","names":[],"sources":["../src/utils/bem.ts"],"sourcesContent":["type BemModifier = string | Record<string, boolean | undefined>;\n\nexport function bem(block: string, ...modifiers: BemModifier[]): string[] {\n const classes = [block];\n for (const mod of modifiers) {\n if (typeof mod === 'string') {\n classes.push(`${block}--${mod}`);\n } else {\n for (const [key, val] of Object.entries(mod)) {\n if (val) classes.push(`${block}--${key}`);\n }\n }\n }\n return classes;\n}\n"],"mappings":";AAEA,SAAgB,IAAI,OAAe,GAAG,WAAoC;CACtE,MAAM,UAAU,CAAC,KAAK;CACtB,KAAK,MAAM,OAAO,WACd,IAAI,OAAO,QAAQ,UACf,QAAQ,KAAK,GAAG,MAAM,IAAI,KAAK;MAE/B,KAAK,MAAM,CAAC,KAAK,QAAQ,OAAO,QAAQ,GAAG,GACvC,IAAI,KAAK,QAAQ,KAAK,GAAG,MAAM,IAAI,KAAK;CAIpD,OAAO;AACX"}
|
package/dist/button-group.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"button-group.js","names":[],"sources":["../src/components/button-group/button-group.vue","../src/components/button-group/button-group.vue"],"sourcesContent":["<template>\n <div\n :id=\"id\"\n :class=\"rootClass\"\n role=\"group\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"labelledby\"\n :aria-describedby=\"describedby\"\n >\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { ButtonGroupProps } from './types';\n\ndefineOptions({ name: 'RpButtonGroup' });\n\nconst props = withDefaults(defineProps<ButtonGroupProps>(), {\n orientation: 'horizontal',\n attached: false,\n wrap: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button-group', {\n vertical: props.orientation === 'vertical',\n attached: props.attached,\n wrap: props.wrap,\n }),\n);\n</script>\n\n<style src=\"./button-group.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div\n :id=\"id\"\n :class=\"rootClass\"\n role=\"group\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"labelledby\"\n :aria-describedby=\"describedby\"\n >\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { ButtonGroupProps } from './types';\n\ndefineOptions({ name: 'RpButtonGroup' });\n\nconst props = withDefaults(defineProps<ButtonGroupProps>(), {\n orientation: 'horizontal',\n attached: false,\n wrap: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button-group', {\n vertical: props.orientation === 'vertical',\n attached: props.attached,\n wrap: props.wrap,\n }),\n);\n</script>\n\n<style src=\"./button-group.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAoBA,MAAM,QAAQ;EAMd,MAAM,YAAY,eACd,IAAI,mBAAmB;GACnB,UAAU,MAAM,gBAAgB;GAChC,UAAU,MAAM;GAChB,MAAM,MAAM;EAChB,CAAC,CACL;;;eA9BS,MAAI,QAAA,EAAE;gBACC,UAAA,KAAS;eAEhB,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,mBAAiB,QAAA,UAAU;eAC3B,oBAAkB,QAAA,WAAW"}
|
package/dist/button.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"button.js","names":[],"sources":["../src/components/button/button.vue","../src/components/button/button.vue"],"sourcesContent":["<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-busy=\"loading || undefined\"\n >\n <span v-if=\"loading\" class=\"rp-button__loading\" aria-hidden=\"true\">\n <slot name=\"loading\">\n <IconLoaderCircle class=\"rp-button__spinner\" />\n </slot>\n </span>\n <span class=\"rp-button__content\" :aria-hidden=\"loading || undefined\">\n <span v-if=\"$slots.left\" class=\"rp-button__left\">\n <slot name=\"left\" />\n </span>\n <span class=\"rp-button__label\">\n <slot />\n </span>\n <span v-if=\"$slots.right\" class=\"rp-button__right\">\n <slot name=\"right\" />\n </span>\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { ButtonProps } from './types';\nimport { getButtonColorStyle } from './useButtonColor';\n\ndefineOptions({ name: 'RpButton' });\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n loading: props.loading,\n }),\n);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"./button.scss\" lang=\"scss\" scoped></style>\n","<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-busy=\"loading || undefined\"\n >\n <span v-if=\"loading\" class=\"rp-button__loading\" aria-hidden=\"true\">\n <slot name=\"loading\">\n <IconLoaderCircle class=\"rp-button__spinner\" />\n </slot>\n </span>\n <span class=\"rp-button__content\" :aria-hidden=\"loading || undefined\">\n <span v-if=\"$slots.left\" class=\"rp-button__left\">\n <slot name=\"left\" />\n </span>\n <span class=\"rp-button__label\">\n <slot />\n </span>\n <span v-if=\"$slots.right\" class=\"rp-button__right\">\n <slot name=\"right\" />\n </span>\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { ButtonProps } from './types';\nimport { getButtonColorStyle } from './useButtonColor';\n\ndefineOptions({ name: 'RpButton' });\n\nconst props = withDefaults(defineProps<ButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() =>\n bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n loading: props.loading,\n }),\n);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"./button.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqCA,MAAM,QAAQ;EAMd,MAAM,YAAY,eACd,IAAI,aAAa;IACZ,MAAM,WAAW,KAAK,QAAQ,MAAM,OAAO;IAC3C,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;IAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;IACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;GAChD,SAAS,MAAM;EACnB,CAAC,CACL;EAEA,MAAM,YAAY,eAAe,oBAAoB,MAAM,KAAK,CAAC;;;;;;iBAnDjD,UAAA,KAAS;iBACT,UAAA,KAAS;gBAChB,YAAU,QAAA,YAAY,YAAW,KAAA,CAAS;gBAC1C,QAAM,QAAA,IAAI;gBACV,aAAW,YAAW,KAAA,CAAS;;;iBAEpB,QAAA,eAAO;;;cACT,WAAc,YAAA;2DACE,OAAM,qBAAoB,CAAA;;;;kCAGlB,eAAa,QAAA,WAAW,KAAA,CAAS,CAAA;;iBACnD,OAAM,YAAA;;;cACR,QAAW,MAAA,MAAA,CAAA;;;;;;iBAKT,OAAM,aAAA;;;cACR,SAAY,MAAA,MAAA,CAAA"}
|
package/dist/card.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","names":[],"sources":["../src/components/card/card.vue","../src/components/card/card.vue"],"sourcesContent":["<template>\n <div :class=\"rootClass\">\n <div v-if=\"hasHeader\" class=\"rp-card__header\">\n <div v-if=\"hasTitle\" class=\"rp-card__title\">\n {{ title }}\n </div>\n <p v-if=\"hasDescription\" class=\"rp-card__description\">\n {{ description }}\n </p>\n </div>\n\n <div v-if=\"$slots.default\" class=\"rp-card__body\">\n <slot />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { CardProps } from './types';\n\ndefineOptions({ name: 'RpCard' });\n\nconst props = withDefaults(defineProps<CardProps>(), {\n border: true,\n title: '',\n description: '',\n});\n\nconst hasTitle = computed(() => Boolean(props.title));\nconst hasDescription = computed(() => Boolean(props.description));\nconst hasHeader = computed(() => Boolean(hasTitle.value || hasDescription.value));\n\nconst rootClass = computed(() =>\n bem('rp-card', {\n [`layer-${props.layer}`]: Boolean(props.layer),\n [`padding-${props.padding}`]: Boolean(props.padding),\n [`radius-${props.radius}`]: Boolean(props.radius),\n borderless: !props.border,\n }),\n);\n</script>\n\n<style src=\"./card.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div :class=\"rootClass\">\n <div v-if=\"hasHeader\" class=\"rp-card__header\">\n <div v-if=\"hasTitle\" class=\"rp-card__title\">\n {{ title }}\n </div>\n <p v-if=\"hasDescription\" class=\"rp-card__description\">\n {{ description }}\n </p>\n </div>\n\n <div v-if=\"$slots.default\" class=\"rp-card__body\">\n <slot />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { CardProps } from './types';\n\ndefineOptions({ name: 'RpCard' });\n\nconst props = withDefaults(defineProps<CardProps>(), {\n border: true,\n title: '',\n description: '',\n});\n\nconst hasTitle = computed(() => Boolean(props.title));\nconst hasDescription = computed(() => Boolean(props.description));\nconst hasHeader = computed(() => Boolean(hasTitle.value || hasDescription.value));\n\nconst rootClass = computed(() =>\n bem('rp-card', {\n [`layer-${props.layer}`]: Boolean(props.layer),\n [`padding-${props.padding}`]: Boolean(props.padding),\n [`radius-${props.radius}`]: Boolean(props.radius),\n borderless: !props.border,\n }),\n);\n</script>\n\n<style src=\"./card.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,QAAQ;EAMd,MAAM,WAAW,eAAe,QAAQ,MAAM,KAAK,CAAC;EACpD,MAAM,iBAAiB,eAAe,QAAQ,MAAM,WAAW,CAAC;EAChE,MAAM,YAAY,eAAe,QAAQ,SAAS,SAAS,eAAe,KAAK,CAAC;EAEhF,MAAM,YAAY,eACd,IAAI,WAAW;IACV,SAAS,MAAM,UAAU,QAAQ,MAAM,KAAK;IAC5C,WAAW,MAAM,YAAY,QAAQ,MAAM,OAAO;IAClD,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;GAChD,YAAY,CAAC,MAAM;EACvB,CAAC,CACL;;mCAxCiB,UAAA,KAAS,CAAA;;iBACP,UAAA,aAAS;;;kBACL,SAAA,aAAQ;;;mDACZ,QAAA,KAAK,CAAA,CAAA;;;;kBAEH,eAAA,aAAc;;;mDAChB,QAAA,WAAW,CAAA,CAAA;;;;;;iBAIX,OAAM,eAAA"}
|
package/dist/checkbox.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"checkbox.js","names":[],"sources":["../src/components/checkbox/useCheckbox.ts","../src/components/checkbox/checkbox.vue","../src/components/checkbox/checkbox.vue"],"sourcesContent":["import { computed, type CSSProperties } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { getComponentCustomColor, isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { CheckboxProps } from './types';\n\nfunction getCheckboxColorStyle(color: CheckboxProps['color']) {\n const customColor = getComponentCustomColor(color);\n if (!customColor) return undefined;\n\n return {\n '--_rp-checkbox-custom-color': customColor,\n '--_rp-checkbox-custom-on-color': 'var(--rp-color-on-primary)',\n } satisfies CSSProperties;\n}\n\nexport function useCheckbox(props: Readonly<CheckboxProps>, emitUpdate: (value: boolean) => void) {\n const control = useControlState(props);\n\n const rootClass = computed(() =>\n bem('rp-checkbox', {\n checked: props.modelValue,\n indeterminate: props.indeterminate,\n disabled: control.disabled,\n invalid: control.invalid,\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n );\n\n const rootStyle = computed(() => getCheckboxColorStyle(props.color));\n\n function onChange(e: Event) {\n emitUpdate((e.target as HTMLInputElement).checked);\n }\n\n return {\n control,\n rootClass,\n rootStyle,\n onChange,\n };\n}\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"control.disabled || undefined\"\n :data-state=\"indeterminate ? 'indeterminate' : modelValue ? 'checked' : 'unchecked'\"\n >\n <input\n :id=\"control.id\"\n :name=\"name\"\n type=\"checkbox\"\n class=\"rp-checkbox__native\"\n :checked=\"modelValue\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :indeterminate=\"indeterminate\"\n :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @change=\"onChange\"\n />\n <span class=\"rp-checkbox__box\">\n <Transition name=\"rp-checkbox-icon\" mode=\"out-in\">\n <MinusIcon v-if=\"indeterminate\" key=\"minus\" class=\"rp-checkbox__icon\" />\n <CheckIcon v-else-if=\"modelValue\" key=\"check\" class=\"rp-checkbox__icon\" />\n </Transition>\n </span>\n <span v-if=\"$slots.default\" class=\"rp-checkbox__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport CheckIcon from '~icons/lucide/check';\nimport MinusIcon from '~icons/lucide/minus';\nimport { useCheckbox } from './useCheckbox';\nimport type { CheckboxProps } from './types';\n\ndefineOptions({ name: 'RpCheckbox' });\n\nconst props = withDefaults(defineProps<CheckboxProps>(), {\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n indeterminate: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: boolean];\n}>();\n\nconst { control, rootClass, rootStyle, onChange } = useCheckbox(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./checkbox.scss\" lang=\"scss\" scoped></style>\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"control.disabled || undefined\"\n :data-state=\"indeterminate ? 'indeterminate' : modelValue ? 'checked' : 'unchecked'\"\n >\n <input\n :id=\"control.id\"\n :name=\"name\"\n type=\"checkbox\"\n class=\"rp-checkbox__native\"\n :checked=\"modelValue\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :indeterminate=\"indeterminate\"\n :aria-checked=\"indeterminate ? 'mixed' : modelValue\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @change=\"onChange\"\n />\n <span class=\"rp-checkbox__box\">\n <Transition name=\"rp-checkbox-icon\" mode=\"out-in\">\n <MinusIcon v-if=\"indeterminate\" key=\"minus\" class=\"rp-checkbox__icon\" />\n <CheckIcon v-else-if=\"modelValue\" key=\"check\" class=\"rp-checkbox__icon\" />\n </Transition>\n </span>\n <span v-if=\"$slots.default\" class=\"rp-checkbox__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport CheckIcon from '~icons/lucide/check';\nimport MinusIcon from '~icons/lucide/minus';\nimport { useCheckbox } from './useCheckbox';\nimport type { CheckboxProps } from './types';\n\ndefineOptions({ name: 'RpCheckbox' });\n\nconst props = withDefaults(defineProps<CheckboxProps>(), {\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n indeterminate: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: boolean];\n}>();\n\nconst { control, rootClass, rootStyle, onChange } = useCheckbox(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./checkbox.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAMA,SAAS,sBAAsB,OAA+B;CAC1D,MAAM,cAAc,wBAAwB,KAAK;CACjD,IAAI,CAAC,aAAa,OAAO,KAAA;CAEzB,OAAO;EACH,+BAA+B;EAC/B,kCAAkC;CACtC;AACJ;AAEA,SAAgB,YAAY,OAAgC,YAAsC;CAC9F,MAAM,UAAU,gBAAgB,KAAK;CAErC,MAAM,YAAY,eACd,IAAI,eAAe;EACf,SAAS,MAAM;EACf,eAAe,MAAM;EACrB,UAAU,QAAQ;EAClB,SAAS,QAAQ;GAChB,MAAM,WAAW,KAAK,QAAQ,MAAM,OAAO;GAC3C,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;GAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;GACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;CACpD,CAAC,CACL;CAEA,MAAM,YAAY,eAAe,sBAAsB,MAAM,KAAK,CAAC;CAEnE,SAAS,SAAS,GAAU;EACxB,WAAY,EAAE,OAA4B,OAAO;CACrD;CAEA,OAAO;EACH;EACA;EACA;EACA;CACJ;AACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECAA,MAAM,QAAQ;EAOd,MAAM,OAAO;EAIb,MAAM,EAAE,SAAS,WAAW,WAAW,aAAa,YAAY,QAAQ,UAAU;GAC9E,KAAK,qBAAqB,KAAK;EACnC,CAAC;;;;SAnCY,WAAM,MAAE,MAAA,QAAA,CAAQ,CAAA,CAAA,CAAA;;;;;;;iBApBb,MAAA,SAAA,CAAS;iBACT,MAAA,SAAA,CAAS;gBAChB,iBAAe,qBAAoB,KAAA,CAAS;gBAC5C,cAAY,iBAAa,kBAAqB,cAAU,YAAA,WAAA;eAGpD,MAAI,SAAO,EAAA;eACX,QAAM,QAAA,IAAI;eAGV,WAAS,WAAU;eACnB,YAAU,qBAAoB,KAAA,CAAS;eACvC,YAAU,qBAAoB,KAAA,CAAS;eACvC,iBAAe,cAAa;eAC5B,gBAAc,iBAAa,UAAa,WAAU;eAClD,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,mBAAiB,SAAO,cAAA;eACxB,oBAAkB,SAAO,eAAA;eACzB,gBAAc,SAAO,WAAY,KAAA,CAAS;eAC1C,iBAAe,qBAAoB,KAAA,CAAS;;;;GAIjC,MAAK;GAAmB,MAAK;;yBACpB,QAAA,qBAAa;uDAAc,OAAM,oBAAmB,CAAA;oBAAjC,OAAO;;2BACrB,QAAA,kBAAU;uDAAc,OAAM,oBAAmB,CAAA;oBAAjC,OAAO;;;;;iBAGzC,OAAM,eAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"componentColors.js","names":[],"sources":["../src/utils/componentColors.ts"],"sourcesContent":["export const componentColors = [\n 'primary',\n 'secondary',\n 'success',\n 'warning',\n 'danger',\n 'info',\n 'neutral',\n] as const;\n\nexport type ComponentColor = (typeof componentColors)[number];\n\nexport type ComponentColorValue = ComponentColor | (string & {});\n\nconst componentColorNames = new Set<string>(componentColors);\n\nexport function isComponentPresetColor(\n color: ComponentColorValue | undefined,\n): color is ComponentColor {\n return Boolean(color && componentColorNames.has(color));\n}\n\nexport function getComponentCustomColor(color: ComponentColorValue | undefined) {\n if (!color || isComponentPresetColor(color)) return undefined;\n\n return color;\n}\n"],"mappings":";AAAA,IAAa,kBAAkB;CAC3B;CACA;CACA;CACA;CACA;CACA;CACA;AACJ;AAMA,IAAM,sBAAsB,IAAI,IAAY,eAAe;AAE3D,SAAgB,uBACZ,OACuB;CACvB,OAAO,QAAQ,SAAS,oBAAoB,IAAI,KAAK,CAAC;AAC1D;AAEA,SAAgB,wBAAwB,OAAwC;CAC5E,IAAI,CAAC,SAAS,uBAAuB,KAAK,GAAG,OAAO,KAAA;CAEpD,OAAO;AACX"}
|
package/dist/field.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"field.js","names":[],"sources":["../src/components/field/field.vue","../src/components/field/field.vue"],"sourcesContent":["<template>\n <div :class=\"rootClass\">\n <label v-if=\"hasLabel\" :id=\"labelId\" class=\"rp-field__label\" :for=\"controlId\">\n <slot name=\"label\">{{ label }}</slot>\n <span v-if=\"required\" class=\"rp-field__required\" aria-hidden=\"true\">*</span>\n </label>\n\n <div class=\"rp-field__control\">\n <slot\n :id=\"controlId\"\n :disabled=\"disabled || undefined\"\n :required=\"required || undefined\"\n :invalid=\"isInvalid || undefined\"\n :labelledby=\"controlLabelledby\"\n :describedby=\"controlDescribedby\"\n :control-props=\"controlProps\"\n />\n </div>\n\n <p v-if=\"hasDescription\" :id=\"descriptionId\" class=\"rp-field__description\">\n <slot name=\"description\">{{ description }}</slot>\n </p>\n\n <p\n v-if=\"hasMessage\"\n :id=\"messageId\"\n class=\"rp-field__message\"\n :role=\"isInvalid ? 'alert' : undefined\"\n >\n <slot name=\"message\">{{ messageText }}</slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed, useId, useSlots } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { FieldControlProps, FieldProps } from './types';\n\ndefineOptions({ name: 'RpField' });\n\nconst props = withDefaults(defineProps<FieldProps>(), {\n label: '',\n description: '',\n message: '',\n error: '',\n disabled: undefined,\n required: false,\n invalid: undefined,\n});\n\nconst slots = useSlots();\nconst generatedId = useId();\n\nconst controlId = computed(() => props.id ?? `${generatedId}-control`);\nconst labelId = computed(() => `${controlId.value}-label`);\nconst descriptionId = computed(() => `${controlId.value}-description`);\nconst messageId = computed(() => `${controlId.value}-message`);\n\nconst isInvalid = computed(() => Boolean(props.invalid || props.error));\nconst messageText = computed(() => props.error || props.message);\n\nconst hasLabel = computed(() => Boolean(props.label || slots.label));\nconst hasDescription = computed(() => Boolean(props.description || slots.description));\nconst hasMessage = computed(() => Boolean(messageText.value || slots.message));\n\nconst controlLabelledby = computed(() => (hasLabel.value ? labelId.value : undefined));\nconst controlDescribedby = computed(\n () =>\n [\n hasDescription.value ? descriptionId.value : undefined,\n hasMessage.value ? messageId.value : undefined,\n ]\n .filter(Boolean)\n .join(' ') || undefined,\n);\n\nconst rootClass = computed(() =>\n bem('rp-field', {\n disabled: props.disabled,\n required: props.required,\n invalid: isInvalid.value,\n }),\n);\n\nconst controlProps = computed<FieldControlProps>(() => ({\n id: controlId.value,\n disabled: props.disabled || undefined,\n required: props.required || undefined,\n invalid: isInvalid.value || undefined,\n labelledby: controlLabelledby.value,\n describedby: controlDescribedby.value,\n}));\n</script>\n\n<style src=\"./field.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div :class=\"rootClass\">\n <label v-if=\"hasLabel\" :id=\"labelId\" class=\"rp-field__label\" :for=\"controlId\">\n <slot name=\"label\">{{ label }}</slot>\n <span v-if=\"required\" class=\"rp-field__required\" aria-hidden=\"true\">*</span>\n </label>\n\n <div class=\"rp-field__control\">\n <slot\n :id=\"controlId\"\n :disabled=\"disabled || undefined\"\n :required=\"required || undefined\"\n :invalid=\"isInvalid || undefined\"\n :labelledby=\"controlLabelledby\"\n :describedby=\"controlDescribedby\"\n :control-props=\"controlProps\"\n />\n </div>\n\n <p v-if=\"hasDescription\" :id=\"descriptionId\" class=\"rp-field__description\">\n <slot name=\"description\">{{ description }}</slot>\n </p>\n\n <p\n v-if=\"hasMessage\"\n :id=\"messageId\"\n class=\"rp-field__message\"\n :role=\"isInvalid ? 'alert' : undefined\"\n >\n <slot name=\"message\">{{ messageText }}</slot>\n </p>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed, useId, useSlots } from 'vue';\nimport { bem } from '@/utils/bem';\nimport type { FieldControlProps, FieldProps } from './types';\n\ndefineOptions({ name: 'RpField' });\n\nconst props = withDefaults(defineProps<FieldProps>(), {\n label: '',\n description: '',\n message: '',\n error: '',\n disabled: undefined,\n required: false,\n invalid: undefined,\n});\n\nconst slots = useSlots();\nconst generatedId = useId();\n\nconst controlId = computed(() => props.id ?? `${generatedId}-control`);\nconst labelId = computed(() => `${controlId.value}-label`);\nconst descriptionId = computed(() => `${controlId.value}-description`);\nconst messageId = computed(() => `${controlId.value}-message`);\n\nconst isInvalid = computed(() => Boolean(props.invalid || props.error));\nconst messageText = computed(() => props.error || props.message);\n\nconst hasLabel = computed(() => Boolean(props.label || slots.label));\nconst hasDescription = computed(() => Boolean(props.description || slots.description));\nconst hasMessage = computed(() => Boolean(messageText.value || slots.message));\n\nconst controlLabelledby = computed(() => (hasLabel.value ? labelId.value : undefined));\nconst controlDescribedby = computed(\n () =>\n [\n hasDescription.value ? descriptionId.value : undefined,\n hasMessage.value ? messageId.value : undefined,\n ]\n .filter(Boolean)\n .join(' ') || undefined,\n);\n\nconst rootClass = computed(() =>\n bem('rp-field', {\n disabled: props.disabled,\n required: props.required,\n invalid: isInvalid.value,\n }),\n);\n\nconst controlProps = computed<FieldControlProps>(() => ({\n id: controlId.value,\n disabled: props.disabled || undefined,\n required: props.required || undefined,\n invalid: isInvalid.value || undefined,\n labelledby: controlLabelledby.value,\n describedby: controlDescribedby.value,\n}));\n</script>\n\n<style src=\"./field.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyCA,MAAM,QAAQ;EAUd,MAAM,QAAQ,SAAS;EACvB,MAAM,cAAc,MAAM;EAE1B,MAAM,YAAY,eAAe,MAAM,MAAM,GAAG,YAAY,SAAS;EACrE,MAAM,UAAU,eAAe,GAAG,UAAU,MAAM,OAAO;EACzD,MAAM,gBAAgB,eAAe,GAAG,UAAU,MAAM,aAAa;EACrE,MAAM,YAAY,eAAe,GAAG,UAAU,MAAM,SAAS;EAE7D,MAAM,YAAY,eAAe,QAAQ,MAAM,WAAW,MAAM,KAAK,CAAC;EACtE,MAAM,cAAc,eAAe,MAAM,SAAS,MAAM,OAAO;EAE/D,MAAM,WAAW,eAAe,QAAQ,MAAM,SAAS,MAAM,KAAK,CAAC;EACnE,MAAM,iBAAiB,eAAe,QAAQ,MAAM,eAAe,MAAM,WAAW,CAAC;EACrF,MAAM,aAAa,eAAe,QAAQ,YAAY,SAAS,MAAM,OAAO,CAAC;EAE7E,MAAM,oBAAoB,eAAgB,SAAS,QAAQ,QAAQ,QAAQ,KAAA,CAAU;EACrF,MAAM,qBAAqB,eAEnB,CACI,eAAe,QAAQ,cAAc,QAAQ,KAAA,GAC7C,WAAW,QAAQ,UAAU,QAAQ,KAAA,CACzC,CAAA,CACK,OAAO,OAAO,CAAA,CACd,KAAK,GAAG,KAAK,KAAA,CAC1B;EAEA,MAAM,YAAY,eACd,IAAI,YAAY;GACZ,UAAU,MAAM;GAChB,UAAU,MAAM;GAChB,SAAS,UAAU;EACvB,CAAC,CACL;EAEA,MAAM,eAAe,gBAAmC;GACpD,IAAI,UAAU;GACd,UAAU,MAAM,YAAY,KAAA;GAC5B,UAAU,MAAM,YAAY,KAAA;GAC5B,SAAS,UAAU,SAAS,KAAA;GAC5B,YAAY,kBAAkB;GAC9B,aAAa,mBAAmB;EACpC,EAAE;;;mCA3Fe,UAAA,KAAS,CAAA;;iBACL,SAAA,aAAQ;;;gBAAG,MAAI,QAAA,KAAO;gBAA2B,OAAK,UAAA,KAAS;;;cAClE,SAAY,YAAA;;mDAAI,QAAA,KAAK,CAAA,CAAA;;;;kBACf,QAAA,gBAAQ;;;;;;;GAKf,UAAI,UAAA;GACJ,gBAAU,QAAA,YAAY,KAAA;GACtB,gBAAU,QAAA,YAAY,KAAA;GACtB,eAAS,UAAA,SAAa,KAAA;GACtB,kBAAY,kBAAA;GACZ,mBAAa,mBAAA;GACb,oBAAe,aAAA;;;iBAIf,eAAA,aAAc;;mCAAG,MAAI,cAAA,KAAa,CAAA;;cACjC,eAAkB,YAAA;;oDAAI,QAAA,WAAW,CAAA,CAAA;;;;;;iBAIjC,WAAA,aAAU;;;iBACf,MAAI,UAAA,KAAS;iBAEb,QAAM,UAAA,QAAS,UAAa,KAAA,CAAS;;;cAEhC,WAAc,YAAA;;oDAAI,YAAA,KAAW,CAAA,CAAA"}
|
package/dist/icon-button.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"icon-button.js","names":[],"sources":["../src/components/icon-button/icon-button.vue","../src/components/icon-button/icon-button.vue"],"sourcesContent":["<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-busy=\"loading || undefined\"\n >\n <IconLoaderCircle v-if=\"loading\" class=\"rp-icon-button__spinner\" aria-hidden=\"true\" />\n <span v-else class=\"rp-icon-button__icon\" aria-hidden=\"true\">\n <slot />\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport { getButtonColorStyle } from '../button/useButtonColor';\nimport type { IconButtonProps } from './types';\n\ndefineOptions({ name: 'RpIconButton' });\n\nconst props = withDefaults(defineProps<IconButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() => [\n ...bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n 'rp-icon-button',\n]);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"../button/button.scss\" lang=\"scss\" scoped></style>\n<style src=\"./icon-button.scss\" lang=\"scss\" scoped></style>\n","<template>\n <button\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :disabled=\"disabled || loading || undefined\"\n :type=\"type\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-busy=\"loading || undefined\"\n >\n <IconLoaderCircle v-if=\"loading\" class=\"rp-icon-button__spinner\" aria-hidden=\"true\" />\n <span v-else class=\"rp-icon-button__icon\" aria-hidden=\"true\">\n <slot />\n </span>\n </button>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport IconLoaderCircle from '~icons/lucide/loader-circle';\nimport { isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport { getButtonColorStyle } from '../button/useButtonColor';\nimport type { IconButtonProps } from './types';\n\ndefineOptions({ name: 'RpIconButton' });\n\nconst props = withDefaults(defineProps<IconButtonProps>(), {\n type: 'button',\n disabled: false,\n loading: false,\n});\n\nconst rootClass = computed(() => [\n ...bem('rp-button', {\n [props.variant ?? '']: Boolean(props.variant),\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n }),\n 'rp-icon-button',\n]);\n\nconst rootStyle = computed(() => getButtonColorStyle(props.color));\n</script>\n\n<style src=\"../button/button.scss\" lang=\"scss\" scoped></style>\n<style src=\"./icon-button.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0BA,MAAM,QAAQ;EAMd,MAAM,YAAY,eAAe,CAC7B,GAAG,IAAI,aAAa;IACf,MAAM,WAAW,KAAK,QAAQ,MAAM,OAAO;IAC3C,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;IAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;IACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;EACpD,CAAC,GACD,gBACJ,CAAC;EAED,MAAM,YAAY,eAAe,oBAAoB,MAAM,KAAK,CAAC;;;;gBAxCjD,UAAA,KAAS;gBACT,UAAA,KAAS;eAChB,YAAU,QAAA,YAAY,YAAW,KAAA,CAAS;eAC1C,QAAM,QAAA,IAAI;eACV,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,aAAW,YAAW,KAAA,CAAS;;;iBAER,QAAA,eAAO;;IAAE,OAAM;IAA0B,eAAY"}
|
package/dist/input.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"input.js","names":[],"sources":["../src/components/input/input.vue","../src/components/input/input.vue"],"sourcesContent":["<template>\n <label :class=\"rootClass\" @mousedown=\"focusInput\">\n <span v-if=\"$slots.left\" class=\"rp-input__left\">\n <slot name=\"left\" />\n </span>\n <input\n :id=\"control.id\"\n :name=\"name\"\n class=\"rp-input__native\"\n :type=\"type\"\n :value=\"modelValue\"\n :placeholder=\"placeholder\"\n :disabled=\"control.disabled || undefined\"\n :readonly=\"readonly || undefined\"\n :required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @input=\"onInput\"\n />\n <span v-if=\"$slots.right\" class=\"rp-input__right\">\n <slot name=\"right\" />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { bem } from '@/utils/bem';\nimport type { InputProps } from './types';\n\ndefineOptions({ name: 'RpInput' });\n\nconst props = withDefaults(defineProps<InputProps>(), {\n type: 'text',\n placeholder: '',\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n valid: undefined,\n readonly: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst control = useControlState(props);\n\nconst rootClass = computed(() =>\n bem('rp-input', {\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n disabled: control.disabled,\n invalid: control.invalid,\n valid: control.valid && !control.invalid,\n readonly: props.readonly,\n }),\n);\n\nfunction onInput(e: Event) {\n emit('update:modelValue', (e.target as HTMLInputElement).value);\n}\n\nfunction focusInput(e: MouseEvent) {\n if (control.disabled) return;\n\n const target = e.target;\n if (target instanceof Element && isInteractiveElement(target)) return;\n\n (e.currentTarget as HTMLElement).querySelector<HTMLInputElement>('.rp-input__native')?.focus();\n}\n\nfunction isInteractiveElement(target: Element) {\n return Boolean(\n target.closest(\n [\n 'button',\n 'a[href]',\n 'input:not(.rp-input__native)',\n 'select',\n 'textarea',\n '[contenteditable=\"true\"]',\n '[tabindex]:not([tabindex=\"-1\"])',\n ].join(','),\n ),\n );\n}\n</script>\n\n<style src=\"./input.scss\" lang=\"scss\" scoped></style>\n","<template>\n <label :class=\"rootClass\" @mousedown=\"focusInput\">\n <span v-if=\"$slots.left\" class=\"rp-input__left\">\n <slot name=\"left\" />\n </span>\n <input\n :id=\"control.id\"\n :name=\"name\"\n class=\"rp-input__native\"\n :type=\"type\"\n :value=\"modelValue\"\n :placeholder=\"placeholder\"\n :disabled=\"control.disabled || undefined\"\n :readonly=\"readonly || undefined\"\n :required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @input=\"onInput\"\n />\n <span v-if=\"$slots.right\" class=\"rp-input__right\">\n <slot name=\"right\" />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { computed } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { bem } from '@/utils/bem';\nimport type { InputProps } from './types';\n\ndefineOptions({ name: 'RpInput' });\n\nconst props = withDefaults(defineProps<InputProps>(), {\n type: 'text',\n placeholder: '',\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n valid: undefined,\n readonly: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst control = useControlState(props);\n\nconst rootClass = computed(() =>\n bem('rp-input', {\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n disabled: control.disabled,\n invalid: control.invalid,\n valid: control.valid && !control.invalid,\n readonly: props.readonly,\n }),\n);\n\nfunction onInput(e: Event) {\n emit('update:modelValue', (e.target as HTMLInputElement).value);\n}\n\nfunction focusInput(e: MouseEvent) {\n if (control.disabled) return;\n\n const target = e.target;\n if (target instanceof Element && isInteractiveElement(target)) return;\n\n (e.currentTarget as HTMLElement).querySelector<HTMLInputElement>('.rp-input__native')?.focus();\n}\n\nfunction isInteractiveElement(target: Element) {\n return Boolean(\n target.closest(\n [\n 'button',\n 'a[href]',\n 'input:not(.rp-input__native)',\n 'select',\n 'textarea',\n '[contenteditable=\"true\"]',\n '[tabindex]:not([tabindex=\"-1\"])',\n ].join(','),\n ),\n );\n}\n</script>\n\n<style src=\"./input.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCA,MAAM,QAAQ;EAUd,MAAM,OAAO;EAIb,MAAM,UAAU,gBAAgB,KAAK;EAErC,MAAM,YAAY,eACd,IAAI,YAAY;IACX,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;IACzC,UAAU,MAAM,WAAW,QAAQ,MAAM,MAAM;GAChD,UAAU,QAAQ;GAClB,SAAS,QAAQ;GACjB,OAAO,QAAQ,SAAS,CAAC,QAAQ;GACjC,UAAU,MAAM;EACpB,CAAC,CACL;EAEA,SAAS,QAAQ,GAAU;GACvB,KAAK,qBAAsB,EAAE,OAA4B,KAAK;EAClE;EAEA,SAAS,WAAW,GAAe;GAC/B,IAAI,QAAQ,UAAU;GAEtB,MAAM,SAAS,EAAE;GACjB,IAAI,kBAAkB,WAAW,qBAAqB,MAAM,GAAG;GAE/D,EAAG,cAA8B,cAAgC,mBAAmB,CAAC,EAAE,MAAM;EACjG;EAEA,SAAS,qBAAqB,QAAiB;GAC3C,OAAO,QACH,OAAO,QACH;IACI;IACA;IACA;IACA;IACA;IACA;IACA;GACJ,CAAC,CAAC,KAAK,GAAG,CACd,CACJ;EACJ;;;kCAzFmB,UAAA,KAAS,CAAA;;iBACR,OAAM,YAAA;;;cACR,QAAW,MAAA,MAAA,CAAA;;;+BAiBT,OAAO;;;;eAdd,MAAI,SAAO,EAAA;eACX,QAAM,QAAA,IAAI;eAEV,QAAM,QAAA,IAAI;gBACH,QAAA,UAAU;eACjB,eAAa,QAAA,WAAW;eACxB,YAAU,SAAO,YAAa,KAAA,CAAS;eACvC,YAAU,QAAA,YAAY,KAAA,CAAS;eAC/B,YAAU,qBAAoB,KAAA,CAAS;eACvC,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,mBAAiB,SAAO,cAAA;eACxB,oBAAkB,SAAO,eAAA;eACzB,gBAAc,SAAO,WAAY,KAAA,CAAS;eAC1C,iBAAe,qBAAoB,KAAA,CAAS;;;iBAGrC,OAAM,aAAA;;;cACR,SAAY,MAAA,MAAA,CAAA;;;mCAtBY,UAAU"}
|
package/dist/progress.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"progress.js","names":[],"sources":["../src/components/progress/useProgress.ts","../src/components/progress/progress.vue","../src/components/progress/progress.vue","../src/components/progress/types.ts"],"sourcesContent":["import { computed, type CSSProperties } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { bem } from '@/utils/bem';\nimport { getComponentCustomColor, isComponentPresetColor } from '@/utils/componentColors';\nimport type { ProgressProps } from './types';\n\ntype ProgressStateProps = Readonly<\n ProgressProps & {\n min: number;\n max: number;\n indeterminate: boolean;\n showValue: boolean;\n }\n>;\n\nexport function normalizeProgressBounds(min: number, max: number) {\n const safeMin = Number.isFinite(min) ? min : 0;\n const safeMax = Number.isFinite(max) ? max : 100;\n\n return safeMax >= safeMin ? { min: safeMin, max: safeMax } : { min: safeMax, max: safeMin };\n}\n\nexport function normalizeProgressValue(value: number | null | undefined, min: number, max: number) {\n const safeValue = Number.isFinite(value) ? Number(value) : min;\n\n return Math.min(max, Math.max(min, safeValue));\n}\n\nexport function getProgressValuePercent(value: number, min: number, max: number) {\n if (max <= min) return 0;\n\n const percent = ((value - min) / (max - min)) * 100;\n return Math.min(100, Math.max(0, percent));\n}\n\nfunction getFormattedProgressValue(\n value: number,\n percent: number,\n formatter: ProgressProps['formatValue'],\n) {\n return formatter ? formatter(value, percent) : `${Math.round(percent)}%`;\n}\n\nfunction getProgressAriaValueText(\n value: number,\n percent: number,\n ariaValueText: ProgressProps['ariaValueText'],\n formatter: ProgressProps['formatValue'],\n) {\n if (typeof ariaValueText === 'function') return String(ariaValueText(value, percent));\n if (ariaValueText != null && ariaValueText !== '') return String(ariaValueText);\n if (formatter) return String(formatter(value, percent));\n\n return undefined;\n}\n\nfunction setProgressStyleValue(\n style: CSSProperties,\n property: `--_rp-progress-${string}`,\n value: string | undefined,\n) {\n if (value) {\n style[property] = value;\n }\n}\n\nexport function useProgress(props: ProgressStateProps) {\n const control = useControlState(props);\n\n const bounds = computed(() => normalizeProgressBounds(props.min, props.max));\n const isIndeterminate = computed(() => props.indeterminate || props.value == null);\n const normalizedValue = computed(() =>\n normalizeProgressValue(props.value, bounds.value.min, bounds.value.max),\n );\n const valuePercent = computed(() =>\n getProgressValuePercent(normalizedValue.value, bounds.value.min, bounds.value.max),\n );\n const formattedValue = computed(() =>\n getFormattedProgressValue(normalizedValue.value, valuePercent.value, props.formatValue),\n );\n const ariaValueText = computed(() =>\n isIndeterminate.value\n ? undefined\n : getProgressAriaValueText(\n normalizedValue.value,\n valuePercent.value,\n props.ariaValueText,\n props.formatValue,\n ),\n );\n const rootClass = computed(() =>\n bem('rp-progress', {\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n indeterminate: isIndeterminate.value,\n }),\n );\n const rootStyle = computed<CSSProperties>(() => {\n const style: CSSProperties = {\n '--_rp-progress-value': `${valuePercent.value}%`,\n '--_rp-progress-ratio': `${valuePercent.value / 100}`,\n };\n\n setProgressStyleValue(\n style,\n '--_rp-progress-custom-color',\n getComponentCustomColor(props.color),\n );\n\n return style;\n });\n\n return {\n control,\n rootClass,\n rootStyle,\n isIndeterminate,\n normalizedValue,\n valuePercent,\n formattedValue,\n ariaValueText,\n ariaValueMin: computed(() => (isIndeterminate.value ? undefined : bounds.value.min)),\n ariaValueMax: computed(() => (isIndeterminate.value ? undefined : bounds.value.max)),\n ariaValueNow: computed(() => (isIndeterminate.value ? undefined : normalizedValue.value)),\n };\n}\n","<template>\n <div\n :id=\"control.id\"\n :class=\"rootClass\"\n :style=\"rootStyle\"\n role=\"progressbar\"\n :data-state=\"isIndeterminate ? 'indeterminate' : 'determinate'\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-valuemin=\"ariaValueMin\"\n :aria-valuemax=\"ariaValueMax\"\n :aria-valuenow=\"ariaValueNow\"\n :aria-valuetext=\"ariaValueText\"\n >\n <span\n v-if=\"$slots.default || (!isIndeterminate && ($slots.value || showValue))\"\n class=\"rp-progress__header\"\n >\n <span v-if=\"$slots.default\" class=\"rp-progress__label\">\n <slot />\n </span>\n <span\n v-if=\"!isIndeterminate && ($slots.value || showValue)\"\n class=\"rp-progress__value\"\n aria-hidden=\"true\"\n >\n <slot\n v-if=\"$slots.value\"\n name=\"value\"\n :value=\"normalizedValue\"\n :formatted-value=\"formattedValue\"\n :percent=\"valuePercent\"\n />\n <template v-else>{{ formattedValue }}</template>\n </span>\n </span>\n <span class=\"rp-progress__track\" aria-hidden=\"true\">\n <span class=\"rp-progress__indicator\" />\n </span>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport type { ProgressProps } from './types';\nimport { useProgress } from './useProgress';\n\ndefineOptions({ name: 'RpProgress' });\n\nconst props = withDefaults(defineProps<ProgressProps>(), {\n min: 0,\n max: 100,\n indeterminate: false,\n showValue: false,\n});\n\nconst {\n control,\n rootClass,\n rootStyle,\n isIndeterminate,\n normalizedValue,\n valuePercent,\n formattedValue,\n ariaValueText,\n ariaValueMin,\n ariaValueMax,\n ariaValueNow,\n} = useProgress(props);\n</script>\n\n<style src=\"./progress.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div\n :id=\"control.id\"\n :class=\"rootClass\"\n :style=\"rootStyle\"\n role=\"progressbar\"\n :data-state=\"isIndeterminate ? 'indeterminate' : 'determinate'\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-valuemin=\"ariaValueMin\"\n :aria-valuemax=\"ariaValueMax\"\n :aria-valuenow=\"ariaValueNow\"\n :aria-valuetext=\"ariaValueText\"\n >\n <span\n v-if=\"$slots.default || (!isIndeterminate && ($slots.value || showValue))\"\n class=\"rp-progress__header\"\n >\n <span v-if=\"$slots.default\" class=\"rp-progress__label\">\n <slot />\n </span>\n <span\n v-if=\"!isIndeterminate && ($slots.value || showValue)\"\n class=\"rp-progress__value\"\n aria-hidden=\"true\"\n >\n <slot\n v-if=\"$slots.value\"\n name=\"value\"\n :value=\"normalizedValue\"\n :formatted-value=\"formattedValue\"\n :percent=\"valuePercent\"\n />\n <template v-else>{{ formattedValue }}</template>\n </span>\n </span>\n <span class=\"rp-progress__track\" aria-hidden=\"true\">\n <span class=\"rp-progress__indicator\" />\n </span>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport type { ProgressProps } from './types';\nimport { useProgress } from './useProgress';\n\ndefineOptions({ name: 'RpProgress' });\n\nconst props = withDefaults(defineProps<ProgressProps>(), {\n min: 0,\n max: 100,\n indeterminate: false,\n showValue: false,\n});\n\nconst {\n control,\n rootClass,\n rootStyle,\n isIndeterminate,\n normalizedValue,\n valuePercent,\n formattedValue,\n ariaValueText,\n ariaValueMin,\n ariaValueMax,\n ariaValueNow,\n} = useProgress(props);\n</script>\n\n<style src=\"./progress.scss\" lang=\"scss\" scoped></style>\n","import { componentColors, type ComponentColorValue } from '../../utils/componentColors';\n\nexport const progressColors = componentColors;\n\nexport const progressSizes = ['xs', 'sm', 'md', 'lg', 'xl'] as const;\n\nexport const progressRadiuses = ['none', 'xs', 'sm', 'md', 'lg', 'xl', 'full'] as const;\n\nexport type ProgressColor = ComponentColorValue;\n\nexport type ProgressSize = (typeof progressSizes)[number];\n\nexport type ProgressRadius = (typeof progressRadiuses)[number];\n\nexport type ProgressValueFormatter = (value: number, percent: number) => string | number;\n\nexport interface ProgressProps {\n id?: string;\n value?: number | null;\n min?: number;\n max?: number;\n color?: ProgressColor;\n size?: ProgressSize;\n radius?: ProgressRadius;\n indeterminate?: boolean;\n showValue?: boolean;\n formatValue?: ProgressValueFormatter;\n ariaLabel?: string;\n ariaValueText?: string | ProgressValueFormatter;\n describedby?: string;\n labelledby?: string;\n}\n"],"mappings":"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"}
|
package/dist/radio.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"radio.js","names":[],"sources":["../src/composables/useRequiredInject.ts","../src/components/radio/types.ts","../src/components/radio/useRadio.ts","../src/components/radio/radio.vue","../src/components/radio/radio.vue","../src/components/radio/radio-group.vue","../src/components/radio/radio-group.vue"],"sourcesContent":["import { inject, type InjectionKey } from 'vue';\n\nexport function useRequiredInject<T>(key: InjectionKey<T>, componentName: string): T {\n const value = inject(key);\n if (value == null) {\n throw new Error(\n `[Ropav] <${componentName}> must be used inside its parent provider component.`,\n );\n }\n return value;\n}\n","import type { InjectionKey } from 'vue';\nimport type { ComponentColorValue } from '../../utils/componentColors';\n\nexport type RadioColor = ComponentColorValue;\n\nexport type RadioSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport type RadioVariant = 'solid' | 'outline';\n\nexport interface RadioProps {\n value: string | number;\n variant?: RadioVariant;\n color?: RadioColor;\n size?: RadioSize;\n disabled?: boolean;\n}\n\nexport interface RadioGroupProps {\n id?: string;\n name?: string;\n modelValue: string | number | null;\n variant?: RadioVariant;\n color?: RadioColor;\n size?: RadioSize;\n disabled?: boolean;\n required?: boolean;\n invalid?: boolean;\n ariaLabel?: string;\n describedby?: string;\n labelledby?: string;\n}\n\nexport interface RadioGroupContext {\n modelValue: string | number | null;\n name: string;\n disabled: boolean;\n required: boolean;\n variant?: RadioVariant;\n color?: RadioColor;\n size?: RadioSize;\n select: (value: string | number) => void;\n}\n\nexport const radioGroupKey = Symbol('radioGroup') as InjectionKey<RadioGroupContext>;\n","import { computed, provide, useId, type CSSProperties } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { useRequiredInject } from '@/composables/useRequiredInject';\nimport { getComponentCustomColor, isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport { radioGroupKey } from './types';\nimport type { RadioGroupContext, RadioGroupProps, RadioProps } from './types';\n\nfunction getRadioColorStyle(color: RadioProps['color']) {\n const customColor = getComponentCustomColor(color);\n if (!customColor) return undefined;\n\n return {\n '--_rp-radio-custom-color': customColor,\n '--_rp-radio-custom-on-color': 'var(--rp-color-on-primary)',\n } satisfies CSSProperties;\n}\n\nexport function useRadio(props: Readonly<RadioProps>) {\n const group = useRequiredInject(radioGroupKey, 'RpRadio');\n const isChecked = computed(() => group.modelValue === props.value);\n const isDisabled = computed(() => props.disabled || group.disabled);\n const variant = computed(() => props.variant ?? group.variant);\n const color = computed(() => props.color ?? group.color);\n const size = computed(() => props.size ?? group.size);\n\n const rootClass = computed(() =>\n bem('rp-radio', {\n checked: isChecked.value,\n disabled: isDisabled.value,\n [variant.value ?? '']: Boolean(variant.value),\n [`color-${color.value}`]: isComponentPresetColor(color.value),\n [`size-${size.value}`]: Boolean(size.value),\n }),\n );\n\n const rootStyle = computed(() => getRadioColorStyle(color.value));\n\n function onSelect() {\n if (isDisabled.value) return;\n group.select(props.value);\n }\n\n return {\n group,\n isChecked,\n isDisabled,\n rootClass,\n rootStyle,\n onSelect,\n };\n}\n\nexport function useRadioGroup(\n props: Readonly<RadioGroupProps>,\n emitUpdate: (value: string | number | null) => void,\n) {\n const control = useControlState(props);\n\n const rootClass = computed(() =>\n bem('rp-radio-group', {\n disabled: control.disabled,\n invalid: control.invalid,\n }),\n );\n\n const generatedName = useId();\n const groupName = computed(() => props.name ?? `${control.id ?? generatedName}-radio`);\n\n provide<RadioGroupContext>(radioGroupKey, {\n get modelValue() {\n return props.modelValue;\n },\n get name() {\n return groupName.value;\n },\n get disabled() {\n return control.disabled;\n },\n get required() {\n return control.required;\n },\n get variant() {\n return props.variant;\n },\n get color() {\n return props.color;\n },\n get size() {\n return props.size;\n },\n select(value) {\n emitUpdate(value);\n },\n });\n\n return {\n control,\n rootClass,\n };\n}\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"isDisabled || undefined\"\n :data-state=\"isChecked ? 'checked' : 'unchecked'\"\n >\n <input\n type=\"radio\"\n class=\"rp-radio__native\"\n :name=\"group.name\"\n :value=\"value\"\n :checked=\"isChecked\"\n :disabled=\"isDisabled || undefined\"\n :required=\"group.required || undefined\"\n @change=\"onSelect\"\n />\n <span class=\"rp-radio__dot\" />\n <span v-if=\"$slots.default\" class=\"rp-radio__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useRadio } from './useRadio';\nimport type { RadioProps } from './types';\n\ndefineOptions({ name: 'RpRadio' });\n\nconst props = withDefaults(defineProps<RadioProps>(), {\n variant: undefined,\n color: undefined,\n size: undefined,\n disabled: false,\n});\n\nconst { group, isChecked, isDisabled, rootClass, rootStyle, onSelect } = useRadio(props);\n</script>\n\n<style src=\"./radio.scss\" lang=\"scss\" scoped></style>\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"isDisabled || undefined\"\n :data-state=\"isChecked ? 'checked' : 'unchecked'\"\n >\n <input\n type=\"radio\"\n class=\"rp-radio__native\"\n :name=\"group.name\"\n :value=\"value\"\n :checked=\"isChecked\"\n :disabled=\"isDisabled || undefined\"\n :required=\"group.required || undefined\"\n @change=\"onSelect\"\n />\n <span class=\"rp-radio__dot\" />\n <span v-if=\"$slots.default\" class=\"rp-radio__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useRadio } from './useRadio';\nimport type { RadioProps } from './types';\n\ndefineOptions({ name: 'RpRadio' });\n\nconst props = withDefaults(defineProps<RadioProps>(), {\n variant: undefined,\n color: undefined,\n size: undefined,\n disabled: false,\n});\n\nconst { group, isChecked, isDisabled, rootClass, rootStyle, onSelect } = useRadio(props);\n</script>\n\n<style src=\"./radio.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div\n :id=\"control.id\"\n :class=\"rootClass\"\n role=\"radiogroup\"\n :data-disabled=\"control.disabled || undefined\"\n :data-invalid=\"control.invalid || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n >\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useRadioGroup } from './useRadio';\nimport type { RadioGroupProps } from './types';\n\ndefineOptions({ name: 'RpRadioGroup' });\n\nconst props = withDefaults(defineProps<RadioGroupProps>(), {\n variant: undefined,\n color: undefined,\n size: undefined,\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string | number | null];\n}>();\n\nconst { control, rootClass } = useRadioGroup(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./radio-group.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div\n :id=\"control.id\"\n :class=\"rootClass\"\n role=\"radiogroup\"\n :data-disabled=\"control.disabled || undefined\"\n :data-invalid=\"control.invalid || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n >\n <slot />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useRadioGroup } from './useRadio';\nimport type { RadioGroupProps } from './types';\n\ndefineOptions({ name: 'RpRadioGroup' });\n\nconst props = withDefaults(defineProps<RadioGroupProps>(), {\n variant: undefined,\n color: undefined,\n size: undefined,\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string | number | null];\n}>();\n\nconst { control, rootClass } = useRadioGroup(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./radio-group.scss\" lang=\"scss\" scoped></style>\n"],"mappings":"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"}
|
package/dist/select.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","names":[],"sources":["../src/composables/useClickOutside.ts","../src/composables/useListNavigation.ts","../src/components/select/useSelect.ts","../src/components/select/select.vue","../src/components/select/select.vue"],"sourcesContent":["import { watch, onMounted, onBeforeUnmount, type Ref } from 'vue';\n\nexport function useClickOutside(\n target: Ref<HTMLElement | null>,\n active: Ref<boolean>,\n callback: () => void,\n) {\n let isListening = false;\n let stopWatch: (() => void) | undefined;\n\n function handler(e: MouseEvent) {\n if (target.value && !target.value.contains(e.target as Node)) {\n callback();\n }\n }\n\n function setListening(value: boolean) {\n if (typeof document === 'undefined' || value === isListening) return;\n isListening = value;\n\n if (value) {\n document.addEventListener('click', handler, true);\n } else {\n document.removeEventListener('click', handler, true);\n }\n }\n\n onMounted(() => {\n stopWatch = watch(active, setListening, { immediate: true });\n });\n\n onBeforeUnmount(() => {\n stopWatch?.();\n setListening(false);\n });\n}\n","import { computed, ref } from 'vue';\n\nexport interface ListNavigationItem {\n disabled?: boolean;\n}\n\nexport interface UseListNavigationOptions<T extends ListNavigationItem> {\n items: () => T[];\n isSelected?: (item: T) => boolean;\n loop?: boolean;\n}\n\nexport function useListNavigation<T extends ListNavigationItem>(\n options: UseListNavigationOptions<T>,\n) {\n const localFocusedIndex = ref(-1);\n const loop = options.loop ?? true;\n\n const enabledIndexes = computed(() =>\n options\n .items()\n .map((item, index) => (item.disabled ? -1 : index))\n .filter((index) => index >= 0),\n );\n\n function resetFocus() {\n localFocusedIndex.value = -1;\n }\n\n function setNearest(index: number, direction: 1 | -1) {\n const indexes = enabledIndexes.value;\n if (indexes.length === 0) {\n resetFocus();\n return;\n }\n\n if (options.items()[index] && !options.items()[index]?.disabled) {\n localFocusedIndex.value = index;\n return;\n }\n\n let next: number | undefined;\n if (direction === 1) {\n next = indexes.find((i) => i > index);\n } else {\n for (let i = indexes.length - 1; i >= 0; i -= 1) {\n const candidate = indexes[i]!;\n if (candidate < index) {\n next = candidate;\n break;\n }\n }\n }\n\n if (next !== undefined) {\n localFocusedIndex.value = next;\n } else if (loop) {\n localFocusedIndex.value = direction === 1 ? indexes[0]! : indexes[indexes.length - 1]!;\n }\n }\n\n function focusSelected() {\n const items = options.items();\n const selectedIndex = options.isSelected\n ? items.findIndex((item) => options.isSelected!(item) && !item.disabled)\n : -1;\n if (selectedIndex >= 0) {\n localFocusedIndex.value = selectedIndex;\n } else {\n focusFirst();\n }\n }\n\n function focusFirst() {\n const first = enabledIndexes.value[0];\n localFocusedIndex.value = first ?? -1;\n }\n\n function focusLast() {\n const indexes = enabledIndexes.value;\n localFocusedIndex.value = indexes[indexes.length - 1] ?? -1;\n }\n\n function moveFocus(delta: 1 | -1) {\n if (localFocusedIndex.value < 0) {\n if (delta === 1) {\n focusFirst();\n } else {\n focusLast();\n }\n return;\n }\n setNearest(localFocusedIndex.value + delta, delta);\n }\n\n return {\n focusedIndex: localFocusedIndex,\n resetFocus,\n focusSelected,\n focusFirst,\n focusLast,\n moveFocus,\n };\n}\n","import { computed, nextTick, ref, useId } from 'vue';\nimport { useClickOutside } from '@/composables/useClickOutside';\nimport { useControlState } from '@/composables/useControlState';\nimport { useListNavigation } from '@/composables/useListNavigation';\nimport { bem } from '@/utils/bem';\nimport type { SelectOption, SelectProps } from './types';\n\ntype SelectValue = string | number | null;\n\nfunction hasSelectValue(value: SelectValue) {\n return value != null && value !== '';\n}\n\nfunction getSelectDisplayLabel(options: SelectOption[] | undefined, value: SelectValue) {\n if (!hasSelectValue(value)) return '';\n return options?.find((option) => option.value === value)?.label ?? '';\n}\n\nfunction getSelectActiveDescendantId(baseId: string, focusedIndex: number) {\n return focusedIndex < 0 ? undefined : `${baseId}-option-${focusedIndex}`;\n}\n\nexport function useSelect(props: Readonly<SelectProps>, emitUpdate: (value: SelectValue) => void) {\n const selectRef = ref<HTMLElement | null>(null);\n const triggerRef = ref<HTMLElement | null>(null);\n const isOpen = ref(false);\n\n const selectId = useId();\n const listboxId = `${selectId}-listbox`;\n\n const control = useControlState(props);\n const visibleOptions = computed(() => props.options ?? []);\n\n const navigation = useListNavigation<SelectOption>({\n items: () => visibleOptions.value,\n isSelected: (item) => item.value === props.modelValue,\n });\n\n const focusedIndex = navigation.focusedIndex;\n const activeDescendantId = computed(() =>\n getSelectActiveDescendantId(selectId, focusedIndex.value),\n );\n\n const rootClass = computed(() =>\n bem('rp-select', {\n open: isOpen.value,\n [`radius-${props.radius}`]: Boolean(props.radius),\n disabled: control.disabled,\n invalid: control.invalid,\n }),\n );\n\n const hasValue = computed(() => hasSelectValue(props.modelValue));\n const displayLabel = computed(() => getSelectDisplayLabel(props.options, props.modelValue));\n const canClear = computed(() =>\n Boolean(props.clearable && hasValue.value && !control.disabled),\n );\n\n function focusTrigger() {\n nextTick(() => triggerRef.value?.focus());\n }\n\n function open() {\n if (control.disabled || isOpen.value) return;\n isOpen.value = true;\n navigation.focusSelected();\n }\n\n function close() {\n isOpen.value = false;\n navigation.resetFocus();\n }\n\n function toggle() {\n if (control.disabled) return;\n if (isOpen.value) {\n close();\n focusTrigger();\n } else {\n open();\n }\n }\n\n function selectOption(option: SelectOption) {\n if (option.disabled) return;\n emitUpdate(option.value);\n close();\n focusTrigger();\n }\n\n function clearSelection() {\n if (!canClear.value) return;\n emitUpdate(null);\n close();\n focusTrigger();\n }\n\n function onOptionMouseenter(option: SelectOption, index: number) {\n if (!option.disabled) focusedIndex.value = index;\n }\n\n function selectFocusedOption() {\n if (focusedIndex.value < 0 || focusedIndex.value >= visibleOptions.value.length) return;\n selectOption(visibleOptions.value[focusedIndex.value]!);\n }\n\n function onTriggerKeydown(e: KeyboardEvent) {\n if (control.disabled) return;\n\n switch (e.key) {\n case 'Enter':\n e.preventDefault();\n if (!isOpen.value) open();\n else selectFocusedOption();\n break;\n case ' ':\n e.preventDefault();\n if (!isOpen.value) open();\n else selectFocusedOption();\n break;\n case 'ArrowDown':\n e.preventDefault();\n if (!isOpen.value) open();\n else navigation.moveFocus(1);\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!isOpen.value) {\n open();\n navigation.focusLast();\n } else {\n navigation.moveFocus(-1);\n }\n break;\n case 'Home':\n if (isOpen.value) {\n e.preventDefault();\n navigation.focusFirst();\n }\n break;\n case 'End':\n if (isOpen.value) {\n e.preventDefault();\n navigation.focusLast();\n }\n break;\n case 'Delete':\n case 'Backspace':\n if (canClear.value) {\n e.preventDefault();\n clearSelection();\n }\n break;\n case 'Escape':\n e.preventDefault();\n close();\n focusTrigger();\n break;\n }\n }\n\n useClickOutside(selectRef, isOpen, close);\n\n return {\n selectRef,\n triggerRef,\n isOpen,\n selectId,\n listboxId,\n control,\n visibleOptions,\n focusedIndex,\n activeDescendantId,\n rootClass,\n hasValue,\n displayLabel,\n canClear,\n toggle,\n selectOption,\n clearSelection,\n onOptionMouseenter,\n onTriggerKeydown,\n };\n}\n","<template>\n <div :class=\"rootClass\" ref=\"selectRef\">\n <input\n v-if=\"name\"\n type=\"hidden\"\n :name=\"name\"\n :value=\"modelValue ?? ''\"\n :disabled=\"control.disabled || undefined\"\n />\n <div\n :id=\"control.id\"\n ref=\"triggerRef\"\n class=\"rp-select__trigger\"\n role=\"combobox\"\n :aria-expanded=\"isOpen\"\n aria-haspopup=\"listbox\"\n :aria-activedescendant=\"activeDescendantId\"\n :aria-controls=\"listboxId\"\n :aria-disabled=\"control.disabled || undefined\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :data-state=\"isOpen ? 'open' : 'closed'\"\n :data-disabled=\"control.disabled || undefined\"\n :tabindex=\"control.disabled ? -1 : 0\"\n @click=\"toggle\"\n @keydown=\"onTriggerKeydown\"\n >\n <span class=\"rp-select__value\" :class=\"{ 'rp-select__placeholder': !hasValue }\">\n {{ displayLabel || placeholder }}\n </span>\n\n <span class=\"rp-select__indicator\">\n <button\n v-if=\"canClear\"\n type=\"button\"\n class=\"rp-select__clear\"\n aria-label=\"Clear selection\"\n tabindex=\"-1\"\n @mousedown.prevent\n @click.stop=\"clearSelection\"\n >\n <XIcon />\n </button>\n <span class=\"rp-select__arrow\" aria-hidden=\"true\">\n <ChevronsUpDownIcon />\n </span>\n </span>\n </div>\n\n <Transition name=\"rp-select-dropdown\">\n <div v-if=\"isOpen\" class=\"rp-select__dropdown\" role=\"listbox\" :id=\"listboxId\">\n <div v-if=\"visibleOptions.length === 0\" class=\"rp-select__empty\">\n <slot name=\"empty\">No options</slot>\n </div>\n <div\n v-for=\"(option, index) in visibleOptions\"\n :key=\"option.value\"\n role=\"option\"\n :id=\"`${selectId}-option-${index}`\"\n :aria-selected=\"option.value === modelValue\"\n :aria-disabled=\"option.disabled || undefined\"\n :data-selected=\"option.value === modelValue || undefined\"\n :data-disabled=\"option.disabled || undefined\"\n :class=\"[\n 'rp-select__option',\n {\n 'rp-select__option--selected': option.value === modelValue,\n 'rp-select__option--focused': index === focusedIndex,\n 'rp-select__option--disabled': option.disabled,\n },\n ]\"\n @click=\"selectOption(option)\"\n @mouseenter=\"onOptionMouseenter(option, index)\"\n >\n {{ option.label }}\n </div>\n </div>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport ChevronsUpDownIcon from '~icons/lucide/chevrons-up-down';\nimport XIcon from '~icons/lucide/x';\nimport { useSelect } from './useSelect';\nimport type { SelectProps } from './types';\n\ndefineOptions({ name: 'RpSelect' });\n\nconst props = withDefaults(defineProps<SelectProps>(), {\n options: () => [],\n placeholder: 'Select...',\n clearable: false,\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string | number | null];\n}>();\n\nconst {\n selectRef,\n triggerRef,\n isOpen,\n selectId,\n listboxId,\n control,\n visibleOptions,\n focusedIndex,\n activeDescendantId,\n rootClass,\n hasValue,\n displayLabel,\n canClear,\n toggle,\n selectOption,\n clearSelection,\n onOptionMouseenter,\n onTriggerKeydown,\n} = useSelect(props, (value) => {\n emit('update:modelValue', value);\n});\n\nvoid selectRef;\nvoid triggerRef;\n</script>\n\n<style src=\"./select.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div :class=\"rootClass\" ref=\"selectRef\">\n <input\n v-if=\"name\"\n type=\"hidden\"\n :name=\"name\"\n :value=\"modelValue ?? ''\"\n :disabled=\"control.disabled || undefined\"\n />\n <div\n :id=\"control.id\"\n ref=\"triggerRef\"\n class=\"rp-select__trigger\"\n role=\"combobox\"\n :aria-expanded=\"isOpen\"\n aria-haspopup=\"listbox\"\n :aria-activedescendant=\"activeDescendantId\"\n :aria-controls=\"listboxId\"\n :aria-disabled=\"control.disabled || undefined\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :data-state=\"isOpen ? 'open' : 'closed'\"\n :data-disabled=\"control.disabled || undefined\"\n :tabindex=\"control.disabled ? -1 : 0\"\n @click=\"toggle\"\n @keydown=\"onTriggerKeydown\"\n >\n <span class=\"rp-select__value\" :class=\"{ 'rp-select__placeholder': !hasValue }\">\n {{ displayLabel || placeholder }}\n </span>\n\n <span class=\"rp-select__indicator\">\n <button\n v-if=\"canClear\"\n type=\"button\"\n class=\"rp-select__clear\"\n aria-label=\"Clear selection\"\n tabindex=\"-1\"\n @mousedown.prevent\n @click.stop=\"clearSelection\"\n >\n <XIcon />\n </button>\n <span class=\"rp-select__arrow\" aria-hidden=\"true\">\n <ChevronsUpDownIcon />\n </span>\n </span>\n </div>\n\n <Transition name=\"rp-select-dropdown\">\n <div v-if=\"isOpen\" class=\"rp-select__dropdown\" role=\"listbox\" :id=\"listboxId\">\n <div v-if=\"visibleOptions.length === 0\" class=\"rp-select__empty\">\n <slot name=\"empty\">No options</slot>\n </div>\n <div\n v-for=\"(option, index) in visibleOptions\"\n :key=\"option.value\"\n role=\"option\"\n :id=\"`${selectId}-option-${index}`\"\n :aria-selected=\"option.value === modelValue\"\n :aria-disabled=\"option.disabled || undefined\"\n :data-selected=\"option.value === modelValue || undefined\"\n :data-disabled=\"option.disabled || undefined\"\n :class=\"[\n 'rp-select__option',\n {\n 'rp-select__option--selected': option.value === modelValue,\n 'rp-select__option--focused': index === focusedIndex,\n 'rp-select__option--disabled': option.disabled,\n },\n ]\"\n @click=\"selectOption(option)\"\n @mouseenter=\"onOptionMouseenter(option, index)\"\n >\n {{ option.label }}\n </div>\n </div>\n </Transition>\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport ChevronsUpDownIcon from '~icons/lucide/chevrons-up-down';\nimport XIcon from '~icons/lucide/x';\nimport { useSelect } from './useSelect';\nimport type { SelectProps } from './types';\n\ndefineOptions({ name: 'RpSelect' });\n\nconst props = withDefaults(defineProps<SelectProps>(), {\n options: () => [],\n placeholder: 'Select...',\n clearable: false,\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string | number | null];\n}>();\n\nconst {\n selectRef,\n triggerRef,\n isOpen,\n selectId,\n listboxId,\n control,\n visibleOptions,\n focusedIndex,\n activeDescendantId,\n rootClass,\n hasValue,\n displayLabel,\n canClear,\n toggle,\n selectOption,\n clearSelection,\n onOptionMouseenter,\n onTriggerKeydown,\n} = useSelect(props, (value) => {\n emit('update:modelValue', value);\n});\n\nvoid selectRef;\nvoid triggerRef;\n</script>\n\n<style src=\"./select.scss\" lang=\"scss\" scoped></style>\n"],"mappings":"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"}
|
package/dist/slider.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"slider.js","names":[],"sources":["../src/components/slider/types.ts","../src/components/slider/useSlider.ts","../src/components/slider/slider.vue","../src/components/slider/slider.vue"],"sourcesContent":["import type { TooltipProps } from '../tooltip/types';\n\nexport const sliderColors = [\n 'primary',\n 'secondary',\n 'success',\n 'warning',\n 'danger',\n 'info',\n 'neutral',\n] as const;\n\nexport const sliderSizes = ['xs', 'sm', 'md', 'lg', 'xl'] as const;\n\nexport const sliderOrientations = ['horizontal', 'vertical'] as const;\n\nexport type SliderPresetColor = (typeof sliderColors)[number];\n\nexport type SliderColor = SliderPresetColor | (string & {});\n\nexport type SliderSize = (typeof sliderSizes)[number];\n\nexport type SliderOrientation = (typeof sliderOrientations)[number];\n\nexport type SliderValueFormatter = (value: number) => string | number;\n\nexport type SliderTooltipMode = 'hover' | 'always';\n\nexport type SliderTooltipOptions = Pick<\n TooltipProps,\n 'id' | 'placement' | 'color' | 'offset' | 'openDelay' | 'arrow'\n> & {\n mode?: SliderTooltipMode;\n};\n\nexport type SliderTooltip = false | SliderTooltipMode | SliderTooltipOptions;\n\nexport type SliderMarkColor = SliderColor;\n\nexport interface SliderMark {\n value: number;\n label?: string | number;\n color?: SliderMarkColor;\n hidden?: boolean;\n}\n\nexport type SliderMarkInput = number | SliderMark;\n\nexport interface SliderThumbStyle {\n size?: number | string;\n border?: number | string;\n padding?: number | string;\n}\n\nexport interface SliderProps {\n id?: string;\n name?: string;\n modelValue: number;\n min?: number;\n max?: number;\n step?: number | 'any';\n marks?: SliderMarkInput[];\n thumbStyle?: SliderThumbStyle;\n tooltip?: SliderTooltip;\n formatValue?: SliderValueFormatter;\n color?: SliderColor;\n size?: SliderSize;\n orientation?: SliderOrientation;\n disabled?: boolean;\n required?: boolean;\n invalid?: boolean;\n valid?: boolean;\n ariaLabel?: string;\n ariaValueText?: string | SliderValueFormatter;\n describedby?: string;\n labelledby?: string;\n}\n","import { computed, type CSSProperties } from 'vue';\nimport { useDelayedOpen } from '@/composables/useDelayedOpen';\nimport { useControlState } from '@/composables/useControlState';\nimport { bem } from '@/utils/bem';\nimport { sliderColors } from './types';\nimport type {\n SliderMark,\n SliderMarkInput,\n SliderProps,\n SliderTooltipMode,\n SliderTooltipOptions,\n} from './types';\n\ntype SliderStateProps = Readonly<\n SliderProps & {\n min: number;\n max: number;\n step: number | 'any';\n tooltip: NonNullable<SliderProps['tooltip']>;\n orientation: NonNullable<SliderProps['orientation']>;\n }\n>;\n\nconst sliderColorNames = new Set<string>(sliderColors);\n\nconst sliderMarkColorProperties = [\n '--_rp-slider-mark-color',\n '--_rp-slider-mark-label-color',\n '--_rp-slider-mark-filled-label-color',\n '--_rp-slider-mark-ring-color',\n] as const;\n\nexport function normalizeSliderValue(\n value: number,\n min: number,\n max: number,\n step: number | 'any',\n) {\n const bounds = normalizeSliderBounds(min, max);\n const safeStep = normalizeSliderStep(step);\n const safeValue = Number.isFinite(value) ? value : bounds.min;\n const clamped = Math.min(bounds.max, Math.max(bounds.min, safeValue));\n\n if (safeStep === 'any') return clamped;\n\n const steps = Math.round((clamped - bounds.min) / safeStep);\n const snapped = bounds.min + steps * safeStep;\n\n return Math.min(bounds.max, Math.max(bounds.min, Number(snapped.toFixed(10))));\n}\n\nexport function normalizeSliderBounds(min: number, max: number) {\n const safeMin = Number.isFinite(min) ? min : 0;\n const safeMax = Number.isFinite(max) ? max : safeMin;\n\n return safeMax >= safeMin ? { min: safeMin, max: safeMax } : { min: safeMax, max: safeMin };\n}\n\nexport function normalizeSliderStep(step: number | 'any') {\n return step === 'any' || (Number.isFinite(step) && step > 0) ? step : 'any';\n}\n\nexport function getSliderValuePercent(value: number, min: number, max: number) {\n if (max <= min) return 0;\n\n const percent = ((value - min) / (max - min)) * 100;\n return Math.min(100, Math.max(0, percent));\n}\n\nfunction getSliderMarkColorValue(color: SliderMark['color']) {\n if (!color) return undefined;\n\n return sliderColorNames.has(color) ? `var(--rp-color-${color})` : color;\n}\n\nfunction isSliderPresetColor(color: SliderProps['color']) {\n return Boolean(color && sliderColorNames.has(color));\n}\n\nfunction getSliderCustomColorValue(color: SliderProps['color']) {\n if (!color || isSliderPresetColor(color)) return undefined;\n\n return color;\n}\n\nfunction setSliderStyleValue(\n style: CSSProperties,\n property: `--_rp-slider-${string}`,\n value: string | undefined,\n) {\n if (value) {\n style[property] = value;\n }\n}\n\nfunction getSliderMarkStyle(percent: number, color: SliderMark['color']) {\n const style: CSSProperties = {\n '--_rp-slider-mark-position': `${percent}%`,\n };\n const colorValue = getSliderMarkColorValue(color);\n\n for (const property of sliderMarkColorProperties) {\n setSliderStyleValue(style, property, colorValue);\n }\n\n return style;\n}\n\nfunction normalizeSliderMark(mark: SliderMarkInput): SliderMark {\n return typeof mark === 'number' ? { value: mark } : mark;\n}\n\nfunction normalizeSliderMarks(\n marks: SliderMarkInput[] | undefined,\n min: number,\n max: number,\n valuePercent: number,\n) {\n return (marks ?? []).flatMap((markInput, index) => {\n const mark = normalizeSliderMark(markInput);\n if (mark.hidden) return [];\n\n const value = Number(mark.value);\n if (!Number.isFinite(value)) return [];\n\n const percent = getSliderValuePercent(value, min, max);\n\n return {\n key: `${value}-${index}`,\n value,\n label: mark.label,\n hasLabel: mark.label != null,\n filled: percent <= valuePercent,\n style: getSliderMarkStyle(percent, mark.color),\n };\n });\n}\n\nfunction getSliderLengthValue(value: number | string | undefined) {\n if (value == null || value === '') return undefined;\n if (typeof value === 'number') return Number.isFinite(value) ? `${value}px` : undefined;\n\n return value;\n}\n\nfunction getSliderBorderValue(value: number | string | undefined) {\n if (value == null || value === '') return undefined;\n if (typeof value === 'number') {\n return Number.isFinite(value)\n ? `${value}px solid var(--_rp-slider-thumb-border)`\n : undefined;\n }\n\n return value;\n}\n\nconst sliderThumbStyleProps = [\n ['--_rp-slider-thumb-size', 'size', getSliderLengthValue],\n ['--_rp-slider-thumb-border-style', 'border', getSliderBorderValue],\n ['--_rp-slider-thumb-padding', 'padding', getSliderLengthValue],\n] as const;\n\nfunction getSliderTrackStyle(props: SliderStateProps, valuePercent: number) {\n const style: CSSProperties = {\n '--_rp-slider-percent': `${valuePercent}%`,\n '--_rp-slider-ratio': `${valuePercent / 100}`,\n };\n\n setSliderStyleValue(style, '--_rp-slider-custom-color', getSliderCustomColorValue(props.color));\n\n for (const [property, propName, getValue] of sliderThumbStyleProps) {\n setSliderStyleValue(style, property, getValue(props.thumbStyle?.[propName]));\n }\n\n return style;\n}\n\nfunction getFormattedSliderValue(value: number, formatter: SliderProps['formatValue']) {\n return formatter ? formatter(value) : value;\n}\n\nfunction getSliderAriaValueText(\n value: number,\n ariaValueText: SliderProps['ariaValueText'],\n formatter: SliderProps['formatValue'],\n) {\n if (typeof ariaValueText === 'function') return String(ariaValueText(value));\n if (ariaValueText != null && ariaValueText !== '') return String(ariaValueText);\n if (formatter) return String(formatter(value));\n\n return undefined;\n}\n\nfunction getSliderTooltipOptions(\n tooltip: NonNullable<SliderProps['tooltip']>,\n): SliderTooltipOptions {\n return typeof tooltip === 'object' ? tooltip : {};\n}\n\nfunction getSliderTooltipMode(\n tooltip: NonNullable<SliderProps['tooltip']>,\n): SliderTooltipMode | false {\n if (tooltip === false) return false;\n if (typeof tooltip === 'object') return tooltip.mode ?? 'hover';\n\n return tooltip;\n}\n\nexport function useSlider(props: SliderStateProps, emitUpdate: (value: number) => void) {\n const control = useControlState(props);\n\n const bounds = computed(() => normalizeSliderBounds(props.min, props.max));\n const nativeStep = computed(() => normalizeSliderStep(props.step));\n\n const normalizedValue = computed(() =>\n normalizeSliderValue(\n props.modelValue,\n bounds.value.min,\n bounds.value.max,\n nativeStep.value,\n ),\n );\n\n const valuePercent = computed(() =>\n getSliderValuePercent(normalizedValue.value, bounds.value.min, bounds.value.max),\n );\n\n const formattedValue = computed(() =>\n getFormattedSliderValue(normalizedValue.value, props.formatValue),\n );\n\n const ariaValueText = computed(() =>\n getSliderAriaValueText(normalizedValue.value, props.ariaValueText, props.formatValue),\n );\n\n const markItems = computed(() =>\n normalizeSliderMarks(props.marks, bounds.value.min, bounds.value.max, valuePercent.value),\n );\n\n const tooltipOptions = computed(() => getSliderTooltipOptions(props.tooltip));\n const tooltipMode = computed(() => getSliderTooltipMode(props.tooltip));\n const tooltipOpenDelay = computed(() => tooltipOptions.value.openDelay ?? 0);\n const {\n isOpen: delayedTooltipOpen,\n open: openDelayedTooltip,\n closeImmediate: closeDelayedTooltip,\n } = useDelayedOpen({\n openDelay: () => tooltipOpenDelay.value,\n disabled: () => tooltipMode.value !== 'hover' || control.disabled,\n });\n\n const hasMarkLabels = computed(() => markItems.value.some((mark) => mark.hasLabel));\n const tooltipVisible = computed(() => tooltipMode.value !== false);\n const tooltipAlwaysVisible = computed(() => tooltipMode.value === 'always');\n const tooltipOpen = computed(\n () =>\n tooltipAlwaysVisible.value ||\n (tooltipMode.value === 'hover' && delayedTooltipOpen.value && !control.disabled),\n );\n const tooltipPlacement = computed(\n () => tooltipOptions.value.placement ?? (props.orientation === 'vertical' ? 'left' : 'top'),\n );\n const tooltipId = computed(() => tooltipOptions.value.id);\n const tooltipColor = computed(() => tooltipOptions.value.color);\n const tooltipOffset = computed(() => tooltipOptions.value.offset);\n const tooltipArrow = computed(() => tooltipOptions.value.arrow ?? false);\n const tooltipContent = computed(() => String(formattedValue.value));\n\n const rootClass = computed(() =>\n bem('rp-slider', {\n [`color-${props.color}`]: isSliderPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n vertical: props.orientation === 'vertical',\n marked: markItems.value.length > 0,\n 'marks-with-labels': hasMarkLabels.value,\n 'tooltip-always-visible': tooltipAlwaysVisible.value,\n disabled: control.disabled,\n invalid: control.invalid,\n valid: control.valid && !control.invalid,\n }),\n );\n\n const trackStyle = computed<CSSProperties>(() =>\n getSliderTrackStyle(props, valuePercent.value),\n );\n\n function onInput(e: Event) {\n if (control.disabled) return;\n\n const input = e.target as HTMLInputElement;\n emitUpdate(\n normalizeSliderValue(\n input.valueAsNumber,\n bounds.value.min,\n bounds.value.max,\n nativeStep.value,\n ),\n );\n }\n\n function openTooltip() {\n if (tooltipMode.value === 'hover' && !control.disabled) openDelayedTooltip();\n }\n\n function closeTooltip() {\n closeDelayedTooltip();\n }\n\n function onTooltipKeydown(event: KeyboardEvent) {\n if (event.key === 'Escape') closeTooltip();\n }\n\n return {\n control,\n nativeMin: computed(() => bounds.value.min),\n nativeMax: computed(() => bounds.value.max),\n nativeStep,\n rootClass,\n normalizedValue,\n valuePercent,\n formattedValue,\n ariaValueText,\n markItems,\n trackStyle,\n tooltipVisible,\n tooltipOpen,\n tooltipPlacement,\n tooltipId,\n tooltipColor,\n tooltipOffset,\n tooltipOpenDelay,\n tooltipArrow,\n tooltipContent,\n onInput,\n openTooltip,\n closeTooltip,\n onTooltipKeydown,\n };\n}\n","<template>\n <label\n :class=\"[rootClass, { 'rp-slider--custom-thumb': $slots.thumb }]\"\n :data-disabled=\"control.disabled || undefined\"\n :style=\"trackStyle\"\n >\n <span v-if=\"$slots.default || $slots.value\" class=\"rp-slider__header\">\n <span v-if=\"$slots.default\" class=\"rp-slider__label\">\n <slot />\n </span>\n <span v-if=\"$slots.value\" class=\"rp-slider__value\" aria-hidden=\"true\">\n <slot\n name=\"value\"\n :value=\"normalizedValue\"\n :formatted-value=\"formattedValue\"\n :percent=\"valuePercent\"\n />\n </span>\n </span>\n <span\n class=\"rp-slider__track\"\n @mouseenter=\"openTooltip\"\n @mouseleave=\"closeTooltip\"\n @focusin=\"openTooltip\"\n @focusout=\"closeTooltip\"\n @keydown=\"onTooltipKeydown\"\n >\n <span class=\"rp-slider__bar\" aria-hidden=\"true\" />\n\n <input\n :id=\"control.id\"\n :name=\"name\"\n class=\"rp-slider__native\"\n type=\"range\"\n :value=\"normalizedValue\"\n :min=\"nativeMin\"\n :max=\"nativeMax\"\n :step=\"nativeStep\"\n :orient=\"orientation === 'vertical' ? 'vertical' : undefined\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-orientation=\"orientation === 'vertical' ? 'vertical' : undefined\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n :aria-valuetext=\"ariaValueText\"\n @input=\"onInput\"\n />\n\n <span v-if=\"markItems.length\" class=\"rp-slider__marks\" aria-hidden=\"true\">\n <span\n v-for=\"mark in markItems\"\n :key=\"mark.key\"\n class=\"rp-slider__mark\"\n :class=\"{ 'rp-slider__mark--filled': mark.filled }\"\n :style=\"mark.style\"\n >\n <span class=\"rp-slider__mark-dot\" />\n <span v-if=\"mark.hasLabel\" class=\"rp-slider__mark-label\">\n {{ mark.label }}\n </span>\n </span>\n </span>\n\n <span v-if=\"$slots.thumb\" class=\"rp-slider__thumb\" aria-hidden=\"true\">\n <span class=\"rp-slider__thumb-content\">\n <slot\n name=\"thumb\"\n :value=\"normalizedValue\"\n :formatted-value=\"formattedValue\"\n :percent=\"valuePercent\"\n />\n </span>\n </span>\n\n <Tooltip\n v-if=\"tooltipVisible\"\n :id=\"tooltipId\"\n class=\"rp-slider__tooltip\"\n :content=\"tooltipContent\"\n :placement=\"tooltipPlacement\"\n :color=\"tooltipColor\"\n :offset=\"tooltipOffset\"\n :open=\"tooltipOpen\"\n :open-delay=\"tooltipOpenDelay\"\n :arrow=\"tooltipArrow\"\n decorative\n >\n <span class=\"rp-slider__tooltip-anchor\" aria-hidden=\"true\" />\n </Tooltip>\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport Tooltip from '../tooltip/tooltip.vue';\nimport type { SliderProps } from './types';\nimport { useSlider } from './useSlider';\n\ndefineOptions({ name: 'RpSlider' });\n\nconst props = withDefaults(defineProps<SliderProps>(), {\n min: 0,\n max: 100,\n step: 1,\n marks: () => [],\n tooltip: 'hover',\n orientation: 'horizontal',\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n valid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: number];\n}>();\n\nconst {\n control,\n nativeMin,\n nativeMax,\n nativeStep,\n rootClass,\n normalizedValue,\n valuePercent,\n formattedValue,\n ariaValueText,\n markItems,\n trackStyle,\n tooltipVisible,\n tooltipOpen,\n tooltipPlacement,\n tooltipId,\n tooltipColor,\n tooltipOffset,\n tooltipOpenDelay,\n tooltipArrow,\n tooltipContent,\n onInput,\n openTooltip,\n closeTooltip,\n onTooltipKeydown,\n} = useSlider(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./slider.scss\" lang=\"scss\" scoped></style>\n","<template>\n <label\n :class=\"[rootClass, { 'rp-slider--custom-thumb': $slots.thumb }]\"\n :data-disabled=\"control.disabled || undefined\"\n :style=\"trackStyle\"\n >\n <span v-if=\"$slots.default || $slots.value\" class=\"rp-slider__header\">\n <span v-if=\"$slots.default\" class=\"rp-slider__label\">\n <slot />\n </span>\n <span v-if=\"$slots.value\" class=\"rp-slider__value\" aria-hidden=\"true\">\n <slot\n name=\"value\"\n :value=\"normalizedValue\"\n :formatted-value=\"formattedValue\"\n :percent=\"valuePercent\"\n />\n </span>\n </span>\n <span\n class=\"rp-slider__track\"\n @mouseenter=\"openTooltip\"\n @mouseleave=\"closeTooltip\"\n @focusin=\"openTooltip\"\n @focusout=\"closeTooltip\"\n @keydown=\"onTooltipKeydown\"\n >\n <span class=\"rp-slider__bar\" aria-hidden=\"true\" />\n\n <input\n :id=\"control.id\"\n :name=\"name\"\n class=\"rp-slider__native\"\n type=\"range\"\n :value=\"normalizedValue\"\n :min=\"nativeMin\"\n :max=\"nativeMax\"\n :step=\"nativeStep\"\n :orient=\"orientation === 'vertical' ? 'vertical' : undefined\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-orientation=\"orientation === 'vertical' ? 'vertical' : undefined\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n :aria-valuetext=\"ariaValueText\"\n @input=\"onInput\"\n />\n\n <span v-if=\"markItems.length\" class=\"rp-slider__marks\" aria-hidden=\"true\">\n <span\n v-for=\"mark in markItems\"\n :key=\"mark.key\"\n class=\"rp-slider__mark\"\n :class=\"{ 'rp-slider__mark--filled': mark.filled }\"\n :style=\"mark.style\"\n >\n <span class=\"rp-slider__mark-dot\" />\n <span v-if=\"mark.hasLabel\" class=\"rp-slider__mark-label\">\n {{ mark.label }}\n </span>\n </span>\n </span>\n\n <span v-if=\"$slots.thumb\" class=\"rp-slider__thumb\" aria-hidden=\"true\">\n <span class=\"rp-slider__thumb-content\">\n <slot\n name=\"thumb\"\n :value=\"normalizedValue\"\n :formatted-value=\"formattedValue\"\n :percent=\"valuePercent\"\n />\n </span>\n </span>\n\n <Tooltip\n v-if=\"tooltipVisible\"\n :id=\"tooltipId\"\n class=\"rp-slider__tooltip\"\n :content=\"tooltipContent\"\n :placement=\"tooltipPlacement\"\n :color=\"tooltipColor\"\n :offset=\"tooltipOffset\"\n :open=\"tooltipOpen\"\n :open-delay=\"tooltipOpenDelay\"\n :arrow=\"tooltipArrow\"\n decorative\n >\n <span class=\"rp-slider__tooltip-anchor\" aria-hidden=\"true\" />\n </Tooltip>\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport Tooltip from '../tooltip/tooltip.vue';\nimport type { SliderProps } from './types';\nimport { useSlider } from './useSlider';\n\ndefineOptions({ name: 'RpSlider' });\n\nconst props = withDefaults(defineProps<SliderProps>(), {\n min: 0,\n max: 100,\n step: 1,\n marks: () => [],\n tooltip: 'hover',\n orientation: 'horizontal',\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n valid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: number];\n}>();\n\nconst {\n control,\n nativeMin,\n nativeMax,\n nativeStep,\n rootClass,\n normalizedValue,\n valuePercent,\n formattedValue,\n ariaValueText,\n markItems,\n trackStyle,\n tooltipVisible,\n tooltipOpen,\n tooltipPlacement,\n tooltipId,\n tooltipColor,\n tooltipOffset,\n tooltipOpenDelay,\n tooltipArrow,\n tooltipContent,\n onInput,\n openTooltip,\n closeTooltip,\n onTooltipKeydown,\n} = useSlider(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./slider.scss\" lang=\"scss\" scoped></style>\n"],"mappings":"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"}
|
package/dist/switch.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"switch.js","names":[],"sources":["../src/components/switch/useSwitch.ts","../src/components/switch/switch.vue","../src/components/switch/switch.vue"],"sourcesContent":["import { computed, type CSSProperties } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { getComponentCustomColor, isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { SwitchProps } from './types';\n\nfunction getSwitchColorStyle(color: SwitchProps['color']) {\n const customColor = getComponentCustomColor(color);\n if (!customColor) return undefined;\n\n return {\n '--_rp-switch-custom-color': customColor,\n } satisfies CSSProperties;\n}\n\nexport function useSwitch(props: Readonly<SwitchProps>, emitUpdate: (value: boolean) => void) {\n const control = useControlState(props);\n\n const rootClass = computed(() =>\n bem('rp-switch', {\n checked: props.modelValue,\n disabled: control.disabled,\n invalid: control.invalid,\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n [`size-${props.size}`]: Boolean(props.size),\n }),\n );\n\n const rootStyle = computed(() => getSwitchColorStyle(props.color));\n\n function onChange(e: Event) {\n emitUpdate((e.target as HTMLInputElement).checked);\n }\n\n return {\n control,\n rootClass,\n rootStyle,\n onChange,\n };\n}\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"control.disabled || undefined\"\n :data-state=\"modelValue ? 'checked' : 'unchecked'\"\n >\n <input\n :id=\"control.id\"\n :name=\"name\"\n type=\"checkbox\"\n class=\"rp-switch__native\"\n role=\"switch\"\n :checked=\"modelValue\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :aria-checked=\"modelValue\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @change=\"onChange\"\n />\n <span class=\"rp-switch__track\">\n <span class=\"rp-switch__thumb\" />\n </span>\n <span v-if=\"$slots.default\" class=\"rp-switch__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useSwitch } from './useSwitch';\nimport type { SwitchProps } from './types';\n\ndefineOptions({ name: 'RpSwitch' });\n\nconst props = withDefaults(defineProps<SwitchProps>(), {\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: boolean];\n}>();\n\nconst { control, rootClass, rootStyle, onChange } = useSwitch(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./switch.scss\" lang=\"scss\" scoped></style>\n","<template>\n <label\n :class=\"rootClass\"\n :style=\"rootStyle\"\n :data-disabled=\"control.disabled || undefined\"\n :data-state=\"modelValue ? 'checked' : 'unchecked'\"\n >\n <input\n :id=\"control.id\"\n :name=\"name\"\n type=\"checkbox\"\n class=\"rp-switch__native\"\n role=\"switch\"\n :checked=\"modelValue\"\n :disabled=\"control.disabled || undefined\"\n :required=\"control.required || undefined\"\n :aria-checked=\"modelValue\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @change=\"onChange\"\n />\n <span class=\"rp-switch__track\">\n <span class=\"rp-switch__thumb\" />\n </span>\n <span v-if=\"$slots.default\" class=\"rp-switch__label\">\n <slot />\n </span>\n </label>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useSwitch } from './useSwitch';\nimport type { SwitchProps } from './types';\n\ndefineOptions({ name: 'RpSwitch' });\n\nconst props = withDefaults(defineProps<SwitchProps>(), {\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: boolean];\n}>();\n\nconst { control, rootClass, rootStyle, onChange } = useSwitch(props, (value) => {\n emit('update:modelValue', value);\n});\n</script>\n\n<style src=\"./switch.scss\" lang=\"scss\" scoped></style>\n"],"mappings":";;;;;AAMA,SAAS,oBAAoB,OAA6B;CACtD,MAAM,cAAc,wBAAwB,KAAK;CACjD,IAAI,CAAC,aAAa,OAAO,KAAA;CAEzB,OAAO,EACH,6BAA6B,YACjC;AACJ;AAEA,SAAgB,UAAU,OAA8B,YAAsC;CAC1F,MAAM,UAAU,gBAAgB,KAAK;CAErC,MAAM,YAAY,eACd,IAAI,aAAa;EACb,SAAS,MAAM;EACf,UAAU,QAAQ;EAClB,SAAS,QAAQ;GAChB,SAAS,MAAM,UAAU,uBAAuB,MAAM,KAAK;GAC3D,QAAQ,MAAM,SAAS,QAAQ,MAAM,IAAI;CAC9C,CAAC,CACL;CAEA,MAAM,YAAY,eAAe,oBAAoB,MAAM,KAAK,CAAC;CAEjE,SAAS,SAAS,GAAU;EACxB,WAAY,EAAE,OAA4B,OAAO;CACrD;CAEA,OAAO;EACH;EACA;EACA;EACA;CACJ;AACJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ECDA,MAAM,QAAQ;EAMd,MAAM,OAAO;EAIb,MAAM,EAAE,SAAS,WAAW,WAAW,aAAa,UAAU,QAAQ,UAAU;GAC5E,KAAK,qBAAqB,KAAK;EACnC,CAAC;;;SA7BY,WAAM,MAAE,MAAA,QAAA,CAAQ,CAAA,CAAA,CAAA;;;;;;gBApBb,MAAA,SAAA,CAAS;gBACT,MAAA,SAAA,CAAS;eAChB,iBAAe,qBAAoB,KAAA,CAAS;eAC5C,cAAY,cAAU,YAAA,WAAA;eAGlB,MAAI,SAAO,EAAA;eACX,QAAM,QAAA,IAAI;eAIV,WAAS,WAAU;eACnB,YAAU,qBAAoB,KAAA,CAAS;eACvC,YAAU,qBAAoB,KAAA,CAAS;eACvC,gBAAc,WAAU;eACxB,cAAY,QAAA,aAAa,KAAA,CAAS;eAClC,mBAAiB,SAAO,cAAA;eACxB,oBAAkB,SAAO,eAAA;eACzB,gBAAc,SAAO,WAAY,KAAA,CAAS;eAC1C,iBAAe,qBAAoB,KAAA,CAAS;;;iBAMrC,OAAM,eAAA"}
|
package/dist/textarea.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"textarea.js","names":[],"sources":["../src/components/textarea/useTextarea.ts","../src/components/textarea/textarea.vue","../src/components/textarea/textarea.vue"],"sourcesContent":["import { computed, nextTick, onMounted, ref, watch } from 'vue';\nimport { useControlState } from '@/composables/useControlState';\nimport { bem } from '@/utils/bem';\nimport type { TextareaProps } from './types';\n\nconst MIN_ROWS = 1;\nconst NATIVE_TEXTAREA_SELECTOR = '.rp-textarea__native';\nconst INTERACTIVE_SELECTOR = [\n 'button',\n 'a[href]',\n 'input',\n 'select',\n `textarea:not(${NATIVE_TEXTAREA_SELECTOR})`,\n '[contenteditable=\"true\"]',\n '[tabindex]:not([tabindex=\"-1\"])',\n].join(',');\n\ninterface AutosizeRows {\n minRows: number;\n maxRows: number | undefined;\n}\n\ninterface TextareaMetrics {\n lineHeight: number;\n paddingHeight: number;\n borderHeight: number;\n}\n\nfunction isInteractiveElement(target: Element) {\n return Boolean(target.closest(INTERACTIVE_SELECTOR));\n}\n\nfunction normalizeRows(value: number | undefined, fallback?: number) {\n if (value === undefined || !Number.isFinite(value)) return fallback;\n return Math.max(MIN_ROWS, Math.floor(value));\n}\n\nfunction getPixelValue(value: string) {\n const parsed = Number.parseFloat(value);\n return Number.isFinite(parsed) ? parsed : 0;\n}\n\nfunction getLineHeight(styles: CSSStyleDeclaration) {\n const lineHeight = getPixelValue(styles.lineHeight);\n if (lineHeight > 0) return lineHeight;\n\n const fontSize = getPixelValue(styles.fontSize);\n return fontSize > 0 ? fontSize * 1.2 : 0;\n}\n\nfunction getTextareaMetrics(textarea: HTMLTextAreaElement): TextareaMetrics {\n const styles = getComputedStyle(textarea);\n\n return {\n lineHeight: getLineHeight(styles),\n paddingHeight: getPixelValue(styles.paddingTop) + getPixelValue(styles.paddingBottom),\n borderHeight:\n getPixelValue(styles.borderTopWidth) + getPixelValue(styles.borderBottomWidth),\n };\n}\n\nfunction getRowsHeight(metrics: TextareaMetrics, rows: number) {\n return rows * metrics.lineHeight + metrics.paddingHeight + metrics.borderHeight;\n}\n\nfunction getAutosizeMeasurement(textarea: HTMLTextAreaElement, rows: AutosizeRows) {\n const metrics = getTextareaMetrics(textarea);\n const maxHeight = rows.maxRows === undefined ? undefined : getRowsHeight(metrics, rows.maxRows);\n\n return {\n contentHeight: textarea.scrollHeight + metrics.borderHeight,\n minHeight: getRowsHeight(metrics, rows.minRows),\n maxHeight,\n };\n}\n\nfunction resetTextareaHeight(textarea: HTMLTextAreaElement) {\n textarea.style.height = '';\n textarea.style.overflowY = '';\n}\n\nexport function useTextarea(props: Readonly<TextareaProps>, emitUpdate: (value: string) => void) {\n const textareaRef = ref<HTMLTextAreaElement | null>(null);\n const control = useControlState(props);\n\n const autosizeRows = computed<AutosizeRows>(() => {\n const minRows =\n normalizeRows(props.minRows, normalizeRows(props.rows, MIN_ROWS)) ?? MIN_ROWS;\n const maxRows = normalizeRows(props.maxRows);\n\n return {\n minRows,\n maxRows: maxRows === undefined ? undefined : Math.max(minRows, maxRows),\n };\n });\n\n const nativeRows = computed(() => (props.autosize ? autosizeRows.value.minRows : props.rows));\n\n const rootClass = computed(() =>\n bem('rp-textarea', {\n [`size-${props.size}`]: Boolean(props.size),\n [`radius-${props.radius}`]: Boolean(props.radius),\n [`resize-${props.resize}`]: props.resize !== undefined && props.resize !== 'none',\n autosize: props.autosize,\n disabled: control.disabled,\n invalid: control.invalid,\n valid: control.valid && !control.invalid,\n readonly: props.readonly,\n }),\n );\n\n const autosizeWatchSource = computed(() => [\n props.modelValue,\n props.autosize,\n props.minRows,\n props.maxRows,\n props.rows,\n props.size,\n ]);\n\n function syncTextareaHeight() {\n const textarea = textareaRef.value;\n if (!textarea) return;\n\n if (!props.autosize) {\n resetTextareaHeight(textarea);\n return;\n }\n\n textarea.style.height = 'auto';\n\n const { contentHeight, minHeight, maxHeight } = getAutosizeMeasurement(\n textarea,\n autosizeRows.value,\n );\n const heightLimit = maxHeight ?? Number.POSITIVE_INFINITY;\n const nextHeight = Math.min(Math.max(contentHeight, minHeight), heightLimit);\n\n textarea.style.height = `${nextHeight}px`;\n textarea.style.overflowY =\n maxHeight !== undefined && contentHeight > maxHeight ? 'auto' : 'hidden';\n }\n\n function scheduleTextareaHeightSync() {\n void nextTick(syncTextareaHeight);\n }\n\n function onInput(e: Event) {\n emitUpdate((e.target as HTMLTextAreaElement).value);\n syncTextareaHeight();\n }\n\n function focusTextarea(e: MouseEvent) {\n if (control.disabled) return;\n\n const target = e.target;\n if (target instanceof Element && isInteractiveElement(target)) return;\n\n textareaRef.value?.focus();\n }\n\n onMounted(scheduleTextareaHeightSync);\n\n watch(autosizeWatchSource, scheduleTextareaHeightSync);\n\n return {\n textareaRef,\n control,\n rootClass,\n nativeRows,\n onInput,\n focusTextarea,\n };\n}\n","<template>\n <div :class=\"rootClass\" @mousedown=\"focusTextarea\">\n <textarea\n :id=\"control.id\"\n ref=\"textareaRef\"\n :name=\"name\"\n class=\"rp-textarea__native\"\n :value=\"modelValue\"\n :placeholder=\"placeholder\"\n :rows=\"nativeRows\"\n :disabled=\"control.disabled || undefined\"\n :readonly=\"readonly || undefined\"\n :required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @input=\"onInput\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useTextarea } from './useTextarea';\nimport type { TextareaProps } from './types';\n\ndefineOptions({ name: 'RpTextarea' });\n\nconst props = withDefaults(defineProps<TextareaProps>(), {\n placeholder: '',\n rows: 3,\n resize: 'none',\n autosize: false,\n minRows: undefined,\n maxRows: undefined,\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n valid: undefined,\n readonly: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst { textareaRef, control, rootClass, nativeRows, onInput, focusTextarea } = useTextarea(\n props,\n (value) => {\n emit('update:modelValue', value);\n },\n);\n\nvoid textareaRef;\n</script>\n\n<style src=\"./textarea.scss\" lang=\"scss\" scoped></style>\n","<template>\n <div :class=\"rootClass\" @mousedown=\"focusTextarea\">\n <textarea\n :id=\"control.id\"\n ref=\"textareaRef\"\n :name=\"name\"\n class=\"rp-textarea__native\"\n :value=\"modelValue\"\n :placeholder=\"placeholder\"\n :rows=\"nativeRows\"\n :disabled=\"control.disabled || undefined\"\n :readonly=\"readonly || undefined\"\n :required=\"control.required || undefined\"\n :aria-label=\"ariaLabel || undefined\"\n :aria-labelledby=\"control.ariaLabelledby\"\n :aria-describedby=\"control.ariaDescribedby\"\n :aria-invalid=\"control.invalid || undefined\"\n :aria-required=\"control.required || undefined\"\n @input=\"onInput\"\n />\n </div>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useTextarea } from './useTextarea';\nimport type { TextareaProps } from './types';\n\ndefineOptions({ name: 'RpTextarea' });\n\nconst props = withDefaults(defineProps<TextareaProps>(), {\n placeholder: '',\n rows: 3,\n resize: 'none',\n autosize: false,\n minRows: undefined,\n maxRows: undefined,\n disabled: undefined,\n required: undefined,\n invalid: undefined,\n valid: undefined,\n readonly: false,\n});\n\nconst emit = defineEmits<{\n 'update:modelValue': [value: string];\n}>();\n\nconst { textareaRef, control, rootClass, nativeRows, onInput, focusTextarea } = useTextarea(\n props,\n (value) => {\n emit('update:modelValue', value);\n },\n);\n\nvoid textareaRef;\n</script>\n\n<style src=\"./textarea.scss\" lang=\"scss\" scoped></style>\n"],"mappings":"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"}
|
package/dist/tooltip.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"tooltip.js","names":[],"sources":["../src/composables/useDelayedOpen.ts","../src/components/tooltip/useTooltip.ts","../src/components/tooltip/tooltip.vue","../src/components/tooltip/tooltip.vue"],"sourcesContent":["import { computed, onBeforeUnmount, ref } from 'vue';\n\nexport interface UseDelayedOpenOptions {\n open?: boolean | (() => boolean | undefined);\n openDelay?: number | (() => number | undefined);\n disabled?: boolean | (() => boolean | undefined);\n onOpenChange?: (open: boolean) => void;\n}\n\nfunction readOption<T>(value: T | (() => T | undefined) | undefined, fallback: T): T {\n return typeof value === 'function'\n ? ((value as () => T | undefined)() ?? fallback)\n : (value ?? fallback);\n}\n\nfunction readOptional<T>(value: T | (() => T | undefined) | undefined): T | undefined {\n return typeof value === 'function' ? (value as () => T | undefined)() : value;\n}\n\nexport function useDelayedOpen(options: UseDelayedOpenOptions = {}) {\n const uncontrolledOpen = ref(false);\n let openTimer: ReturnType<typeof setTimeout> | null = null;\n\n const isOpen = computed(() => readOptional(options.open) ?? uncontrolledOpen.value);\n\n function clearTimers() {\n if (openTimer) {\n clearTimeout(openTimer);\n openTimer = null;\n }\n }\n\n function isDisabled() {\n return readOption(options.disabled, false);\n }\n\n function setOpen(nextOpen: boolean) {\n const previousOpen = isOpen.value;\n if (readOptional(options.open) === undefined) uncontrolledOpen.value = nextOpen;\n if (previousOpen !== nextOpen) options.onOpenChange?.(nextOpen);\n }\n\n function open() {\n if (isDisabled()) return;\n const delay = readOption(options.openDelay, 0);\n if (delay <= 0) {\n setOpen(true);\n return;\n }\n if (openTimer) clearTimeout(openTimer);\n openTimer = setTimeout(() => {\n setOpen(true);\n openTimer = null;\n }, delay);\n }\n\n function closeImmediate() {\n clearTimers();\n setOpen(false);\n }\n\n onBeforeUnmount(clearTimers);\n\n return {\n isOpen,\n open,\n closeImmediate,\n };\n}\n","import {\n computed,\n isRef,\n onBeforeUnmount,\n onMounted,\n ref,\n useId,\n useSlots,\n watch,\n type CSSProperties,\n} from 'vue';\nimport { useDelayedOpen } from '@/composables/useDelayedOpen';\nimport { getComponentCustomColor, isComponentPresetColor } from '@/utils/componentColors';\nimport { bem } from '@/utils/bem';\nimport type { TooltipOffset, TooltipPlacement, TooltipProps, TooltipTriggerProps } from './types';\n\ninterface TooltipPosition {\n x: number;\n y: number;\n}\n\nfunction isHTMLElement(value: unknown): value is HTMLElement {\n return typeof HTMLElement !== 'undefined' && value instanceof HTMLElement;\n}\n\nfunction getTargetPosition(rect: DOMRect, placement: TooltipPlacement): TooltipPosition {\n switch (placement) {\n case 'right':\n return { x: rect.right, y: rect.top + rect.height / 2 };\n case 'bottom':\n return { x: rect.left + rect.width / 2, y: rect.bottom };\n case 'left':\n return { x: rect.left, y: rect.top + rect.height / 2 };\n case 'top':\n default:\n return { x: rect.left + rect.width / 2, y: rect.top };\n }\n}\n\nfunction resolveOffsetStyle(offset: TooltipOffset | undefined): CSSProperties | undefined {\n if (offset == null) return undefined;\n\n if (typeof offset === 'number') {\n return {\n '--_rp-tooltip-main-axis-offset': `${offset}px`,\n };\n }\n\n const style: CSSProperties = {};\n\n if (offset.mainAxis != null) {\n style['--_rp-tooltip-main-axis-offset'] = `${offset.mainAxis}px`;\n }\n\n if (offset.crossAxis != null) {\n style['--_rp-tooltip-cross-axis-offset'] = `${offset.crossAxis}px`;\n }\n\n return Object.keys(style).length > 0 ? style : undefined;\n}\n\nfunction resolveTooltipColorStyle(color: TooltipProps['color']): CSSProperties | undefined {\n const customColor = getComponentCustomColor(color);\n if (!customColor) return undefined;\n\n return {\n '--_rp-tooltip-bg': customColor,\n '--_rp-tooltip-fg': 'var(--rp-color-on-primary)',\n };\n}\n\nexport function useTooltip(\n props: Readonly<TooltipProps>,\n emitOpenChange?: (open: boolean) => void,\n) {\n const slots = useSlots();\n const generatedId = useId();\n const targetElement = ref<HTMLElement | null>(null);\n const targetPosition = ref<TooltipPosition | null>(null);\n\n let isMounted = false;\n let removeTargetListeners: (() => void) | undefined;\n let removePositionListeners: (() => void) | undefined;\n let describedTarget: HTMLElement | null = null;\n let previousTargetDescribedby: string | null = null;\n\n const tooltipId = computed(() => props.id ?? `${generatedId}-tooltip`);\n const placement = computed(() => props.placement ?? 'top');\n const isTargetMode = computed(() => props.target != null && props.target !== '');\n const hasContent = computed(() => Boolean(props.content || slots.content));\n const isDecorative = computed(() => Boolean(props.decorative));\n const isDisabled = computed(() => Boolean(props.disabled || !hasContent.value));\n const shouldRenderContent = computed(() => !isDisabled.value);\n const shouldDescribeContent = computed(() => shouldRenderContent.value && !isDecorative.value);\n\n const { isOpen, open, closeImmediate } = useDelayedOpen({\n open: () => props.open,\n openDelay: () => props.openDelay ?? 300,\n disabled: () => isDisabled.value,\n onOpenChange: emitOpenChange,\n });\n\n const isVisible = computed(() => isOpen.value && !isDisabled.value);\n\n const rootClass = computed(() =>\n bem('rp-tooltip', {\n [`placement-${placement.value}`]: true,\n [`color-${props.color}`]: isComponentPresetColor(props.color),\n arrow: props.arrow,\n target: isTargetMode.value,\n open: isVisible.value,\n disabled: props.disabled,\n }),\n );\n\n const triggerProps = computed<TooltipTriggerProps>(() => ({\n 'aria-describedby': shouldDescribeContent.value ? tooltipId.value : undefined,\n }));\n\n const contentRole = computed(() => (isDecorative.value ? undefined : 'tooltip'));\n const contentAriaHidden = computed(() => (isDecorative.value ? 'true' : undefined));\n\n const contentStyle = computed<CSSProperties | undefined>(() => {\n const style: CSSProperties = {\n ...resolveOffsetStyle(props.offset),\n ...resolveTooltipColorStyle(props.color),\n };\n\n if (!isTargetMode.value || !targetPosition.value) {\n return Object.keys(style).length > 0 ? style : undefined;\n }\n\n return {\n ...style,\n '--_rp-tooltip-target-x': `${targetPosition.value.x}px`,\n '--_rp-tooltip-target-y': `${targetPosition.value.y}px`,\n };\n });\n\n function openTooltip() {\n open();\n }\n\n function closeTooltip() {\n closeImmediate();\n }\n\n function onKeydown(event: KeyboardEvent) {\n if (event.key === 'Escape') closeTooltip();\n }\n\n function readTarget() {\n return isRef(props.target) ? props.target.value : props.target;\n }\n\n function resolveTarget() {\n const target = readTarget();\n if (!target) return null;\n\n if (typeof target === 'string') {\n if (typeof document === 'undefined') return null;\n\n try {\n const element = document.querySelector(target);\n return isHTMLElement(element) ? element : null;\n } catch {\n return null;\n }\n }\n\n return isHTMLElement(target) ? target : null;\n }\n\n function restoreTargetDescription() {\n if (!describedTarget) return;\n\n if (previousTargetDescribedby) {\n describedTarget.setAttribute('aria-describedby', previousTargetDescribedby);\n } else {\n describedTarget.removeAttribute('aria-describedby');\n }\n\n describedTarget = null;\n previousTargetDescribedby = null;\n }\n\n function syncTargetDescription() {\n restoreTargetDescription();\n\n if (!isTargetMode.value || !shouldDescribeContent.value || !targetElement.value) return;\n\n describedTarget = targetElement.value;\n previousTargetDescribedby = describedTarget.getAttribute('aria-describedby');\n\n const ids = (previousTargetDescribedby ?? '').split(/\\s+/).filter(Boolean);\n if (!ids.includes(tooltipId.value)) ids.push(tooltipId.value);\n describedTarget.setAttribute('aria-describedby', ids.join(' '));\n }\n\n function updateTargetPosition() {\n if (!isTargetMode.value || !targetElement.value) {\n targetPosition.value = null;\n return;\n }\n\n targetPosition.value = getTargetPosition(\n targetElement.value.getBoundingClientRect(),\n placement.value,\n );\n }\n\n function onTargetOpen() {\n updateTargetPosition();\n openTooltip();\n }\n\n function bindTargetListeners(element: HTMLElement) {\n removeTargetListeners?.();\n\n element.addEventListener('mouseenter', onTargetOpen);\n element.addEventListener('mouseleave', closeTooltip);\n element.addEventListener('focusin', onTargetOpen);\n element.addEventListener('focusout', closeTooltip);\n element.addEventListener('keydown', onKeydown);\n\n removeTargetListeners = () => {\n element.removeEventListener('mouseenter', onTargetOpen);\n element.removeEventListener('mouseleave', closeTooltip);\n element.removeEventListener('focusin', onTargetOpen);\n element.removeEventListener('focusout', closeTooltip);\n element.removeEventListener('keydown', onKeydown);\n removeTargetListeners = undefined;\n };\n }\n\n function removeViewportListeners() {\n removePositionListeners?.();\n removePositionListeners = undefined;\n }\n\n function bindViewportListeners() {\n if (typeof window === 'undefined' || removePositionListeners) return;\n\n window.addEventListener('resize', updateTargetPosition);\n window.addEventListener('scroll', updateTargetPosition, true);\n\n removePositionListeners = () => {\n window.removeEventListener('resize', updateTargetPosition);\n window.removeEventListener('scroll', updateTargetPosition, true);\n };\n }\n\n function syncTarget() {\n if (!isTargetMode.value) {\n removeTargetListeners?.();\n removeViewportListeners();\n restoreTargetDescription();\n targetElement.value = null;\n targetPosition.value = null;\n return;\n }\n\n const nextTarget = resolveTarget();\n if (targetElement.value === nextTarget) {\n syncTargetDescription();\n updateTargetPosition();\n return;\n }\n\n removeTargetListeners?.();\n removeViewportListeners();\n restoreTargetDescription();\n targetElement.value = nextTarget;\n\n if (!nextTarget) {\n targetPosition.value = null;\n return;\n }\n\n bindTargetListeners(nextTarget);\n syncTargetDescription();\n updateTargetPosition();\n }\n\n watch(isDisabled, (disabled) => {\n if (disabled) closeTooltip();\n });\n\n watch(\n () => readTarget(),\n () => {\n if (isMounted) syncTarget();\n },\n { flush: 'post' },\n );\n\n watch([isTargetMode, shouldDescribeContent, tooltipId], () => {\n if (isMounted) syncTargetDescription();\n });\n\n watch([placement, isVisible], () => {\n if (isMounted && isVisible.value) updateTargetPosition();\n });\n\n watch(isVisible, (visible) => {\n if (!isMounted || !isTargetMode.value) return;\n\n if (visible) {\n updateTargetPosition();\n bindViewportListeners();\n } else {\n removeViewportListeners();\n }\n });\n\n onMounted(() => {\n isMounted = true;\n syncTarget();\n });\n\n onBeforeUnmount(() => {\n isMounted = false;\n removeTargetListeners?.();\n removeViewportListeners();\n restoreTargetDescription();\n });\n\n return {\n tooltipId,\n isOpen,\n isVisible,\n isTargetMode,\n shouldRenderContent,\n rootClass,\n triggerProps,\n contentRole,\n contentAriaHidden,\n contentStyle,\n openTooltip,\n closeTooltip,\n onKeydown,\n };\n}\n","<template>\n <span\n :class=\"rootClass\"\n @mouseenter=\"openTooltip\"\n @mouseleave=\"closeTooltip\"\n @focusin=\"openTooltip\"\n @focusout=\"closeTooltip\"\n @keydown=\"onKeydown\"\n >\n <slot v-if=\"!isTargetMode\" :trigger-props=\"triggerProps\" />\n\n <Transition name=\"rp-tooltip-content\">\n <span\n v-if=\"shouldRenderContent\"\n v-show=\"isVisible\"\n :id=\"tooltipId\"\n class=\"rp-tooltip__content\"\n :role=\"contentRole\"\n :aria-hidden=\"contentAriaHidden\"\n :style=\"contentStyle\"\n >\n <slot name=\"content\">{{ content }}</slot>\n </span>\n </Transition>\n </span>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useTooltip } from './useTooltip';\nimport type { TooltipProps } from './types';\n\ndefineOptions({ name: 'RpTooltip' });\n\nconst props = withDefaults(defineProps<TooltipProps>(), {\n content: '',\n placement: 'top',\n open: undefined,\n openDelay: 300,\n arrow: false,\n disabled: false,\n decorative: false,\n});\n\nconst emit = defineEmits<{\n 'update:open': [value: boolean];\n}>();\n\nconst {\n tooltipId,\n isVisible,\n isTargetMode,\n shouldRenderContent,\n rootClass,\n triggerProps,\n contentRole,\n contentAriaHidden,\n contentStyle,\n openTooltip,\n closeTooltip,\n onKeydown,\n} = useTooltip(props, (open) => {\n emit('update:open', open);\n});\n</script>\n\n<style src=\"./tooltip.scss\" lang=\"scss\" scoped></style>\n","<template>\n <span\n :class=\"rootClass\"\n @mouseenter=\"openTooltip\"\n @mouseleave=\"closeTooltip\"\n @focusin=\"openTooltip\"\n @focusout=\"closeTooltip\"\n @keydown=\"onKeydown\"\n >\n <slot v-if=\"!isTargetMode\" :trigger-props=\"triggerProps\" />\n\n <Transition name=\"rp-tooltip-content\">\n <span\n v-if=\"shouldRenderContent\"\n v-show=\"isVisible\"\n :id=\"tooltipId\"\n class=\"rp-tooltip__content\"\n :role=\"contentRole\"\n :aria-hidden=\"contentAriaHidden\"\n :style=\"contentStyle\"\n >\n <slot name=\"content\">{{ content }}</slot>\n </span>\n </Transition>\n </span>\n</template>\n\n<script lang=\"ts\" setup vapor>\nimport { useTooltip } from './useTooltip';\nimport type { TooltipProps } from './types';\n\ndefineOptions({ name: 'RpTooltip' });\n\nconst props = withDefaults(defineProps<TooltipProps>(), {\n content: '',\n placement: 'top',\n open: undefined,\n openDelay: 300,\n arrow: false,\n disabled: false,\n decorative: false,\n});\n\nconst emit = defineEmits<{\n 'update:open': [value: boolean];\n}>();\n\nconst {\n tooltipId,\n isVisible,\n isTargetMode,\n shouldRenderContent,\n rootClass,\n triggerProps,\n contentRole,\n contentAriaHidden,\n contentStyle,\n openTooltip,\n closeTooltip,\n onKeydown,\n} = useTooltip(props, (open) => {\n emit('update:open', open);\n});\n</script>\n\n<style src=\"./tooltip.scss\" lang=\"scss\" scoped></style>\n"],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useButtonColor.js","names":[],"sources":["../src/components/button/useButtonColor.ts"],"sourcesContent":["import type { CSSProperties } from 'vue';\nimport { getComponentCustomColor } from '@/utils/componentColors';\nimport type { ButtonColor } from './types';\n\nexport function getButtonColorStyle(color: ButtonColor | undefined) {\n const customColor = getComponentCustomColor(color);\n if (!customColor) return undefined;\n\n return {\n '--_rp-button-custom-color': customColor,\n '--_rp-button-custom-hover': `color-mix(in srgb, ${customColor} 90%, #111111)`,\n '--_rp-button-custom-active': `color-mix(in srgb, ${customColor} 80%, #111111)`,\n '--_rp-button-custom-on': 'var(--rp-color-on-primary)',\n '--_rp-button-custom-subtle-bg': `color-mix(in srgb, ${customColor} 12%, transparent)`,\n '--_rp-button-custom-subtle-bg-hover': `color-mix(in srgb, ${customColor} 18%, transparent)`,\n '--_rp-button-custom-subtle-bg-active': `color-mix(in srgb, ${customColor} 24%, transparent)`,\n '--_rp-button-custom-border': `color-mix(in srgb, ${customColor} 45%, transparent)`,\n '--_rp-button-custom-border-hover': `color-mix(in srgb, ${customColor} 62%, transparent)`,\n '--_rp-button-custom-fg': customColor,\n } satisfies CSSProperties;\n}\n"],"mappings":";;;;;;;;;;;;;AAIA,SAAgB,oBAAoB,OAAgC;CAChE,MAAM,cAAc,wBAAwB,KAAK;CACjD,IAAI,CAAC,aAAa,OAAO,KAAA;CAEzB,OAAO;EACH,6BAA6B;EAC7B,6BAA6B,sBAAsB,YAAY;EAC/D,8BAA8B,sBAAsB,YAAY;EAChE,0BAA0B;EAC1B,iCAAiC,sBAAsB,YAAY;EACnE,uCAAuC,sBAAsB,YAAY;EACzE,wCAAwC,sBAAsB,YAAY;EAC1E,8BAA8B,sBAAsB,YAAY;EAChE,oCAAoC,sBAAsB,YAAY;EACtE,0BAA0B;CAC9B;AACJ"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useControlState.js","names":[],"sources":["../src/composables/useControlState.ts"],"sourcesContent":["import { computed } from 'vue';\n\nexport interface ControlStateOptions {\n id?: string;\n disabled?: boolean;\n required?: boolean;\n invalid?: boolean;\n valid?: boolean;\n describedby?: string;\n labelledby?: string;\n}\n\nexport interface ControlState {\n id: string | undefined;\n disabled: boolean;\n required: boolean;\n invalid: boolean;\n valid: boolean;\n ariaDescribedby: string | undefined;\n ariaLabelledby: string | undefined;\n}\n\nfunction mergeIds(...values: Array<string | undefined>): string | undefined {\n const ids = values.flatMap((value) => value?.split(/\\s+/) ?? []).filter(Boolean);\n return ids.length > 0 ? Array.from(new Set(ids)).join(' ') : undefined;\n}\n\nexport function useControlState(options: ControlStateOptions = {}): ControlState {\n const id = computed(() => options.id);\n const disabled = computed(() => options.disabled ?? false);\n const required = computed(() => options.required ?? false);\n const invalid = computed(() => options.invalid ?? false);\n const valid = computed(() => options.valid ?? false);\n\n const ariaDescribedby = computed(() => mergeIds(options.describedby));\n const ariaLabelledby = computed(() => mergeIds(options.labelledby));\n\n return {\n get id() {\n return id.value;\n },\n get disabled() {\n return disabled.value;\n },\n get required() {\n return required.value;\n },\n get invalid() {\n return invalid.value;\n },\n get valid() {\n return valid.value;\n },\n get ariaDescribedby() {\n return ariaDescribedby.value;\n },\n get ariaLabelledby() {\n return ariaLabelledby.value;\n },\n };\n}\n"],"mappings":";;AAsBA,SAAS,SAAS,GAAG,QAAuD;CACxE,MAAM,MAAM,OAAO,SAAS,UAAU,OAAO,MAAM,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,OAAO;CAC/E,OAAO,IAAI,SAAS,IAAI,MAAM,KAAK,IAAI,IAAI,GAAG,CAAC,CAAC,CAAC,KAAK,GAAG,IAAI,KAAA;AACjE;AAEA,SAAgB,gBAAgB,UAA+B,CAAC,GAAiB;CAC7E,MAAM,KAAK,eAAe,QAAQ,EAAE;CACpC,MAAM,WAAW,eAAe,QAAQ,YAAY,KAAK;CACzD,MAAM,WAAW,eAAe,QAAQ,YAAY,KAAK;CACzD,MAAM,UAAU,eAAe,QAAQ,WAAW,KAAK;CACvD,MAAM,QAAQ,eAAe,QAAQ,SAAS,KAAK;CAEnD,MAAM,kBAAkB,eAAe,SAAS,QAAQ,WAAW,CAAC;CACpE,MAAM,iBAAiB,eAAe,SAAS,QAAQ,UAAU,CAAC;CAElE,OAAO;EACH,IAAI,KAAK;GACL,OAAO,GAAG;EACd;EACA,IAAI,WAAW;GACX,OAAO,SAAS;EACpB;EACA,IAAI,WAAW;GACX,OAAO,SAAS;EACpB;EACA,IAAI,UAAU;GACV,OAAO,QAAQ;EACnB;EACA,IAAI,QAAQ;GACR,OAAO,MAAM;EACjB;EACA,IAAI,kBAAkB;GAClB,OAAO,gBAAgB;EAC3B;EACA,IAAI,iBAAiB;GACjB,OAAO,eAAe;EAC1B;CACJ;AACJ"}
|