pxd 0.0.2 → 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (111) hide show
  1. package/README.md +78 -8
  2. package/dist/components/_icons/CheckIcon.js +1 -0
  3. package/dist/components/_icons/ChevronDownIcon.js +1 -0
  4. package/dist/components/_icons/ExclamationTriangleIcon.js +1 -0
  5. package/dist/components/_icons/ExternalLinkIcon.js +1 -0
  6. package/dist/components/_utils/css.d.ts +9 -0
  7. package/dist/components/_utils/css.js +1 -0
  8. package/dist/components/avatar/_.js +1 -0
  9. package/dist/components/avatar/index.d.ts +6 -0
  10. package/dist/components/avatar/index.js +1 -0
  11. package/dist/components/avatar/src/avatar.d.ts +22 -0
  12. package/dist/components/avatar-group/index.d.ts +7 -0
  13. package/dist/components/avatar-group/index.js +1 -0
  14. package/dist/components/avatar-group/src/avatar-group.d.ts +3 -0
  15. package/dist/components/badge/index.d.ts +1 -0
  16. package/dist/components/badge/index.js +1 -0
  17. package/dist/components/badge/src/badge.d.ts +42 -0
  18. package/dist/components/book/index.d.ts +1 -0
  19. package/dist/components/book/index.js +1 -0
  20. package/dist/components/book/src/book.d.ts +8 -0
  21. package/dist/components/button/index.d.ts +23 -0
  22. package/dist/components/button/index.js +1 -1
  23. package/dist/components/button/src/button.d.ts +29 -0
  24. package/dist/components/checkbox/index.d.ts +1 -0
  25. package/dist/components/checkbox/index.js +1 -1
  26. package/dist/components/checkbox/src/checkbox.d.ts +27 -0
  27. package/dist/components/checkbox-group/index.d.ts +4 -0
  28. package/dist/components/checkbox-group/index.js +1 -0
  29. package/dist/components/checkbox-group/src/checkbox-group.d.ts +17 -0
  30. package/dist/components/choicebox/index.d.ts +1 -0
  31. package/dist/components/choicebox/index.js +1 -0
  32. package/dist/components/choicebox/src/choicebox.d.ts +21 -0
  33. package/dist/components/choicebox-group/index.d.ts +13 -0
  34. package/dist/components/choicebox-group/index.js +1 -0
  35. package/dist/components/choicebox-group/src/choicebox-group.d.ts +25 -0
  36. package/dist/components/collapse/index.d.ts +1 -0
  37. package/dist/components/collapse/index.js +1 -0
  38. package/dist/components/collapse/src/collapse.d.ts +9 -0
  39. package/dist/components/combobox/index.d.ts +1 -0
  40. package/dist/components/combobox/index.js +1 -0
  41. package/dist/components/combobox/src/combobox.d.ts +19 -0
  42. package/dist/components/dialog/index.d.ts +1 -0
  43. package/dist/components/dialog/index.js +1 -1
  44. package/dist/components/dialog/src/dialog.d.ts +32 -0
  45. package/dist/components/error/index.d.ts +1 -0
  46. package/dist/components/error/index.js +1 -0
  47. package/dist/components/error/src/error.d.ts +22 -0
  48. package/dist/components/input/index.d.ts +4 -0
  49. package/dist/components/input/index.js +1 -1
  50. package/dist/components/input/src/input.d.ts +25 -0
  51. package/dist/components/keyboard-input/index.d.ts +1 -0
  52. package/dist/components/keyboard-input/index.js +1 -0
  53. package/dist/components/keyboard-input/src/keyboard-input.d.ts +24 -0
  54. package/dist/components/link/index.d.ts +1 -0
  55. package/dist/components/link/index.js +1 -0
  56. package/dist/components/link/src/link.d.ts +22 -0
  57. package/dist/components/loading-dots/index.d.ts +1 -0
  58. package/dist/components/loading-dots/index.js +1 -0
  59. package/dist/components/loading-dots/src/loading-dots.d.ts +19 -0
  60. package/dist/components/overlay/index.d.ts +1 -0
  61. package/dist/components/overlay/index.js +1 -0
  62. package/dist/components/overlay/src/overlay.d.ts +5 -0
  63. package/dist/components/progress/index.d.ts +1 -0
  64. package/dist/components/progress/index.js +1 -1
  65. package/dist/components/progress/src/progress.d.ts +15 -0
  66. package/dist/components/radio/index.d.ts +6 -0
  67. package/dist/components/radio/index.js +1 -1
  68. package/dist/components/radio/src/radio.d.ts +17 -0
  69. package/dist/components/scrollbar/index.d.ts +1 -0
  70. package/dist/components/scrollbar/index.js +1 -1
  71. package/dist/components/scrollbar/src/scrollbar.d.ts +16 -0
  72. package/dist/components/select/index.d.ts +1 -0
  73. package/dist/components/select/index.js +1 -1
  74. package/dist/components/select/src/select.d.ts +15 -0
  75. package/dist/components/show-more/index.d.ts +1 -0
  76. package/dist/components/show-more/index.js +1 -0
  77. package/dist/components/show-more/src/show-more.d.ts +16 -0
  78. package/dist/components/spinner/_.js +1 -0
  79. package/dist/components/spinner/index.d.ts +1 -0
  80. package/dist/components/spinner/index.js +1 -0
  81. package/dist/components/spinner/src/spinner.d.ts +5 -0
  82. package/dist/components/status-dot/index.d.ts +1 -0
  83. package/dist/components/status-dot/index.js +1 -0
  84. package/dist/components/status-dot/src/status-dot.d.ts +6 -0
  85. package/dist/components/switch/index.d.ts +1 -0
  86. package/dist/components/switch/index.js +1 -1
  87. package/dist/components/switch/src/switch.d.ts +38 -0
  88. package/dist/components/tabs/index.d.ts +8 -0
  89. package/dist/components/tabs/index.js +1 -1
  90. package/dist/components/tabs/src/tabs.d.ts +48 -0
  91. package/dist/components/tabs-item/index.d.ts +1 -0
  92. package/dist/components/tabs-item/index.js +1 -1
  93. package/dist/components/tabs-item/src/tabs-item.d.ts +34 -0
  94. package/dist/components/textarea/index.d.ts +1 -0
  95. package/dist/components/textarea/index.js +1 -1
  96. package/dist/components/textarea/src/textarea.d.ts +16 -0
  97. package/dist/components/toggle/index.d.ts +1 -0
  98. package/dist/components/toggle/index.js +1 -0
  99. package/dist/components/toggle/src/toggle.d.ts +35 -0
  100. package/dist/plugins/resolver.d.ts +3 -0
  101. package/dist/plugins/resolver.js +1 -1
  102. package/dist/plugins/tailwind-preset.d.ts +193 -0
  103. package/dist/plugins/tailwind-preset.js +1 -0
  104. package/dist/vars.css +1 -0
  105. package/package.json +58 -56
  106. package/dist/components/space/index.js +0 -1
  107. package/dist/composables/use-sizes.js +0 -1
  108. package/dist/preview.png +0 -0
  109. package/dist/styles.css +0 -1
  110. package/dist/styles.js +0 -1
  111. package/public/preview.png +0 -0
package/README.md CHANGED
@@ -1,14 +1,84 @@
1
1
  # PXD
2
- A library of Vue3 components based on radix-vue and unocss. Everything is just right.
2
+ Vue component library based on radix-vue and geist design system. Everything is just right.
3
3
 
