imooc-cli-dev-components44 1.0.0 → 1.0.1

package/dist/components/LText/LText.vue.d.ts

@@ -0,0 +1,280 @@
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    text: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontSize: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontFamily: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontWeight: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontStyle: {
+        type: StringConstructor;
+        default: string;
+    };
+    textDecoration: {
+        type: StringConstructor;
+        default: string;
+    };
+    lineHeight: {
+        type: StringConstructor;
+        default: string;
+    };
+    textAlign: {
+        type: StringConstructor;
+        default: string;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+    backgroundColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    actionType: {
+        type: StringConstructor;
+        default: string;
+    };
+    url: {
+        type: StringConstructor;
+        default: string;
+    };
+    height: {
+        type: StringConstructor;
+        default: string;
+    };
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingLeft: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingRight: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingTop: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingBottom: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderStyle: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderRadius: {
+        type: StringConstructor;
+        default: string;
+    };
+    boxShadow: {
+        type: StringConstructor;
+        default: string;
+    };
+    opacity: {
+        type: StringConstructor;
+        default: string;
+    };
+    position: {
+        type: StringConstructor;
+        default: string;
+    };
+    left: {
+        type: StringConstructor;
+        default: string;
+    };
+    top: {
+        type: StringConstructor;
+        default: string;
+    };
+    right: {
+        type: StringConstructor;
+        default: string;
+    };
+    isEditing: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}>, {
+    styleProps: import("vue").ComputedRef<Partial<Readonly<Partial<import("../../defaultProps").CommonComponentProps & {
+        isEditing: boolean;
+    }>>>>;
+    handleClick: () => void;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    text: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontSize: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontFamily: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontWeight: {
+        type: StringConstructor;
+        default: string;
+    };
+    fontStyle: {
+        type: StringConstructor;
+        default: string;
+    };
+    textDecoration: {
+        type: StringConstructor;
+        default: string;
+    };
+    lineHeight: {
+        type: StringConstructor;
+        default: string;
+    };
+    textAlign: {
+        type: StringConstructor;
+        default: string;
+    };
+    color: {
+        type: StringConstructor;
+        default: string;
+    };
+    backgroundColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    actionType: {
+        type: StringConstructor;
+        default: string;
+    };
+    url: {
+        type: StringConstructor;
+        default: string;
+    };
+    height: {
+        type: StringConstructor;
+        default: string;
+    };
+    width: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingLeft: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingRight: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingTop: {
+        type: StringConstructor;
+        default: string;
+    };
+    paddingBottom: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderStyle: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderColor: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+    borderRadius: {
+        type: StringConstructor;
+        default: string;
+    };
+    boxShadow: {
+        type: StringConstructor;
+        default: string;
+    };
+    opacity: {
+        type: StringConstructor;
+        default: string;
+    };
+    position: {
+        type: StringConstructor;
+        default: string;
+    };
+    left: {
+        type: StringConstructor;
+        default: string;
+    };
+    top: {
+        type: StringConstructor;
+        default: string;
+    };
+    right: {
+        type: StringConstructor;
+        default: string;
+    };
+    isEditing: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}>> & Readonly<{}>, {
+    text: string;
+    fontSize: string;
+    fontFamily: string;
+    fontWeight: string;
+    fontStyle: string;
+    textDecoration: string;
+    lineHeight: string;
+    textAlign: string;
+    color: string;
+    backgroundColor: string;
+    actionType: string;
+    url: string;
+    height: string;
+    width: string;
+    paddingLeft: string;
+    paddingRight: string;
+    paddingTop: string;
+    paddingBottom: string;
+    borderStyle: string;
+    borderColor: string;
+    borderWidth: string;
+    borderRadius: string;
+    boxShadow: string;
+    opacity: string;
+    position: string;
+    left: string;
+    top: string;
+    right: string;
+    tag: string;
+    isEditing: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/components/LText/index.d.ts

@@ -0,0 +1,2 @@
+import LText from './LText.vue';
+export default LText;

package/dist/defaultProps.d.ts

@@ -0,0 +1,61 @@
+export interface CommonComponentProps {
+    actionType: string;
+    url: string;
+    height: string;
+    width: string;
+    paddingLeft: string;
+    paddingRight: string;
+    paddingTop: string;
+    paddingBottom: string;
+    borderStyle: string;
+    borderColor: string;
+    borderWidth: string;
+    borderRadius: string;
+    boxShadow: string;
+    opacity: string;
+    position: string;
+    left: string;
+    top: string;
+    right: string;
+}
+export declare const commonDefaultProps: CommonComponentProps;
+export interface TextComponentProps extends CommonComponentProps {
+    text: string;
+    fontSize: string;
+    fontFamily: string;
+    fontWeight: string;
+    fontStyle: string;
+    textDecoration: string;
+    lineHeight: string;
+    textAlign: string;
+    color: string;
+    backgroundColor: string;
+}
+export interface ImageComponentProps extends CommonComponentProps {
+    src: string;
+}
+export interface ShapeComponentProps extends CommonComponentProps {
+    backgroundColor: string;
+}
+export type AllComponentProps = TextComponentProps & ImageComponentProps & ShapeComponentProps;
+export declare const textDefaultProps: TextComponentProps;
+export declare const imageDefaultProps: ImageComponentProps;
+export declare const shapeDefaultProps: ShapeComponentProps;
+export declare const isEditingProp: {
+    isEditing: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};
+export declare const textStylePropNames: string[];
+export declare const imageStylePropsNames: string[];
+export declare const shapeStylePropsNames: string[];
+export declare const transformToComponentProps: <T extends {}>(props: T) => { [P in keyof T]: {
+    type: StringConstructor;
+    default: T[keyof T];
+}; } & {
+    isEditing: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+};

package/dist/hooks/useComponentCommon.d.ts

@@ -0,0 +1,10 @@
+import { CommonComponentProps } from '../defaultProps';
+declare const useComponentCommon: (props: Readonly<Partial<CommonComponentProps & {
+    isEditing: boolean;
+}>>, picks: string[]) => {
+    styleProps: import("vue").ComputedRef<Partial<Readonly<Partial<CommonComponentProps & {
+        isEditing: boolean;
+    }>>>>;
+    handleClick: () => void;
+};
+export default useComponentCommon;

package/dist/imooc-cli-dev-components44.esm.js

@@ -0,0 +1,217 @@
+/* eslint-disable */
+import { without, mapValues, pick } from 'lodash-es';
+import { computed, defineComponent, openBlock, createBlock, resolveDynamicComponent, normalizeStyle, withCtx, createTextVNode, toDisplayString, createElementBlock, withModifiers } from 'vue';
+
+const commonDefaultProps = {
+    // actions
+    actionType: '',
+    url: '',
+    // size
+    height: '',
+    width: '373px',
+    paddingLeft: '0px',
+    paddingRight: '0px',
+    paddingTop: '0px',
+    paddingBottom: '0px',
+    // border type
+    borderStyle: 'none',
+    borderColor: '#000',
+    borderWidth: '0',
+    borderRadius: '0',
+    // shadow and opacity
+    boxShadow: '0 0 0 #000000',
+    opacity: '1',
+    // position and x,y
+    position: 'absolute',
+    left: '0',
+    top: '0',
+    right: '0'
+};
+const textDefaultProps = {
+    // basic props - font styles
+    text: '正文内容',
+    fontSize: '14px',
+    fontFamily: '',
+    fontWeight: 'normal',
+    fontStyle: 'normal',
+    textDecoration: 'none',
+    lineHeight: '1',
+    textAlign: 'left',
+    color: '#000000',
+    backgroundColor: '',
+    ...commonDefaultProps
+};
+const imageDefaultProps = {
+    src: 'test.url',
+    ...commonDefaultProps
+};
+const shapeDefaultProps = {
+    backgroundColor: '',
+    ...commonDefaultProps
+};
+const isEditingProp = {
+    isEditing: {
+        type: Boolean,
+        default: false
+    }
+};
+const textStylePropNames = without(Object.keys(textDefaultProps), 'actionType', 'url', 'text');
+const imageStylePropsNames = without(Object.keys(imageDefaultProps), 'actionType', 'url', 'src');
+const shapeStylePropsNames = without(Object.keys(imageDefaultProps), 'actionType', 'url');
+const transformToComponentProps = (props) => {
+    const mapProps = mapValues(props, (item) => {
+        return {
+            type: item.constructor,
+            default: item
+        };
+    });
+    return { ...mapProps, ...isEditingProp };
+};
+
+const useComponentCommon = (props, picks) => {
+    const styleProps = computed(() => pick(props, picks));
+    const handleClick = () => {
+        if (props.actionType === 'url' && props.url && !props.isEditing) {
+            window.location.href = props.url;
+        }
+    };
+    return {
+        styleProps,
+        handleClick
+    };
+};
+
+const defaultProps$2 = transformToComponentProps(textDefaultProps);
+// array that contains style props
+var script$2 = defineComponent({
+    name: 'l-text',
+    props: {
+        tag: {
+            type: String,
+            default: 'div'
+        },
+        ...defaultProps$2
+    },
+    setup(props) {
+        // 重用并且简化
+        // 抽离并且获得 styleProps
+        const { styleProps, handleClick } = useComponentCommon(props, textStylePropNames);
+        return {
+            styleProps,
+            handleClick
+        };
+    }
+});
+
+function render$2(_ctx, _cache, $props, $setup, $data, $options) {
+  return (openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
+    style: normalizeStyle(_ctx.styleProps),
+    class: "l-text-component",
+    onClick: _ctx.handleClick
+  }, {
+    default: withCtx(() => [
+      createTextVNode(toDisplayString(_ctx.text), 1 /* TEXT */)
+    ]),
+    _: 1 /* STABLE */
+  }, 8 /* PROPS */, ["style", "onClick"]))
+}
+
+script$2.render = render$2;
+script$2.__scopeId = "data-v-6bf95b7a";
+script$2.__file = "src/components/LText/LText.vue";
+
+// import { App } from 'vue'
+script$2.install = (app) => {
+    app.component(script$2.name, script$2);
+};
+
+const defaultProps$1 = transformToComponentProps(imageDefaultProps);
+// array that contains style props
+var script$1 = defineComponent({
+    name: 'l-image',
+    props: {
+        ...defaultProps$1
+    },
+    setup(props) {
+        // 重用并且简化
+        // 抽离并且获得 styleProps
+        const { styleProps, handleClick } = useComponentCommon(props, imageStylePropsNames);
+        return {
+            styleProps,
+            handleClick
+        };
+    }
+});
+
+const _hoisted_1 = ["src"];
+
+function render$1(_ctx, _cache, $props, $setup, $data, $options) {
+  return (openBlock(), createElementBlock("img", {
+    style: normalizeStyle(_ctx.styleProps),
+    class: "l-image-component",
+    onClick: _cache[0] || (_cache[0] = withModifiers((...args) => (_ctx.handleClick && _ctx.handleClick(...args)), ["prevent"])),
+    src: _ctx.src
+  }, null, 12 /* STYLE, PROPS */, _hoisted_1))
+}
+
+script$1.render = render$1;
+script$1.__scopeId = "data-v-1e970aa2";
+script$1.__file = "src/components/LImage/LImage.vue";
+
+// import { App } from 'vue'
+script$1.install = (app) => {
+    app.component(script$1.name, script$1);
+};
+
+const defaultProps = transformToComponentProps(shapeDefaultProps);
+// array that contains style props
+var script = defineComponent({
+    name: 'l-shape',
+    props: {
+        ...defaultProps
+    },
+    setup(props) {
+        // 重用并且简化
+        // 抽离并且获得 styleProps
+        const { styleProps, handleClick } = useComponentCommon(props, shapeStylePropsNames);
+        return {
+            styleProps,
+            handleClick
+        };
+    }
+});
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return (openBlock(), createElementBlock("div", {
+    style: normalizeStyle(_ctx.styleProps),
+    class: "l-shape-component",
+    onClick: _cache[0] || (_cache[0] = withModifiers((...args) => (_ctx.handleClick && _ctx.handleClick(...args)), ["prevent"]))
+  }, null, 4 /* STYLE */))
+}
+
+script.render = render;
+script.__file = "src/components/LShape/LShape.vue";
+
+// import { App } from 'vue'
+script.install = (app) => {
+    app.component(script.name, script);
+};
+
+// import   { App } from 'vue'
+const components = [
+    script$2,
+    script$1,
+    script
+];
+// @ts-ignore
+const install = (app) => {
+    components.forEach(component => {
+        app.component(component.name, component);
+    });
+};
+var index = {
+    install
+};
+
+export { script$1 as LImage, script as LShape, script$2 as LText, index as default, imageDefaultProps, imageStylePropsNames, install, shapeDefaultProps, shapeStylePropsNames, textDefaultProps, textStylePropNames };
+/* Powered by www.imooc.com */