@wwtdev/bsds-components-vue3 0.0.3

package/README.md

@@ -0,0 +1,11 @@
+# `components-vue3`
+
+> TODO: description
+
+## Usage
+
+```
+const componentsVue3 = require('components-vue3');
+
+// TODO: DEMONSTRATE API
+```

package/lib/components.d.ts

@@ -0,0 +1,2 @@
+import type { JSX } from '@wwtdev/bsds-components';
+export declare const BsButton: import("vue").DefineComponent<JSX.BsButton & import("./vue-component-lib/utils").InputProps<string | number | boolean>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<JSX.BsButton & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;

package/lib/components.js

@@ -0,0 +1,11 @@
+import { defineContainer } from './vue-component-lib/utils';
+export const BsButton = defineContainer('bs-button', undefined, [
+    'variant',
+    'disabled',
+    'ghostBtn',
+    'linkTo',
+    'passAttrs',
+    'textBtn',
+    'size'
+]);
+//# sourceMappingURL=components.js.map

package/lib/components.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components.js","sourceRoot":"","sources":["../src/components.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAO5D,MAAM,CAAC,MAAM,QAAQ,GAAiB,eAAe,CAAe,WAAW,EAAE,SAAS,EAAE;IAC1F,SAAS;IACT,UAAU;IACV,UAAU;IACV,QAAQ;IACR,WAAW;IACX,SAAS;IACT,MAAM;CACP,CAAC,CAAC"}

package/lib/index.d.ts

@@ -0,0 +1,2 @@
+export * from './components';
+export * from './plugin';

package/lib/index.js

@@ -0,0 +1,3 @@
+export * from './components';
+export * from './plugin';
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC"}

package/lib/plugin.d.ts

@@ -0,0 +1,2 @@
+import { Plugin } from 'vue';
+export declare const ComponentLibrary: Plugin;

package/lib/plugin.js

@@ -0,0 +1,9 @@
+import { applyPolyfills, defineCustomElements } from '@wwtdev/bsds-components/loader';
+export const ComponentLibrary = {
+    async install() {
+        applyPolyfills().then(() => {
+            defineCustomElements();
+        });
+    },
+};
+//# sourceMappingURL=plugin.js.map

package/lib/plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin.js","sourceRoot":"","sources":["../src/plugin.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AAEtF,MAAM,CAAC,MAAM,gBAAgB,GAAW;IACtC,KAAK,CAAC,OAAO;QACX,cAAc,EAAE,CAAC,IAAI,CAAC,GAAG,EAAE;YACzB,oBAAoB,EAAE,CAAC;QACzB,CAAC,CAAC,CAAC;IACL,CAAC;CACF,CAAC"}

package/lib/vue-component-lib/utils.d.ts

@@ -0,0 +1,6 @@
+export interface InputProps<T> {
+    modelValue?: T;
+}
+export declare const defineContainer: <Props, VModelType = string | number | boolean>(name: string, defineCustomElement: any, componentProps?: string[], modelProp?: string, modelUpdateEvent?: string, externalModelUpdateEvent?: string) => import("vue").DefineComponent<Props & InputProps<VModelType>, object, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<Props & InputProps<VModelType> extends infer T ? T extends Props & InputProps<VModelType> ? T extends import("vue").ComponentPropsOptions<{
+    [x: string]: unknown;
+}> ? import("vue").ExtractPropTypes<T> : T : never : never>, import("vue").ExtractDefaultPropTypes<Props & InputProps<VModelType>>>;

package/lib/vue-component-lib/utils.js

