@rosettadash/vue 0.1.2 → 0.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rosettadash/vue",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "RosettaDash Vue 3 runtime — same import paths as @rosettadash/web-components. Storybook: github.com/KevinEverywhere/rosettadash (port 6008).",
   "author": "Kevin Ready <kevin@planetkevin.com>",
   "type": "module",
@@ -119,6 +119,11 @@
       "import": "./src/layout/modal/index.js",
       "default": "./src/layout/modal/index.js"
     },
+    "./layout/scroll-region": {
+      "types": "./src/layout/scroll-region/index.d.ts",
+      "import": "./src/layout/scroll-region/index.js",
+      "default": "./src/layout/scroll-region/index.js"
+    },
     "./layout/tabs": {
       "types": "./src/layout/tabs/index.d.ts",
       "import": "./src/layout/tabs/index.js",
@@ -341,6 +346,7 @@
     "./layout/flex/index": "./src/layout/flex/index.js",
     "./layout/grid/index": "./src/layout/grid/index.js",
     "./layout/modal/index": "./src/layout/modal/index.js",
+    "./layout/scroll-region/index": "./src/layout/scroll-region/index.js",
     "./layout/tabs/index": "./src/layout/tabs/index.js",
     "./logic/timer/index": "./src/logic/timer/index.js",
     "./visual/chart/bar/index": "./src/visual/chart/bar/index.js",
@@ -388,7 +394,7 @@
     "LICENSE"
   ],
   "dependencies": {
-    "@rosettadash/web-components": "0.1.1",
+    "@rosettadash/web-components": "0.1.3",
     "tslib": "^2.3.0"
   },
   "peerDependencies": {

package/src/domain/role-gate/role-gate.d.ts

@@ -2,7 +2,10 @@ import { type PropType, type SlotsType, type VNode } from 'vue';
 export interface RoleGateProps {
     label?: string;
     allowedRoles?: string[];
+    /** Active session role — when omitted, content is always shown (builder/demo mode). */
+    currentRole?: string;
     statusText?: string;
+    hiddenStatusText?: string;
     className?: string;
 }
 /** @rosettadash/vue/domain/role-gate — domain.role-gate */
@@ -19,10 +22,18 @@ export declare const RoleGate: import("vue").DefineComponent<import("vue").Extra
         type: PropType<string[] | undefined>;
         default: undefined;
     };
+    currentRole: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
     statusText: {
         type: PropType<string | undefined>;
         default: undefined;
     };
+    hiddenStatusText: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
 }>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -38,15 +49,25 @@ export declare const RoleGate: import("vue").DefineComponent<import("vue").Extra
         type: PropType<string[] | undefined>;
         default: undefined;
     };
+    currentRole: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
     statusText: {
         type: PropType<string | undefined>;
         default: undefined;
     };
+    hiddenStatusText: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     className: string | undefined;
     label: string | undefined;
     allowedRoles: string[] | undefined;
+    currentRole: string | undefined;
     statusText: string | undefined;
+    hiddenStatusText: string | undefined;
 }, SlotsType<{
     default?: () => VNode[];
 }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/src/domain/role-gate/role-gate.js

@@ -1,4 +1,11 @@
 import { defineComponent, h } from 'vue';
