@stsdti/approvable-vue 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 STSDTI
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,108 @@
+# @stsdti/approvable-vue
+
+Vue 3 components for [laravel-approvable](https://github.com/stsdti/laravel-approvable):
+approval trails, step actions, comments and the audit timeline.
+
+```bash
+npm install @stsdti/approvable-vue
+```
+
+Vue 3 is a peer dependency. All behaviour comes from `@stsdti/approvable-core`,
+which installs alongside.
+
+This package is **ESM only**: it publishes ES modules and no CommonJS build. Use
+`import`, or a dynamic `import()` from CommonJS.
+
+## Usage
+
+```js
+import { createApp } from 'vue'
+import ApprovableVue from '@stsdti/approvable-vue'
+import '@stsdti/approvable-vue/themes/approvable.css'
+
+app.use(ApprovableVue)
+```
+
+Or import components individually:
+
+```vue
+<script setup>
+import { Approvable } from '@stsdti/approvable-vue'
+</script>
+
+<template>
+  <Approvable :value="document" @refresh="reload" />
+</template>
+```
+
+`value` is the **resource** that carries the approval — a document, a request —
+not the approvable itself.
+
+## Theming
+
+The components ship unstyled and emit `.approvable-*` class names. One
+stylesheet — `themes/approvable.css` — gives them their look, in light and dark.
+
+Dark mode follows the viewer's system setting; an application with its own
+toggle stamps `data-theme="dark"` (or a `.dark` class) on an ancestor and the
+panel follows it, in either direction.
+
+A button's `icon` is a class name from the workflow definition, so the icon font
+is the application's to load — `examples/vue` uses
+[Tabler](https://tabler.io/icons) and workflow icons named `ti ti-check`.
+
+There is **no Tailwind dependency and no build step to configure** — you do not
+need to add this package to a Tailwind `content` glob. Every class it renders is
+styled by the stylesheet you import.
+
+Every colour, radius and shadow is a custom property, so changing one is a
+declaration rather than a rule:
+
+```css
+.approvable {
+  --approvable-accent: #16a34a;
+  --approvable-radius: 12px;
+}
+```
+
+To write a theme of your own, target the same class names — they are the public
+contract, and a React binding would emit exactly the same ones.
+
+## Links
+
+A button that navigates renders as a plain `<a>` by default, so the package
+works with no router installed. To use your router's link component:
+
+```js
+import { RouterLink } from 'vue-router'
+
+app.use(ApprovableVue, { linkComponent: RouterLink })
+```
+
+## Custom action buttons
+
+A button whose `action_ui` matches a registered renderer renders through it:
+
+```js
+import { registerApprovableActionRenderer } from '@stsdti/approvable-vue'
+
+registerApprovableActionRenderer('pdf-signature', SignatureButton)
+```
+
+The renderer receives `button`, `step`, `approvable`, `resource` and a
+`complete` callback to invoke when its own flow finishes.
+
+## Configuration
+
+Notifications and date formatting are configured on the core package:
+
+```js
+import { setApprovableNotifier, setApprovableClient, ApprovableClient, axiosAdapter } from '@stsdti/approvable-core'
+
+setApprovableNotifier({ success: toast.success, error: toast.error })
+setApprovableClient(new ApprovableClient({ adapter: axiosAdapter(axios) }))
+```
+
+## License
+
+MIT