vue-cesium-jyt
Version:
Vue 3.x components for CesiumJS.
1 lines • 7.62 kB
Source Map (JSON)
{"version":3,"file":"fab-action.mjs","sources":["../../../../../../packages/components/ui/fab/fab-action.ts"],"sourcesContent":["/*\n * @Author: zouyaoji@https://github.com/zouyaoji\n * @Date: 2021-09-16 09:28:13\n * @LastEditTime: 2022-01-22 09:39:46\n * @LastEditors: zouyaoji\n * @Description:\n * @FilePath: \\vue-cesium@next\\packages\\components\\ui\\fab\\fab-action.ts\n */\nimport { h, defineComponent, computed, inject, getCurrentInstance } from 'vue'\nimport type { VNode, ExtractPropTypes } from 'vue'\nimport { fabKey } from '@vue-cesium/utils/config'\nimport { hMergeSlot } from '@vue-cesium/utils/private/render'\n\nimport VcBtn from '../btn'\nimport VcIcon from '../icon'\nimport useFab from './use-fab'\nimport defaultPropsAction, { anchorMap } from './defaultPropsAction'\n\ninterface FabData {\n showing?: {\n value: boolean\n }\n onChildClick?(...args: any[]): any\n}\n\nexport const fabActionProps = defaultPropsAction\nexport default defineComponent({\n name: 'VcFabAction',\n\n props: fabActionProps,\n\n emits: ['click'],\n\n setup(props, { slots, emit }) {\n const $fab = inject<FabData>(fabKey)\n\n const { formClass, labelProps } = useFab(props, $fab?.showing)\n\n const classes = computed(() => {\n let align = undefined\n if (props.anchor) {\n align = anchorMap[props.anchor]\n }\n return formClass.value + (align !== void 0 ? ` ${align}` : '')\n })\n\n const isDisabled = computed(() => props.disable === true || $fab?.showing?.value !== true)\n\n function click(e) {\n $fab?.onChildClick?.(e)\n emit('click', e)\n }\n\n function getContent() {\n const child: Array<VNode> = []\n\n props.icon !== '' && child.push(h(VcIcon, { name: props.icon }))\n\n props.label !== '' && child[labelProps.value.action](h('div', labelProps.value.data, [props.label]))\n\n return hMergeSlot(slots.default, child)\n }\n\n // expose public methods\n const vm = getCurrentInstance()\n Object.assign(vm?.proxy, { click })\n\n return () =>\n h(\n VcBtn,\n {\n class: classes.value,\n ...props,\n noWrap: true,\n stack: props.stacked,\n icon: void 0,\n label: void 0,\n noCaps: true,\n fabMini: true,\n disable: isDisabled.value,\n size: props.size,\n onClick: click\n },\n getContent\n )\n }\n})\n\n// export type VcFabActionProps = ExtractPropTypes<typeof fabActionProps>\n\nexport interface VcFabActionProps {\n /**\n * Define the button HTML DOM type.\n * Default value: a\n */\n type?: 'a' | 'submit' | 'button' | 'reset' | undefined\n /**\n * Use 'outline' design for Fab button.\n */\n outline?: boolean | undefined\n /**\n * Use 'push' design for Fab button.\n */\n push?: boolean | undefined\n /**\n * Use 'flat' design for Fab button.\n */\n flat?: boolean | undefined\n /**\n * Remove shadow\n */\n unelevated?: boolean | undefined\n /**\n * Apply custom padding (vertical [horizontal]); Size in CSS units, including unit name or standard size name (none|xs|sm|md|lg|xl); Also removes the min width and height when set.\n */\n padding?: string | undefined\n /**\n * Color name for component from the css color palette.\n */\n color?: string | undefined\n /**\n * Overrides text color (if needed); Color name from the css color palette.\n */\n textColor?: string | undefined\n /**\n * Apply the glossy effect over the button.\n */\n glossy?: boolean | undefined\n /**\n * Display label besides the FABs, as external content.\n */\n externalLabel?: boolean | undefined\n /**\n * The label that will be shown when Fab is extended.\n */\n label?: string | number | undefined\n /**\n * Position of the label around the icon.\n */\n labelPosition?: 'top' | 'right' | 'bottom' | 'left' | undefined\n /**\n * Hide the label; Useful for animation purposes where you toggle the visibility of the label.\n */\n hideLabel?: boolean | undefined\n /**\n * Class definitions to be attributed to the label container.\n */\n labelClass?: any[] | string | any | undefined\n /**\n * Style definitions to be attributed to the label container.\n */\n labelStyle?: any[] | string | any | undefined\n /**\n * Apply a rectangle aspect to the FAB.\n */\n square?: boolean | undefined\n /**\n * Put component in disabled mode.\n */\n disable?: boolean | undefined\n /**\n * Tabindex HTML attribute value.\n */\n tabindex?: number | string | undefined\n /**\n * Icon name following VueCesium convention; Make sure you have the icon library installed unless you are using 'img:' prefix.\n */\n icon?: string | undefined\n /**\n * How to align the Fab Action relative to Fab expand side; By default it uses the align specified in QFab.\n */\n anchor?: 'start' | 'center' | 'end' | undefined\n /**\n * Equivalent to Vue Router <router-link> 'to' property.\n */\n to?: string | any | undefined\n /**\n * Equivalent to Vue Router <router-link> 'replace' property.\n */\n replace?: boolean | undefined\n /**\n * Emitted when user clicks/taps on the component.\n * @param evt JS event object\n */\n onClick?: (evt: any) => void\n}\n"],"names":["defaultPropsAction","VcIcon","VcBtn"],"mappings":"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"}