npm - @ptlm-azulejo/sidebar - Versions diffs - 0.0.1-alpha.100 - Mend

@ptlm-azulejo/sidebar 0.0.1-alpha.100

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 (32) hide show

package/CHANGELOG.md ADDED Viewed

@@ -0,0 +1,4 @@
+# Change Log
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

package/README.md ADDED Viewed

@@ -0,0 +1,54 @@
+# Sidebar
+TODO: describe what the Sidebar component does and when to use it.
+## Installation
+```bash
+npm install @ptlm-azulejo/sidebar @ptlm-azulejo/themes
+# or
+yarn add @ptlm-azulejo/sidebar @ptlm-azulejo/themes
+```
+## Styles & theming
+The component reads theme CSS variables, so it needs `@ptlm-azulejo/themes`. Import a
+brand preset (it bundles the base tokens) and the component styles, then set the
+brand class on the root element:
+```js
+import '@ptlm-azulejo/themes/presets/leroy-merlin.css' // or /presets/adeo.css
+import '@ptlm-azulejo/sidebar/style.css'
+```
+```html
+<html class="preset-lm" data-theme="dark">
+```
+> Without a preset **and** the `.preset-*` class, the component renders uncolored.
+> See the [themes package](../themes/README.md) for brand switching, dark mode,
+> and custom brands.
+## Props
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| — | — | — | TODO: document the component props. |
+## Slots
+| Name | Description |
+| --- | --- |
+| `default` | The content displayed in the component. |
+## Basic Usage
+```vue
+<script setup>
+import { AzSidebar } from '@ptlm-azulejo/sidebar'
+</script>
+<template>
+  <AzSidebar>Content</AzSidebar>
+</template>
+```