+function roleGateAllowsRole(allowedRoles, roleId) {
+    const normalizedRole = roleId.trim();
+    if (!normalizedRole) {
+        return false;
+    }
+    return allowedRoles.some((allowed) => allowed === normalizedRole);
+}
 /** @rosettadash/vue/domain/role-gate — domain.role-gate */
 export const RoleGate = defineComponent({
     name: 'RdRoleGate',
@@ -6,17 +13,38 @@ export const RoleGate = defineComponent({
         className: { type: String, default: undefined },
         label: { type: String, default: undefined },
         allowedRoles: { type: Array, default: undefined },
+        currentRole: { type: String, default: undefined },
         statusText: { type: String, default: undefined },
+        hiddenStatusText: { type: String, default: undefined },
     },
     slots: Object,
     setup(props, { slots, attrs }) {
         return () => {
-            var _a, _b;
-            const rootClass = ['rd-role-gate', props.className, typeof attrs.class === 'string' ? attrs.class : ''].filter(Boolean).join(' ');
+            var _a, _b, _c, _d, _e;
+            const allowedRoles = (_a = props.allowedRoles) !== null && _a !== void 0 ? _a : [];
+            const hasRoleContext = props.currentRole !== undefined && props.currentRole !== '';
+            const visible = !hasRoleContext ||
+                allowedRoles.length === 0 ||
+                roleGateAllowsRole(allowedRoles, (_b = props.currentRole) !== null && _b !== void 0 ? _b : '');
+            const rootClass = [
+                'rd-role-gate',
+                visible ? 'rd-role-gate--visible' : 'rd-role-gate--hidden',
+                props.className,
+                typeof attrs.class === 'string' ? attrs.class : '',
+            ]
+                .filter(Boolean)
+                .join(' ');
             return h('section', { class: rootClass, 'data-testid': 'rd-role-gate' }, [
                 props.label ? h('span', { class: 'rd-field__label' }, props.label) : null,
-                h('p', { class: 'rd-role-gate__status' }, (_a = props.statusText) !== null && _a !== void 0 ? _a : 'Visible'),
-                (_b = slots.default) === null || _b === void 0 ? void 0 : _b.call(slots),
+                visible
+                    ? [
+                        h('p', { class: 'rd-role-gate__status', 'data-testid': 'rd-role-gate-visible' }, (_c = props.statusText) !== null && _c !== void 0 ? _c : 'Visible'),
+                        (_d = slots.default) === null || _d === void 0 ? void 0 : _d.call(slots),
+                    ]
+                    : h('p', {
+                        class: 'rd-role-gate__status rd-role-gate__status--hidden',
+                        'data-testid': 'rd-role-gate-hidden',
+                    }, (_e = props.hiddenStatusText) !== null && _e !== void 0 ? _e : 'Hidden for current role'),
             ]);
         };
     },

package/src/domain/role-gate/role-gate.js.map

@@ -1 +1 @@
-{"version":3,"file":"role-gate.js","sourceRoot":"","sources":["../../../../../../packages/vue/src/domain/role-gate/role-gate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,CAAC,EAA6C,MAAM,KAAK,CAAC;AASpF,2DAA2D;AAC3D,MAAM,CAAC,MAAM,QAAQ,GAAG,eAAe,CAAC;IACtC,IAAI,EAAE,YAAY;IAClB,KAAK,EAAE;QACL,SAAS,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC/E,KAAK,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC3E,YAAY,EAAE,EAAE,IAAI,EAAE,KAAuC,EAAE,OAAO,EAAE,SAAS,EAAE;QACnF,UAAU,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;KACjF;IACD,KAAK,EAAE,MAAgD;IACvD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,OAAO,GAAG,EAAE;;YACV,MAAM,SAAS,GAAG,CAAC,cAAc,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YAClI,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,EAAE;gBACzE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACzE,CAAC,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,EAAE,MAAA,KAAK,CAAC,UAAU,mCAAI,SAAS,CAAC;gBACxE,MAAA,KAAK,CAAC,OAAO,qDAAI;aAClB,CAAC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC;CACF,CAAC,CAAC"}
+{"version":3,"file":"role-gate.js","sourceRoot":"","sources":["../../../../../../packages/vue/src/domain/role-gate/role-gate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,CAAC,EAA6C,MAAM,KAAK,CAAC;AAYpF,SAAS,kBAAkB,CAAC,YAAsB,EAAE,MAAc;IAChE,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,EAAE,CAAC;IACrC,IAAI,CAAC,cAAc,EAAE,CAAC;QACpB,OAAO,KAAK,CAAC;IACf,CAAC;IACD,OAAO,YAAY,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,KAAK,cAAc,CAAC,CAAC;AACpE,CAAC;AAED,2DAA2D;AAC3D,MAAM,CAAC,MAAM,QAAQ,GAAG,eAAe,CAAC;IACtC,IAAI,EAAE,YAAY;IAClB,KAAK,EAAE;QACL,SAAS,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC/E,KAAK,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC3E,YAAY,EAAE,EAAE,IAAI,EAAE,KAAuC,EAAE,OAAO,EAAE,SAAS,EAAE;QACnF,WAAW,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QACjF,UAAU,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAChF,gBAAgB,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;KACvF;IACD,KAAK,EAAE,MAAgD;IACvD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,OAAO,GAAG,EAAE;;YACV,MAAM,YAAY,GAAG,MAAA,KAAK,CAAC,YAAY,mCAAI,EAAE,CAAC;YAC9C,MAAM,cAAc,GAAG,KAAK,CAAC,WAAW,KAAK,SAAS,IAAI,KAAK,CAAC,WAAW,KAAK,EAAE,CAAC;YACnF,MAAM,OAAO,GACX,CAAC,cAAc;gBACf,YAAY,CAAC,MAAM,KAAK,CAAC;gBACzB,kBAAkB,CAAC,YAAY,EAAE,MAAA,KAAK,CAAC,WAAW,mCAAI,EAAE,CAAC,CAAC;YAC5D,MAAM,SAAS,GAAG;gBAChB,cAAc;gBACd,OAAO,CAAC,CAAC,CAAC,uBAAuB,CAAC,CAAC,CAAC,sBAAsB;gBAC1D,KAAK,CAAC,SAAS;gBACf,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE;aACnD;iBACE,MAAM,CAAC,OAAO,CAAC;iBACf,IAAI,CAAC,GAAG,CAAC,CAAC;YAEb,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,EAAE;gBACvE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACzE,OAAO;oBACL,CAAC,CAAC;wBACE,CAAC,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,aAAa,EAAE,sBAAsB,EAAE,EAAE,MAAA,KAAK,CAAC,UAAU,mCAAI,SAAS,CAAC;wBAC/G,MAAA,KAAK,CAAC,OAAO,qDAAI;qBAClB;oBACH,CAAC,CAAC,CAAC,CACC,GAAG,EACH;wBACE,KAAK,EAAE,mDAAmD;wBAC1D,aAAa,EAAE,qBAAqB;qBACrC,EACD,MAAA,KAAK,CAAC,gBAAgB,mCAAI,yBAAyB,CACpD;aACN,CAAC,CAAC;QACL,CAAC,CAAC;IACJ,CAAC;CACF,CAAC,CAAC"}

package/src/domain/time-preset/time-preset.d.ts

@@ -30,7 +30,7 @@ export declare const TimePreset: import("vue").DefineComponent<import("vue").Ext
     };
 }>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "presetChange"[], "presetChange", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     className: {
         type: PropType<string | undefined>;
         default: undefined;
@@ -47,7 +47,9 @@ export declare const TimePreset: import("vue").DefineComponent<import("vue").Ext
         type: PropType<string | undefined>;
         default: undefined;
     };
-}>> & Readonly<{}>, {
+}>> & Readonly<{
+    onPresetChange?: ((...args: any[]) => any) | undefined;
+}>, {
     className: string | undefined;
     label: string | undefined;
     presets: TimePresetPreset[] | undefined;

package/src/domain/time-preset/time-preset.js

@@ -9,7 +9,8 @@ export const TimePreset = defineComponent({
         activePresetId: { type: String, default: undefined },
     },
     slots: Object,
-    setup(props, { slots, attrs }) {
+    emits: ['presetChange'],
+    setup(props, { slots, attrs, emit }) {
         function presetButtonClass(id) {
             return ['rd-time-preset__button', props.activePresetId === id ? 'rd-time-preset__button--active' : ''].filter(Boolean).join(' ');
         }
@@ -18,7 +19,16 @@ export const TimePreset = defineComponent({
             const rootClass = ['rd-time-preset', props.className, typeof attrs.class === 'string' ? attrs.class : ''].filter(Boolean).join(' ');
             return h('section', { class: rootClass, 'data-testid': 'rd-time-preset' }, [
                 props.label ? h('span', { class: 'rd-field__label' }, props.label) : null,
-                h('div', { class: 'rd-time-preset__buttons', role: 'group' }, ((_a = props.presets) !== null && _a !== void 0 ? _a : []).map((p) => h('button', { type: 'button', key: p.id, class: presetButtonClass(p.id) }, p.label))),
+                h('div', { class: 'rd-time-preset__buttons', role: 'group' }, ((_a = props.presets) !== null && _a !== void 0 ? _a : []).map((p) => h('button', {
+                    type: 'button',
+                    key: p.id,
+                    class: presetButtonClass(p.id),
+                    onClick: () => {
+                        var _a;
+                        emit('presetChange', p.id);
+                        (_a = props.onPresetChange) === null || _a === void 0 ? void 0 : _a.call(props, p.id);
+                    },
+                }, p.label))),
                 (_b = slots.default) === null || _b === void 0 ? void 0 : _b.call(slots),
             ]);
         };

package/src/domain/time-preset/time-preset.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-preset.js","sourceRoot":"","sources":["../../../../../../packages/vue/src/domain/time-preset/time-preset.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,CAAC,EAA6C,MAAM,KAAK,CAAC;AAepF,+DAA+D;AAC/D,MAAM,CAAC,MAAM,UAAU,GAAG,eAAe,CAAC;IACxC,IAAI,EAAE,cAAc;IACpB,KAAK,EAAE;QACL,SAAS,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC/E,KAAK,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC3E,OAAO,EAAE,EAAE,IAAI,EAAE,KAAiD,EAAE,OAAO,EAAE,SAAS,EAAE;QACxF,cAAc,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;KACrF;IACD,KAAK,EAAE,MAAgD;IACvD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,SAAS,iBAAiB,CAAC,EAAU;YACnC,OAAO,CAAC,wBAAwB,EAAE,KAAK,CAAC,cAAc,KAAK,EAAE,CAAC,CAAC,CAAC,gCAAgC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACnI,CAAC;QACD,OAAO,GAAG,EAAE;;YACV,MAAM,SAAS,GAAG,CAAC,gBAAgB,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACpI,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,EAAE;gBAC3E,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACzE,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,yBAAyB,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,CAAC,MAAA,KAAK,CAAC,OAAO,mCAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAC5F,CAAC,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,EAAE,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CACpF,CAAC;gBACF,MAAA,KAAK,CAAC,OAAO,qDAAI;aAClB,CAAC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC;CACF,CAAC,CAAC"}
+{"version":3,"file":"time-preset.js","sourceRoot":"","sources":["../../../../../../packages/vue/src/domain/time-preset/time-preset.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,CAAC,EAA6C,MAAM,KAAK,CAAC;AAepF,+DAA+D;AAC/D,MAAM,CAAC,MAAM,UAAU,GAAG,eAAe,CAAC;IACxC,IAAI,EAAE,cAAc;IACpB,KAAK,EAAE;QACL,SAAS,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC/E,KAAK,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC3E,OAAO,EAAE,EAAE,IAAI,EAAE,KAAiD,EAAE,OAAO,EAAE,SAAS,EAAE;QACxF,cAAc,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;KACrF;IACD,KAAK,EAAE,MAAgD;IACvD,KAAK,EAAE,CAAC,cAAc,CAAC;IACvB,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE;QACjC,SAAS,iBAAiB,CAAC,EAAU;YACnC,OAAO,CAAC,wBAAwB,EAAE,KAAK,CAAC,cAAc,KAAK,EAAE,CAAC,CAAC,CAAC,gCAAgC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QACnI,CAAC;QACD,OAAO,GAAG,EAAE;;YACV,MAAM,SAAS,GAAG,CAAC,gBAAgB,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACpI,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,gBAAgB,EAAE,EAAE;gBAC3E,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACzE,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,yBAAyB,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,CAAC,MAAA,KAAK,CAAC,OAAO,mCAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAC5F,CAAC,CAAC,QAAQ,EAAE;oBACV,IAAI,EAAE,QAAQ;oBACd,GAAG,EAAE,CAAC,CAAC,EAAE;oBACT,KAAK,EAAE,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC;oBAC9B,OAAO,EAAE,GAAG,EAAE;;wBACZ,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;wBAC3B,MAAA,KAAK,CAAC,cAAc,sDAAG,CAAC,CAAC,EAAE,CAAC,CAAC;oBAC/B,CAAC;iBACF,EAAE,CAAC,CAAC,KAAK,CAAC,CACZ,CAAC;gBACF,MAAA,KAAK,CAAC,OAAO,qDAAI;aAClB,CAAC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC;CACF,CAAC,CAAC"}

package/src/index.d.ts

@@ -19,6 +19,7 @@ export * from './layout/collapsible/index.js';
 export * from './layout/flex/index.js';
 export * from './layout/grid/index.js';
 export * from './layout/modal/index.js';
+export * from './layout/scroll-region/index.js';
 export * from './layout/tabs/index.js';
 export * from './logic/timer/index.js';
 export * from './visual/chart/bar/index.js';

package/src/index.js

@@ -19,6 +19,7 @@ export * from './layout/collapsible/index.js';
 export * from './layout/flex/index.js';
 export * from './layout/grid/index.js';
 export * from './layout/modal/index.js';
+export * from './layout/scroll-region/index.js';
 export * from './layout/tabs/index.js';
 export * from './logic/timer/index.js';
 export * from './visual/chart/bar/index.js';

package/src/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/vue/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,4CAA4C,CAAC;AAC3D,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uCAAuC,CAAC;AACtD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wCAAwC,CAAC;AACvD,cAAc,wCAAwC,CAAC;AACvD,cAAc,yCAAyC,CAAC;AACxD,cAAc,sCAAsC,CAAC;AACrD,cAAc,oCAAoC,CAAC;AACnD,cAAc,mCAAmC,CAAC;AAClD,cAAc,kCAAkC,CAAC;AACjD,cAAc,oCAAoC,CAAC;AACnD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2CAA2C,CAAC;AAC1D,cAAc,sCAAsC,CAAC;AACrD,cAAc,sCAAsC,CAAC;AACrD,cAAc,uCAAuC,CAAC;AACtD,cAAc,uCAAuC,CAAC;AACtD,cAAc,wCAAwC,CAAC;AACvD,cAAc,sCAAsC,CAAC;AACrD,cAAc,sCAAsC,CAAC;AACrD,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,sCAAsC,CAAC;AACrD,cAAc,uCAAuC,CAAC;AACtD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,cAAc,4BAA4B,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../packages/vue/src/index.ts"],"names":[],"mappings":"AAAA,cAAc,4CAA4C,CAAC;AAC3D,cAAc,iCAAiC,CAAC;AAChD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iCAAiC,CAAC;AAChD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,uCAAuC,CAAC;AACtD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,iCAAiC,CAAC;AAChD,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wCAAwC,CAAC;AACvD,cAAc,wCAAwC,CAAC;AACvD,cAAc,yCAAyC,CAAC;AACxD,cAAc,sCAAsC,CAAC;AACrD,cAAc,oCAAoC,CAAC;AACnD,cAAc,mCAAmC,CAAC;AAClD,cAAc,kCAAkC,CAAC;AACjD,cAAc,oCAAoC,CAAC;AACnD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AACjD,cAAc,uBAAuB,CAAC;AACtC,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2CAA2C,CAAC;AAC1D,cAAc,sCAAsC,CAAC;AACrD,cAAc,sCAAsC,CAAC;AACrD,cAAc,uCAAuC,CAAC;AACtD,cAAc,uCAAuC,CAAC;AACtD,cAAc,wCAAwC,CAAC;AACvD,cAAc,sCAAsC,CAAC;AACrD,cAAc,sCAAsC,CAAC;AACrD,cAAc,mCAAmC,CAAC;AAClD,cAAc,oCAAoC,CAAC;AACnD,cAAc,sCAAsC,CAAC;AACrD,cAAc,uCAAuC,CAAC;AACtD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,yBAAyB,CAAC;AACxC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,oCAAoC,CAAC;AACnD,cAAc,4BAA4B,CAAC"}

package/src/layout/scroll-region/index.d.ts

@@ -0,0 +1,2 @@
+export type { ScrollRegionProps, ScrollRegionComponent } from './scroll-region';
+export { ScrollRegion } from './scroll-region';

package/src/layout/scroll-region/index.js

@@ -0,0 +1,2 @@
+export { ScrollRegion } from './scroll-region';
+//# sourceMappingURL=index.js.map

package/src/layout/scroll-region/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../packages/vue/src/layout/scroll-region/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC"}

package/src/layout/scroll-region/scroll-region.d.ts

@@ -0,0 +1,53 @@
+import { type PropType, type SlotsType, type VNode } from 'vue';
+export interface ScrollRegionProps {
+    title?: string;
+    maxHeight?: string;
+    overlayScrollbar?: boolean;
+    className?: string;
+}
+/** @rosettadash/vue/layout/scroll-region — layout.scroll-region */
+export declare const ScrollRegion: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    className: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    title: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    maxHeight: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    overlayScrollbar: {
+        type: PropType<boolean | undefined>;
+        default: undefined;
+    };
+}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    className: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    title: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    maxHeight: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    overlayScrollbar: {
+        type: PropType<boolean | undefined>;
+        default: undefined;
+    };
+}>> & Readonly<{}>, {
+    className: string | undefined;
+    title: string | undefined;
+    maxHeight: string | undefined;
+    overlayScrollbar: boolean | undefined;
+}, SlotsType<{
+    default?: () => VNode[];
+}>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export type ScrollRegionComponent = typeof ScrollRegion;

package/src/layout/scroll-region/scroll-region.js

@@ -0,0 +1,28 @@
+import { defineComponent, h } from 'vue';
+/** @rosettadash/vue/layout/scroll-region — layout.scroll-region */
+export const ScrollRegion = defineComponent({
+    name: 'RdScrollRegion',
+    props: {
+        className: { type: String, default: undefined },
+        title: { type: String, default: undefined },
+        maxHeight: { type: String, default: undefined },
+        overlayScrollbar: { type: Boolean, default: undefined },
+    },
+    slots: Object,
+    setup(props, { slots, attrs }) {
+        return () => {
+            var _a, _b;
+            const rootClass = ['rd-scroll-region', props.className, typeof attrs.class === 'string' ? attrs.class : ''].filter(Boolean).join(' ');
+            return h('section', {
+                class: [rootClass, props.overlayScrollbar === false ? '' : 'rd-scroll-region--overlay-scrollbar'].filter(Boolean).join(' '),
+                'data-testid': 'rd-scroll-region',
+                'aria-label': (_a = props.title) !== null && _a !== void 0 ? _a : 'Scrollable content',
+                style: props.maxHeight ? { maxHeight: props.maxHeight } : undefined,
+            }, [
+                props.title ? h('header', { class: 'rd-scroll-region__header' }, props.title) : null,
+                h('div', { class: 'rd-scroll-region__body' }, (_b = slots.default) === null || _b === void 0 ? void 0 : _b.call(slots)),
+            ]);
+        };
+    },
+});
+//# sourceMappingURL=scroll-region.js.map

package/src/layout/scroll-region/scroll-region.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-region.js","sourceRoot":"","sources":["../../../../../../packages/vue/src/layout/scroll-region/scroll-region.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,CAAC,EAA6C,MAAM,KAAK,CAAC;AASpF,mEAAmE;AACnE,MAAM,CAAC,MAAM,YAAY,GAAG,eAAe,CAAC;IAC1C,IAAI,EAAE,gBAAgB;IACtB,KAAK,EAAE;QACL,SAAS,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC/E,KAAK,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC3E,SAAS,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC/E,gBAAgB,EAAE,EAAE,IAAI,EAAE,OAAwC,EAAE,OAAO,EAAE,SAAS,EAAE;KACzF;IACD,KAAK,EAAE,MAAgD;IACvD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,OAAO,GAAG,EAAE;;YACV,MAAM,SAAS,GAAG,CAAC,kBAAkB,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YACtI,OAAO,CAAC,CAAC,SAAS,EAAE;gBACpB,KAAK,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,gBAAgB,KAAK,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,qCAAqC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;gBAC3H,aAAa,EAAE,kBAAkB;gBACjC,YAAY,EAAE,MAAA,KAAK,CAAC,KAAK,mCAAI,oBAAoB;gBACjD,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,EAAE,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,SAAS;aACpE,EAAE;gBACD,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,0BAA0B,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBACpF,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,wBAAwB,EAAE,EAAE,MAAA,KAAK,CAAC,OAAO,qDAAI,CAAC;aACjE,CAAC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC;CACF,CAAC,CAAC"}

package/src/lib/custom-element-host.js

@@ -45,7 +45,7 @@ export function defineCustomElementHost(options, propDefs) {
                 type: String,
                 default: undefined,
             } }, propDefs),
-        emits: Object.values(eventMap),
+        emits: [...new Set([...Object.keys(eventMap), ...Object.values(eventMap)])],
         setup(props, { emit, attrs }) {
             options.register();
             const host = ref(null);
@@ -64,7 +64,11 @@ export function defineCustomElementHost(options, propDefs) {
                 applyAttrs();
                 for (const [domEvent, vueEvent] of Object.entries(eventMap)) {
                     const handler = (event) => {
-                        emit(vueEvent, event.detail);
+                        const detail = event.detail;
+                        emit(vueEvent, detail);
+                        if (domEvent !== vueEvent) {
+                            emit(domEvent, detail);
+                        }
                     };
                     el.addEventListener(domEvent, handler);
                     listeners.push([domEvent, handler]);

package/src/lib/custom-element-host.js.map

@@ -1 +1 @@
-{"version":3,"file":"custom-element-host.js","sourceRoot":"","sources":["../../../../../packages/vue/src/lib/custom-element-host.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"custom-element-host.js","sourceRoot":"","sources":["../../../../../packages/vue/src/lib/custom-element-host.ts"],"names":[],"mappings":"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"}

package/src/visual/chart/bar/bar-chart.d.ts

@@ -1,6 +1,13 @@
 import { type PropType, type SlotsType, type VNode } from 'vue';
+export interface BarChartBar {
+    label: string;
+    value: number;
+}
 export interface BarChartProps {
     title?: string;
+    bars?: BarChartBar[];
+    yAxisLabel?: string;
+    valueFormat?: (value: number) => string;
     className?: string;
 }
 /** @rosettadash/vue/visual/chart/bar — visual.chart.bar */
@@ -13,6 +20,18 @@ export declare const BarChart: import("vue").DefineComponent<import("vue").Extra
         type: PropType<string | undefined>;
         default: undefined;
     };
+    bars: {
+        type: PropType<BarChartBar[] | undefined>;
+        default: undefined;
+    };
+    yAxisLabel: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    valueFormat: {
+        type: PropType<((value: number) => string) | undefined>;
+        default: undefined;
+    };
 }>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -24,9 +43,24 @@ export declare const BarChart: import("vue").DefineComponent<import("vue").Extra
         type: PropType<string | undefined>;
         default: undefined;
     };
+    bars: {
+        type: PropType<BarChartBar[] | undefined>;
+        default: undefined;
+    };
+    yAxisLabel: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    valueFormat: {
+        type: PropType<((value: number) => string) | undefined>;
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     className: string | undefined;
     title: string | undefined;
+    bars: BarChartBar[] | undefined;
+    yAxisLabel: string | undefined;
+    valueFormat: ((value: number) => string) | undefined;
 }, SlotsType<{
     default?: () => VNode[];
 }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

package/src/visual/chart/bar/bar-chart.js

@@ -1,21 +1,85 @@
 import { defineComponent, h } from 'vue';
+const FALLBACK_BARS = [
+    { label: 'A', value: 40 },
+    { label: 'B', value: 65 },
+    { label: 'C', value: 55 },
+    { label: 'D', value: 80 },
+    { label: 'E', value: 48 },
+];
+function defaultFormat(value) {
+    if (value >= 1000000) {
+        return `${(value / 1000000).toFixed(1)}M`;
+    }
+    if (value >= 1000) {
+        return `${(value / 1000).toFixed(0)}K`;
+    }
+    return String(Math.round(value));
+}
+function buildTicks(max, count = 4) {
+    if (max <= 0) {
+        return [0];
+    }
+    const step = max / (count - 1);
+    return Array.from({ length: count }, (_, index) => step * index);
+}
 /** @rosettadash/vue/visual/chart/bar — visual.chart.bar */
 export const BarChart = defineComponent({
     name: 'RdBarChart',
     props: {
         className: { type: String, default: undefined },
         title: { type: String, default: undefined },
+        bars: { type: Array, default: undefined },
+        yAxisLabel: { type: String, default: undefined },
+        valueFormat: { type: Function, default: undefined },
     },
     slots: Object,
     setup(props, { slots, attrs }) {
-        const barHeights = [40, 65, 55, 80, 48];
         return () => {
-            var _a, _b;
-            const rootClass = ['rd-chart-bar', props.className, typeof attrs.class === 'string' ? attrs.class : ''].filter(Boolean).join(' ');
-            return h('section', { class: rootClass, 'data-testid': 'rd-chart-bar' }, [
-                h('header', { class: 'rd-chart-bar__header' }, h('span', null, (_a = props.title) !== null && _a !== void 0 ? _a : 'Bar chart')),
-                h('div', { class: 'rd-chart-bar__bars', 'aria-hidden': 'true' }, barHeights.map((height, i) => h('div', { key: i, class: 'rd-chart-bar__bar-wrap' }, h('div', { class: 'rd-chart-bar__bar', style: { height: `${height}%` } })))),
-                (_b = slots.default) === null || _b === void 0 ? void 0 : _b.call(slots),
+            var _a, _b, _c, _d, _e;
+            const rootClass = ['rd-chart-bar', props.className, typeof attrs.class === 'string' ? attrs.class : '']
+                .filter(Boolean)
+                .join(' ');
+            const bars = ((_a = props.bars) === null || _a === void 0 ? void 0 : _a.length) ? props.bars : FALLBACK_BARS;
+            const format = (_b = props.valueFormat) !== null && _b !== void 0 ? _b : defaultFormat;
+            const maxValue = Math.max(...bars.map((bar) => bar.value), 1);
+            const ticks = buildTicks(maxValue);
+            return h('section', {
+                class: rootClass,
+                'data-testid': 'rd-chart-bar',
+                role: 'img',
+                'aria-label': (_c = props.title) !== null && _c !== void 0 ? _c : 'Bar chart',
+            }, [
+                h('header', { class: 'rd-chart-bar__header' }, h('span', null, (_d = props.title) !== null && _d !== void 0 ? _d : 'Bar chart')),
+                h('div', { class: 'rd-chart-bar__body' }, [
+                    h('div', { class: 'rd-chart-bar__y-axis', 'aria-hidden': 'true' }, [
+                        h('div', { class: 'rd-chart-bar__y-ticks' }, [...ticks]
+                            .reverse()
+                            .map((tick) => h('span', { key: tick, class: 'rd-chart-bar__y-tick' }, format(tick)))),
+                        props.yAxisLabel ? h('span', { class: 'rd-chart-bar__y-label' }, props.yAxisLabel) : null,
+                    ]),
+                    h('div', { class: 'rd-chart-bar__plot' }, [
+                        h('div', { class: 'rd-chart-bar__grid-lines', 'aria-hidden': 'true' }, ticks.map((tick) => h('span', {
+                            key: tick,
+                            class: 'rd-chart-bar__grid-line',
+                            style: { bottom: `${(tick / maxValue) * 100}%` },
+                        }))),
+                        h('div', { class: 'rd-chart-bar__bars' }, bars.map((bar) => {
+                            const heightPct = (bar.value / maxValue) * 100;
+                            return h('div', { key: bar.label, class: 'rd-chart-bar__bar-group' }, [
+                                h('div', { class: 'rd-chart-bar__bar-wrap' }, [
+                                    h('div', {
+                                        class: 'rd-chart-bar__bar',
+                                        style: { height: `${heightPct}%` },
+                                        title: `${bar.label}: ${format(bar.value)}`,
+                                    }),
+                                ]),
+                                h('span', { class: 'rd-chart-bar__x-label' }, bar.label),
+                                h('span', { class: 'rd-chart-bar__value' }, format(bar.value)),
+                            ]);
+                        })),
+                    ]),
+                ]),
+                (_e = slots.default) === null || _e === void 0 ? void 0 : _e.call(slots),
             ]);
         };
     },

package/src/visual/chart/bar/bar-chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"bar-chart.js","sourceRoot":"","sources":["../../../../../../../packages/vue/src/visual/chart/bar/bar-chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,CAAC,EAA6C,MAAM,KAAK,CAAC;AAOpF,2DAA2D;AAC3D,MAAM,CAAC,MAAM,QAAQ,GAAG,eAAe,CAAC;IACtC,IAAI,EAAE,YAAY;IAClB,KAAK,EAAE;QACL,SAAS,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;QAC/E,KAAK,EAAE,EAAE,IAAI,EAAE,MAAsC,EAAE,OAAO,EAAE,SAAS,EAAE;KAC5E;IACD,KAAK,EAAE,MAAgD;IACvD,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE;QAC3B,MAAM,UAAU,GAAG,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC;QACxC,OAAO,GAAG,EAAE;;YACV,MAAM,SAAS,GAAG,CAAC,cAAc,EAAE,KAAK,CAAC,SAAS,EAAE,OAAO,KAAK,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;YAClI,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,EAAE;gBACzE,CAAC,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,IAAI,EAAE,MAAA,KAAK,CAAC,KAAK,mCAAI,WAAW,CAAC,CAAC;gBAC3F,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,EAAE,EAAE,UAAU,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAC5F,CAAC,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,KAAK,EAAE,wBAAwB,EAAE,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,GAAG,MAAM,GAAG,EAAE,EAAE,CAAC,CAAC,CACjI,CAAC;gBACF,MAAA,KAAK,CAAC,OAAO,qDAAI;aAClB,CAAC,CAAC;QACH,CAAC,CAAC;IACJ,CAAC;CACF,CAAC,CAAC"}
+{"version":3,"file":"bar-chart.js","sourceRoot":"","sources":["../../../../../../../packages/vue/src/visual/chart/bar/bar-chart.ts"],"names":[],"mappings":"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"}

package/src/visual/chart/line/line-chart.d.ts

@@ -1,6 +1,14 @@
 import { type PropType, type SlotsType, type VNode } from 'vue';
+export interface LineChartPoint {
+    x: string | number;
+    y: number;
+}
 export interface LineChartProps {
     title?: string;
+    points?: LineChartPoint[];
+    xAxisLabel?: string;
+    yAxisLabel?: string;
+    valueFormat?: (value: number) => string;
     className?: string;
 }
 /** @rosettadash/vue/visual/chart/line — visual.chart.line */
@@ -13,6 +21,22 @@ export declare const LineChart: import("vue").DefineComponent<import("vue").Extr
         type: PropType<string | undefined>;
         default: undefined;
     };
+    points: {
+        type: PropType<LineChartPoint[] | undefined>;
+        default: undefined;
+    };
+    xAxisLabel: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    yAxisLabel: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    valueFormat: {
+        type: PropType<((value: number) => string) | undefined>;
+        default: undefined;
+    };
 }>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
     [key: string]: any;
 }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -24,9 +48,29 @@ export declare const LineChart: import("vue").DefineComponent<import("vue").Extr
         type: PropType<string | undefined>;
         default: undefined;
     };
+    points: {
+        type: PropType<LineChartPoint[] | undefined>;
+        default: undefined;
+    };
+    xAxisLabel: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    yAxisLabel: {
+        type: PropType<string | undefined>;
+        default: undefined;
+    };
+    valueFormat: {
+        type: PropType<((value: number) => string) | undefined>;
+        default: undefined;
+    };
 }>> & Readonly<{}>, {
     className: string | undefined;
     title: string | undefined;
+    yAxisLabel: string | undefined;
+    valueFormat: ((value: number) => string) | undefined;
+    points: LineChartPoint[] | undefined;
+    xAxisLabel: string | undefined;
 }, SlotsType<{
     default?: () => VNode[];
 }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;