@velkymx/vibeui 0.8.0 → 0.8.2

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 (52) hide show
  1. package/CLAUDE.md +48 -0
  2. package/dist/vibeui.css +1 -1
  3. package/dist/vibeui.es.js +149 -148
  4. package/dist/vibeui.umd.js +1 -1
  5. package/docs/README.md +153 -0
  6. package/docs/components/advanced/popover.md +150 -0
  7. package/docs/components/advanced/scrollspy.md +64 -0
  8. package/docs/components/advanced/tooltip.md +111 -0
  9. package/docs/components/card/card.md +215 -0
  10. package/docs/components/core/alert.md +72 -0
  11. package/docs/components/core/badge.md +81 -0
  12. package/docs/components/core/button-group.md +105 -0
  13. package/docs/components/core/button.md +127 -0
  14. package/docs/components/core/close-button.md +82 -0
  15. package/docs/components/core/link.md +36 -0
  16. package/docs/components/core/placeholder.md +135 -0
  17. package/docs/components/core/spinner.md +109 -0
  18. package/docs/components/data/datatable.md +416 -0
  19. package/docs/components/interactive/accordion.md +92 -0
  20. package/docs/components/interactive/carousel.md +97 -0
  21. package/docs/components/interactive/collapse.md +105 -0
  22. package/docs/components/interactive/dropdown.md +93 -0
  23. package/docs/components/interactive/modal.md +148 -0
  24. package/docs/components/interactive/offcanvas.md +89 -0
  25. package/docs/components/interactive/toast.md +114 -0
  26. package/docs/components/layout/col.md +123 -0
  27. package/docs/components/layout/container.md +59 -0
  28. package/docs/components/layout/row.md +113 -0
  29. package/docs/components/list/list-group.md +221 -0
  30. package/docs/components/navigation/breadcrumb.md +116 -0
  31. package/docs/components/navigation/nav.md +88 -0
  32. package/docs/components/navigation/navbar.md +106 -0
  33. package/docs/components/navigation/pagination.md +146 -0
  34. package/docs/components/progress/progress.md +182 -0
  35. package/docs/composables/back-button.md +28 -0
  36. package/docs/composables/breakpoints.md +54 -0
  37. package/docs/composables/color-mode.md +141 -0
  38. package/docs/forms/README.md +88 -0
  39. package/docs/forms/form-checkbox.md +50 -0
  40. package/docs/forms/form-datepicker.md +50 -0
  41. package/docs/forms/form-group.md +80 -0
  42. package/docs/forms/form-input.md +55 -0
  43. package/docs/forms/form-radio.md +58 -0
  44. package/docs/forms/form-select.md +54 -0
  45. package/docs/forms/form-spinbutton.md +55 -0
  46. package/docs/forms/form-switch.md +47 -0
  47. package/docs/forms/form-textarea.md +51 -0
  48. package/docs/forms/form-wysiwyg.md +64 -0
  49. package/docs/forms/input-group.md +51 -0
  50. package/docs/forms/validation.md +599 -0
  51. package/llms.txt +422 -0
  52. package/package.json +5 -2