4
- ![](./public/preview.png)
4
+ > [!IMPORTANT]
5
+ > The library is still under development and may undergo major changes at any time.
6
+
7
+ > [!IMPORTANT]
8
+ > This is a COMMUNITY PROJECT, not associated with Vercel, originating from [Vercel design system](https://vercel.com/geist/introduction). Did not strictly follow its implementation, and added some personal ideas.
9
+
10
+ ## Install
11
+
12
+ ```bash
13
+ pnpm i pxd
14
+ ```
15
+
16
+ ## Usage
17
+
18
+ ### Styles
19
+ ```js
20
+ // tailwind.config.js
21
+
22
+ export default {
23
+ content: [
24
+ './src/**/*.{ts,tsx,vue}',
25
+ './node_modules/pxd/dist/components/**/*.js',
26
+ ]
27
+ }
28
+ ```
29
+
30
+ ### vars.css
31
+
32
+ ```js
33
+ // main.ts
34
+ import 'pxd/vars.css'
35
+ ```
36
+
37
+ ### Auto import
38
+
39
+ ```js
40
+ // vite.config.js
41
+ import PxResolver from 'pxd/resolver'
42
+ import VueComponents from 'unplugin-vue-components/vite'
43
+ import { defineConfig } from 'vite'
44
+
45
+ export default defineConfig({
46
+ plugins: [
47
+ VueComponents({
48
+ resolvers: [
49
+ PxResolver()
50
+ ]
51
+ })
52
+ ]
53
+ })
54
+ ```
55
+
56
+ ### Global import
57
+ We strongly recommend using automatic import because it can significantly reduce the package size.
58
+
59
+ ## Manual Import
60
+ ```js
61
+ // main.ts
62
+
63
+ // All components only need to import this style file.
64
+ import 'pxd/vars.css'
65
+ ```
66
+
67
+ ```vue
68
+ <script setup>
69
+ import Button from 'pxd/components/button/index.js'
70
+ </script>
71
+
72
+ <template>
73
+ <Button>
74
+ Button
75
+ </Button>
76
+ </template>
77
+ ```
5
78
 
6
79
  ## Acknowledgement
7
80
  rankings are in no particular order, they are all very important to this project.
8
81
 
9
- - animate: https://animated-unocss.elonehoo.me/
10
- - unocss: https://unocss.dev/
11
- - radix-vue: https://www.radix-vue.com/
12
- - vite: https://vitejs.dev/
13
- - shadcn-ui: https://github.com/shadcn-ui/ui
14
- - iconify: https://iconify.design/
82
+ - Vite: https://vitejs.dev/
83
+ - Iconify: https://iconify.design/
84
+ - Geist Design System: https://vercel.com/geist/introduction
@@ -0,0 +1 @@
1
+ import{openBlock as e,createElementBlock as r,createElementVNode as l}from"vue";function c(o,t){return e(),r("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[l("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z",fill:"currentColor"})])}export{c as r};
@@ -0,0 +1 @@
1
+ import{openBlock as e,createElementBlock as r,createElementVNode as l}from"vue";function c(o,t){return e(),r("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[l("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",fill:"currentColor"})])}export{c as r};
@@ -0,0 +1 @@
1
+ import{openBlock as r,createElementBlock as t,createElementVNode as s,defineComponent as c,normalizeClass as f,createVNode as p,unref as n,Fragment as a,toDisplayString as o,createBlock as u,withCtx as C,createTextVNode as i,createCommentVNode as d,renderSlot as h}from"vue";import{_}from"./ExternalLinkIcon.js";function g(m,l){return r(),t("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[s("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M8.4449 0.608765C8.0183 -0.107015 6.9817 -0.107015 6.55509 0.608766L0.161178 11.3368C-0.275824 12.07 0.252503 13 1.10608 13H13.8939C14.7475 13 15.2758 12.07 14.8388 11.3368L8.4449 0.608765ZM7.4141 1.12073C7.45288 1.05566 7.54712 1.05566 7.5859 1.12073L13.9798 11.8488C14.0196 11.9154 13.9715 12 13.8939 12H1.10608C1.02849 12 0.980454 11.9154 1.02018 11.8488L7.4141 1.12073ZM6.8269 4.48611C6.81221 4.10423 7.11783 3.78663 7.5 3.78663C7.88217 3.78663 8.18778 4.10423 8.1731 4.48612L8.01921 8.48701C8.00848 8.766 7.7792 8.98664 7.5 8.98664C7.2208 8.98664 6.99151 8.766 6.98078 8.48701L6.8269 4.48611ZM8.24989 10.476C8.24989 10.8902 7.9141 11.226 7.49989 11.226C7.08567 11.226 6.74989 10.8902 6.74989 10.476C6.74989 10.0618 7.08567 9.72599 7.49989 9.72599C7.9141 9.72599 8.24989 10.0618 8.24989 10.476Z",fill:"currentColor"})])}const k={"aria-hidden":"true",class:"inline-flex items-center mr-1 mt-[3px]"},x={class:"pxd-error--text"},v={class:"mr-1"},w={key:0,class:"font-medium mr-1"},b=c({name:"PError",__name:"error",props:{size:{default:"default"},label:{},error:{}},setup(m){const l={small:"text-xs",default:"text-sm",large:"text-lg"};return(e,y)=>(r(),t("div",{class:f(["pxd-error flex items-start text-red-900 text-sm",l[e.size]])},[s("div",k,[p(n(g))]),s("div",x,[typeof e.error=="object"?(r(),t(a,{key:0},[s("span",v,o(e.error.message),1),e.error.link?(r(),u(n(_),{key:0,href:e.error.link,underline:""},{default:C(()=>[i(o(e.error.action),1)]),_:1},8,["href"])):d("",!0)],64)):(r(),t(a,{key:1},[e.label?(r(),t("span",w,o(e.label)+":",1)):d("",!0),h(e.$slots,"default",{},()=>[i(o(e.error),1)])],64))])],2))}});export{b as _};
@@ -0,0 +1 @@
1
+ import{openBlock as n,createElementBlock as l,createElementVNode as i,defineComponent as a,resolveComponent as d,createBlock as r,normalizeClass as s,withCtx as C,renderSlot as u,unref as p,createCommentVNode as c}from"vue";function f(t,e){return n(),l("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[i("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M3 2C2.44772 2 2 2.44772 2 3V12C2 12.5523 2.44772 13 3 13H12C12.5523 13 13 12.5523 13 12V8.5C13 8.22386 12.7761 8 12.5 8C12.2239 8 12 8.22386 12 8.5V12H3V3L6.5 3C6.77614 3 7 2.77614 7 2.5C7 2.22386 6.77614 2 6.5 2H3ZM12.8536 2.14645C12.9015 2.19439 12.9377 2.24964 12.9621 2.30861C12.9861 2.36669 12.9996 2.4303 13 2.497L13 2.5V2.50049V5.5C13 5.77614 12.7761 6 12.5 6C12.2239 6 12 5.77614 12 5.5V3.70711L6.85355 8.85355C6.65829 9.04882 6.34171 9.04882 6.14645 8.85355C5.95118 8.65829 5.95118 8.34171 6.14645 8.14645L11.2929 3H9.5C9.22386 3 9 2.77614 9 2.5C9 2.22386 9.22386 2 9.5 2H12.4999H12.5C12.5678 2 12.6324 2.01349 12.6914 2.03794C12.7504 2.06234 12.8056 2.09851 12.8536 2.14645Z",fill:"currentColor"})])}const v=a({__name:"link",props:{href:{},external:{type:[Boolean,String]},underline:{type:Boolean},hoverUnderline:{type:Boolean,default:!0}},setup(t){return(e,m)=>{const o=d("RouterLink");return n(),r(o,{to:e.href,rel:"noopener",target:e.external?"_blank":void 0,class:s(["pxd-link inline-flex items-center font-medium",{"underline underline-offset-2":e.underline,"hover:underline":e.hoverUnderline}])},{default:C(()=>[u(e.$slots,"default"),e.external?(n(),r(p(f),{key:0,class:"text-lg"})):c("",!0)]),_:3},8,["to","target","class"])}}});export{v as _};
@@ -0,0 +1,9 @@
1
+ export declare function autoUnit(target: string | number): string;
2
+ /**
3
+ * Increase string a value with unit
4
+ *
5
+ * @example '2px' + 1 = '3px'
6
+ * @example '15em' + (-2) = '13em'
7
+ */
8
+ export declare function getFlowDirection(propValue: string): '' | 'flex-col';
9
+ export declare function getStandardSize(mergeSizes?: Record<string, string>): (v: string) => string;
@@ -0,0 +1 @@
1
+ function o(t){return typeof t=="number"||!isNaN(t)?`${t}px`:t}function u(t){return t==="row"?"":"flex-col"}function r(t){const f={small:"h-7 text-sm",default:"h-8 text-sm",large:"h-10 text-base"};return t&&Object.keys(t).forEach(n=>{n in f?f[n]+=` ${t[n]}`:f[n]=t[n]}),n=>f[n]||f.default}export{o as autoUnit,u as getFlowDirection,r as getStandardSize};
@@ -0,0 +1 @@
1
+ import{defineComponent as i,openBlock as r,createElementBlock as t,normalizeStyle as f,unref as a,renderSlot as l,createCommentVNode as s}from"vue";import{autoUnit as n}from"../_utils/css.js";const u=["src","width","height"],h={key:0,class:"absolute bottom-[-5px] left-[-3px] z-10 w-1/2 h-1/2 flex items-center rounded-full border border-white bg-white overflow-hidden"},c=i({name:"PAvatar",__name:"avatar",props:{src:{},size:{default:32},placeholder:{type:Boolean}},emits:["error"],setup(b){return(e,o)=>(r(),t("div",{class:"pxd-avatar relative rounded-full border border-white select-none before:absolute before:inset-0 before:w-full before:h-full before:rounded-full before:bg-[length:400%_100%] before:animate-flash-loading before:bg-gradient-to-l after:absolute after:inset-0 after:w-full after:h-full after:rounded-full after:border after:border-gray-alpha-400",style:f({width:a(n)(e.size),height:a(n)(e.size),"--tw-gradient-stops":"var(--accents-1), var(--accents-2), var(--accents-2), var(--accents-1)"})},[l(e.$slots,"default",{},()=>[e.placeholder?s("",!0):(r(),t("img",{key:0,src:e.src,class:"relative rounded-full text-0 overflow-hidden",width:e.size,height:e.size,alt:"avatar","aria-hidden":"true",onError:o[0]||(o[0]=d=>e.$emit("error",d))},null,40,u))]),e.$slots.badge?(r(),t("div",h,[l(e.$slots,"badge")])):s("",!0)],4))}});export{c as _};
@@ -0,0 +1,6 @@
1
+ export interface AvatarProps {
2
+ src?: string;
3
+ size: number | string;
4
+ placeholder?: boolean;
5
+ }
6
+ export { default } from './src/avatar';
@@ -0,0 +1 @@
1
+ import{_ as p}from"./_.js";import"vue";import"../_utils/css.js";export{p as default};
@@ -0,0 +1,22 @@
1
+ import { AvatarProps } from '../index.js';
2
+ declare function __VLS_template(): {
3
+ slots: {
4
+ default?(_: {}): any;
5
+ badge?(_: {}): any;
6
+ };
7
+ refs: {};
8
+ attrs: Partial<{}>;
9
+ };
10
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
11
+ declare const __VLS_component: import('vue').DefineComponent<AvatarProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
12
+ error: (args_0: Event) => any;
13
+ }, string, import('vue').PublicProps, Readonly<AvatarProps> & Readonly<{
14
+ onError?: ((args_0: Event) => any) | undefined;
15
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
16
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
17
+ export default _default;
18
+ type __VLS_WithTemplateSlots<T, S> = T & {
19
+ new (): {
20
+ $slots: S;
21
+ };
22
+ };
@@ -0,0 +1,7 @@
1
+ import { AvatarProps } from '../avatar';
2
+ export interface AvatarGroupProps {
3
+ max?: number;
4
+ size?: number | string;
5
+ members: AvatarProps[];
6
+ }
7
+ export { default } from './src/avatar-group';
@@ -0,0 +1 @@
1
+ import{defineComponent as c,computed as d,provide as u,openBlock as t,createElementBlock as s,Fragment as f,renderList as p,unref as a,createBlock as o,withCtx as h,createElementVNode as z,toDisplayString as g,createCommentVNode as v}from"vue";import{_ as n}from"../avatar/_.js";import"../_utils/css.js";const x={class:"flex flex-wrap items-center"},b={class:"relative w-full h-full flex items-center justify-center font-bold text-sm rounded-full bg-gray-1000 text-gray-100 font-mono"},B=c({name:"PAvatarGroup",__name:"avatar-group",props:{max:{default:5},size:{default:32},members:{default:()=>[]}},setup(r){const m=d(()=>r.members.slice(0,r.max));return u("avatarGroupProvider",{size:r.size}),(e,y)=>(t(),s("div",x,[(t(!0),s(f,null,p(a(m),(l,i)=>(t(),o(a(n),{key:i,size:e.size,src:l.src,placeholder:l.placeholder,class:"[&:nth-child(n+2)]:-ml-3"},null,8,["size","src","placeholder"]))),128)),e.members.length>e.max?(t(),o(a(n),{key:0,size:e.size,class:"-ml-3"},{default:h(()=>[z("div",b," +"+g(e.members.length-e.max),1)]),_:1},8,["size"])):v("",!0)]))}});export{B as default};
@@ -0,0 +1,3 @@
1
+ import { AvatarGroupProps } from '../index.js';
2
+ declare const _default: import('vue').DefineComponent<AvatarGroupProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<AvatarGroupProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
3
+ export default _default;
@@ -0,0 +1 @@
1
+ export { default } from './src/badge';
@@ -0,0 +1 @@
1
+ import{defineComponent as r,openBlock as n,createElementBlock as u,normalizeClass as o,renderSlot as m}from"vue";const g=r({__name:"badge",props:{variant:{default:"default"}},setup(b){const t={default:"font-medium bg-background-100",gray:"font-medium bg-gray-700 text-background-100",blue:"font-medium bg-blue-700 text-background-100",purple:"font-medium bg-purple-700 text-background-100",amber:"font-medium bg-amber-700",red:"font-medium bg-red-700 text-background-100",pink:"font-medium bg-pink-700 text-background-100",green:"font-medium bg-green-700 text-background-100",teal:"font-medium bg-teal-700 text-background-100","gray-subtle":"font-medium bg-gray-200 text-gray-1000","blue-subtle":"font-medium bg-blue-200 text-blue-700","purple-subtle":"font-medium bg-purple-200 text-purple-700","amber-subtle":"font-medium bg-amber-200 text-amber-700","red-subtle":"font-medium bg-red-200 text-red-700","pink-subtle":"font-medium bg-pink-200 text-pink-700","green-subtle":"font-medium bg-green-200 text-green-700","teal-subtle":"font-medium bg-teal-200 text-teal-700",inverted:"font-medium bg-gray-1000 text-background-100",vue:"font-medium text-background-100 bg-gradient-to-br from-[#42d392] via-[#42d392] via-25% to-[#647eff]",trial:"font-medium text-background-100 bg-gradient-to-br from-[#0070f3] to-[#f81ce5]",turborepo:"font-medium text-background-100 bg-gradient-to-br from-[#ff1e56] to-[#0096ff]"};return(e,d)=>(n(),u("span",{class:o(["pxd-badge inline-flex items-center justify-center px-2.5 h-6 text-xs rounded-full",t[e.variant]])},[m(e.$slots,"default")],2))}});export{g as default};
@@ -0,0 +1,42 @@
1
+ interface BadgeProps {
2
+ variant?: keyof typeof VARIANTS;
3
+ }
4
+ declare const VARIANTS: {
5
+ default: string;
6
+ gray: string;
7
+ blue: string;
8
+ purple: string;
9
+ amber: string;
10
+ red: string;
11
+ pink: string;
12
+ green: string;
13
+ teal: string;
14
+ 'gray-subtle': string;
15
+ 'blue-subtle': string;
16
+ 'purple-subtle': string;
17
+ 'amber-subtle': string;
18
+ 'red-subtle': string;
19
+ 'pink-subtle': string;
20
+ 'green-subtle': string;
21
+ 'teal-subtle': string;
22
+ inverted: string;
23
+ vue: string;
24
+ trial: string;
25
+ turborepo: string;
26
+ };
27
+ declare function __VLS_template(): {
28
+ slots: {
29
+ default?(_: {}): any;
30
+ };
31
+ refs: {};
32
+ attrs: Partial<{}>;
33
+ };
34
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
35
+ declare const __VLS_component: import('vue').DefineComponent<BadgeProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<BadgeProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
36
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
37
+ export default _default;
38
+ type __VLS_WithTemplateSlots<T, S> = T & {
39
+ new (): {
40
+ $slots: S;
41
+ };
42
+ };
@@ -0,0 +1 @@
1
+ export { default } from './src/book';
@@ -0,0 +1 @@
1
+ import{defineComponent as l,openBlock as o,createElementBlock as r,normalizeStyle as n,createElementVNode as t}from"vue";const s=l({__name:"book",props:{title:{},color:{},width:{default:196},variant:{default:"default"}},setup(d){return(a,e)=>(o(),r("div",{class:"pxd-book w-[--book-width] h-full",style:n({"--book-width":`${a.width}px`,"--book-depth":"29cqw"})},e[0]||(e[0]=[t("div",null,null,-1),t("div",{class:"absolute top-1",style:{height:"calc(100% - 2 * 4px)",width:"calc(var(--book-depth) - 2px)",transform:"translateX(calc(var(--book-width) * 1px - var(--book-depth) / 2 - 3px)) rotateY(90deg) translateX(calc(var(--book-depth) / 2))",background:"linear-gradient(90deg,#eaeaea,transparent 70%),linear-gradient(#fff,#fafafa)"}},null,-1),t("div",{class:"absolute left-0 h-full bg-gray-200 rounded-[6px_4px_4px_6px]",style:{transform:"translateZ(calc(-1 * var(--book-depth)))"}},null,-1)]),4))}});export{s as default};
@@ -0,0 +1,8 @@
1
+ interface BookProps {
2
+ title: string;
3
+ color?: string;
4
+ width?: number | string;
5
+ variant?: 'default' | 'simple';
6
+ }
7
+ declare const _default: import('vue').DefineComponent<BookProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<BookProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
8
+ export default _default;
@@ -0,0 +1,23 @@
1
+ import { StandardSize } from '../../types';
2
+ export declare const getButtonSizes: (v: string) => string;
3
+ export declare const buttonShapes: {
4
+ normal: string;
5
+ square: string;
6
+ rounded: string;
7
+ circle: string;
8
+ };
9
+ export declare const buttonVariants: {
10
+ base: string;
11
+ default: string;
12
+ secondary: string;
13
+ danger: string;
14
+ warning: string;
15
+ outline: string;
16
+ ghost: string;
17
+ underline: string;
18
+ };
19
+ export type ButtonSizes = StandardSize;
20
+ export type ButtonShapes = keyof typeof buttonShapes;
21
+ export type ButtonVariants = keyof typeof buttonVariants;
22
+ export declare function getButtonVariant(variant: ButtonVariants, withBase?: boolean): string;
23
+ export { default } from './src/button';
@@ -1 +1 @@
1
- import{getSize as a}from"../../composables/use-sizes.js";import{defineComponent as o,openBlock as r,createElementBlock as i,normalizeClass as d,unref as s,renderSlot as b}from"vue";const l=["type"],c=o({name:"PxButton",install(e){e.component(this.name,this)},__name:"button",props:{type:{type:String,default:"button"},size:{type:String,default:"default"},variant:{type:String,default:"default"}},setup(e){const n={default:"shadow-sm bg-primary text-primary-foreground not-disabled:hover:bg-primary/75 not-disabled:active:bg-primary/90",secondary:"shadow-sm bg-secondary text-secondary-foreground not-disabled:hover:bg-input/75 not-disabled:active:bg-input",danger:"shadow-sm bg-danger text-danger-foreground not-disabled:hover:bg-danger/75 not-disabled:active:bg-danger/90",outline:"shadow-sm !b-input text-primary bg-background not-disabled:hover:bg-secondary not-disabled:active:bg-input",ghost:"bg-transparent text-primary not-disabled:hover:bg-secondary not-disabled:active:bg-input",link:"bg-transparent text-primary underline-offset-3 not-disabled:hover:underline not-disabled:hover:bg-secondary not-disabled:active:bg-input"};return(t,g)=>(r(),i("button",{type:e.type,class:d(["pxd-button inline-flex items-center font-inherit b-1 b-solid b-transparent justify-center outlines text-sm not-disabled:cursor-pointer disabled:pointer-events-none disabled:op-50",[n[e.variant],("getSize"in t?t.getSize:s(a))(e.size)]])},[b(t.$slots,"default")],10,l))}});export{c as default};
1
+ import{getStandardSize as b}from"../_utils/css.js";import{defineComponent as u,computed as r,openBlock as l,createElementBlock as c,normalizeClass as g,unref as t,createBlock as p,createCommentVNode as y,renderSlot as o,createElementVNode as f}from"vue";import{_ as m}from"../spinner/_.js";const h=["type","disabled"],v={class:"px-1.5 flex items-center text-nowrap overflow-hidden"},$=u({name:"PButton",__name:"button",props:{type:{default:"button"},icon:{type:Boolean},shadow:{type:Boolean,default:!1},loading:{type:Boolean},disabled:{type:Boolean},shape:{default:"normal"},variant:{default:"default"},size:{default:"default"}},setup(a){const n=r(()=>a.shadow&&!["ghost","underline"].includes(a.variant)),s=r(()=>x(a.size)),i=r(()=>B(a.variant));return(e,k)=>(l(),c("button",{type:e.type,class:g(["pxd-button p-ring",[t(i),t(s),t(w)[e.shape],{"shadow-sm":t(n),"w-8 h-8 !p-0":e.icon}]]),disabled:e.disabled||e.loading},[e.loading?(l(),p(t(m),{key:0})):y("",!0),o(e.$slots,"prefix"),f("span",v,[o(e.$slots,"default")]),o(e.$slots,"suffix")],10,h))}}),x=b({default:"px-2",small:"px-1.5",large:"px-2.5"}),w={normal:"rounded-md",square:"rounded-none",rounded:"rounded-full",circle:"rounded-full overflow-hidden w-8 !p-1"},d={base:"inline-flex items-center select-none border font-inherit b-(1 solid) justify-center text-sm cursor-pointer disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-gray-700 disabled:border-gray-400",default:"bg-gray-1000 text-background-100 border-transparent enabled:hover:opacity-90 enabled:active:opacity-80",secondary:"bg-gray-100 text-gray-1000 border-transparent enabled:hover:bg-gray-200 enabled:active:bg-gray-alpha-300",danger:"bg-red-800 text-background-100 border-transparent enabled:hover:opacity-90 enabled:active:opacity-80",warning:"bg-amber-800 text-background-100 border-transparent enabled:hover:opacity-90 enabled:active:opacity-80",outline:"text-gray-1000 bg-background-100 border-gray-alpha-400 enabled:hover:bg-gray-100 enabled:active:bg-gray-200",ghost:"bg-transparent text-gray-1000 border-transparent enabled:hover:bg-gray-100 enabled:active:bg-gray-200",underline:"bg-transparent text-gray-1000 border-transparent underline underline-offset-4 enabled:hover:opacity-90 enabled:active:opacity-70"};function B(a,n=!0){return(d[a]||d.default)+(n?` ${d.base}`:"")}export{w as buttonShapes,d as buttonVariants,$ as default,x as getButtonSizes,B as getButtonVariant};
@@ -0,0 +1,29 @@
1
+ import { ButtonShapes, ButtonSizes, ButtonVariants } from '../index.js';
2
+ interface ButtonProps {
3
+ type?: HTMLButtonElement['type'];
4
+ icon?: boolean;
5
+ shadow?: boolean;
6
+ loading?: boolean;
7
+ disabled?: boolean;
8
+ shape?: ButtonShapes;
9
+ variant?: ButtonVariants;
10
+ size?: ButtonSizes;
11
+ }
12
+ declare function __VLS_template(): {
13
+ slots: {
14
+ prefix?(_: {}): any;
15
+ default?(_: {}): any;
16
+ suffix?(_: {}): any;
17
+ };
18
+ refs: {};
19
+ attrs: Partial<{}>;
20
+ };
21
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
22
+ declare const __VLS_component: import('vue').DefineComponent<ButtonProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ButtonProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
23
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
24
+ export default _default;
25
+ type __VLS_WithTemplateSlots<T, S> = T & {
26
+ new (): {
27
+ $slots: S;
28
+ };
29
+ };
@@ -0,0 +1 @@
1
+ export { default } from './src/checkbox';
@@ -1 +1 @@
1
- import{defineComponent as r,useModel as i,openBlock as u,createElementBlock as h,createVNode as c,unref as l,mergeProps as p,withCtx as s,createElementVNode as n,renderSlot as m}from"vue";import{CheckboxRoot as k,CheckboxIndicator as b}from"radix-vue";const f={class:"pxd-checkbox outline-none"},x=n("i",{class:"i-ic-check bg-background"},null,-1),_={class:"pl-1.5 active:select-none"},w=r({name:"PxCheckbox",install(e){e.component(this.name,this)},__name:"checkbox",props:{modelValue:{type:Boolean}},emits:["update:modelValue"],setup(e){const t=i(e,"modelValue");return(o,a)=>(u(),h("label",f,[c(l(k),p({checked:t.value,"onUpdate:checked":a[0]||(a[0]=d=>t.value=d),class:"w-4 h-4 p-0 b-1 b-solid b-input shadow-sm rounded outlines bg-background overflow-hidden data-[state=unchecked]:va--1.4px data-[state=checked]:b-primary data-[state=checked]:va--1px"},o.$attrs),{default:s(()=>[c(l(b),{class:"block flex items-center justify-center h-full w-full bg-primary"},{default:s(()=>[x]),_:1})]),_:1},16,["checked"]),n("span",_,[m(o.$slots,"default")])]))}});export{w as default};
1
+ import{defineComponent as c,mergeModels as n,useModel as i,openBlock as p,createElementBlock as u,createVNode as e,unref as t,mergeProps as b,withCtx as d,createElementVNode as m,renderSlot as h}from"vue";import{CheckboxRoot as g,CheckboxIndicator as k}from"radix-vue";import{r as x}from"../_icons/CheckIcon.js";const y={class:"pxd-checkbox group inline-flex items-center cursor-pointer text-gray-1000"},f={class:"pl-1 pr-1.5 leading-0 active:select-none text-sm text-gray-1000 empty:hidden peer-disabled:text-gray-500"},v=c({name:"PCheckbox",__name:"checkbox",props:n({defaultChecked:{type:Boolean},checked:{type:[Boolean,String]},disabled:{type:Boolean},required:{type:Boolean},name:{},value:{},id:{},asChild:{type:Boolean},as:{}},{modelValue:{type:Boolean},modelModifiers:{}}),emits:["update:modelValue"],setup(l){const o=i(l,"modelValue");return(a,r)=>(p(),u("label",y,[e(t(g),b({checked:o.value,"onUpdate:checked":r[0]||(r[0]=s=>o.value=s),class:"p-ring peer w-4 min-w-4 h-4 p-0 shadow-sm rounded border border-gray-700 transition-colors bg-background-100 data-[state=checked]:bg-current data-[state=checked]:!border-current disabled:cursor-not-allowed disabled:bg-gray-100 disabled:border-gray-500 disabled:text-gray-600 group-hover:[&:not(:disabled,[data-state=checked])]:bg-gray-200 group-hover:[&:not(:disabled,[data-state=checked])]:border-gray-700"},a.$attrs),{default:d(()=>[e(t(k),{"as-child":"",class:"block h-full p-px -m-px"},{default:d(()=>[e(t(x),{class:"text-background-100"})]),_:1})]),_:1},16,["checked"]),m("span",f,[h(a.$slots,"default")])]))}});export{v as default};
@@ -0,0 +1,27 @@
1
+ import { CheckboxRootProps } from 'radix-vue';
2
+ interface CheckboxProps extends CheckboxRootProps {
3
+ }
4
+ declare let __VLS_typeProps: CheckboxProps;
5
+ type __VLS_PublicProps = {
6
+ modelValue?: boolean;
7
+ } & typeof __VLS_typeProps;
8
+ declare function __VLS_template(): {
9
+ slots: {
10
+ default?(_: {}): any;
11
+ };
12
+ refs: {};
13
+ attrs: Partial<{}>;
14
+ };
15
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
16
+ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
17
+ "update:modelValue": (modelValue: boolean) => any;
18
+ }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
19
+ "onUpdate:modelValue"?: ((modelValue: boolean) => any) | undefined;
20
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
21
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
22
+ export default _default;
23
+ type __VLS_WithTemplateSlots<T, S> = T & {
24
+ new (): {
25
+ $slots: S;
26
+ };
27
+ };
@@ -0,0 +1,4 @@
1
+ export interface CheckboxGroupProps {
2
+ direction?: 'row' | 'col';
3
+ }
4
+ export { default } from './src/checkbox-group';
@@ -0,0 +1 @@
1
+ import{defineComponent as r,openBlock as n,createElementBlock as c,normalizeClass as i,unref as l,renderSlot as a}from"vue";import{getFlowDirection as s}from"../_utils/css.js";const u=r({__name:"checkbox-group",props:{direction:{default:"row"}},setup(e){const o=s(e.direction);return(t,p)=>(n(),c("div",{class:i(["flex gap-3",l(o)])},[a(t.$slots,"default")],2))}});export{u as default};
@@ -0,0 +1,17 @@
1
+ import { CheckboxGroupProps } from '../index.js';
2
+ declare function __VLS_template(): {
3
+ slots: {
4
+ default?(_: {}): any;
5
+ };
6
+ refs: {};
7
+ attrs: Partial<{}>;
8
+ };
9
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
10
+ declare const __VLS_component: import('vue').DefineComponent<CheckboxGroupProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CheckboxGroupProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
11
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
12
+ export default _default;
13
+ type __VLS_WithTemplateSlots<T, S> = T & {
14
+ new (): {
15
+ $slots: S;
16
+ };
17
+ };
@@ -0,0 +1 @@
1
+ export { default } from './src/choicebox';
@@ -0,0 +1 @@
1
+ import{defineComponent as p,inject as m,computed as f,openBlock as d,createElementBlock as l,unref as t,createElementVNode as o,toDisplayString as a,createVNode as g,renderSlot as h,createCommentVNode as y}from"vue";import{ChoiceboxInjectionKey as x}from"../choicebox-group/index.js";import{r as k}from"../_icons/CheckIcon.js";import"../_utils/css.js";const _=["aria-selected","data-selected"],v={class:"flex gap-6 items-center justify-between p-3"},C={class:"flex flex-col items-stretch justify-start"},j={class:"font-medium text-sm"},V={class:"font-normal text-sm opacity-90 empty:hidden"},w=["data-selected"],N=["data-selected"],S={key:0,class:"border-t border-inherit p-2 flex justify-center"},D=p({__name:"choicebox",props:{title:{},value:{},description:{}},setup(n){const c=n,{multiple:i,modelValue:u,onChoiceboxItemChange:b}=m(x,{modelValue:{}}),r=f(()=>{var e;return(e=u.value)==null?void 0:e.includes(c.value)});return(e,s)=>(d(),l("li",{tabindex:"0","aria-selected":t(r),"data-selected":t(r),class:"pxd-choicebox-item w-full rounded-md list-none cursor-pointer border border-gray-400 bg-background-100 transition-colors hover:bg-gray-100 hover:border-gray-500 data-[selected=true]:border-blue-600 data-[selected=true]:bg-blue-100 data-[selected=true]:text-blue-900",onClick:s[0]||(s[0]=$=>t(b)(e.value))},[o("div",v,[o("div",C,[o("span",j,a(e.title),1),o("span",V,a(e.description),1)]),t(i)?(d(),l("span",{key:0,"data-selected":t(r),class:"relative group block size-4 rounded border border-gray-500 bg-background-100 data-[selected=true]:border-blue-900 data-[selected=true]:bg-blue-900"},[g(t(k),{class:"text-background-100 absolute left-[-1px] top-[-1px] p-px"})],8,w)):(d(),l("span",{key:1,"data-selected":t(r),class:"relative group block size-4 rounded-full bg-background-100 border border-gray-500 data-[selected=true]:border-blue-900"},s[1]||(s[1]=[o("i",{class:"hidden group-data-[selected=true]:block absolute inset-0 m-auto w-1/2 h-1/2 rounded-full bg-blue-900"},null,-1)]),8,N))]),e.$slots.default?(d(),l("div",S,[h(e.$slots,"default")])):y("",!0)],8,_))}});export{D as default};
@@ -0,0 +1,21 @@
1
+ interface ChoiceboxProps {
2
+ title: string;
3
+ value: string;
4
+ description?: string;
5
+ }
6
+ declare function __VLS_template(): {
7
+ slots: {
8
+ default?(_: {}): any;
9
+ };
10
+ refs: {};
11
+ attrs: Partial<{}>;
12
+ };
13
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
14
+ declare const __VLS_component: import('vue').DefineComponent<ChoiceboxProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ChoiceboxProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
15
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
16
+ export default _default;
17
+ type __VLS_WithTemplateSlots<T, S> = T & {
18
+ new (): {
19
+ $slots: S;
20
+ };
21
+ };
@@ -0,0 +1,13 @@
1
+ import { InjectionKey, Ref } from 'vue';
2
+ export interface ChoiceboxProps {
3
+ title?: string;
4
+ multiple?: boolean;
5
+ direction?: 'row' | 'col';
6
+ }
7
+ export interface ChoiceboxProvider {
8
+ multiple: Ref<boolean>;
9
+ modelValue: Ref<string | string[]>;
10
+ onChoiceboxItemChange: (value: string) => void;
11
+ }
12
+ export declare const ChoiceboxInjectionKey: InjectionKey<ChoiceboxProvider>;
13
+ export { default } from './src/choicebox-group';
@@ -0,0 +1 @@
1
+ import{defineComponent as n,mergeModels as u,useModel as c,provide as m,toRef as s,openBlock as d,createElementBlock as f,normalizeClass as p,unref as b,renderSlot as h}from"vue";import{getFlowDirection as x}from"../_utils/css.js";const g=["aria-label","aria-multiselectable"],B=n({name:"PChoiceboxGroup",__name:"choicebox-group",props:u({title:{},multiple:{type:Boolean,default:!1},direction:{default:"row"}},{modelValue:{required:!0},modelModifiers:{}}),emits:["update:modelValue"],setup(o){const l=c(o,"modelValue"),i=x(o.direction);function a(e){if(o.multiple){const t=l.value;t.includes(e)?l.value=t.filter(r=>r!==e):t.push(e);return}l.value=e}return m(C,{multiple:s(()=>o.multiple),modelValue:l,onChoiceboxItemChange:a}),(e,t)=>(d(),f("ul",{class:p(["pxd-choicebox list-none m-0 p-0 flex gap-3",b(i)]),role:"group","aria-label":e.title,"aria-multiselectable":e.multiple},[h(e.$slots,"default")],10,g))}}),C=Symbol("choiceboxProvider");export{C as ChoiceboxInjectionKey,B as default};
@@ -0,0 +1,25 @@
1
+ import { ChoiceboxProps } from '../index.js';
2
+ declare let __VLS_typeProps: ChoiceboxProps;
3
+ type __VLS_PublicProps = {
4
+ modelValue: string | string[];
5
+ } & typeof __VLS_typeProps;
6
+ declare function __VLS_template(): {
7
+ slots: {
8
+ default?(_: {}): any;
9
+ };
10
+ refs: {};
11
+ attrs: Partial<{}>;
12
+ };
13
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
14
+ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
15
+ "update:modelValue": (modelValue: string | string[]) => any;
16
+ }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
17
+ "onUpdate:modelValue"?: ((modelValue: string | string[]) => any) | undefined;
18
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
19
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
20
+ export default _default;
21
+ type __VLS_WithTemplateSlots<T, S> = T & {
22
+ new (): {
23
+ $slots: S;
24
+ };
25
+ };
@@ -0,0 +1 @@
1
+ export { default } from './src/collapse';
@@ -0,0 +1 @@
1
+ import{defineComponent as c,openBlock as a,createBlock as n,unref as e,withCtx as t,createElementBlock as d,Fragment as p,renderList as i,createVNode as r,createTextVNode as u,toDisplayString as s,createElementVNode as f}from"vue";import{AccordionRoot as m,AccordionItem as b,AccordionHeader as g,AccordionTrigger as _,AccordionContent as v}from"radix-vue";import{r as h}from"../_icons/ChevronDownIcon.js";const x={class:"p-4 bg-background-200 border-t border-gray-400"},B=c({name:"PCollapse",__name:"collapse",props:{options:{}},setup(k){return(l,y)=>(a(),n(e(m),{collapsible:"",class:"pxd-collapse bg-background-100","default-value":l.options[0].value},{default:t(()=>[(a(!0),d(p,null,i(l.options,o=>(a(),n(e(b),{key:o.value,value:o.value,class:"[&:not(:last-child)]:border-b border-gray-400"},{default:t(()=>[r(e(g),{class:"flex m-0 cursor-pointer text-4"},{default:t(()=>[r(e(_),{class:"group relative w-full text-inherit font-inherit pl-2 py-3 pr-8 text-left b-0 bg-transparent cursor-pointer"},{default:t(()=>[u(s(o.label)+" ",1),r(e(h),{class:"absolute right-4 top-4 transition-transform group-data-[state=open]:rotate-180"})]),_:2},1024)]),_:2},1024),r(e(v),{class:"overflow-hidden data-[state=open]:animate-collapse-slide-down data-[state=closed]:animate-collapse-slide-up"},{default:t(()=>[f("div",x,s(o.content),1)]),_:2},1024)]),_:2},1032,["value"]))),128))]),_:1},8,["default-value"]))}});export{B as default};
@@ -0,0 +1,9 @@
1
+ import { OptionItem } from '../../../types';
2
+ type CollapseOptionItem = Pick<OptionItem, 'label' | 'value'> & {
3
+ content: string;
4
+ };
5
+ interface CollapseProps {
6
+ options: CollapseOptionItem[];
7
+ }
8
+ declare const _default: import('vue').DefineComponent<CollapseProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<CollapseProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
9
+ export default _default;
@@ -0,0 +1 @@
1
+ export { default } from './src/combobox';
@@ -0,0 +1 @@
1
+ import{openBlock as r,createElementBlock as m,createElementVNode as c,defineComponent as w,mergeModels as g,useModel as y,shallowRef as V,computed as L,watchEffect as k,createBlock as u,unref as e,isRef as _,withCtx as a,createVNode as l,normalizeClass as M,withModifiers as z,createCommentVNode as B,createTextVNode as p,toDisplayString as b,Fragment as I,renderList as N}from"vue";import{_ as E}from"../_icons/ExclamationTriangleIcon.js";import{getInputSizes as S}from"../input/index.js";import{ComboboxRoot as T,ComboboxAnchor as $,ComboboxInput as R,ComboboxTrigger as Z,ComboboxContent as j,ComboboxViewport as A,ComboboxEmpty as D,ComboboxItem as F,ComboboxItemIndicator as P}from"radix-vue";import{r as U}from"../_icons/ChevronDownIcon.js";import{r as q}from"../_icons/CheckIcon.js";import"../_icons/ExternalLinkIcon.js";import"../_utils/css.js";function G(s,d){return r(),m("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[c("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M11.7816 4.03157C12.0062 3.80702 12.0062 3.44295 11.7816 3.2184C11.5571 2.99385 11.193 2.99385 10.9685 3.2184L7.50005 6.68682L4.03164 3.2184C3.80708 2.99385 3.44301 2.99385 3.21846 3.2184C2.99391 3.44295 2.99391 3.80702 3.21846 4.03157L6.68688 7.49999L3.21846 10.9684C2.99391 11.193 2.99391 11.557 3.21846 11.7816C3.44301 12.0061 3.80708 12.0061 4.03164 11.7816L7.50005 8.31316L10.9685 11.7816C11.193 12.0061 11.5571 12.0061 11.7816 11.7816C12.0062 11.557 12.0062 11.193 11.7816 10.9684L8.31322 7.49999L11.7816 4.03157Z",fill:"currentColor"})])}function H(s,d){return r(),m("svg",{width:"15",height:"15",viewBox:"0 0 15 15",fill:"none",xmlns:"http://www.w3.org/2000/svg"},[c("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M10 6.5C10 8.433 8.433 10 6.5 10C4.567 10 3 8.433 3 6.5C3 4.567 4.567 3 6.5 3C8.433 3 10 4.567 10 6.5ZM9.30884 10.0159C8.53901 10.6318 7.56251 11 6.5 11C4.01472 11 2 8.98528 2 6.5C2 4.01472 4.01472 2 6.5 2C8.98528 2 11 4.01472 11 6.5C11 7.56251 10.6318 8.53901 10.0159 9.30884L12.8536 12.1464C13.0488 12.3417 13.0488 12.6583 12.8536 12.8536C12.6583 13.0488 12.3417 13.0488 12.1464 12.8536L9.30884 10.0159Z",fill:"currentColor"})])}const J={class:"absolute left-0 top-0 text-gray-700 w-8 h-full flex items-center"},le=w({name:"PCombobox",__name:"combobox",props:g({size:{default:"default"},error:{},disabled:{type:Boolean},placeholder:{default:"Search..."},options:{},emptyText:{default:"Nothing to see here..."}},{modelValue:{},modelModifiers:{}}),emits:["update:modelValue"],setup(s){const d=y(s,"modelValue"),n=V({}),h=L(()=>S(s.size));function C(t){d.value=t.value}function f(){n.value={}}function x(){d.value="",f()}return k(()=>{if(d.value){const t=s.options.find(i=>i.value===d.value);if(t){n.value=t;return}}f()}),(t,i)=>(r(),u(e(T),{modelValue:e(n),"onUpdate:modelValue":[i[0]||(i[0]=o=>_(n)?n.value=o:null),C],disabled:t.disabled,class:"pxd-combobox relative"},{default:a(()=>[l(e($),{"data-disabled":t.disabled,class:M(["p-focusable rounded-md",[{"p-focusable-error":t.error},e(h)]])},{default:a(()=>{var o;return[c("div",J,[l(e(H),{class:"mx-auto"})]),l(e(R),{class:"px-8 w-full h-full rounded-inherit p-input",placeholder:t.placeholder,value:(o=e(n))==null?void 0:o.label},null,8,["placeholder","value"]),l(e(Z),{class:"absolute right-0 top-0 text-gray-700 w-8 h-full flex items-center justify-center transition-transform data-[state=open]:rotate-180"},{default:a(()=>[d.value?(r(),m("span",{key:0,class:"inline-block w-fit h-fit p-0.5 rounded-full transition-colors hover:bg-gray-alpha-300",onClick:z(x,["stop"])},[l(e(G))])):(r(),u(e(U),{key:1}))]),_:1}),t.error?(r(),u(e(E),{key:0,error:t.error,class:"mt-2"},null,8,["error"])):B("",!0)]}),_:1},8,["data-disabled","class"]),l(e(j),{class:"absolute p-shadow-border-large z-10 w-full mt-2 min-w-40 bg-white overflow-hidden rounded-lg data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out"},{default:a(()=>[l(e(A),{class:"p-select-list p-2 text-sm"},{default:a(()=>[l(e(D),{class:"text-gray-alpha-600 text-xs font-medium text-center py-2 select-none"},{default:a(()=>[p(b(t.emptyText),1)]),_:1}),(r(!0),m(I,null,N(t.options,(o,v)=>(r(),u(e(F),{key:v,value:o,title:o.label,disabled:o.disabled,class:"p-select-item outline-0 flex items-center h-9 pl-7 pr-2 relative select-none rounded-md data-[disabled]:text-gray-alpha-600 data-[disabled]:cursor-not-allowed data-[state=checked]:text-gray-1000"},{default:a(()=>[l(e(P),{class:"absolute left-1 w-6 inline-flex items-center justify-center"},{default:a(()=>[l(e(q))]),_:1}),p(" "+b(o.value),1)]),_:2},1032,["value","title","disabled"]))),128))]),_:1})]),_:1})]),_:1},8,["modelValue","disabled"]))}});export{le as default};
@@ -0,0 +1,19 @@
1
+ import { OptionItem, StandardError, StandardSize } from '../../../types';
2
+ interface SelectProps {
3
+ size?: StandardSize;
4
+ error?: StandardError;
5
+ disabled?: boolean;
6
+ placeholder?: string;
7
+ options: OptionItem[];
8
+ emptyText?: string;
9
+ }
10
+ declare let __VLS_typeProps: SelectProps;
11
+ type __VLS_PublicProps = {
12
+ modelValue?: string;
13
+ } & typeof __VLS_typeProps;
14
+ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
15
+ "update:modelValue": (modelValue: string) => any;
16
+ }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
17
+ "onUpdate:modelValue"?: ((modelValue: string) => any) | undefined;
18
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
19
+ export default _default;
@@ -0,0 +1 @@
1
+ export { default } from './src/dialog';
@@ -1 +1 @@
1
- import{defineComponent as f,mergeModels as b,useModel as h,openBlock as l,createBlock as n,unref as e,withCtx as o,renderSlot as i,createCommentVNode as g,createVNode as d,resolveDynamicComponent as D,createElementVNode as c,createTextVNode as u,toDisplayString as m}from"vue";import{DialogRoot as x,DialogTrigger as y,DialogPortal as k,DialogOverlay as C,DialogContent as v,AlertDialogContent as V,DialogTitle as z,DialogDescription as S,DialogClose as $}from"radix-vue";const w={class:"pxd-dialog--header"},B=c("i",{class:"block pointer-events-none i-ic-close"},null,-1),O=f({name:"PxDialog",install(t){t.component(this.name,this)},__name:"dialog",props:b({title:{type:String,default:""},description:{type:String,default:""},closeOnClickModal:{type:Boolean,default:!1}},{modelValue:{type:Boolean}}),emits:["update:modelValue"],setup(t){const r=h(t,"modelValue");return(a,s)=>(l(),n(e(x),{open:r.value,"onUpdate:open":s[0]||(s[0]=p=>r.value=p)},{default:o(()=>[a.$slots.trigger?(l(),n(e(y),{key:0,"as-child":""},{default:o(()=>[i(a.$slots,"trigger")]),_:3})):g("",!0),d(e(k),{to:"body"},{default:o(()=>[d(e(C),{class:"fixed inset-0 z-10 bg-background/90 animated animated-duration-150 data-[state=open]:animated-fade-in data-[state=closed]:animated-fade-out"}),(l(),n(D(t.closeOnClickModal?e(v):e(V)),{class:"pxd-dialog fixed left-0 right-0 top-50% translate-y--50% mx-auto z-11 grid gap-4 w-full box-border max-w-lg bg-background rounded-lg p-8 shadow-lg b-1 b-solid b-border origin-center animated animated-duration-150 data-[state=open]:animated-zoom-in data-[state=closed]:animated-zoom-out"},{default:o(()=>[c("div",w,[d(e(z),{class:"text-lg font-500 tracking-tight m-0"},{default:o(()=>[i(a.$slots,"title",{},()=>[u(m(t.title),1)])]),_:3}),t.description?(l(),n(e(S),{key:0,class:"text-muted-foreground m-0 text-sm leading-normal"},{default:o(()=>[i(a.$slots,"description",{},()=>[u(m(t.description),1)])]),_:3})):g("",!0),d(e($),{class:"absolute right-4 top-4 z-11 b-0 outline-none p-1 rounded text-4 bg-transparent op-50 hover:bg-secondary hover:op-100 cursor-pointer text-inherit","aria-label":"Close"},{default:o(()=>[B]),_:1})]),i(a.$slots,"default")]),_:3}))]),_:3})]),_:3},8,["open"]))}});export{O as default};
1
+ import{defineComponent as h,mergeModels as g,useModel as y,useTemplateRef as b,watchEffect as k,openBlock as a,createBlock as v,Transition as x,withCtx as w,withDirectives as _,createElementBlock as d,createElementVNode as l,toDisplayString as r,renderSlot as c,createCommentVNode as f,vShow as C}from"vue";const D={class:"flex-1 px-6 pb-6 overflow-y-auto max-h-[min(800px,80vh)]"},M={class:"sticky top-0 left-0 bg-background-100"},B={class:"empty:hidden py-6 text-2xl font-semibold tracking-tight"},V={class:"empty:hidden text-sm -mt-6 pb-4 text-gray-900"},R={key:0,class:"flex items-center justify-between border-t border-gray-alpha-400 bg-background-200 p-3.5"},E=h({name:"PDialog",inheritAttrs:!1,__name:"dialog",props:g({title:{},description:{},closeOnClickModal:{type:Boolean}},{modelValue:{type:Boolean,default:!1},modelModifiers:{}}),emits:["update:modelValue"],setup(s){const u=s,o=y(s,"modelValue"),t=b("dialogRef");function p(){var e;(e=t.value)==null||e.showModal(),document.body.style.overflow="hidden"}function n(){var e;(e=t.value)==null||e.close(),o.value=!1,document.body.style.overflow=""}function m(e){const[i]=e.composedPath();i===t.value&&u.closeOnClickModal&&(e.preventDefault(),n())}return k(()=>{o.value&&p()}),(e,i)=>(a(),v(x,{name:"transition-slide-down"},{default:w(()=>[o.value?_((a(),d("dialog",{key:0,ref_key:"dialogRef",ref:t,class:"pxd-dialog fixed inset-0 m-auto z-50 w-[540px] rounded-xl shadow-sm outline-0 flex flex-col [&::backdrop]:bg-gray-alpha-500 [&::backdrop]:backdrop-blur-sm",onClose:n,onClick:m},[l("div",D,[l("header",M,[l("h3",B,r(e.title),1),l("p",V,r(e.description),1)]),c(e.$slots,"default")]),e.$slots.footer?(a(),d("footer",R,[c(e.$slots,"footer")])):f("",!0)],544)),[[C,o.value]]):f("",!0)]),_:3}))}});export{E as default};
@@ -0,0 +1,32 @@
1
+ interface DialogProps {
2
+ title?: string;
3
+ description?: string;
4
+ closeOnClickModal?: boolean;
5
+ }
6
+ declare let __VLS_typeProps: DialogProps;
7
+ type __VLS_PublicProps = {
8
+ modelValue?: boolean;
9
+ } & typeof __VLS_typeProps;
10
+ declare function __VLS_template(): {
11
+ slots: {
12
+ default?(_: {}): any;
13
+ footer?(_: {}): any;
14
+ };
15
+ refs: {
16
+ dialogRef: HTMLDialogElement;
17
+ };
18
+ attrs: Partial<{}>;
19
+ };
20
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
21
+ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
22
+ "update:modelValue": (modelValue: boolean) => any;
23
+ }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
24
+ "onUpdate:modelValue"?: ((modelValue: boolean) => any) | undefined;
25
+ }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
26
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
27
+ export default _default;
28
+ type __VLS_WithTemplateSlots<T, S> = T & {
29
+ new (): {
30
+ $slots: S;
31
+ };
32
+ };
@@ -0,0 +1 @@
1
+ export { default } from './src/error';
@@ -0,0 +1 @@
1
+ import{_ as p}from"../_icons/ExclamationTriangleIcon.js";import"vue";import"../_icons/ExternalLinkIcon.js";export{p as default};