casc-cesium/es/components/ui/fab/fab.mjs.map

Vue 3.x components for CesiumJS.

{"version":3,"file":"fab.mjs","sources":["../../../../../../packages/components/ui/fab/fab.ts"],"sourcesContent":["import { h, defineComponent, ref, computed, provide, ComponentPublicInstance } from 'vue'\nimport type { VNode, ExtractPropTypes } from 'vue'\nimport useModelToggle, { useModelToggleEmits } from 'casc-cesium-composables/private/use-model-toggle'\nimport { hSlot, hMergeSlot } from 'casc-cesium-utils/private/render'\nimport { fabKey } from 'casc-cesium-utils/config'\nimport useFab from './use-fab'\nimport VcBtn from '../btn'\nimport VcIcon from '../icon'\nimport defaultProps from './defaultProps'\nimport { LooseDictionary } from 'casc-cesium-utils/types'\n\nexport const fabProps = defaultProps\nexport default defineComponent({\n  name: 'VcFab',\n\n  props: fabProps,\n\n  emits: useModelToggleEmits,\n\n  setup(props, { slots }) {\n    const triggerRef = ref<typeof VcBtn>(null!)\n\n    const showing = ref(props.modelValue === true)\n    const { formClass, labelProps } = useFab(props, showing)\n\n    const hideOnRouteChange = computed(() => props.persistent !== true)\n\n    const { hide, toggle } = useModelToggle({\n      showing,\n      hideOnRouteChange\n    })\n\n    const slotScope = computed(() => ({ opened: showing.value }))\n\n    const classes = computed(\n      () =>\n        'vc-fab z-fab row inline justify-center' +\n        ` vc-fab--align-${props.verticalActionsAlign} ${formClass.value}` +\n        (showing.value === true ? ' vc-fab--opened' : ' vc-fab--closed')\n    )\n\n    const actionClass = computed(\n      () =>\n        'vc-fab__actions flex no-wrap inline' +\n        ` vc-fab__actions--${props.direction}` +\n        ` vc-fab__actions--${showing.value === true ? 'opened' : 'closed'}`\n    )\n\n    const iconHolderClass = computed(() => 'vc-fab__icon-holder ' + ` vc-fab__icon-holder--${showing.value === true ? 'opened' : 'closed'}`)\n\n    function getIcon(kebab, camel) {\n      const slotFn = slots[kebab]\n      const classes = `q-fab__${kebab} absolute-full`\n\n      return slotFn === void 0 ? h(VcIcon, { class: classes, name: props[kebab] as any }) : h('div', { class: classes }, slotFn(slotScope.value))\n    }\n\n    function getTriggerContent() {\n      const child: Array<VNode> = []\n\n      props.hideIcon !== true &&\n        child.push(h('div', { class: iconHolderClass.value }, [getIcon('icon', 'icon'), getIcon('active-icon', 'activeIcon')]))\n\n      if (props.label !== '' || slots.label !== void 0) {\n        child[labelProps.value.action](h('div', labelProps.value.data, slots.label !== void 0 ? slots.label(slotScope.value) : [props.label]))\n      }\n\n      return hMergeSlot(slots.tooltip, child)\n    }\n\n    provide(fabKey, {\n      showing,\n\n      onChildClick(evt) {\n        props.hideActionOnClick && hide(evt)\n\n        if (triggerRef.value !== null) {\n          triggerRef.value.$el.focus()\n        }\n      }\n    })\n\n    return () =>\n      h(\n        'div',\n        {\n          class: classes.value\n        },\n        [\n          h(\n            VcBtn,\n            {\n              ref: triggerRef,\n              class: formClass.value,\n              ...props,\n              noWrap: true,\n              stack: props.stacked,\n              align: void 0,\n              icon: void 0,\n              label: void 0,\n              noCaps: true,\n              fab: true,\n              flat: props.flat,\n              size: props.size,\n              'aria-expanded': showing.value === true ? 'true' : 'false',\n              'aria-haspopup': 'true',\n              onClick: toggle\n            },\n            getTriggerContent\n          ),\n\n          h('div', { class: actionClass.value }, hSlot(slots.default))\n        ]\n      )\n  }\n})\n\n// export type VcFabProps = ExtractPropTypes<typeof fabProps>\n\nexport interface VcFabProps {\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   * Controls state of fab actions (showing/hidden); Works best with v-model directive, otherwise use along listening to 'update:modelValue' event.\n   */\n  modelValue?: boolean\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   * Icon name following VueCesium convention; Make sure you have the icon library installed unless you are using 'img:' prefix.\n   */\n  activeIcon?: string | undefined\n  /**\n   * Hide the icon (don't use any).\n   */\n  hideIcon?: boolean | undefined\n  /**\n   * Direction to expand Fab Actions to.\n   * Default value: right\n   */\n  direction?: 'up' | 'right' | 'down' | 'left' | undefined\n  /**\n   * The side of the Fab where Fab Actions will expand (only when direction is 'up' or 'down').\n   * Default value: center\n   */\n  verticalActionsAlign?: 'left' | 'center' | 'right' | undefined\n  /**\n   * By default, Fab Actions are hidden when user navigates to another route and this prop disables this behavior.\n   */\n  persistent?: boolean | undefined\n  /**\n   * Emitted when fab actions are shown/hidden; Captured by v-model directive.\n   * @param value New state (showing/hidden)\n   */\n  'onUpdate:modelValue'?: (value: boolean) => void\n  /**\n   * Emitted after component has triggered show()\n   * @param evt JS event object\n   */\n  onShow?: (evt: LooseDictionary) => void\n  /**\n   * Emitted when component triggers show() but before it finishes doing it\n   * @param evt JS event object\n   */\n  onBeforeShow?: (evt: LooseDictionary) => void\n  /**\n   * Emitted after component has triggered hide()\n   * @param evt JS event object\n   */\n  onHide?: (evt: LooseDictionary) => void\n  /**\n   * Emitted when component triggers hide() but before it finishes doing it\n   * @param evt JS event object\n   */\n  onBeforeHide?: (evt: LooseDictionary) => void\n}\n\nexport interface VcFabSlots {\n  /**\n   * This is where VcFabActions may go into\n   */\n  default: () => VNode[]\n  /**\n   * Slot specifically designed for a VcTooltip\n   */\n  tooltip: () => VNode[]\n  /**\n   * Slot for icon shown when FAB is closed; Suggestion: VcIcon\n   * @param scope\n   */\n  icon: (scope: {\n    /**\n     * FAB is opened\n     */\n    opened: boolean\n  }) => VNode[]\n  /**\n   * Slot for icon shown when FAB is opened; Suggestion: VcIcon\n   * @param scope\n   */\n  'active-icon': (scope: {\n    /**\n     * FAB is opened\n     */\n    opened: boolean\n  }) => VNode[]\n  /**\n   * Slot for label\n   * @param scope\n   */\n  label: (scope: {\n    /**\n     * FAB is opened\n     */\n    opened: boolean\n  }) => VNode[]\n}\n\nexport interface VcFabRef extends ComponentPublicInstance<VcFabProps> {\n  /**\n   * Expands fab actions list\n   * @param evt JS event object\n   */\n  show: (evt?: LooseDictionary) => void\n  /**\n   * Collapses fab actions list\n   * @param evt JS event object\n   */\n  hide: (evt?: LooseDictionary) => void\n  /**\n   * Triggers component to toggle between show/hide\n   * @param evt JS event object\n   */\n  toggle: (evt?: LooseDictionary) => void\n}\n"],"names":["VcIcon","VcBtn"],"mappings":"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"}