package/CLAUDE.md ADDED
@@ -0,0 +1,48 @@
1
+ # VibeUI - AI Assistant Guide
2
+
3
+ **DO NOT read the source files in this package to understand how to use VibeUI.**
4
+
5
+ Instead, use these resources:
6
+
7
+ ## Documentation
8
+
9
+ - **Full docs:** `docs/` directory in this package (included in npm install)
10
+ - **Start here:** `docs/README.md` for an overview
11
+ - **Component docs:** `docs/components/` for per-component API reference
12
+ - **Form docs:** `docs/forms/` for form components and validation
13
+ - **Composable docs:** `docs/composables/` for hooks like `useColorMode`
14
+ - **LLM-optimized reference:** `llms.txt` in this package root
15
+
16
+ ## Quick Reference
17
+
18
+ - **Package:** `@velkymx/vibeui`
19
+ - **Repository:** https://github.com/velkymx/vibeui
20
+ - **Stack:** Vue 3 + Bootstrap 5.3 + TypeScript
21
+
22
+ ## How to Use VibeUI
23
+
24
+ ```ts
25
+ import { createApp } from 'vue'
26
+ import VibeUI from '@velkymx/vibeui'
27
+ import 'bootstrap/dist/css/bootstrap.min.css'
28
+
29
+ createApp(App).use(VibeUI).mount('#app')
30
+ ```
31
+
32
+ All components are available globally after `app.use(VibeUI)`, or can be imported individually:
33
+
34
+ ```ts
35
+ import { VibeButton, VibeModal, VibeCard } from '@velkymx/vibeui'
36
+ ```
37
+
38
+ ## Key Patterns
39
+
40
+ - Components use Bootstrap 5.3 class names via props (e.g., `variant="primary"`, `size="lg"`)
41
+ - Interactive components (Modal, Offcanvas, Toast, Collapse) use `v-model` for visibility
42
+ - Data-driven components (Breadcrumb, ListGroup, Dropdown, Accordion) accept `items` arrays
43
+ - Bootstrap JS is managed internally - do NOT import bootstrap JS yourself
44
+ - Bootstrap CSS must be imported by the consumer
45
+
46
+ ## For Complete API Details
47
+
48
+ Read the `docs/` directory or `llms.txt` - do not reverse-engineer behavior from dist files.
package/dist/vibeui.css CHANGED
@@ -1 +1 @@
1
- .navbar.fixed-top[data-v-8228b170],.navbar.sticky-top[data-v-8228b170]{padding-top:env(safe-area-inset-top,0)}.navbar.fixed-bottom[data-v-8228b170]{padding-bottom:env(safe-area-inset-bottom,0)}.modal.show .modal-dialog.modal-fullscreen[data-v-c11ac690],.modal.show .modal-dialog.modal-fullscreen .modal-content[data-v-c11ac690]{height:100dvh}.modal-header[data-v-c11ac690]{padding-top:calc(1rem + env(safe-area-inset-top,0))}.modal-footer[data-v-c11ac690]{padding-bottom:calc(.75rem + env(safe-area-inset-bottom,0))}.offcanvas.offcanvas-start[data-v-f03bd194],.offcanvas.offcanvas-end[data-v-f03bd194]{height:100dvh}.offcanvas.offcanvas-top[data-v-f03bd194],.offcanvas.offcanvas-bottom[data-v-f03bd194]{max-height:100dvh}.offcanvas-header[data-v-f03bd194]{padding-top:calc(1rem + env(safe-area-inset-top,0))}.offcanvas-body[data-v-f03bd194]{padding-bottom:calc(1rem + env(safe-area-inset-bottom,0))}.vibe-datatable[data-v-c496dc70]{width:100%}.datatable-info[data-v-c496dc70]{padding:.5rem 0;color:var(--bs-secondary-color)}@media(max-width:767.98px){.vibe-table-stack[data-v-c496dc70],.vibe-table-stack tbody[data-v-c496dc70],.vibe-table-stack tr[data-v-c496dc70],.vibe-table-stack td[data-v-c496dc70]{display:block;width:100%}.vibe-table-stack thead[data-v-c496dc70]{display:none}.vibe-table-stack tr[data-v-c496dc70]{margin-bottom:1rem;border:1px solid var(--bs-border-color);border-radius:.375rem;background-color:var(--bs-body-bg)}.vibe-table-stack td[data-v-c496dc70]{text-align:right;padding:.5rem 1rem;position:relative;padding-left:50%;border-top:none;border-bottom:1px solid var(--bs-border-color)}.vibe-table-stack td[data-v-c496dc70]:last-child{border-bottom:none}.vibe-table-stack td[data-v-c496dc70]:before{content:attr(data-label);position:absolute;left:1rem;width:45%;text-align:left;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.input-group-vertical[data-v-49746a62]{flex-direction:column}.input-group-vertical[data-v-49746a62]>*{width:100%}.vibe-wysiwyg-container[data-v-952f7269]{border:1px solid var(--bs-border-color);border-radius:.375rem}.vibe-wysiwyg-container.is-valid[data-v-952f7269]{border-color:var(--bs-success)}.vibe-wysiwyg-container.is-invalid[data-v-952f7269]{border-color:var(--bs-danger)}.vibe-wysiwyg-container.disabled[data-v-952f7269]{background-color:var(--bs-secondary-bg);opacity:.6;cursor:not-allowed}.vibe-wysiwyg-container[data-v-952f7269] .ql-container{border:none;font-size:1rem}.vibe-wysiwyg-container[data-v-952f7269] .ql-toolbar{border:none;border-bottom:1px solid var(--bs-border-color);border-top-left-radius:.375rem;border-top-right-radius:.375rem}.vibe-wysiwyg-container[data-v-952f7269] .ql-editor{min-height:150px}
1
+ .navbar.fixed-top[data-v-8228b170],.navbar.sticky-top[data-v-8228b170]{padding-top:env(safe-area-inset-top,0)}.navbar.fixed-bottom[data-v-8228b170]{padding-bottom:env(safe-area-inset-bottom,0)}.modal.show .modal-dialog.modal-fullscreen[data-v-c11ac690],.modal.show .modal-dialog.modal-fullscreen .modal-content[data-v-c11ac690]{height:100dvh}.modal-header[data-v-c11ac690]{padding-top:calc(1rem + env(safe-area-inset-top,0))}.modal-footer[data-v-c11ac690]{padding-bottom:calc(.75rem + env(safe-area-inset-bottom,0))}.offcanvas.offcanvas-start[data-v-f03bd194],.offcanvas.offcanvas-end[data-v-f03bd194]{height:100dvh}.offcanvas.offcanvas-top[data-v-f03bd194],.offcanvas.offcanvas-bottom[data-v-f03bd194]{max-height:100dvh}.offcanvas-header[data-v-f03bd194]{padding-top:calc(1rem + env(safe-area-inset-top,0))}.offcanvas-body[data-v-f03bd194]{padding-bottom:calc(1rem + env(safe-area-inset-bottom,0))}.vibe-datatable[data-v-c496dc70]{width:100%}.datatable-info[data-v-c496dc70]{padding:.5rem 0;color:var(--bs-secondary-color)}@media(max-width:767.98px){.vibe-table-stack[data-v-c496dc70],.vibe-table-stack tbody[data-v-c496dc70],.vibe-table-stack tr[data-v-c496dc70],.vibe-table-stack td[data-v-c496dc70]{display:block;width:100%}.vibe-table-stack thead[data-v-c496dc70]{display:none}.vibe-table-stack tr[data-v-c496dc70]{margin-bottom:1rem;border:1px solid var(--bs-border-color);border-radius:.375rem;background-color:var(--bs-body-bg)}.vibe-table-stack td[data-v-c496dc70]{text-align:right;padding:.5rem 1rem;position:relative;padding-left:50%;border-top:none;border-bottom:1px solid var(--bs-border-color)}.vibe-table-stack td[data-v-c496dc70]:last-child{border-bottom:none}.vibe-table-stack td[data-v-c496dc70]:before{content:attr(data-label);position:absolute;left:1rem;width:45%;text-align:left;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.input-group-vertical[data-v-49746a62]{flex-direction:column}.input-group-vertical[data-v-49746a62]>*{width:100%}.vibe-wysiwyg-container[data-v-822ccb91]{border:1px solid var(--bs-border-color);border-radius:.375rem}.vibe-wysiwyg-container.is-valid[data-v-822ccb91]{border-color:var(--bs-success)}.vibe-wysiwyg-container.is-invalid[data-v-822ccb91]{border-color:var(--bs-danger)}.vibe-wysiwyg-container.disabled[data-v-822ccb91]{background-color:var(--bs-secondary-bg);opacity:.6;cursor:not-allowed}.vibe-wysiwyg-container[data-v-822ccb91] .ql-container{border:none;font-size:1rem}.vibe-wysiwyg-container[data-v-822ccb91] .ql-toolbar{border:none;border-bottom:1px solid var(--bs-border-color);border-top-left-radius:.375rem;border-top-right-radius:.375rem}.vibe-wysiwyg-container[data-v-822ccb91] .ql-editor{min-height:150px}