@tianditu/vue 0.0.0

package/LICENSE

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

package/README.md

@@ -0,0 +1,25 @@
+# @tianditu/vue
+
+![npm version](https://img.shields.io/npm/v/@tianditu/vue)
+![npm downloads](https://img.shields.io/npm/dw/@tianditu/vue)
+![npm license](https://img.shields.io/npm/l/@tianditu/vue)
+[![Contributor Covenant](https://img.shields.io/badge/Contributor%20Covenant-2.1-4baaaa.svg)](https://www.contributor-covenant.org/version/2/1/code_of_conduct/)
+
+> Vue components for tianditu, powered by Demo Macro.
+
+## Getting started
+
+```bash
+# npm
+$ npm install -D @tianditu/web-components @tianditu/vue
+
+# yarn
+$ yarn add -D @tianditu/web-components @tianditu/vue
+
+# pnpm
+$ pnpm add -D @tianditu/web-components @tianditu/vue
+```
+
+## License
+
+- [MIT](LICENSE) © [Demo Macro](https://imst.xyz/)

package/dist/components.d.ts

@@ -0,0 +1,9 @@
+import type { JSX } from "@tianditu/web-components";
+export declare const TControl: import("vue").DefineComponent<JSX.TControl & 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.TControl & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {}>;
+export declare const TMap: import("vue").DefineComponent<JSX.TMap & 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.TMap & import("./vue-component-lib/utils").InputProps<string | number | boolean>>, {
+    projection: any;
+    minZoom: any;
+    maxZoom: any;
+    maxBounds: any;
+    zoom: any;
+}>;

package/dist/components.mjs

@@ -0,0 +1,10 @@
+import { defineContainer } from "./vue-component-lib/utils.mjs";
+export const TControl = /* @__PURE__ */ defineContainer(
+  "t-control",
+  void 0
+);
+export const TMap = /* @__PURE__ */ defineContainer(
+  "t-map",
+  void 0,
+  ["tk", "projection", "minZoom", "maxZoom", "maxBounds", "center", "zoom"]
+);

package/dist/index.d.ts

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

package/dist/index.mjs

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

package/dist/plugin.d.ts

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

package/dist/plugin.mjs

@@ -0,0 +1,11 @@
+import {
+  applyPolyfills,
+  defineCustomElements
+} from "@tianditu/web-components/dist/loader";
+export const ComponentLibrary = {
+  async install() {
+    applyPolyfills().then(() => {
+      defineCustomElements();
+    });
+  }
+};

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

@@ -0,0 +1,20 @@
+export interface InputProps<T> {
+    modelValue?: T;
+}
+/**
+ * Create a callback to define a Vue component wrapper around a Web Component.
+ *
+ * @prop name - The component tag name (i.e. `ion-button`)
+ * @prop componentProps - An array of properties on the
+ * component. These usually match up with the @Prop definitions
+ * in each component's TSX file.
+ * @prop customElement - An option custom element instance to pass
+ * to customElements.define. Only set if `includeImportCustomElements: true` in your config.
+ * @prop modelProp - The prop that v-model binds to (i.e. value)
+ * @prop modelUpdateEvent - The event that is fired from your Web Component when the value changes (i.e. ionChange)
+ * @prop externalModelUpdateEvent - The external event to fire from your Vue component when modelUpdateEvent fires. This is used for ensuring that v-model references have been
+ * correctly updated when a user's event callback fires.
+ */
+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/dist/vue-component-lib/utils.mjs

@@ -0,0 +1,124 @@
+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 ARIA_PROP_PREFIX = "aria";
+const EMPTY_PROP = Symbol();
+const DEFAULT_EMPTY_PROP = { default: EMPTY_PROP };
+const getComponentClasses = (classes) => {
+  return classes?.split(" ") || [];
+};
+const getElementClasses = (ref2, componentClasses, defaultClasses = []) => {
+  return [...Array.from(ref2.value?.classList || []), ...defaultClasses].filter(
+    (c, i, self) => !componentClasses.has(c) && self.indexOf(c) === i
+  );
+};
+export const defineContainer = (name, defineCustomElement, componentProps = [], modelProp, modelUpdateEvent, externalModelUpdateEvent) => {
+  if (defineCustomElement !== void 0) {
+    defineCustomElement();
+  }
+  const Container = defineComponent(
+    (props, { attrs, slots, emit }) => {
+      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?.target)[modelProp];
+              emit(UPDATE_VALUE_EVENT, modelPropValue);
+              if (externalModelUpdateEvent) {
+                emit(externalModelUpdateEvent, e);
+              }
+            });
+          });
+        }
+      };
+      const currentInstance = getCurrentInstance();
+      const hasRouter = currentInstance?.appContext?.provides[NAV_MANAGER];
+      const navManager = hasRouter ? inject(NAV_MANAGER) : void 0;
+      const handleRouterLink = (ev) => {
+        const { routerLink } = props;
+        if (routerLink === EMPTY_PROP)
+          return;
+        if (navManager !== void 0) {
+          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 !== void 0) {
+            oldClick(ev);
+          }
+          if (!ev.defaultPrevented) {
+            handleRouterLink(ev);
+          }
+        };
+        let propsToAdd = {
+          ref: containerRef,
+          class: getElementClasses(containerRef, classes),
+          onClick: handleClick,
+          onVnodeBeforeMount: modelUpdateEvent ? onVnodeBeforeMount : void 0
+        };
+        for (const key in props) {
+          const value = props[key];
+          if (props.hasOwnProperty(key) && value !== EMPTY_PROP || key.startsWith(ARIA_PROP_PREFIX)) {
+            propsToAdd[key] = value;
+          }
+        }
+        if (modelProp) {
+          if (props[MODEL_VALUE] !== EMPTY_PROP) {
+            propsToAdd = {
+              ...propsToAdd,
+              [modelProp]: props[MODEL_VALUE]
+            };
+          } else if (modelPropValue !== EMPTY_PROP) {
+            propsToAdd = {
+              ...propsToAdd,
+              [modelProp]: modelPropValue
+            };
+          }
+        }
+        return h(name, propsToAdd, slots.default && slots.default());
+      };
+    }
+  );
+  Container.name = 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;
+};

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@tianditu/vue",
+  "version": "0.0.0",
+  "description": "Vue components for tianditu, powered by Demo Macro.",
+  "main": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/DemoMacro/tianditu.git"
+  },
+  "keywords": [
+    "utility",
+    "libraries",
+    "tianditu",
+    "map",
+    "vue"
+  ],
+  "author": {
+    "name": "Demo Macro",
+    "email": "abc@imst.xyz",
+    "url": "https://imst.xyz/"
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/DemoMacro/tianditu/issues"
+  },
+  "homepage": "https://github.com/DemoMacro/tianditu#readme",
+  "devDependencies": {
+    "vue": "3.2.47",
+    "@tianditu/web-components": "0.0.0"
+  },
+  "scripts": {}
+}