@birdapi/velinstyle 0.7.0 → 0.9.0
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/README.de.md +135 -224
- package/README.md +134 -223
- package/cli/blueprint.js +8 -0
- package/cli/blueprints/bottom-nav-mobile.html +17 -0
- package/cli/blueprints/cookie-consent.html +9 -0
- package/cli/blueprints/empty-state.html +5 -0
- package/cli/blueprints/filter-bar.html +15 -0
- package/cli/blueprints/notification-center.html +13 -0
- package/cli/blueprints/onboarding.html +23 -0
- package/cli/blueprints/pricing-table.html +20 -0
- package/cli/blueprints/settings-panel.html +20 -0
- package/cli/cli-manifest.json +97 -0
- package/cli/docgen/extract-a11y.js +89 -0
- package/cli/docgen/extract-attributes.js +95 -0
- package/cli/docgen/extract-cli.js +50 -0
- package/cli/docgen/extract-components.js +175 -0
- package/cli/docgen/extract-meta.js +32 -0
- package/cli/docgen/extract-rules.js +76 -0
- package/cli/docgen/extract-tokens.js +79 -0
- package/cli/docgen/extract-utilities.js +75 -0
- package/cli/docgen/markdown.js +43 -0
- package/cli/docs-generate.js +196 -0
- package/cli/index.js +236 -5
- package/cli/layout-audit.js +325 -0
- package/cli/meta.js +97 -0
- package/cli/perf-audit.js +174 -0
- package/cli/pii-scanner.js +134 -0
- package/cli/scaffold-recipes.json +70 -0
- package/cli/scaffold.js +155 -0
- package/cli/scanner-rules-data.js +62 -0
- package/cli/scanner.js +136 -1
- package/cli/search-index.js +163 -0
- package/cli/tokens-build.js +21 -1
- package/cli/tokens-validate.js +69 -0
- package/components/a11y-entry.js +42 -0
- package/components/a11y-utils.js +71 -0
- package/components/focus-manager.js +45 -8
- package/components/index.js +40 -11
- package/components/runtime/component-loaders.js +43 -0
- package/components/runtime/index.js +77 -0
- package/components/runtime-entry.js +10 -0
- package/components/sanitize.js +135 -28
- package/components/shadow-a11y-styles.js +18 -0
- package/components/velin-accordion.js +12 -0
- package/components/velin-announcer.js +35 -0
- package/components/velin-bottom-nav.js +108 -0
- package/components/velin-carousel.js +2 -2
- package/components/velin-code-block.js +142 -0
- package/components/velin-combobox.js +149 -0
- package/components/velin-command.js +142 -0
- package/components/velin-copy.js +18 -5
- package/components/velin-counter.js +155 -0
- package/components/velin-dialog.js +9 -1
- package/components/velin-email.js +94 -0
- package/components/velin-flip.js +220 -0
- package/components/velin-icon.js +99 -22
- package/components/velin-lightbox.js +8 -3
- package/components/velin-live-dot.js +90 -0
- package/components/velin-menubar.js +83 -0
- package/components/velin-modal.js +6 -3
- package/components/velin-popover.js +34 -2
- package/components/velin-rating.js +91 -0
- package/components/velin-reveal.js +22 -0
- package/components/velin-scroll-top.js +1 -1
- package/components/velin-search.js +267 -0
- package/components/velin-secure-field.js +99 -0
- package/components/velin-segmented-control.js +108 -0
- package/components/velin-sheet.js +107 -0
- package/components/velin-sparkline.js +227 -0
- package/components/{velin-stepper-wc.js → velin-stepper.js} +37 -8
- package/components/velin-theme-toggle.js +284 -60
- package/components/velin-toast.js +4 -0
- package/components/{velin-tooltip-wc.js → velin-tooltip.js} +22 -3
- package/core/a11y/component-contracts.json +221 -0
- package/core/attributes/index.js +6 -0
- package/core/attributes/registry.js +268 -0
- package/core/highlight/highlight.js +114 -0
- package/core/highlight/index.js +29 -0
- package/core/highlight/languages/_utils.js +52 -0
- package/core/highlight/languages/blade.js +16 -0
- package/core/highlight/languages/css.js +26 -0
- package/core/highlight/languages/html.js +17 -0
- package/core/highlight/languages/js.js +58 -0
- package/core/highlight/languages/json.js +14 -0
- package/core/highlight/languages/markdown.js +16 -0
- package/core/highlight/languages/php.js +39 -0
- package/core/highlight/languages/plain.js +7 -0
- package/core/highlight/languages/shell.js +33 -0
- package/core/highlight/languages/sql.js +20 -0
- package/core/highlight/languages/typescript.js +28 -0
- package/core/highlight/observe.js +53 -0
- package/core/highlight/registry.js +107 -0
- package/core/highlight/render.js +35 -0
- package/core/highlight/types.js +28 -0
- package/core/meta/build.js +293 -0
- package/core/meta/index.js +17 -0
- package/core/meta/schema.js +49 -0
- package/core/motion/effects.js +54 -0
- package/core/motion/index.js +76 -0
- package/core/motion/scheduler.js +72 -0
- package/core/motion/scroll.js +32 -0
- package/core/motion/stagger.js +24 -0
- package/core/search/docs-url.js +96 -0
- package/core/search/engine.js +139 -0
- package/core/search/highlight.js +48 -0
- package/core/search/index.js +126 -0
- package/core/search/providers.js +36 -0
- package/core/search/types.js +61 -0
- package/core/search/worker-client.js +56 -0
- package/core/search/worker.js +20 -0
- package/dist/chunks/a11y-utils-IRC7LOPF.js +16 -0
- package/dist/chunks/attributes-3BZLI7XF.js +364 -0
- package/dist/chunks/attributes-4N5JP4CG.js +364 -0
- package/dist/chunks/attributes-5Q2WXGRC.js +374 -0
- package/dist/chunks/attributes-AIR7SVLK.js +364 -0
- package/dist/chunks/attributes-BGRN5XZO.js +364 -0
- package/dist/chunks/attributes-BVSQAYLR.js +364 -0
- package/dist/chunks/attributes-CDYFUY7Y.js +364 -0
- package/dist/chunks/attributes-JMYJZBPE.js +364 -0
- package/dist/chunks/attributes-R5JY3X4O.js +374 -0
- package/dist/chunks/attributes-STYCS3O5.js +391 -0
- package/dist/chunks/attributes-TNSPQTHX.js +374 -0
- package/dist/chunks/attributes-TPANLMLF.js +391 -0
- package/dist/chunks/blade-LIQLVKZQ.js +19 -0
- package/dist/chunks/browser-MRKYZPEH.js +1149 -0
- package/dist/chunks/chunk-2354NEBP.js +109 -0
- package/dist/chunks/chunk-2VNA7G7S.js +109 -0
- package/dist/chunks/chunk-42VVPW6N.js +132 -0
- package/dist/chunks/chunk-7FFAMRFV.js +44 -0
- package/dist/chunks/chunk-7MCGPHVC.js +69 -0
- package/dist/chunks/chunk-AQLRJSGG.js +109 -0
- package/dist/chunks/chunk-EWPSDMQT.js +109 -0
- package/dist/chunks/chunk-F7OLHTGX.js +22 -0
- package/dist/chunks/chunk-J472ERN2.js +242 -0
- package/dist/chunks/chunk-LA7264K4.js +85 -0
- package/dist/chunks/chunk-M5CHQVP6.js +61 -0
- package/dist/chunks/chunk-MKZP2TBH.js +89 -0
- package/dist/chunks/chunk-QTJJ3DPO.js +109 -0
- package/dist/chunks/chunk-RDE3QE7Z.js +89 -0
- package/dist/chunks/chunk-RSMRR27R.js +109 -0
- package/dist/chunks/chunk-RZQVWFHW.js +109 -0
- package/dist/chunks/chunk-SRL6EWHP.js +109 -0
- package/dist/chunks/chunk-U4XHMZ7D.js +109 -0
- package/dist/chunks/chunk-V5YIUA6G.js +109 -0
- package/dist/chunks/chunk-XIET2VSZ.js +109 -0
- package/dist/chunks/chunk-XYLJ2GCB.js +205 -0
- package/dist/chunks/chunk-Z4JYQ2XX.js +51 -0
- package/dist/chunks/chunk-ZPSPKUYD.js +109 -0
- package/dist/chunks/css-MQ5YU77P.js +28 -0
- package/dist/chunks/highlight-GJHHV4KM.js +37 -0
- package/dist/chunks/highlight-XTHRKBA3.js +37 -0
- package/dist/chunks/html-ZODC4DLQ.js +20 -0
- package/dist/chunks/js-MNSNYTJU.js +7 -0
- package/dist/chunks/json-VEM2HFH3.js +17 -0
- package/dist/chunks/markdown-E7OPGS3S.js +19 -0
- package/dist/chunks/php-MLL7T3LT.js +41 -0
- package/dist/chunks/plain-LJJDC5TN.js +8 -0
- package/dist/chunks/runtime-entry.js +14 -0
- package/dist/chunks/shell-QTRK4U4E.js +35 -0
- package/dist/chunks/sql-PPWLHGJ2.js +23 -0
- package/dist/chunks/typescript-JT3CCYWL.js +30 -0
- package/dist/chunks/velin-accordion-FBIPAEXG.js +105 -0
- package/dist/chunks/velin-accordion-QAQO7BI7.js +117 -0
- package/dist/chunks/velin-announcer-PVTXXCWR.js +33 -0
- package/dist/chunks/velin-bottom-nav-2N2TYWOF.js +86 -0
- package/dist/chunks/velin-bottom-nav-7GEMPIM6.js +86 -0
- package/dist/chunks/velin-bottom-nav-CTU6FFZV.js +101 -0
- package/dist/chunks/velin-bottom-nav-N3DFQR66.js +86 -0
- package/dist/chunks/velin-carousel-Y5VCOABZ.js +213 -0
- package/dist/chunks/velin-carousel-ZTBANFQQ.js +213 -0
- package/dist/chunks/velin-code-block-ASUBTAQV.js +119 -0
- package/dist/chunks/velin-code-block-CIAURDRJ.js +132 -0
- package/dist/chunks/velin-code-block-TSUKPY4C.js +123 -0
- package/dist/chunks/velin-code-block-Y6CM726Q.js +119 -0
- package/dist/chunks/velin-collapse-5XYBUIID.js +80 -0
- package/dist/chunks/velin-combobox-2KDTCQ7N.js +155 -0
- package/dist/chunks/velin-combobox-NXS4QB4R.js +155 -0
- package/dist/chunks/velin-combobox-UGA56HP3.js +155 -0
- package/dist/chunks/velin-command-CKDNO4BW.js +148 -0
- package/dist/chunks/velin-command-M7RNHUPR.js +136 -0
- package/dist/chunks/velin-command-ONKO2A3J.js +136 -0
- package/dist/chunks/velin-command-TMLSRGIU.js +136 -0
- package/dist/chunks/velin-copy-G2TZ5YBB.js +81 -0
- package/dist/chunks/velin-copy-NYDBOKXT.js +81 -0
- package/dist/chunks/velin-copy-T5KDTDXP.js +81 -0
- package/dist/chunks/velin-countdown-4ZVDGK4R.js +101 -0
- package/dist/chunks/velin-countdown-5XSTN3BH.js +101 -0
- package/dist/chunks/velin-countdown-7AIY66CU.js +101 -0
- package/dist/chunks/velin-counter-ISCTEAHI.js +118 -0
- package/dist/chunks/velin-counter-L5FYJF7A.js +121 -0
- package/dist/chunks/velin-dialog-D2GUHSCD.js +144 -0
- package/dist/chunks/velin-dialog-ELFOZIXZ.js +152 -0
- package/dist/chunks/velin-dialog-GTTZI564.js +147 -0
- package/dist/chunks/velin-dialog-IJLFDXAJ.js +144 -0
- package/dist/chunks/velin-dialog-TNS3WXMB.js +144 -0
- package/dist/chunks/velin-drawer-BE6TYN3H.js +130 -0
- package/dist/chunks/velin-drawer-DLL2GLT6.js +130 -0
- package/dist/chunks/velin-drawer-MJS6WCF7.js +130 -0
- package/dist/chunks/velin-dropdown-PLUIFA5M.js +172 -0
- package/dist/chunks/velin-email-N5B5ZYTE.js +90 -0
- package/dist/chunks/velin-email-NTM6DG3V.js +90 -0
- package/dist/chunks/velin-email-RBX6ZR4S.js +90 -0
- package/dist/chunks/velin-haptic-4QQTM3RK.js +50 -0
- package/dist/chunks/velin-icon-7M76DOPB.js +164 -0
- package/dist/chunks/velin-icon-KZO3IEHG.js +164 -0
- package/dist/chunks/velin-icon-WTFPG2DD.js +191 -0
- package/dist/chunks/velin-icon-ZTSKUOVN.js +193 -0
- package/dist/chunks/velin-lightbox-6E7CAATP.js +149 -0
- package/dist/chunks/velin-lightbox-I75U6JF4.js +140 -0
- package/dist/chunks/velin-lightbox-QOTB4PRL.js +140 -0
- package/dist/chunks/velin-lightbox-UCD6N7HF.js +140 -0
- package/dist/chunks/velin-live-dot-RJHX2DGY.js +74 -0
- package/dist/chunks/velin-live-dot-XHUZCIDZ.js +67 -0
- package/dist/chunks/velin-menubar-I426AED2.js +86 -0
- package/dist/chunks/velin-menubar-J66JXRWW.js +86 -0
- package/dist/chunks/velin-menubar-SFEXJE56.js +86 -0
- package/dist/chunks/velin-modal-2HOBXE6F.js +176 -0
- package/dist/chunks/velin-modal-5HYNNNUI.js +176 -0
- package/dist/chunks/velin-modal-AEOTZ67O.js +177 -0
- package/dist/chunks/velin-modal-GLI2XZZB.js +176 -0
- package/dist/chunks/velin-persist-DFPL3QP4.js +110 -0
- package/dist/chunks/velin-popover-EXINRIGJ.js +145 -0
- package/dist/chunks/velin-popover-HQW6Q2Y6.js +172 -0
- package/dist/chunks/velin-popover-OXX7MRZ6.js +145 -0
- package/dist/chunks/velin-popover-T72HK3DF.js +151 -0
- package/dist/chunks/velin-popover-YKCCROJG.js +145 -0
- package/dist/chunks/velin-progress-ring-E4YRLZHH.js +66 -0
- package/dist/chunks/velin-rating-6CDBI6DG.js +91 -0
- package/dist/chunks/velin-rating-N4DI2XNL.js +91 -0
- package/dist/chunks/velin-rating-XRQJV4LO.js +91 -0
- package/dist/chunks/velin-scroll-top-F2FCZNYD.js +58 -0
- package/dist/chunks/velin-scroll-top-OHYVVHHY.js +58 -0
- package/dist/chunks/velin-scrollspy-OKCT4FDV.js +50 -0
- package/dist/chunks/velin-search-2XRQFBCS.js +556 -0
- package/dist/chunks/velin-search-4YHJWYSS.js +556 -0
- package/dist/chunks/velin-search-7B4KJ6TX.js +557 -0
- package/dist/chunks/velin-search-LWHY23Q5.js +474 -0
- package/dist/chunks/velin-secure-field-6PV7RZDJ.js +95 -0
- package/dist/chunks/velin-secure-field-H7FSBUJW.js +95 -0
- package/dist/chunks/velin-secure-field-OFNAXCDP.js +95 -0
- package/dist/chunks/velin-segmented-control-EKL4E3BL.js +109 -0
- package/dist/chunks/velin-segmented-control-GYD5BIXQ.js +109 -0
- package/dist/chunks/velin-segmented-control-PQX6LKOJ.js +109 -0
- package/dist/chunks/velin-sheet-3OGI4HD7.js +119 -0
- package/dist/chunks/velin-sheet-OUK6572T.js +119 -0
- package/dist/chunks/velin-sheet-R2Y67X6H.js +119 -0
- package/dist/chunks/velin-sparkline-GVEANJVW.js +184 -0
- package/dist/chunks/velin-sparkline-KDA3GQAN.js +162 -0
- package/dist/chunks/velin-sparkline-XVTFC6GE.js +181 -0
- package/dist/chunks/velin-stepper-2ZIHLKGM.js +141 -0
- package/dist/chunks/velin-stepper-7ECRUYHD.js +148 -0
- package/dist/chunks/velin-stepper-FYEUEWE6.js +141 -0
- package/dist/chunks/velin-stepper-X54WGHDG.js +141 -0
- package/dist/chunks/velin-stepper-wc-QU3KRVQR.js +133 -0
- package/dist/chunks/velin-tabs-5UQ5ZVMV.js +138 -0
- package/dist/chunks/velin-theme-toggle-32J2CBNC.js +291 -0
- package/dist/chunks/velin-theme-toggle-BNNS7WLV.js +285 -0
- package/dist/chunks/velin-theme-toggle-NO7V4TWI.js +285 -0
- package/dist/chunks/velin-theme-toggle-QELCJM2Q.js +291 -0
- package/dist/chunks/velin-toast-OMMOA2DK.js +109 -0
- package/dist/chunks/velin-toast-RCZ4CSUC.js +109 -0
- package/dist/chunks/velin-toast-RSF2IHT3.js +113 -0
- package/dist/chunks/velin-toast-WEUBTJG6.js +109 -0
- package/dist/chunks/velin-tooltip-664IOHZA.js +112 -0
- package/dist/chunks/velin-tooltip-BDHGRTQB.js +112 -0
- package/dist/chunks/velin-tooltip-HVUOKNVX.js +112 -0
- package/dist/chunks/velin-tooltip-wc-LXDVT6DE.js +103 -0
- package/dist/chunks/worker-client-R6DBYPFT.js +46 -0
- package/dist/llms.test.txt +40 -0
- package/dist/llms.txt +40 -0
- package/dist/search-index.json +1773 -0
- package/dist/search-index.test.json +1773 -0
- package/dist/themes/brutalist.min.css +1 -1
- package/dist/themes/midnight.min.css +1 -1
- package/dist/themes/pastel.min.css +1 -1
- package/dist/themes/retro.min.css +1 -1
- package/dist/themes/sunset.min.css +1 -1
- package/dist/velin-agent.json +684 -0
- package/dist/velin-agent.test.json +684 -0
- package/dist/velinstyle-components.iife.js +7959 -2199
- package/dist/velinstyle-components.js +7982 -2174
- package/dist/velinstyle-components.min.js +521 -90
- package/dist/velinstyle.css +1290 -282
- package/dist/velinstyle.d.ts +54 -0
- package/dist/velinstyle.min.css +1 -1
- package/examples/search-index.schema.json +33 -0
- package/package.json +57 -10
- package/src/a11y/authentication.css +37 -0
- package/src/a11y/consistent-help.css +22 -0
- package/src/a11y/dragging-alternatives.css +30 -0
- package/src/a11y/focus-appearance.css +20 -0
- package/src/a11y/high-contrast-aaa.css +16 -26
- package/src/a11y/security.css +18 -0
- package/src/a11y/skip-link.css +3 -1
- package/src/a11y/sr-only.css +1 -1
- package/src/base/reset.css +0 -25
- package/src/base/wc-placeholder.css +102 -0
- package/src/components/attributes.css +42 -0
- package/src/components/highlight.css +182 -0
- package/src/components/input-group.css +1 -2
- package/src/components/nav.css +151 -151
- package/src/components/search.css +95 -0
- package/src/components/stepper.css +2 -4
- package/src/components/timeline.css +1 -2
- package/src/components/tooltip.css +2 -4
- package/src/layout/container.css +5 -5
- package/src/layout/grid.css +8 -8
- package/src/layout/patterns.css +5 -5
- package/src/themes/brutalist.css +2 -11
- package/src/themes/corporate.css +0 -9
- package/src/themes/earth.css +0 -9
- package/src/themes/forest.css +0 -9
- package/src/themes/midnight.css +1 -10
- package/src/themes/neon.css +0 -9
- package/src/themes/nordic.css +0 -9
- package/src/themes/ocean.css +0 -9
- package/src/themes/pastel.css +1 -10
- package/src/themes/retro.css +2 -11
- package/src/themes/sharp.css +0 -7
- package/src/themes/soft.css +0 -7
- package/src/themes/sunset.css +1 -10
- package/src/tokens/color.css +45 -46
- package/src/tokens/fonts.css +10 -0
- package/src/tokens/motion.css +7 -0
- package/src/tokens/typography.css +4 -5
- package/src/utilities/animation.css +99 -3
- package/src/utilities/chart-animation.css +101 -0
- package/src/utilities/display.css +3 -3
- package/src/utilities/divide.css +2 -6
- package/src/utilities/filter-effects.css +103 -0
- package/src/utilities/responsive.css +4 -4
- package/src/utilities/safe-area.css +39 -0
- package/src/utilities/scroll-animation.css +34 -0
- package/src/utilities/spacing.css +17 -8
- package/src/utilities/text.css +4 -1
- package/src/velinstyle.css +12 -0
|
@@ -0,0 +1,109 @@
|
|
|
1
|
+
import {
|
|
2
|
+
escapeHTML
|
|
3
|
+
} from "./chunk-MKZP2TBH.js";
|
|
4
|
+
|
|
5
|
+
// components/velin-toast.js
|
|
6
|
+
var styles = `
|
|
7
|
+
:host {
|
|
8
|
+
position: fixed;
|
|
9
|
+
z-index: var(--velin-z-toast, 600);
|
|
10
|
+
inset-block-end: var(--velin-space-4, 1rem);
|
|
11
|
+
inset-inline-end: var(--velin-space-4, 1rem);
|
|
12
|
+
display: flex;
|
|
13
|
+
flex-direction: column-reverse;
|
|
14
|
+
gap: var(--velin-space-2, 0.5rem);
|
|
15
|
+
pointer-events: none;
|
|
16
|
+
max-inline-size: min(24rem, calc(100vw - 2rem));
|
|
17
|
+
}
|
|
18
|
+
.toast {
|
|
19
|
+
display: flex;
|
|
20
|
+
align-items: flex-start;
|
|
21
|
+
gap: var(--velin-space-3, 0.75rem);
|
|
22
|
+
padding: var(--velin-space-3, 0.75rem) var(--velin-space-4, 1rem);
|
|
23
|
+
background: var(--velin-color-surface-bright, #fff);
|
|
24
|
+
border: 1px solid var(--velin-color-border, #ddd);
|
|
25
|
+
border-radius: var(--velin-radius-md, 0.5rem);
|
|
26
|
+
box-shadow: var(--velin-shadow-lg, 0 10px 15px rgba(0,0,0,0.08));
|
|
27
|
+
pointer-events: auto;
|
|
28
|
+
animation: velin-toast-in 200ms ease forwards;
|
|
29
|
+
font-size: var(--velin-text-base, 1rem);
|
|
30
|
+
color: var(--velin-color-text, #111);
|
|
31
|
+
}
|
|
32
|
+
.toast--success { border-inline-start: 4px solid var(--velin-color-success, #16a34a); }
|
|
33
|
+
.toast--warning { border-inline-start: 4px solid var(--velin-color-warning, #ca8a04); }
|
|
34
|
+
.toast--danger { border-inline-start: 4px solid var(--velin-color-danger, #dc2626); }
|
|
35
|
+
.toast--info { border-inline-start: 4px solid var(--velin-color-info, #2563eb); }
|
|
36
|
+
.toast-content { flex: 1; }
|
|
37
|
+
.toast-close {
|
|
38
|
+
min-width: 2rem;
|
|
39
|
+
min-height: 2rem;
|
|
40
|
+
display: inline-flex;
|
|
41
|
+
align-items: center;
|
|
42
|
+
justify-content: center;
|
|
43
|
+
background: none;
|
|
44
|
+
border: none;
|
|
45
|
+
cursor: pointer;
|
|
46
|
+
color: var(--velin-color-text-muted, #666);
|
|
47
|
+
border-radius: var(--velin-radius-sm, 0.25rem);
|
|
48
|
+
font-size: 1.25rem;
|
|
49
|
+
line-height: 1;
|
|
50
|
+
}
|
|
51
|
+
.toast-close:hover {
|
|
52
|
+
background: var(--velin-color-surface-dim, #eee);
|
|
53
|
+
}
|
|
54
|
+
.toast--out {
|
|
55
|
+
animation: velin-toast-out 200ms ease forwards;
|
|
56
|
+
}
|
|
57
|
+
@keyframes velin-toast-in {
|
|
58
|
+
from { opacity: 0; transform: translateX(1rem); }
|
|
59
|
+
to { opacity: 1; transform: translateX(0); }
|
|
60
|
+
}
|
|
61
|
+
@keyframes velin-toast-out {
|
|
62
|
+
from { opacity: 1; transform: translateX(0); }
|
|
63
|
+
to { opacity: 0; transform: translateX(1rem); }
|
|
64
|
+
}
|
|
65
|
+
@media (prefers-reduced-motion: reduce) {
|
|
66
|
+
.toast, .toast--out { animation: none; }
|
|
67
|
+
}
|
|
68
|
+
`;
|
|
69
|
+
var VelinToast = class extends HTMLElement {
|
|
70
|
+
constructor() {
|
|
71
|
+
super();
|
|
72
|
+
this.attachShadow({ mode: "open" });
|
|
73
|
+
this._container = null;
|
|
74
|
+
}
|
|
75
|
+
connectedCallback() {
|
|
76
|
+
this.shadowRoot.innerHTML = `<style>${styles}</style>`;
|
|
77
|
+
this._container = this.shadowRoot;
|
|
78
|
+
this.setAttribute("role", "status");
|
|
79
|
+
this.setAttribute("aria-live", "polite");
|
|
80
|
+
this.setAttribute("aria-atomic", "true");
|
|
81
|
+
}
|
|
82
|
+
show({ message, type = "info", duration = 5e3 } = {}) {
|
|
83
|
+
const toast = document.createElement("div");
|
|
84
|
+
toast.className = `toast toast--${type}`;
|
|
85
|
+
toast.innerHTML = `
|
|
86
|
+
<div class="toast-content">${escapeHTML(message)}</div>
|
|
87
|
+
<button class="toast-close" aria-label="Close">×</button>
|
|
88
|
+
`;
|
|
89
|
+
toast.querySelector(".toast-close").addEventListener("click", () => {
|
|
90
|
+
this._dismiss(toast);
|
|
91
|
+
});
|
|
92
|
+
this._container.appendChild(toast);
|
|
93
|
+
if (duration > 0) {
|
|
94
|
+
setTimeout(() => this._dismiss(toast), duration);
|
|
95
|
+
}
|
|
96
|
+
return toast;
|
|
97
|
+
}
|
|
98
|
+
_dismiss(toast) {
|
|
99
|
+
if (!toast || !toast.parentNode) return;
|
|
100
|
+
toast.classList.add("toast--out");
|
|
101
|
+
toast.addEventListener("animationend", () => toast.remove(), { once: true });
|
|
102
|
+
setTimeout(() => toast.remove(), 300);
|
|
103
|
+
}
|
|
104
|
+
};
|
|
105
|
+
customElements.define("velin-toast", VelinToast);
|
|
106
|
+
var velin_toast_default = VelinToast;
|
|
107
|
+
export {
|
|
108
|
+
velin_toast_default as default
|
|
109
|
+
};
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
import {
|
|
2
|
+
escapeHTML
|
|
3
|
+
} from "./chunk-MKZP2TBH.js";
|
|
4
|
+
|
|
5
|
+
// components/velin-tooltip.js
|
|
6
|
+
var styles = `
|
|
7
|
+
:host { position: relative; display: inline-block; }
|
|
8
|
+
.tip {
|
|
9
|
+
position: absolute; z-index: var(--velin-z-tooltip, 700);
|
|
10
|
+
padding: var(--velin-space-2, 0.5rem) var(--velin-space-3, 0.75rem);
|
|
11
|
+
font-size: var(--velin-text-sm, 0.875rem);
|
|
12
|
+
color: var(--velin-color-on-primary, #fff);
|
|
13
|
+
background: var(--velin-color-text, #1a1a2e);
|
|
14
|
+
border-radius: var(--velin-radius-md, 0.375rem);
|
|
15
|
+
white-space: nowrap; pointer-events: none;
|
|
16
|
+
opacity: 0; transition: opacity 150ms ease;
|
|
17
|
+
max-inline-size: 20rem; white-space: normal;
|
|
18
|
+
}
|
|
19
|
+
:host([visible]) .tip { opacity: 1; }
|
|
20
|
+
.tip[data-placement="top"] { bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
21
|
+
.tip[data-placement="bottom"] { top: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
22
|
+
.tip[data-placement="start"] { right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
23
|
+
.tip[data-placement="end"] { left: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
24
|
+
@media (prefers-reduced-motion: reduce) { .tip { transition: none; } }
|
|
25
|
+
`;
|
|
26
|
+
var tooltipId = 0;
|
|
27
|
+
var VelinTooltip = class extends HTMLElement {
|
|
28
|
+
static get observedAttributes() {
|
|
29
|
+
return ["content", "placement"];
|
|
30
|
+
}
|
|
31
|
+
constructor() {
|
|
32
|
+
super();
|
|
33
|
+
this.attachShadow({ mode: "open" });
|
|
34
|
+
this._tipId = `velin-tooltip-${++tooltipId}`;
|
|
35
|
+
}
|
|
36
|
+
connectedCallback() {
|
|
37
|
+
const placement = this.getAttribute("placement") || "top";
|
|
38
|
+
const D = "div";
|
|
39
|
+
this.shadowRoot.innerHTML = `
|
|
40
|
+
<style>${styles}</style>
|
|
41
|
+
<slot></slot>
|
|
42
|
+
<${D} class="tip" id="${this._tipId}" role="tooltip" data-placement="${escapeHTML(placement)}" part="tip">${escapeHTML(this.getAttribute("content") || "")}</${D}>
|
|
43
|
+
`;
|
|
44
|
+
this.addEventListener("mouseenter", () => this._show());
|
|
45
|
+
this.addEventListener("mouseleave", () => this._hide());
|
|
46
|
+
this.addEventListener("focusin", () => this._show());
|
|
47
|
+
this.addEventListener("focusout", () => this._hide());
|
|
48
|
+
this.addEventListener("keydown", (e) => {
|
|
49
|
+
if (e.key === "Escape") this._hide();
|
|
50
|
+
});
|
|
51
|
+
const slot = this.shadowRoot.querySelector("slot");
|
|
52
|
+
slot.addEventListener("slotchange", () => this._linkTrigger());
|
|
53
|
+
this._linkTrigger();
|
|
54
|
+
}
|
|
55
|
+
_linkTrigger() {
|
|
56
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
57
|
+
if (!trigger) return;
|
|
58
|
+
if (this.hasAttribute("visible")) {
|
|
59
|
+
trigger.setAttribute("aria-describedby", this._tipId);
|
|
60
|
+
} else {
|
|
61
|
+
trigger.removeAttribute("aria-describedby");
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
_show() {
|
|
65
|
+
this.setAttribute("visible", "");
|
|
66
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
67
|
+
if (trigger) trigger.setAttribute("aria-describedby", this._tipId);
|
|
68
|
+
this._flip();
|
|
69
|
+
}
|
|
70
|
+
_hide() {
|
|
71
|
+
this.removeAttribute("visible");
|
|
72
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
73
|
+
if (trigger) trigger.removeAttribute("aria-describedby");
|
|
74
|
+
}
|
|
75
|
+
_flip() {
|
|
76
|
+
const tip = this.shadowRoot.querySelector(".tip");
|
|
77
|
+
if (!tip) return;
|
|
78
|
+
const rect = tip.getBoundingClientRect();
|
|
79
|
+
const placement = this.getAttribute("placement") || "top";
|
|
80
|
+
if (placement === "top" && rect.top < 0) tip.setAttribute("data-placement", "bottom");
|
|
81
|
+
else if (placement === "bottom" && rect.bottom > window.innerHeight) tip.setAttribute("data-placement", "top");
|
|
82
|
+
else tip.setAttribute("data-placement", placement);
|
|
83
|
+
}
|
|
84
|
+
attributeChangedCallback(name, _, val) {
|
|
85
|
+
const tip = this.shadowRoot?.querySelector(".tip");
|
|
86
|
+
if (!tip) return;
|
|
87
|
+
if (name === "content") tip.textContent = val;
|
|
88
|
+
if (name === "placement") tip.setAttribute("data-placement", val);
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var VelinTooltipWC = class _VelinTooltipWC extends VelinTooltip {
|
|
92
|
+
static _warned = false;
|
|
93
|
+
connectedCallback() {
|
|
94
|
+
if (!_VelinTooltipWC._warned && typeof console !== "undefined" && console.warn) {
|
|
95
|
+
_VelinTooltipWC._warned = true;
|
|
96
|
+
console.warn("[velinstyle] <velin-tooltip-wc> is deprecated; use <velin-tooltip> instead.");
|
|
97
|
+
}
|
|
98
|
+
super.connectedCallback();
|
|
99
|
+
}
|
|
100
|
+
};
|
|
101
|
+
if (!customElements.get("velin-tooltip")) {
|
|
102
|
+
customElements.define("velin-tooltip", VelinTooltip);
|
|
103
|
+
}
|
|
104
|
+
if (!customElements.get("velin-tooltip-wc")) {
|
|
105
|
+
customElements.define("velin-tooltip-wc", VelinTooltipWC);
|
|
106
|
+
}
|
|
107
|
+
var velin_tooltip_default = VelinTooltip;
|
|
108
|
+
export {
|
|
109
|
+
VelinTooltip,
|
|
110
|
+
VelinTooltipWC,
|
|
111
|
+
velin_tooltip_default as default
|
|
112
|
+
};
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
import {
|
|
2
|
+
escapeHTML
|
|
3
|
+
} from "./chunk-LA7264K4.js";
|
|
4
|
+
|
|
5
|
+
// components/velin-tooltip.js
|
|
6
|
+
var styles = `
|
|
7
|
+
:host { position: relative; display: inline-block; }
|
|
8
|
+
.tip {
|
|
9
|
+
position: absolute; z-index: var(--velin-z-tooltip, 700);
|
|
10
|
+
padding: var(--velin-space-2, 0.5rem) var(--velin-space-3, 0.75rem);
|
|
11
|
+
font-size: var(--velin-text-sm, 0.875rem);
|
|
12
|
+
color: var(--velin-color-on-primary, #fff);
|
|
13
|
+
background: var(--velin-color-text, #1a1a2e);
|
|
14
|
+
border-radius: var(--velin-radius-md, 0.375rem);
|
|
15
|
+
white-space: nowrap; pointer-events: none;
|
|
16
|
+
opacity: 0; transition: opacity 150ms ease;
|
|
17
|
+
max-inline-size: 20rem; white-space: normal;
|
|
18
|
+
}
|
|
19
|
+
:host([visible]) .tip { opacity: 1; }
|
|
20
|
+
.tip[data-placement="top"] { bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
21
|
+
.tip[data-placement="bottom"] { top: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
22
|
+
.tip[data-placement="start"] { right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
23
|
+
.tip[data-placement="end"] { left: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
24
|
+
@media (prefers-reduced-motion: reduce) { .tip { transition: none; } }
|
|
25
|
+
`;
|
|
26
|
+
var tooltipId = 0;
|
|
27
|
+
var VelinTooltip = class extends HTMLElement {
|
|
28
|
+
static get observedAttributes() {
|
|
29
|
+
return ["content", "placement"];
|
|
30
|
+
}
|
|
31
|
+
constructor() {
|
|
32
|
+
super();
|
|
33
|
+
this.attachShadow({ mode: "open" });
|
|
34
|
+
this._tipId = `velin-tooltip-${++tooltipId}`;
|
|
35
|
+
}
|
|
36
|
+
connectedCallback() {
|
|
37
|
+
const placement = this.getAttribute("placement") || "top";
|
|
38
|
+
const D = "div";
|
|
39
|
+
this.shadowRoot.innerHTML = `
|
|
40
|
+
<style>${styles}</style>
|
|
41
|
+
<slot></slot>
|
|
42
|
+
<${D} class="tip" id="${this._tipId}" role="tooltip" data-placement="${escapeHTML(placement)}" part="tip">${escapeHTML(this.getAttribute("content") || "")}</${D}>
|
|
43
|
+
`;
|
|
44
|
+
this.addEventListener("mouseenter", () => this._show());
|
|
45
|
+
this.addEventListener("mouseleave", () => this._hide());
|
|
46
|
+
this.addEventListener("focusin", () => this._show());
|
|
47
|
+
this.addEventListener("focusout", () => this._hide());
|
|
48
|
+
this.addEventListener("keydown", (e) => {
|
|
49
|
+
if (e.key === "Escape") this._hide();
|
|
50
|
+
});
|
|
51
|
+
const slot = this.shadowRoot.querySelector("slot");
|
|
52
|
+
slot.addEventListener("slotchange", () => this._linkTrigger());
|
|
53
|
+
this._linkTrigger();
|
|
54
|
+
}
|
|
55
|
+
_linkTrigger() {
|
|
56
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
57
|
+
if (!trigger) return;
|
|
58
|
+
if (this.hasAttribute("visible")) {
|
|
59
|
+
trigger.setAttribute("aria-describedby", this._tipId);
|
|
60
|
+
} else {
|
|
61
|
+
trigger.removeAttribute("aria-describedby");
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
_show() {
|
|
65
|
+
this.setAttribute("visible", "");
|
|
66
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
67
|
+
if (trigger) trigger.setAttribute("aria-describedby", this._tipId);
|
|
68
|
+
this._flip();
|
|
69
|
+
}
|
|
70
|
+
_hide() {
|
|
71
|
+
this.removeAttribute("visible");
|
|
72
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
73
|
+
if (trigger) trigger.removeAttribute("aria-describedby");
|
|
74
|
+
}
|
|
75
|
+
_flip() {
|
|
76
|
+
const tip = this.shadowRoot.querySelector(".tip");
|
|
77
|
+
if (!tip) return;
|
|
78
|
+
const rect = tip.getBoundingClientRect();
|
|
79
|
+
const placement = this.getAttribute("placement") || "top";
|
|
80
|
+
if (placement === "top" && rect.top < 0) tip.setAttribute("data-placement", "bottom");
|
|
81
|
+
else if (placement === "bottom" && rect.bottom > window.innerHeight) tip.setAttribute("data-placement", "top");
|
|
82
|
+
else tip.setAttribute("data-placement", placement);
|
|
83
|
+
}
|
|
84
|
+
attributeChangedCallback(name, _, val) {
|
|
85
|
+
const tip = this.shadowRoot?.querySelector(".tip");
|
|
86
|
+
if (!tip) return;
|
|
87
|
+
if (name === "content") tip.textContent = val;
|
|
88
|
+
if (name === "placement") tip.setAttribute("data-placement", val);
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var VelinTooltipWC = class _VelinTooltipWC extends VelinTooltip {
|
|
92
|
+
static _warned = false;
|
|
93
|
+
connectedCallback() {
|
|
94
|
+
if (!_VelinTooltipWC._warned && typeof console !== "undefined" && console.warn) {
|
|
95
|
+
_VelinTooltipWC._warned = true;
|
|
96
|
+
console.warn("[velinstyle] <velin-tooltip-wc> is deprecated; use <velin-tooltip> instead.");
|
|
97
|
+
}
|
|
98
|
+
super.connectedCallback();
|
|
99
|
+
}
|
|
100
|
+
};
|
|
101
|
+
if (!customElements.get("velin-tooltip")) {
|
|
102
|
+
customElements.define("velin-tooltip", VelinTooltip);
|
|
103
|
+
}
|
|
104
|
+
if (!customElements.get("velin-tooltip-wc")) {
|
|
105
|
+
customElements.define("velin-tooltip-wc", VelinTooltipWC);
|
|
106
|
+
}
|
|
107
|
+
var velin_tooltip_default = VelinTooltip;
|
|
108
|
+
export {
|
|
109
|
+
VelinTooltip,
|
|
110
|
+
VelinTooltipWC,
|
|
111
|
+
velin_tooltip_default as default
|
|
112
|
+
};
|
|
@@ -0,0 +1,112 @@
|
|
|
1
|
+
import {
|
|
2
|
+
escapeHTML
|
|
3
|
+
} from "./chunk-RDE3QE7Z.js";
|
|
4
|
+
|
|
5
|
+
// components/velin-tooltip.js
|
|
6
|
+
var styles = `
|
|
7
|
+
:host { position: relative; display: inline-block; }
|
|
8
|
+
.tip {
|
|
9
|
+
position: absolute; z-index: var(--velin-z-tooltip, 700);
|
|
10
|
+
padding: var(--velin-space-2, 0.5rem) var(--velin-space-3, 0.75rem);
|
|
11
|
+
font-size: var(--velin-text-sm, 0.875rem);
|
|
12
|
+
color: var(--velin-color-on-primary, #fff);
|
|
13
|
+
background: var(--velin-color-text, #1a1a2e);
|
|
14
|
+
border-radius: var(--velin-radius-md, 0.375rem);
|
|
15
|
+
white-space: nowrap; pointer-events: none;
|
|
16
|
+
opacity: 0; transition: opacity 150ms ease;
|
|
17
|
+
max-inline-size: 20rem; white-space: normal;
|
|
18
|
+
}
|
|
19
|
+
:host([visible]) .tip { opacity: 1; }
|
|
20
|
+
.tip[data-placement="top"] { bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
21
|
+
.tip[data-placement="bottom"] { top: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
22
|
+
.tip[data-placement="start"] { right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
23
|
+
.tip[data-placement="end"] { left: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
24
|
+
@media (prefers-reduced-motion: reduce) { .tip { transition: none; } }
|
|
25
|
+
`;
|
|
26
|
+
var tooltipId = 0;
|
|
27
|
+
var VelinTooltip = class extends HTMLElement {
|
|
28
|
+
static get observedAttributes() {
|
|
29
|
+
return ["content", "placement"];
|
|
30
|
+
}
|
|
31
|
+
constructor() {
|
|
32
|
+
super();
|
|
33
|
+
this.attachShadow({ mode: "open" });
|
|
34
|
+
this._tipId = `velin-tooltip-${++tooltipId}`;
|
|
35
|
+
}
|
|
36
|
+
connectedCallback() {
|
|
37
|
+
const placement = this.getAttribute("placement") || "top";
|
|
38
|
+
const D = "div";
|
|
39
|
+
this.shadowRoot.innerHTML = `
|
|
40
|
+
<style>${styles}</style>
|
|
41
|
+
<slot></slot>
|
|
42
|
+
<${D} class="tip" id="${this._tipId}" role="tooltip" data-placement="${escapeHTML(placement)}" part="tip">${escapeHTML(this.getAttribute("content") || "")}</${D}>
|
|
43
|
+
`;
|
|
44
|
+
this.addEventListener("mouseenter", () => this._show());
|
|
45
|
+
this.addEventListener("mouseleave", () => this._hide());
|
|
46
|
+
this.addEventListener("focusin", () => this._show());
|
|
47
|
+
this.addEventListener("focusout", () => this._hide());
|
|
48
|
+
this.addEventListener("keydown", (e) => {
|
|
49
|
+
if (e.key === "Escape") this._hide();
|
|
50
|
+
});
|
|
51
|
+
const slot = this.shadowRoot.querySelector("slot");
|
|
52
|
+
slot.addEventListener("slotchange", () => this._linkTrigger());
|
|
53
|
+
this._linkTrigger();
|
|
54
|
+
}
|
|
55
|
+
_linkTrigger() {
|
|
56
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
57
|
+
if (!trigger) return;
|
|
58
|
+
if (this.hasAttribute("visible")) {
|
|
59
|
+
trigger.setAttribute("aria-describedby", this._tipId);
|
|
60
|
+
} else {
|
|
61
|
+
trigger.removeAttribute("aria-describedby");
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
_show() {
|
|
65
|
+
this.setAttribute("visible", "");
|
|
66
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
67
|
+
if (trigger) trigger.setAttribute("aria-describedby", this._tipId);
|
|
68
|
+
this._flip();
|
|
69
|
+
}
|
|
70
|
+
_hide() {
|
|
71
|
+
this.removeAttribute("visible");
|
|
72
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
73
|
+
if (trigger) trigger.removeAttribute("aria-describedby");
|
|
74
|
+
}
|
|
75
|
+
_flip() {
|
|
76
|
+
const tip = this.shadowRoot.querySelector(".tip");
|
|
77
|
+
if (!tip) return;
|
|
78
|
+
const rect = tip.getBoundingClientRect();
|
|
79
|
+
const placement = this.getAttribute("placement") || "top";
|
|
80
|
+
if (placement === "top" && rect.top < 0) tip.setAttribute("data-placement", "bottom");
|
|
81
|
+
else if (placement === "bottom" && rect.bottom > window.innerHeight) tip.setAttribute("data-placement", "top");
|
|
82
|
+
else tip.setAttribute("data-placement", placement);
|
|
83
|
+
}
|
|
84
|
+
attributeChangedCallback(name, _, val) {
|
|
85
|
+
const tip = this.shadowRoot?.querySelector(".tip");
|
|
86
|
+
if (!tip) return;
|
|
87
|
+
if (name === "content") tip.textContent = val;
|
|
88
|
+
if (name === "placement") tip.setAttribute("data-placement", val);
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var VelinTooltipWC = class _VelinTooltipWC extends VelinTooltip {
|
|
92
|
+
static _warned = false;
|
|
93
|
+
connectedCallback() {
|
|
94
|
+
if (!_VelinTooltipWC._warned && typeof console !== "undefined" && console.warn) {
|
|
95
|
+
_VelinTooltipWC._warned = true;
|
|
96
|
+
console.warn("[velinstyle] <velin-tooltip-wc> is deprecated; use <velin-tooltip> instead.");
|
|
97
|
+
}
|
|
98
|
+
super.connectedCallback();
|
|
99
|
+
}
|
|
100
|
+
};
|
|
101
|
+
if (!customElements.get("velin-tooltip")) {
|
|
102
|
+
customElements.define("velin-tooltip", VelinTooltip);
|
|
103
|
+
}
|
|
104
|
+
if (!customElements.get("velin-tooltip-wc")) {
|
|
105
|
+
customElements.define("velin-tooltip-wc", VelinTooltipWC);
|
|
106
|
+
}
|
|
107
|
+
var velin_tooltip_default = VelinTooltip;
|
|
108
|
+
export {
|
|
109
|
+
VelinTooltip,
|
|
110
|
+
VelinTooltipWC,
|
|
111
|
+
velin_tooltip_default as default
|
|
112
|
+
};
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
import {
|
|
2
|
+
escapeHTML
|
|
3
|
+
} from "./chunk-LA7264K4.js";
|
|
4
|
+
|
|
5
|
+
// components/velin-tooltip-wc.js
|
|
6
|
+
var styles = `
|
|
7
|
+
:host { position: relative; display: inline-block; }
|
|
8
|
+
.tip {
|
|
9
|
+
position: absolute; z-index: var(--velin-z-tooltip, 700);
|
|
10
|
+
padding: var(--velin-space-2, 0.5rem) var(--velin-space-3, 0.75rem);
|
|
11
|
+
font-size: var(--velin-text-sm, 0.875rem);
|
|
12
|
+
color: var(--velin-color-on-primary, #fff);
|
|
13
|
+
background: var(--velin-color-text, #1a1a2e);
|
|
14
|
+
border-radius: var(--velin-radius-md, 0.375rem);
|
|
15
|
+
white-space: nowrap; pointer-events: none;
|
|
16
|
+
opacity: 0; transition: opacity 150ms ease;
|
|
17
|
+
max-inline-size: 20rem; white-space: normal;
|
|
18
|
+
}
|
|
19
|
+
:host([visible]) .tip { opacity: 1; }
|
|
20
|
+
.tip[data-placement="top"] { bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
21
|
+
.tip[data-placement="bottom"] { top: calc(100% + 6px); left: 50%; transform: translateX(-50%); }
|
|
22
|
+
.tip[data-placement="start"] { right: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
23
|
+
.tip[data-placement="end"] { left: calc(100% + 6px); top: 50%; transform: translateY(-50%); }
|
|
24
|
+
@media (prefers-reduced-motion: reduce) { .tip { transition: none; } }
|
|
25
|
+
`;
|
|
26
|
+
var tooltipId = 0;
|
|
27
|
+
var VelinTooltipWC = class extends HTMLElement {
|
|
28
|
+
static get observedAttributes() {
|
|
29
|
+
return ["content", "placement"];
|
|
30
|
+
}
|
|
31
|
+
constructor() {
|
|
32
|
+
super();
|
|
33
|
+
this.attachShadow({ mode: "open" });
|
|
34
|
+
this._tipId = `velin-tooltip-${++tooltipId}`;
|
|
35
|
+
}
|
|
36
|
+
connectedCallback() {
|
|
37
|
+
const placement = this.getAttribute("placement") || "top";
|
|
38
|
+
const D = "div";
|
|
39
|
+
this.shadowRoot.innerHTML = `
|
|
40
|
+
<style>${styles}</style>
|
|
41
|
+
<slot></slot>
|
|
42
|
+
<${D} class="tip" id="${this._tipId}" role="tooltip" data-placement="${escapeHTML(placement)}" part="tip">${escapeHTML(this.getAttribute("content") || "")}</${D}>
|
|
43
|
+
`;
|
|
44
|
+
this.addEventListener("mouseenter", () => this._show());
|
|
45
|
+
this.addEventListener("mouseleave", () => this._hide());
|
|
46
|
+
this.addEventListener("focusin", () => this._show());
|
|
47
|
+
this.addEventListener("focusout", () => this._hide());
|
|
48
|
+
this.addEventListener("keydown", (e) => {
|
|
49
|
+
if (e.key === "Escape") this._hide();
|
|
50
|
+
});
|
|
51
|
+
const slot = this.shadowRoot.querySelector("slot");
|
|
52
|
+
slot.addEventListener("slotchange", () => this._linkTrigger());
|
|
53
|
+
this._linkTrigger();
|
|
54
|
+
}
|
|
55
|
+
_linkTrigger() {
|
|
56
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
57
|
+
if (!trigger) return;
|
|
58
|
+
if (this.hasAttribute("visible")) {
|
|
59
|
+
trigger.setAttribute("aria-describedby", this._tipId);
|
|
60
|
+
} else {
|
|
61
|
+
trigger.removeAttribute("aria-describedby");
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
_show() {
|
|
65
|
+
this.setAttribute("visible", "");
|
|
66
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
67
|
+
if (trigger) trigger.setAttribute("aria-describedby", this._tipId);
|
|
68
|
+
this._flip();
|
|
69
|
+
}
|
|
70
|
+
_hide() {
|
|
71
|
+
this.removeAttribute("visible");
|
|
72
|
+
const trigger = this.shadowRoot.querySelector("slot")?.assignedElements()[0];
|
|
73
|
+
if (trigger) trigger.removeAttribute("aria-describedby");
|
|
74
|
+
}
|
|
75
|
+
_flip() {
|
|
76
|
+
const tip = this.shadowRoot.querySelector(".tip");
|
|
77
|
+
if (!tip) return;
|
|
78
|
+
const rect = tip.getBoundingClientRect();
|
|
79
|
+
const placement = this.getAttribute("placement") || "top";
|
|
80
|
+
if (placement === "top" && rect.top < 0) tip.setAttribute("data-placement", "bottom");
|
|
81
|
+
else if (placement === "bottom" && rect.bottom > window.innerHeight) tip.setAttribute("data-placement", "top");
|
|
82
|
+
else tip.setAttribute("data-placement", placement);
|
|
83
|
+
}
|
|
84
|
+
attributeChangedCallback(name, _, val) {
|
|
85
|
+
const tip = this.shadowRoot?.querySelector(".tip");
|
|
86
|
+
if (!tip) return;
|
|
87
|
+
if (name === "content") tip.textContent = val;
|
|
88
|
+
if (name === "placement") tip.setAttribute("data-placement", val);
|
|
89
|
+
}
|
|
90
|
+
};
|
|
91
|
+
var VelinTooltip = class extends VelinTooltipWC {
|
|
92
|
+
};
|
|
93
|
+
if (!customElements.get("velin-tooltip-wc")) {
|
|
94
|
+
customElements.define("velin-tooltip-wc", VelinTooltipWC);
|
|
95
|
+
}
|
|
96
|
+
if (!customElements.get("velin-tooltip")) {
|
|
97
|
+
customElements.define("velin-tooltip", VelinTooltip);
|
|
98
|
+
}
|
|
99
|
+
var velin_tooltip_wc_default = VelinTooltipWC;
|
|
100
|
+
export {
|
|
101
|
+
VelinTooltip,
|
|
102
|
+
velin_tooltip_wc_default as default
|
|
103
|
+
};
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
// core/search/worker-client.js
|
|
2
|
+
var _nextId = 0;
|
|
3
|
+
function createSearchWorker(workerUrl) {
|
|
4
|
+
if (typeof Worker === "undefined") return null;
|
|
5
|
+
const url = workerUrl || new URL("./worker.js", import.meta.url).href;
|
|
6
|
+
let worker;
|
|
7
|
+
try {
|
|
8
|
+
worker = new Worker(url, { type: "module" });
|
|
9
|
+
} catch {
|
|
10
|
+
return null;
|
|
11
|
+
}
|
|
12
|
+
const pending = /* @__PURE__ */ new Map();
|
|
13
|
+
worker.onmessage = (e) => {
|
|
14
|
+
const { id, ok, result, error } = e.data || {};
|
|
15
|
+
const p = pending.get(id);
|
|
16
|
+
if (!p) return;
|
|
17
|
+
pending.delete(id);
|
|
18
|
+
if (ok) p.resolve(result);
|
|
19
|
+
else p.reject(new Error(error || "Worker error"));
|
|
20
|
+
};
|
|
21
|
+
worker.onerror = () => {
|
|
22
|
+
for (const p of pending.values()) p.reject(new Error("Worker failed"));
|
|
23
|
+
pending.clear();
|
|
24
|
+
};
|
|
25
|
+
function send(type, payload) {
|
|
26
|
+
const id = ++_nextId;
|
|
27
|
+
return new Promise((resolve, reject) => {
|
|
28
|
+
pending.set(id, { resolve, reject });
|
|
29
|
+
worker.postMessage({ id, type, payload });
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
return {
|
|
33
|
+
setEntries(entries) {
|
|
34
|
+
return send("setEntries", { entries });
|
|
35
|
+
},
|
|
36
|
+
query(query, options) {
|
|
37
|
+
return send("query", { query, options });
|
|
38
|
+
},
|
|
39
|
+
terminate() {
|
|
40
|
+
worker.terminate();
|
|
41
|
+
}
|
|
42
|
+
};
|
|
43
|
+
}
|
|
44
|
+
export {
|
|
45
|
+
createSearchWorker
|
|
46
|
+
};
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
# VelinStyle 0.9.0
|
|
2
|
+
|
|
3
|
+
> VelinStyle is the WCAG 2.2 AAA CSS framework with native JavaScript runtime and Web Components.
|
|
4
|
+
> Full machine context: https://velinstyle.info/dist/velin-agent.json
|
|
5
|
+
> MIME: application/vnd.velinstyle.meta+json
|
|
6
|
+
|
|
7
|
+
## Framework
|
|
8
|
+
- npm: @birdapi/velinstyle
|
|
9
|
+
- VelinStyle is the WCAG 2.2 AAA CSS framework with native JavaScript runtime and Web Components.
|
|
10
|
+
- Components: 36 canonical Web Components (`velin-*`); 38 lazy-loader entries
|
|
11
|
+
- HTML attributes: 27 `velin-*` bridges
|
|
12
|
+
- CLI: velinstyle (scan, scaffold, docs generate, search index, meta)
|
|
13
|
+
|
|
14
|
+
## Conventions
|
|
15
|
+
- Positioning: VelinStyle is the WCAG 2.2 AAA CSS framework with native JavaScript runtime and Web Components — not a JS-only library or a utility-only CSS kit.
|
|
16
|
+
- Use only velin-* utility classes and documented Web Components.
|
|
17
|
+
- Prefer data-velin-theme on <html> for theme switching.
|
|
18
|
+
- Run velinstyle scan on generated HTML before shipping.
|
|
19
|
+
- Do not put secrets, API keys, or raw emails in velin-meta or page meta.
|
|
20
|
+
- Resolve doc links against docs root (/docs/), not the current page folder.
|
|
21
|
+
|
|
22
|
+
## Key guides
|
|
23
|
+
- [Velin-Meta](https://velinstyle.info/docs/guides/velin-meta.html)
|
|
24
|
+
- [VelinSearch](https://velinstyle.info/docs/guides/velin-search.html)
|
|
25
|
+
- [Syntax highlighting](https://velinstyle.info/docs/guides/syntax-highlight.html)
|
|
26
|
+
- [Prompt scaffolding](https://velinstyle.info/docs/guides/prompt-scaffolding.html)
|
|
27
|
+
- [API reference (generated)](https://velinstyle.info/docs/guides/api-reference.html)
|
|
28
|
+
|
|
29
|
+
## Generated reference
|
|
30
|
+
- [Components index](https://velinstyle.info/docs/generated/components/)
|
|
31
|
+
- [Tokens](https://velinstyle.info/docs/generated/tokens/)
|
|
32
|
+
- [Utilities](https://velinstyle.info/docs/generated/utilities/)
|
|
33
|
+
- [CLI commands](https://velinstyle.info/docs/generated/cli/commands.md)
|
|
34
|
+
|
|
35
|
+
## Usage for agents
|
|
36
|
+
```
|
|
37
|
+
npx velinstyle meta
|
|
38
|
+
npx velinstyle docs generate
|
|
39
|
+
npx velinstyle search index
|
|
40
|
+
```
|
package/dist/llms.txt
ADDED
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
# VelinStyle 0.9.0
|
|
2
|
+
|
|
3
|
+
> VelinStyle is the WCAG 2.2 AAA CSS framework with native JavaScript runtime and Web Components.
|
|
4
|
+
> Full machine context: https://velinstyle.info/dist/velin-agent.json
|
|
5
|
+
> MIME: application/vnd.velinstyle.meta+json
|
|
6
|
+
|
|
7
|
+
## Framework
|
|
8
|
+
- npm: @birdapi/velinstyle
|
|
9
|
+
- VelinStyle is the WCAG 2.2 AAA CSS framework with native JavaScript runtime and Web Components.
|
|
10
|
+
- Components: 36 canonical Web Components (`velin-*`); 38 lazy-loader entries
|
|
11
|
+
- HTML attributes: 27 `velin-*` bridges
|
|
12
|
+
- CLI: velinstyle (scan, scaffold, docs generate, search index, meta)
|
|
13
|
+
|
|
14
|
+
## Conventions
|
|
15
|
+
- Positioning: VelinStyle is the WCAG 2.2 AAA CSS framework with native JavaScript runtime and Web Components — not a JS-only library or a utility-only CSS kit.
|
|
16
|
+
- Use only velin-* utility classes and documented Web Components.
|
|
17
|
+
- Prefer data-velin-theme on <html> for theme switching.
|
|
18
|
+
- Run velinstyle scan on generated HTML before shipping.
|
|
19
|
+
- Do not put secrets, API keys, or raw emails in velin-meta or page meta.
|
|
20
|
+
- Resolve doc links against docs root (/docs/), not the current page folder.
|
|
21
|
+
|
|
22
|
+
## Key guides
|
|
23
|
+
- [Velin-Meta](https://velinstyle.info/docs/guides/velin-meta.html)
|
|
24
|
+
- [VelinSearch](https://velinstyle.info/docs/guides/velin-search.html)
|
|
25
|
+
- [Syntax highlighting](https://velinstyle.info/docs/guides/syntax-highlight.html)
|
|
26
|
+
- [Prompt scaffolding](https://velinstyle.info/docs/guides/prompt-scaffolding.html)
|
|
27
|
+
- [API reference (generated)](https://velinstyle.info/docs/guides/api-reference.html)
|
|
28
|
+
|
|
29
|
+
## Generated reference
|
|
30
|
+
- [Components index](https://velinstyle.info/docs/generated/components/)
|
|
31
|
+
- [Tokens](https://velinstyle.info/docs/generated/tokens/)
|
|
32
|
+
- [Utilities](https://velinstyle.info/docs/generated/utilities/)
|
|
33
|
+
- [CLI commands](https://velinstyle.info/docs/generated/cli/commands.md)
|
|
34
|
+
|
|
35
|
+
## Usage for agents
|
|
36
|
+
```
|
|
37
|
+
npx velinstyle meta
|
|
38
|
+
npx velinstyle docs generate
|
|
39
|
+
npx velinstyle search index
|
|
40
|
+
```
|