@@ -0,0 +1,111 @@
+import { defineComponent, getCurrentInstance, h, inject, ref } from 'vue';
+const UPDATE_VALUE_EVENT = 'update:modelValue';
+const MODEL_VALUE = 'modelValue';
+const ROUTER_LINK_VALUE = 'routerLink';
+const NAV_MANAGER = 'navManager';
+const ROUTER_PROP_PREFIX = 'router';
+const EMPTY_PROP = Symbol();
+const DEFAULT_EMPTY_PROP = { default: EMPTY_PROP };
+const getComponentClasses = (classes) => {
+    return (classes === null || classes === void 0 ? void 0 : classes.split(' ')) || [];
+};
+const getElementClasses = (ref, componentClasses, defaultClasses = []) => {
+    var _a;
+    return [...Array.from(((_a = ref.value) === null || _a === void 0 ? void 0 : _a.classList) || []), ...defaultClasses]
+        .filter((c, i, self) => !componentClasses.has(c) && self.indexOf(c) === i);
+};
+export const defineContainer = (name, defineCustomElement, componentProps = [], modelProp, modelUpdateEvent, externalModelUpdateEvent) => {
+    if (defineCustomElement !== undefined) {
+        defineCustomElement();
+    }
+    const Container = defineComponent((props, { attrs, slots, emit }) => {
+        var _a;
+        let modelPropValue = props[modelProp];
+        const containerRef = ref();
+        const classes = new Set(getComponentClasses(attrs.class));
+        const onVnodeBeforeMount = (vnode) => {
+            if (vnode.el) {
+                const eventsNames = Array.isArray(modelUpdateEvent) ? modelUpdateEvent : [modelUpdateEvent];
+                eventsNames.forEach((eventName) => {
+                    vnode.el.addEventListener(eventName.toLowerCase(), (e) => {
+                        modelPropValue = (e === null || e === void 0 ? void 0 : e.target)[modelProp];
+                        emit(UPDATE_VALUE_EVENT, modelPropValue);
+                        if (externalModelUpdateEvent) {
+                            emit(externalModelUpdateEvent, e);
+                        }
+                    });
+                });
+            }
+        };
+        const currentInstance = getCurrentInstance();
+        const hasRouter = (_a = currentInstance === null || currentInstance === void 0 ? void 0 : currentInstance.appContext) === null || _a === void 0 ? void 0 : _a.provides[NAV_MANAGER];
+        const navManager = hasRouter ? inject(NAV_MANAGER) : undefined;
+        const handleRouterLink = (ev) => {
+            const { routerLink } = props;
+            if (routerLink === EMPTY_PROP)
+                return;
+            if (navManager !== undefined) {
+                let navigationPayload = { event: ev };
+                for (const key in props) {
+                    const value = props[key];
+                    if (props.hasOwnProperty(key) && key.startsWith(ROUTER_PROP_PREFIX) && value !== EMPTY_PROP) {
+                        navigationPayload[key] = value;
+                    }
+                }
+                navManager.navigate(navigationPayload);
+            }
+            else {
+                console.warn('Tried to navigate, but no router was found. Make sure you have mounted Vue Router.');
+            }
+        };
+        return () => {
+            modelPropValue = props[modelProp];
+            getComponentClasses(attrs.class).forEach(value => {
+                classes.add(value);
+            });
+            const oldClick = props.onClick;
+            const handleClick = (ev) => {
+                if (oldClick !== undefined) {
+                    oldClick(ev);
+                }
+                if (!ev.defaultPrevented) {
+                    handleRouterLink(ev);
+                }
+            };
+            let propsToAdd = {
+                ref: containerRef,
+                class: getElementClasses(containerRef, classes),
+                onClick: handleClick,
+                onVnodeBeforeMount: (modelUpdateEvent) ? onVnodeBeforeMount : undefined
+            };
+            for (const key in props) {
+                const value = props[key];
+                if (props.hasOwnProperty(key) && value !== EMPTY_PROP) {
+                    propsToAdd[key] = value;
+                }
+            }
+            if (modelProp) {
+                if (props[MODEL_VALUE] !== EMPTY_PROP) {
+                    propsToAdd = Object.assign(Object.assign({}, propsToAdd), { [modelProp]: props[MODEL_VALUE] });
+                }
+                else if (modelPropValue !== EMPTY_PROP) {
+                    propsToAdd = Object.assign(Object.assign({}, propsToAdd), { [modelProp]: modelPropValue });
+                }
+            }
+            return h(name, propsToAdd, slots.default && slots.default());
+        };
+    });
+    Container.displayName = name;
+    Container.props = {
+        [ROUTER_LINK_VALUE]: DEFAULT_EMPTY_PROP
+    };
+    componentProps.forEach(componentProp => {
+        Container.props[componentProp] = DEFAULT_EMPTY_PROP;
+    });
+    if (modelProp) {
+        Container.props[MODEL_VALUE] = DEFAULT_EMPTY_PROP;
+        Container.emits = [UPDATE_VALUE_EVENT, externalModelUpdateEvent];
+    }
+    return Container;
+};
+//# sourceMappingURL=utils.js.map

package/lib/vue-component-lib/utils.js.map

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

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@wwtdev/bsds-components-vue3",
+  "version": "0.0.3",
+  "description": "BSDS Vue3 Components",
+  "homepage": "",
+  "license": "ISC",
+  "main": "lib/index.js",
+  "types": "lib/index.d.ts",
+  "directories": {
+    "lib": "lib",
+    "test": "__tests__"
+  },
+  "files": [
+    "lib"
+  ],
+  "publishConfig": {
+    "registry": "https://npm.wwt.com/"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.wwt.com/custom-apps/wwt-blue-steel.git"
+  },
+  "scripts": {
+    "build": "npm run tsc",
+    "test": "echo \"Error: run tests from root\" && exit 1",
+    "tsc": "tsc -p .",
+    "publish-wwt": "publish-wwt-package --monorepo",
+    "publish-npm": "npm publish --@wwtdev:registry=https://registry.npmjs.org --access=public"
+  },
+  "devDependencies": {
+    "vue": "^3.2.39",
+    "wwt-package-publisher": "^4.1.2"
+  },
+  "dependencies": {
+    "@wwtdev/bsds-components": "*"
+  }
+}