@gradient-ui/core 0.8.0 → 2.0.0

package/dist/components/GChip.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const vue=require("vue"),components_GGradient=require("./GGradient.cjs"),actionSurface=require("../actionSurface-Db2TksPm.cjs"),px=require("../px-CVkec5Jf.cjs"),gradient=require("../gradient-Bf_C3oqp.cjs"),propsFactory=require("../propsFactory-DT6-QS4L.cjs"),_pluginVue_exportHelper=require("../_plugin-vue_export-helper-D_jf5u0r.cjs"),makeChipProps=propsFactory.propsFactory({...actionSurface.makeActionSurfaceProps(),...gradient.makeGradientProps({borderWidth:void 0,borderRadius:20,placement:"center",rounded:!0}),label:String,prependIcon:String,appendIcon:String,removable:Boolean,onRemove:Function}),_hoisted_1={key:0,class:"g-chip__prepend"},_hoisted_2={class:"g-chip__label"},_hoisted_3={key:1,class:"g-chip__append"},_sfc_main=vue.defineComponent({__name:"GChip",props:makeChipProps(),emits:["remove"],setup(__props,{emit:__emit}){vue.useCssVars(_ctx=>({v309eb36c:vue.unref(computedBorderRadius)}));const slots=vue.useSlots(),props=__props,emit=__emit,computedBorderRadius=px.usePx(props.borderRadius),resolvedBorderWidth=vue.computed(()=>props.borderWidth??(props.variant==="glass"||props.glow||props.animateGlow?1:0)),{actionSurfaceClasses,resolvedColor,resolvedState,surfaceStyles,surfaceMaterialMorphBlobClasses,surfaceMaterialMorphClasses,surfaceOverlayClasses,surfaceUnderlayClasses,surfaceTextureClasses,surfaceContentClasses,hasSurfaceOverlay,hasSurfaceTexture,hasSurfaceUnderlay,morphBlobs,morphEnabled,getMorphBlobStyle}=actionSurface.useActionSurface(props,"g-chip");function handleRemove(){var _a;emit("remove"),(_a=props.onRemove)==null||_a.call(props)}return(_ctx,_cache)=>(vue.openBlock(),vue.createBlock(components_GGradient.default,vue.mergeProps({class:"g-gradient"},{...props,color:vue.unref(resolvedColor),state:vue.unref(resolvedState)},{"border-width":resolvedBorderWidth.value}),{default:vue.withCtx(()=>[vue.createElementVNode("div",{class:vue.normalizeClass(["g-chip",vue.unref(actionSurfaceClasses)]),style:vue.normalizeStyle(vue.unref(surfaceStyles))},[vue.unref(hasSurfaceUnderlay)?(vue.openBlock(),vue.createElementBlock("span",{key:0,class:vue.normalizeClass(vue.unref(surfaceUnderlayClasses))},null,2)):vue.createCommentVNode("",!0),vue.unref(morphEnabled)?(vue.openBlock(),vue.createElementBlock("span",{key:1,class:vue.normalizeClass(vue.unref(surfaceMaterialMorphClasses)),"aria-hidden":"true"},[(vue.openBlock(!0),vue.createElementBlock(vue.Fragment,null,vue.renderList(vue.unref(morphBlobs),(blob,index)=>(vue.openBlock(),vue.createElementBlock("span",{key:index,class:vue.normalizeClass(vue.unref(surfaceMaterialMorphBlobClasses)),style:vue.normalizeStyle(vue.unref(getMorphBlobStyle)(blob))},null,6))),128))],2)):vue.createCommentVNode("",!0),vue.unref(hasSurfaceOverlay)?(vue.openBlock(),vue.createElementBlock("span",{key:2,class:vue.normalizeClass(vue.unref(surfaceOverlayClasses))},null,2)):vue.createCommentVNode("",!0),vue.unref(hasSurfaceTexture)?(vue.openBlock(),vue.createElementBlock("span",{key:3,class:vue.normalizeClass(vue.unref(surfaceTextureClasses))},null,2)):vue.createCommentVNode("",!0),vue.createElementVNode("div",{class:vue.normalizeClass(["g-chip__content",vue.unref(surfaceContentClasses)])},[slots.prepend||_ctx.prependIcon?(vue.openBlock(),vue.createElementBlock("div",_hoisted_1,[vue.renderSlot(_ctx.$slots,"prepend",{},()=>[_ctx.prependIcon?(vue.openBlock(),vue.createBlock(actionSurface.GIcon,{key:0,icon:_ctx.prependIcon},null,8,["icon"])):vue.createCommentVNode("",!0)],!0)])):vue.createCommentVNode("",!0),vue.createElementVNode("div",_hoisted_2,[vue.renderSlot(_ctx.$slots,"default",{},()=>[vue.createTextVNode(vue.toDisplayString(_ctx.label),1)],!0)]),slots.append||_ctx.appendIcon?(vue.openBlock(),vue.createElementBlock("div",_hoisted_3,[vue.renderSlot(_ctx.$slots,"append",{},()=>[_ctx.appendIcon?(vue.openBlock(),vue.createBlock(actionSurface.GIcon,{key:0,icon:_ctx.appendIcon},null,8,["icon"])):vue.createCommentVNode("",!0)],!0)])):vue.createCommentVNode("",!0),_ctx.removable?(vue.openBlock(),vue.createElementBlock("button",{key:2,type:"button",class:"g-chip__remove",onClick:vue.withModifiers(handleRemove,["stop"])},[vue.createVNode(actionSurface.GIcon,{icon:"close"})])):vue.createCommentVNode("",!0)],2)],6)]),_:3},16,["border-width"]))}}),GChip=_pluginVue_exportHelper._export_sfc(_sfc_main,[["__scopeId","data-v-a40921f4"]]);exports.default=GChip;

package/dist/components/GChip.mjs

@@ -0,0 +1,133 @@
+import { defineComponent, useCssVars, unref, useSlots, computed, openBlock, createBlock, mergeProps, withCtx, createElementVNode, normalizeStyle, normalizeClass, createElementBlock, createCommentVNode, Fragment, renderList, renderSlot, createTextVNode, toDisplayString, withModifiers, createVNode } from "vue";
+import GGradient from "./GGradient.mjs";
+import { m as makeActionSurfaceProps, u as useActionSurface, G as GIcon } from "../actionSurface-BkFPXb-Z.js";
+import { u as usePx } from "../px-B-cyF02Z.js";
+import { m as makeGradientProps } from "../gradient-Cesrzb2-.js";
+import { p as propsFactory } from "../propsFactory-FM5RGbLN.js";
+import { _ as _export_sfc } from "../_plugin-vue_export-helper-B--vMWp3.js";
+const makeChipProps = propsFactory({
+  ...makeActionSurfaceProps(),
+  ...makeGradientProps({
+    borderWidth: void 0,
+    borderRadius: 20,
+    placement: "center",
+    rounded: !0
+  }),
+  label: String,
+  prependIcon: String,
+  appendIcon: String,
+  removable: Boolean,
+  onRemove: Function
+}), _hoisted_1 = {
+  key: 0,
+  class: "g-chip__prepend"
+}, _hoisted_2 = { class: "g-chip__label" }, _hoisted_3 = {
+  key: 1,
+  class: "g-chip__append"
+}, _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "GChip",
+  props: makeChipProps(),
+  emits: ["remove"],
+  setup(__props, { emit: __emit }) {
+    useCssVars((_ctx) => ({
+      v309eb36c: unref(computedBorderRadius)
+    }));
+    const slots = useSlots(), props = __props, emit = __emit, computedBorderRadius = usePx(props.borderRadius), resolvedBorderWidth = computed(
+      () => props.borderWidth ?? (props.variant === "glass" || props.glow || props.animateGlow ? 1 : 0)
+    ), {
+      actionSurfaceClasses,
+      resolvedColor,
+      resolvedState,
+      surfaceStyles,
+      surfaceMaterialMorphBlobClasses,
+      surfaceMaterialMorphClasses,
+      surfaceOverlayClasses,
+      surfaceUnderlayClasses,
+      surfaceTextureClasses,
+      surfaceContentClasses,
+      hasSurfaceOverlay,
+      hasSurfaceTexture,
+      hasSurfaceUnderlay,
+      morphBlobs,
+      morphEnabled,
+      getMorphBlobStyle
+    } = useActionSurface(props, "g-chip");
+    function handleRemove() {
+      var _a;
+      emit("remove"), (_a = props.onRemove) == null || _a.call(props);
+    }
+    return (_ctx, _cache) => (openBlock(), createBlock(GGradient, mergeProps({ class: "g-gradient" }, {
+      ...props,
+      color: unref(resolvedColor),
+      state: unref(resolvedState)
+    }, { "border-width": resolvedBorderWidth.value }), {
+      default: withCtx(() => [
+        createElementVNode("div", {
+          class: normalizeClass(["g-chip", unref(actionSurfaceClasses)]),
+          style: normalizeStyle(unref(surfaceStyles))
+        }, [
+          unref(hasSurfaceUnderlay) ? (openBlock(), createElementBlock("span", {
+            key: 0,
+            class: normalizeClass(unref(surfaceUnderlayClasses))
+          }, null, 2)) : createCommentVNode("", !0),
+          unref(morphEnabled) ? (openBlock(), createElementBlock("span", {
+            key: 1,
+            class: normalizeClass(unref(surfaceMaterialMorphClasses)),
+            "aria-hidden": "true"
+          }, [
+            (openBlock(!0), createElementBlock(Fragment, null, renderList(unref(morphBlobs), (blob, index) => (openBlock(), createElementBlock("span", {
+              key: index,
+              class: normalizeClass(unref(surfaceMaterialMorphBlobClasses)),
+              style: normalizeStyle(unref(getMorphBlobStyle)(blob))
+            }, null, 6))), 128))
+          ], 2)) : createCommentVNode("", !0),
+          unref(hasSurfaceOverlay) ? (openBlock(), createElementBlock("span", {
+            key: 2,
+            class: normalizeClass(unref(surfaceOverlayClasses))
+          }, null, 2)) : createCommentVNode("", !0),
+          unref(hasSurfaceTexture) ? (openBlock(), createElementBlock("span", {
+            key: 3,
+            class: normalizeClass(unref(surfaceTextureClasses))
+          }, null, 2)) : createCommentVNode("", !0),
+          createElementVNode("div", {
+            class: normalizeClass(["g-chip__content", unref(surfaceContentClasses)])
+          }, [
+            slots.prepend || _ctx.prependIcon ? (openBlock(), createElementBlock("div", _hoisted_1, [
+              renderSlot(_ctx.$slots, "prepend", {}, () => [
+                _ctx.prependIcon ? (openBlock(), createBlock(GIcon, {
+                  key: 0,
+                  icon: _ctx.prependIcon
+                }, null, 8, ["icon"])) : createCommentVNode("", !0)
+              ], !0)
+            ])) : createCommentVNode("", !0),
+            createElementVNode("div", _hoisted_2, [
+              renderSlot(_ctx.$slots, "default", {}, () => [
+                createTextVNode(toDisplayString(_ctx.label), 1)
+              ], !0)
+            ]),
+            slots.append || _ctx.appendIcon ? (openBlock(), createElementBlock("div", _hoisted_3, [
+              renderSlot(_ctx.$slots, "append", {}, () => [
+                _ctx.appendIcon ? (openBlock(), createBlock(GIcon, {
+                  key: 0,
+                  icon: _ctx.appendIcon
+                }, null, 8, ["icon"])) : createCommentVNode("", !0)
+              ], !0)
+            ])) : createCommentVNode("", !0),
+            _ctx.removable ? (openBlock(), createElementBlock("button", {
+              key: 2,
+              type: "button",
+              class: "g-chip__remove",
+              onClick: withModifiers(handleRemove, ["stop"])
+            }, [
+              createVNode(GIcon, { icon: "close" })
+            ])) : createCommentVNode("", !0)
+          ], 2)
+        ], 6)
+      ]),
+      _: 3
+    }, 16, ["border-width"]));
+  }
+}), GChip = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-a40921f4"]]);
+export {
+  GChip as default
+};

package/dist/components/GCombobox.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const vue=require("vue"),components_GChip=require("./GChip.cjs"),GDropdown=require("../GDropdown-CmBNk0jK.cjs"),textFieldComponent=require("../textFieldComponent-Ct4Z0dFr.cjs"),components_GIcon=require("./GIcon.cjs"),tokenInputKeyboard=require("../tokenInputKeyboard-DqEV34Li.cjs"),components_GMenu=require("./GMenu.cjs"),fieldControl=require("../fieldControl-CIJMnu2j.cjs"),selectionController=require("../selectionController-D_SzzLi7.cjs"),_pluginVue_exportHelper=require("../_plugin-vue_export-helper-D_jf5u0r.cjs"),normalizeSelectSearch=value=>value.trim().toLocaleLowerCase();function useSelectSearch(options){const internalSearch=vue.shallowRef(vue.toValue(options.search)??""),searchValue=vue.computed(()=>vue.toValue(options.search)??internalSearch.value),normalizedQuery=vue.computed(()=>normalizeSelectSearch(searchValue.value));vue.watch(()=>vue.toValue(options.search),value=>{value!==void 0&&(internalSearch.value=value)}),options.selectionText&&options.isMultiple!==void 0&&syncSelectionText(options.selectionText,options.isMultiple);function syncSelectionText(selectionText,isMultiple){vue.watch(selectionText,value=>{!vue.toValue(isMultiple)&&vue.toValue(options.search)===void 0&&(internalSearch.value=value)},{immediate:!0})}function setSearch(value){internalSearch.value=value,options.onSearch(value)}return{searchValue,normalizedQuery,setSearch,syncSelectionText}}function useComboboxCreatable(options){const hasExactLabelMatch=vue.computed(()=>fieldControl.flattenSelectItems(vue.toValue(options.normalizedSourceItems)).some(item=>normalizeSelectSearch(item.label)===vue.toValue(options.normalizedQuery))),canCreateWithoutFactory=vue.computed(()=>!!vue.toValue(options.itemFromQuery)||typeof vue.unref(options.labelKey)!="function"&&typeof vue.unref(options.valueKey)!="function"),customItem=vue.computed(()=>{if(vue.toValue(options.allowCustom)&&vue.toValue(options.normalizedQuery)&&canCreateWithoutFactory.value&&!hasExactLabelMatch.value)return createRawItemFromQuery(vue.toValue(options.searchValue).trim())});function createRawItemFromQuery(query){const itemFromQuery=vue.toValue(options.itemFromQuery);return itemFromQuery?itemFromQuery(query):options.createRawRecord(query,query)}return{customItem}}function useFilteredSelectMenu(options){const filteredMenuItems=vue.computed(()=>vue.toValue(options.items).map(item=>filterMenuItem(item)).filter(item=>!!item)),firstVisibleItem=vue.computed(()=>flattenMenuItems(filteredMenuItems.value).find(item=>!item.disabled));function filterMenuItem(item){var _a,_b;const children=(_a=item.children)==null?void 0:_a.map(child=>filterMenuItem(child)).filter(child=>!!child),query=vue.toValue(options.normalizedQuery),filter=vue.toValue(options.filter);return!query||((_b=options.isAlwaysVisible)==null?void 0:_b.call(options,item))||(filter?filter(item,vue.toValue(options.searchValue)):normalizeSelectSearch(item.label).includes(query))?item:children!=null&&children.length?{...item,children}:null}function flattenMenuItems(items){var _a;const result=[];for(const item of items)(_a=item.children)!=null&&_a.length?result.push(...flattenMenuItems(item.children)):result.push(item);return result}return{filteredMenuItems,firstVisibleItem}}function useModelFallbackItems(options){const baseItems=vue.computed(()=>vue.unref(options.items)),{items:normalizedBaseItems,resolveValue}=selectionController.useItems({items:baseItems,labelKey:options.labelKey,valueKey:options.valueKey,itemChildren:options.itemChildren}),modelValues=vue.computed(()=>{const value=vue.unref(options.modelValue);return Array.isArray(value)?value:value==null?[]:[value]}),modelFallbackItems=vue.computed(()=>modelValues.value.filter(value=>!hasNormalizedMatch(value)).map(createRawItemFromValue)),sourceItems=vue.computed(()=>[...baseItems.value,...modelFallbackItems.value]),{items:normalizedSourceItems}=selectionController.useItems({items:sourceItems,labelKey:options.labelKey,valueKey:options.valueKey,itemChildren:options.itemChildren});function hasNormalizedMatch(value){return fieldControl.flattenSelectItems(normalizedBaseItems.value).some(item=>vue.unref(options.returnObject)?Object.is(resolveValue(value),item.value):Object.is(value,item.value))}function createRawItemFromValue(value){return vue.unref(options.returnObject)?value:createRawRecord(String(value),value)}function createRawRecord(label,value){const labelKey=vue.unref(options.labelKey),valueKey=vue.unref(options.valueKey),resolvedLabelKey=typeof labelKey=="string"?labelKey:"label",resolvedValueKey=typeof valueKey=="string"?valueKey:"value";return labelKey||valueKey?{[resolvedLabelKey]:label,[resolvedValueKey]:value}:value}return{sourceItems,normalizedSourceItems,createRawRecord}}function useComboboxController(props,emit){const{sourceItems,normalizedSourceItems,createRawRecord}=useModelFallbackItems({items:props.items,modelValue:props.modelValue,returnObject:props.returnObject,labelKey:props.labelKey,valueKey:props.valueKey,itemChildren:props.itemChildren}),{searchValue,normalizedQuery,setSearch,syncSelectionText}=useSelectSearch({search:props.search,onSearch:props.onSearch}),{customItem}=useComboboxCreatable({searchValue,normalizedQuery,normalizedSourceItems,allowCustom:props.allowCustom,itemFromQuery:props.itemFromQuery,labelKey:props.labelKey,valueKey:props.valueKey,createRawRecord}),selectableItems=vue.computed(()=>[...sourceItems.value,...customItem.value===void 0?[]:[customItem.value]]),{isMultiple,shouldCloseOnSelect,normalizedItems,menuItems,resolveMenuItem,getSlotItem,isItemSelected,isMenuItemSelected,selectItem,selectedItems,hasSelection,selectionText}=fieldControl.useSelectController({items:selectableItems,modelValue:props.modelValue,multiple:props.multiple,returnObject:props.returnObject,labelKey:props.labelKey,valueKey:props.valueKey,itemChildren:props.itemChildren},emit),{filteredMenuItems,firstVisibleItem:firstVisibleMenuItem}=useFilteredSelectMenu({items:menuItems,searchValue,normalizedQuery,filter:props.filter,isAlwaysVisible:item=>isCustomItem(item)}),customSelectionItem=vue.computed(()=>normalizedItems.value.find(isCustomItem));syncSelectionText(selectionText,isMultiple);function isCustomItem(item){return customItem.value!==void 0&&Object.is(item.raw,customItem.value)}function isCustomMenuItem(item){const resolvedItem=resolveMenuItem(item);return resolvedItem?isCustomItem(resolvedItem):!1}function firstVisibleItem(){return firstVisibleMenuItem.value}return{isMultiple,shouldCloseOnSelect,searchValue,setSearch,filteredMenuItems,getSlotItem,resolveMenuItem,isItemSelected,isMenuItemSelected,isCustomItem,isCustomMenuItem,customSelectionItem,firstVisibleItem,selectItem,selectedItems,hasSelection,selectionText}}const _hoisted_1={key:1,class:"g-combobox__plain-selection"},_hoisted_2=["id","value","placeholder","disabled","aria-expanded","aria-disabled","aria-invalid"],_hoisted_3={key:0,class:"g-combobox__add-option"},_hoisted_4={key:1},_sfc_main=vue.defineComponent({inheritAttrs:!1,__name:"GCombobox",props:{items:{},modelValue:{},multiple:{},returnObject:{},closeOnSelect:{type:Boolean},labelKey:{},valueKey:{},itemChildren:{},label:{},color:{},variant:{},backdropBlur:{},borderWidth:{},placeholder:{},prependIcon:{},appendIcon:{},disabled:{type:Boolean},clearable:{type:Boolean},size:{default:"m"},state:{},message:{},rules:{},search:{},allowCustom:{type:Boolean,default:!0},itemFromQuery:{},filter:{},chips:{type:Boolean,default:!0},addOnBlur:{type:Boolean,default:!1},noDataText:{default:"No matching options"}},emits:["update:modelValue","update:search","focus","blur","clear","add","select"],setup(__props,{expose:__expose,emit:__emit}){const props=__props,propsRefs=vue.toRefs(props),slots=vue.useSlots(),emit=__emit,{attrs,id,visibleSlotNames:fieldSlotNames}=textFieldComponent.useTextFieldComponent(slots),visibleSlotNames=vue.computed(()=>fieldSlotNames.value.filter(slotName=>slotName!=="append")),listboxId=`${id}-listbox`,open=vue.ref(!1),inputRef=vue.ref(),{isMultiple,shouldCloseOnSelect,searchValue,setSearch,filteredMenuItems,getSlotItem,resolveMenuItem,isMenuItemSelected,isCustomItem,isCustomMenuItem,customSelectionItem,firstVisibleItem,selectItem,selectedItems,hasSelection,selectionText}=useComboboxController({...propsRefs,onSearch:value=>emit("update:search",value)},(e,value)=>emit(e,value)),{$v,disabled,onFocus,onBlur,onInputValidation,fieldProps}=fieldControl.useSelectFieldControl({...propsRefs,id,focused:open,hasValue:()=>hasSelection.value||!!searchValue.value,multiline:!1}),{commitItem,onSelect,selectFirstVisibleItem,removeItem}=tokenInputKeyboard.useSelectCommit({open,isMultiple,shouldCloseOnSelect,searchValue,resolveMenuItem,firstVisibleItem,selectItem,setSearch,onInputValidation,isCustomItem,onAdd:(item,query)=>emit("add",item,query),onSelect:item=>emit("select",item)}),listboxKeyboard=tokenInputKeyboard.useSelectListboxKeyboard({open,selectFirstVisibleItem}),tokenKeyboard=tokenInputKeyboard.useTokenInputKeyboard({enabled:isMultiple,searchValue,items:selectedItems,removeItem}),{handleKeydown}=tokenInputKeyboard.useFieldKeyboard({disabled,handlers:vue.computed(()=>[...listboxKeyboard.handlers,...tokenKeyboard.handlers])});function clearValue(){const nextValue=isMultiple.value?[]:null;emit("update:modelValue",nextValue)}const{handleInput,handleFocus,handleBlur,handleClear,focusControl,handleActivatorMousedown}=tokenInputKeyboard.useSearchFieldControl({open,inputRef,disabled,setSearch,onFocus,onBlur,onInputValidation,emitFocus:event=>emit("focus",event),emitBlur:event=>emit("blur",event),emitClear:()=>emit("clear"),clearValue,afterBlur:()=>{window.setTimeout(()=>{props.addOnBlur&&!open.value&&customSelectionItem.value&&commitItem(customSelectionItem.value)})}});return __expose({$v,focus:focusControl,blur:()=>{var _a;return(_a=inputRef.value)==null?void 0:_a.blur()}}),(_ctx,_cache)=>(vue.openBlock(),vue.createBlock(GDropdown.GDropdown,{modelValue:open.value,"onUpdate:modelValue":_cache[5]||(_cache[5]=$event=>open.value=$event),"open-on-click":!1,"open-on-focus":!1,"close-on-content-click":!1,offset:0,"activator-full-width":"","same-width":""},{activator:vue.withCtx(({activatorAttrs,activatorRef})=>[vue.createElementVNode("div",vue.mergeProps({ref:activatorRef},activatorAttrs,{class:"g-combobox__activator",onMousedown:_cache[4]||(_cache[4]=(...args)=>vue.unref(handleActivatorMousedown)&&vue.unref(handleActivatorMousedown)(...args))}),[vue.createVNode(textFieldComponent.GFieldBase,vue.mergeProps(vue.unref(fieldProps),{onClear:vue.unref(handleClear)}),vue.createSlots({control:vue.withCtx(()=>[vue.createElementVNode("div",{class:vue.normalizeClass(["g-combobox__control",{"g-combobox__control_multiple":vue.unref(isMultiple)}])},[slots.selection?vue.renderSlot(_ctx.$slots,"selection",{selection:vue.unref(selectionText),selectedItems:vue.unref(selectedItems),remove:vue.unref(removeItem)},void 0,!0,0):vue.unref(isMultiple)&&vue.unref(hasSelection)?(vue.openBlock(!0),vue.createElementBlock(vue.Fragment,{key:1},vue.renderList(vue.unref(selectedItems),(item,index)=>vue.renderSlot(_ctx.$slots,"chip",{item,index,remove:vue.unref(removeItem)},()=>[props.chips?(vue.openBlock(),vue.createBlock(components_GChip.default,{key:0,label:item.label,size:"s",variant:"tonal",color:props.color,state:props.state,removable:"",onRemove:$event=>vue.unref(removeItem)(item)},null,8,["label","color","state","onRemove"])):(vue.openBlock(),vue.createElementBlock("span",_hoisted_1,vue.toDisplayString(item.label),1))],!0,`${item.label}-${index}`)),128)):vue.createCommentVNode("",!0),vue.createElementVNode("input",vue.mergeProps(vue.unref(attrs),{id:vue.unref(id),ref_key:"inputRef",ref:inputRef,class:["g-combobox__input g-field-base__native",{"g-combobox__input_compact":vue.unref(isMultiple)&&vue.unref(hasSelection)&&!vue.unref(searchValue)}],role:"combobox",value:vue.unref(searchValue),placeholder:vue.unref(hasSelection)&&vue.unref(isMultiple)?"":props.placeholder??"",disabled:vue.unref(fieldProps).disabled,"aria-controls":listboxId,"aria-expanded":open.value,"aria-autocomplete":"list","aria-disabled":vue.unref(fieldProps).disabled,"aria-invalid":vue.unref(fieldProps).state==="error"||void 0,onInput:_cache[0]||(_cache[0]=(...args)=>vue.unref(handleInput)&&vue.unref(handleInput)(...args)),onFocus:_cache[1]||(_cache[1]=(...args)=>vue.unref(handleFocus)&&vue.unref(handleFocus)(...args)),onBlur:_cache[2]||(_cache[2]=(...args)=>vue.unref(handleBlur)&&vue.unref(handleBlur)(...args)),onKeydown:_cache[3]||(_cache[3]=(...args)=>vue.unref(handleKeydown)&&vue.unref(handleKeydown)(...args))}),null,16,_hoisted_2)],2)]),append:vue.withCtx(()=>[vue.renderSlot(_ctx.$slots,"append",{},()=>[vue.createVNode(components_GIcon.default,{icon:props.appendIcon??"chevron-down"},null,8,["icon"])],!0)]),_:2},[vue.renderList(visibleSlotNames.value,slotName=>({name:slotName,fn:vue.withCtx(()=>[vue.renderSlot(_ctx.$slots,slotName,{},void 0,!0)])}))]),1040,["onClear"])],16)]),default:vue.withCtx(()=>[vue.unref(filteredMenuItems).length?(vue.openBlock(),vue.createBlock(components_GMenu.default,{key:0,id:listboxId,items:vue.unref(filteredMenuItems),state:props.state,"is-selected":vue.unref(isMenuItemSelected),onSelect:vue.unref(onSelect)},{item:vue.withCtx(({item,selected})=>[vue.renderSlot(_ctx.$slots,"item",{item:vue.unref(getSlotItem)(item),selected,query:vue.unref(searchValue),custom:vue.unref(isCustomMenuItem)(item)},()=>[vue.unref(isCustomMenuItem)(item)?(vue.openBlock(),vue.createElementBlock("span",_hoisted_3,vue.toDisplayString(vue.unref(searchValue).trim()),1)):(vue.openBlock(),vue.createElementBlock("span",_hoisted_4,vue.toDisplayString(item.label),1))],!0)]),_:3},8,["items","state","is-selected","onSelect"])):(vue.openBlock(),vue.createElementBlock("div",{key:1,id:listboxId,class:"g-combobox__empty",role:"listbox"},[vue.renderSlot(_ctx.$slots,"noData",{query:vue.unref(searchValue)},()=>[vue.createTextVNode(vue.toDisplayString(props.noDataText),1)],!0)]))]),_:3},8,["modelValue"]))}}),GCombobox=_pluginVue_exportHelper._export_sfc(_sfc_main,[["__scopeId","data-v-63c306de"]]);exports.default=GCombobox;

package/dist/components/GCombobox.mjs

@@ -0,0 +1,477 @@
+import { shallowRef, toValue, computed, watch, unref, defineComponent, toRefs, useSlots, ref, openBlock, createBlock, withCtx, renderSlot, createElementBlock, toDisplayString, createTextVNode, createElementVNode, mergeProps, createVNode, createSlots, normalizeClass, Fragment, renderList, createCommentVNode } from "vue";
+import GChip from "./GChip.mjs";
+import { G as GDropdown } from "../GDropdown-TVH93Obq.js";
+import { u as useTextFieldComponent, G as GFieldBase } from "../textFieldComponent-gnbYgrX0.js";
+import GIcon from "./GIcon.mjs";
+import { u as useFieldKeyboard, b as useSelectCommit, c as useSelectListboxKeyboard, d as useTokenInputKeyboard, a as useSearchFieldControl } from "../tokenInputKeyboard-DBcgGd7c.js";
+import GMenu from "./GMenu.mjs";
+import { f as flattenSelectItems, u as useSelectController, a as useSelectFieldControl } from "../fieldControl-BgVt1Hh1.js";
+import { a as useItems } from "../selectionController-Cq7OffKP.js";
+import { _ as _export_sfc } from "../_plugin-vue_export-helper-B--vMWp3.js";
+const normalizeSelectSearch = (value) => value.trim().toLocaleLowerCase();
+function useSelectSearch(options) {
+  const internalSearch = shallowRef(toValue(options.search) ?? ""), searchValue = computed(
+    () => toValue(options.search) ?? internalSearch.value
+  ), normalizedQuery = computed(
+    () => normalizeSelectSearch(searchValue.value)
+  );
+  watch(
+    () => toValue(options.search),
+    (value) => {
+      value !== void 0 && (internalSearch.value = value);
+    }
+  ), options.selectionText && options.isMultiple !== void 0 && syncSelectionText(options.selectionText, options.isMultiple);
+  function syncSelectionText(selectionText, isMultiple) {
+    watch(
+      selectionText,
+      (value) => {
+        !toValue(isMultiple) && toValue(options.search) === void 0 && (internalSearch.value = value);
+      },
+      { immediate: !0 }
+    );
+  }
+  function setSearch(value) {
+    internalSearch.value = value, options.onSearch(value);
+  }
+  return {
+    searchValue,
+    normalizedQuery,
+    setSearch,
+    syncSelectionText
+  };
+}
+function useComboboxCreatable(options) {
+  const hasExactLabelMatch = computed(
+    () => flattenSelectItems(toValue(options.normalizedSourceItems)).some(
+      (item) => normalizeSelectSearch(item.label) === toValue(options.normalizedQuery)
+    )
+  ), canCreateWithoutFactory = computed(
+    () => !!toValue(options.itemFromQuery) || typeof unref(options.labelKey) != "function" && typeof unref(options.valueKey) != "function"
+  ), customItem = computed(() => {
+    if (toValue(options.allowCustom) && toValue(options.normalizedQuery) && canCreateWithoutFactory.value && !hasExactLabelMatch.value)
+      return createRawItemFromQuery(toValue(options.searchValue).trim());
+  });
+  function createRawItemFromQuery(query) {
+    const itemFromQuery = toValue(options.itemFromQuery);
+    return itemFromQuery ? itemFromQuery(query) : options.createRawRecord(query, query);
+  }
+  return {
+    customItem
+  };
+}
+function useFilteredSelectMenu(options) {
+  const filteredMenuItems = computed(
+    () => toValue(options.items).map((item) => filterMenuItem(item)).filter((item) => !!item)
+  ), firstVisibleItem = computed(
+    () => flattenMenuItems(filteredMenuItems.value).find((item) => !item.disabled)
+  );
+  function filterMenuItem(item) {
+    var _a, _b;
+    const children = (_a = item.children) == null ? void 0 : _a.map((child) => filterMenuItem(child)).filter((child) => !!child), query = toValue(options.normalizedQuery), filter = toValue(options.filter);
+    return !query || ((_b = options.isAlwaysVisible) == null ? void 0 : _b.call(options, item)) || (filter ? filter(item, toValue(options.searchValue)) : normalizeSelectSearch(item.label).includes(query)) ? item : children != null && children.length ? { ...item, children } : null;
+  }
+  function flattenMenuItems(items) {
+    var _a;
+    const result = [];
+    for (const item of items)
+      (_a = item.children) != null && _a.length ? result.push(...flattenMenuItems(item.children)) : result.push(item);
+    return result;
+  }
+  return {
+    filteredMenuItems,
+    firstVisibleItem
+  };
+}
+function useModelFallbackItems(options) {
+  const baseItems = computed(() => unref(options.items)), { items: normalizedBaseItems, resolveValue } = useItems({
+    items: baseItems,
+    labelKey: options.labelKey,
+    valueKey: options.valueKey,
+    itemChildren: options.itemChildren
+  }), modelValues = computed(() => {
+    const value = unref(options.modelValue);
+    return Array.isArray(value) ? value : value == null ? [] : [value];
+  }), modelFallbackItems = computed(
+    () => modelValues.value.filter((value) => !hasNormalizedMatch(value)).map(createRawItemFromValue)
+  ), sourceItems = computed(() => [
+    ...baseItems.value,
+    ...modelFallbackItems.value
+  ]), { items: normalizedSourceItems } = useItems({
+    items: sourceItems,
+    labelKey: options.labelKey,
+    valueKey: options.valueKey,
+    itemChildren: options.itemChildren
+  });
+  function hasNormalizedMatch(value) {
+    return flattenSelectItems(normalizedBaseItems.value).some((item) => unref(options.returnObject) ? Object.is(resolveValue(value), item.value) : Object.is(value, item.value));
+  }
+  function createRawItemFromValue(value) {
+    return unref(options.returnObject) ? value : createRawRecord(String(value), value);
+  }
+  function createRawRecord(label, value) {
+    const labelKey = unref(options.labelKey), valueKey = unref(options.valueKey), resolvedLabelKey = typeof labelKey == "string" ? labelKey : "label", resolvedValueKey = typeof valueKey == "string" ? valueKey : "value";
+    return labelKey || valueKey ? {
+      [resolvedLabelKey]: label,
+      [resolvedValueKey]: value
+    } : value;
+  }
+  return {
+    sourceItems,
+    normalizedSourceItems,
+    createRawRecord
+  };
+}
+function useComboboxController(props, emit) {
+  const { sourceItems, normalizedSourceItems, createRawRecord } = useModelFallbackItems({
+    items: props.items,
+    modelValue: props.modelValue,
+    returnObject: props.returnObject,
+    labelKey: props.labelKey,
+    valueKey: props.valueKey,
+    itemChildren: props.itemChildren
+  }), { searchValue, normalizedQuery, setSearch, syncSelectionText } = useSelectSearch({
+    search: props.search,
+    onSearch: props.onSearch
+  }), { customItem } = useComboboxCreatable({
+    searchValue,
+    normalizedQuery,
+    normalizedSourceItems,
+    allowCustom: props.allowCustom,
+    itemFromQuery: props.itemFromQuery,
+    labelKey: props.labelKey,
+    valueKey: props.valueKey,
+    createRawRecord
+  }), selectableItems = computed(() => [
+    ...sourceItems.value,
+    ...customItem.value === void 0 ? [] : [customItem.value]
+  ]), {
+    isMultiple,
+    shouldCloseOnSelect,
+    normalizedItems,
+    menuItems,
+    resolveMenuItem,
+    getSlotItem,
+    isItemSelected,
+    isMenuItemSelected,
+    selectItem,
+    selectedItems,
+    hasSelection,
+    selectionText
+  } = useSelectController(
+    {
+      items: selectableItems,
+      modelValue: props.modelValue,
+      multiple: props.multiple,
+      returnObject: props.returnObject,
+      labelKey: props.labelKey,
+      valueKey: props.valueKey,
+      itemChildren: props.itemChildren
+    },
+    emit
+  ), { filteredMenuItems, firstVisibleItem: firstVisibleMenuItem } = useFilteredSelectMenu({
+    items: menuItems,
+    searchValue,
+    normalizedQuery,
+    filter: props.filter,
+    isAlwaysVisible: (item) => isCustomItem(item)
+  }), customSelectionItem = computed(
+    () => normalizedItems.value.find(isCustomItem)
+  );
+  syncSelectionText(selectionText, isMultiple);
+  function isCustomItem(item) {
+    return customItem.value !== void 0 && Object.is(item.raw, customItem.value);
+  }
+  function isCustomMenuItem(item) {
+    const resolvedItem = resolveMenuItem(item);
+    return resolvedItem ? isCustomItem(resolvedItem) : !1;
+  }
+  function firstVisibleItem() {
+    return firstVisibleMenuItem.value;
+  }
+  return {
+    isMultiple,
+    shouldCloseOnSelect,
+    searchValue,
+    setSearch,
+    filteredMenuItems,
+    getSlotItem,
+    resolveMenuItem,
+    isItemSelected,
+    isMenuItemSelected,
+    isCustomItem,
+    isCustomMenuItem,
+    customSelectionItem,
+    firstVisibleItem,
+    selectItem,
+    selectedItems,
+    hasSelection,
+    selectionText
+  };
+}
+const _hoisted_1 = {
+  key: 1,
+  class: "g-combobox__plain-selection"
+}, _hoisted_2 = ["id", "value", "placeholder", "disabled", "aria-expanded", "aria-disabled", "aria-invalid"], _hoisted_3 = {
+  key: 0,
+  class: "g-combobox__add-option"
+}, _hoisted_4 = { key: 1 }, _sfc_main = /* @__PURE__ */ defineComponent({
+  inheritAttrs: !1,
+  __name: "GCombobox",
+  props: {
+    items: {},
+    modelValue: {},
+    multiple: {},
+    returnObject: {},
+    closeOnSelect: { type: Boolean },
+    labelKey: {},
+    valueKey: {},
+    itemChildren: {},
+    label: {},
+    color: {},
+    variant: {},
+    backdropBlur: {},
+    borderWidth: {},
+    placeholder: {},
+    prependIcon: {},
+    appendIcon: {},
+    disabled: { type: Boolean },
+    clearable: { type: Boolean },
+    size: { default: "m" },
+    state: {},
+    message: {},
+    rules: {},
+    search: {},
+    allowCustom: { type: Boolean, default: !0 },
+    itemFromQuery: {},
+    filter: {},
+    chips: { type: Boolean, default: !0 },
+    addOnBlur: { type: Boolean, default: !1 },
+    noDataText: { default: "No matching options" }
+  },
+  emits: ["update:modelValue", "update:search", "focus", "blur", "clear", "add", "select"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props, propsRefs = toRefs(props), slots = useSlots(), emit = __emit, {
+      attrs,
+      id,
+      visibleSlotNames: fieldSlotNames
+    } = useTextFieldComponent(slots), visibleSlotNames = computed(
+      () => fieldSlotNames.value.filter((slotName) => slotName !== "append")
+    ), listboxId = `${id}-listbox`, open = ref(!1), inputRef = ref(), {
+      isMultiple,
+      shouldCloseOnSelect,
+      searchValue,
+      setSearch,
+      filteredMenuItems,
+      getSlotItem,
+      resolveMenuItem,
+      isMenuItemSelected,
+      isCustomItem,
+      isCustomMenuItem,
+      customSelectionItem,
+      firstVisibleItem,
+      selectItem,
+      selectedItems,
+      hasSelection,
+      selectionText
+    } = useComboboxController(
+      {
+        ...propsRefs,
+        onSearch: (value) => emit("update:search", value)
+      },
+      (e, value) => emit(e, value)
+    ), { $v, disabled, onFocus, onBlur, onInputValidation, fieldProps } = useSelectFieldControl({
+      ...propsRefs,
+      id,
+      focused: open,
+      hasValue: () => hasSelection.value || !!searchValue.value,
+      multiline: !1
+    }), { commitItem, onSelect, selectFirstVisibleItem, removeItem } = useSelectCommit({
+      open,
+      isMultiple,
+      shouldCloseOnSelect,
+      searchValue,
+      resolveMenuItem,
+      firstVisibleItem,
+      selectItem,
+      setSearch,
+      onInputValidation,
+      isCustomItem,
+      onAdd: (item, query) => emit("add", item, query),
+      onSelect: (item) => emit("select", item)
+    }), listboxKeyboard = useSelectListboxKeyboard({
+      open,
+      selectFirstVisibleItem
+    }), tokenKeyboard = useTokenInputKeyboard({
+      enabled: isMultiple,
+      searchValue,
+      items: selectedItems,
+      removeItem
+    }), { handleKeydown } = useFieldKeyboard({
+      disabled,
+      handlers: computed(() => [
+        ...listboxKeyboard.handlers,
+        ...tokenKeyboard.handlers
+      ])
+    });
+    function clearValue() {
+      const nextValue = isMultiple.value ? [] : null;
+      emit("update:modelValue", nextValue);
+    }
+    const {
+      handleInput,
+      handleFocus,
+      handleBlur,
+      handleClear,
+      focusControl,
+      handleActivatorMousedown
+    } = useSearchFieldControl({
+      open,
+      inputRef,
+      disabled,
+      setSearch,
+      onFocus,
+      onBlur,
+      onInputValidation,
+      emitFocus: (event) => emit("focus", event),
+      emitBlur: (event) => emit("blur", event),
+      emitClear: () => emit("clear"),
+      clearValue,
+      afterBlur: () => {
+        window.setTimeout(() => {
+          props.addOnBlur && !open.value && customSelectionItem.value && commitItem(customSelectionItem.value);
+        });
+      }
+    });
+    return __expose({
+      $v,
+      focus: focusControl,
+      blur: () => {
+        var _a;
+        return (_a = inputRef.value) == null ? void 0 : _a.blur();
+      }
+    }), (_ctx, _cache) => (openBlock(), createBlock(GDropdown, {
+      modelValue: open.value,
+      "onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => open.value = $event),
+      "open-on-click": !1,
+      "open-on-focus": !1,
+      "close-on-content-click": !1,
+      offset: 0,
+      "activator-full-width": "",
+      "same-width": ""
+    }, {
+      activator: withCtx(({ activatorAttrs, activatorRef }) => [
+        createElementVNode("div", mergeProps({ ref: activatorRef }, activatorAttrs, {
+          class: "g-combobox__activator",
+          onMousedown: _cache[4] || (_cache[4] = //@ts-ignore
+          (...args) => unref(handleActivatorMousedown) && unref(handleActivatorMousedown)(...args))
+        }), [
+          createVNode(GFieldBase, mergeProps(unref(fieldProps), { onClear: unref(handleClear) }), createSlots({
+            control: withCtx(() => [
+              createElementVNode("div", {
+                class: normalizeClass(["g-combobox__control", {
+                  "g-combobox__control_multiple": unref(isMultiple)
+                }])
+              }, [
+                slots.selection ? renderSlot(_ctx.$slots, "selection", {
+                  selection: unref(selectionText),
+                  selectedItems: unref(selectedItems),
+                  remove: unref(removeItem)
+                }, void 0, !0, 0) : unref(isMultiple) && unref(hasSelection) ? (openBlock(!0), createElementBlock(Fragment, { key: 1 }, renderList(unref(selectedItems), (item, index) => renderSlot(_ctx.$slots, "chip", {
+                  item,
+                  index,
+                  remove: unref(removeItem)
+                }, () => [
+                  props.chips ? (openBlock(), createBlock(GChip, {
+                    key: 0,
+                    label: item.label,
+                    size: "s",
+                    variant: "tonal",
+                    color: props.color,
+                    state: props.state,
+                    removable: "",
+                    onRemove: ($event) => unref(removeItem)(item)
+                  }, null, 8, ["label", "color", "state", "onRemove"])) : (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(item.label), 1))
+                ], !0, `${item.label}-${index}`)), 128)) : createCommentVNode("", !0),
+                createElementVNode("input", mergeProps(unref(attrs), {
+                  id: unref(id),
+                  ref_key: "inputRef",
+                  ref: inputRef,
+                  class: ["g-combobox__input g-field-base__native", {
+                    "g-combobox__input_compact": unref(isMultiple) && unref(hasSelection) && !unref(searchValue)
+                  }],
+                  role: "combobox",
+                  value: unref(searchValue),
+                  placeholder: unref(hasSelection) && unref(isMultiple) ? "" : props.placeholder ?? "",
+                  disabled: unref(fieldProps).disabled,
+                  "aria-controls": listboxId,
+                  "aria-expanded": open.value,
+                  "aria-autocomplete": "list",
+                  "aria-disabled": unref(fieldProps).disabled,
+                  "aria-invalid": unref(fieldProps).state === "error" || void 0,
+                  onInput: _cache[0] || (_cache[0] = //@ts-ignore
+                  (...args) => unref(handleInput) && unref(handleInput)(...args)),
+                  onFocus: _cache[1] || (_cache[1] = //@ts-ignore
+                  (...args) => unref(handleFocus) && unref(handleFocus)(...args)),
+                  onBlur: _cache[2] || (_cache[2] = //@ts-ignore
+                  (...args) => unref(handleBlur) && unref(handleBlur)(...args)),
+                  onKeydown: _cache[3] || (_cache[3] = //@ts-ignore
+                  (...args) => unref(handleKeydown) && unref(handleKeydown)(...args))
+                }), null, 16, _hoisted_2)
+              ], 2)
+            ]),
+            append: withCtx(() => [
+              renderSlot(_ctx.$slots, "append", {}, () => [
+                createVNode(GIcon, {
+                  icon: props.appendIcon ?? "chevron-down"
+                }, null, 8, ["icon"])
+              ], !0)
+            ]),
+            _: 2
+          }, [
+            renderList(visibleSlotNames.value, (slotName) => ({
+              name: slotName,
+              fn: withCtx(() => [
+                renderSlot(_ctx.$slots, slotName, {}, void 0, !0)
+              ])
+            }))
+          ]), 1040, ["onClear"])
+        ], 16)
+      ]),
+      default: withCtx(() => [
+        unref(filteredMenuItems).length ? (openBlock(), createBlock(GMenu, {
+          key: 0,
+          id: listboxId,
+          items: unref(filteredMenuItems),
+          state: props.state,
+          "is-selected": unref(isMenuItemSelected),
+          onSelect: unref(onSelect)
+        }, {
+          item: withCtx(({ item, selected }) => [
+            renderSlot(_ctx.$slots, "item", {
+              item: unref(getSlotItem)(item),
+              selected,
+              query: unref(searchValue),
+              custom: unref(isCustomMenuItem)(item)
+            }, () => [
+              unref(isCustomMenuItem)(item) ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(unref(searchValue).trim()), 1)) : (openBlock(), createElementBlock("span", _hoisted_4, toDisplayString(item.label), 1))
+            ], !0)
+          ]),
+          _: 3
+        }, 8, ["items", "state", "is-selected", "onSelect"])) : (openBlock(), createElementBlock("div", {
+          key: 1,
+          id: listboxId,
+          class: "g-combobox__empty",
+          role: "listbox"
+        }, [
+          renderSlot(_ctx.$slots, "noData", { query: unref(searchValue) }, () => [
+            createTextVNode(toDisplayString(props.noDataText), 1)
+          ], !0)
+        ]))
+      ]),
+      _: 3
+    }, 8, ["modelValue"]));
+  }
+}), GCombobox = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-63c306de"]]);
+export {
+  GCombobox as default
+};

package/dist/components/GDivider.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const vue=require("vue"),components_GIcon=require("./GIcon.cjs"),density=require("../density-C3E1eUQ3.cjs"),colorResolver=require("../colorResolver-C6PTz0S8.cjs"),materialSurface=require("../materialSurface-BZWqxSOo.cjs"),tagName=require("../tagName-EmIHK0fg.cjs"),surface=require("../surface-NFdB950M.cjs"),propsFactory=require("../propsFactory-DT6-QS4L.cjs"),_pluginVue_exportHelper=require("../_plugin-vue_export-helper-D_jf5u0r.cjs"),makeDividerProps=propsFactory.propsFactory({...materialSurface.makeMaterialSurfaceProps({borderRadius:999,borderWidth:void 0,color:"primary",interactive:!1,placement:"center"}),...density.makeDensityProps(),...surface.makeSurfaceTextureProps(),...tagName.makeTagNameProps(),label:String,icon:String,orientation:{type:String,default:"horizontal"},variant:{type:String,default:"tonal"},effect:{type:String,default:"solid"},align:{type:String,default:"center"},thickness:{type:[Number,String],default:1},length:{type:[Number,String],default:"100%"},inset:{type:[Boolean,Number,String],default:!1},decorative:Boolean}),_hoisted_1={key:0,class:"g-divider__content"},_hoisted_2={key:0,class:"g-divider__icon"},_hoisted_3={class:"g-divider__label"},_hoisted_4={key:1,class:"g-divider__append"},_sfc_main=vue.defineComponent({inheritAttrs:!1,__name:"GDivider",props:makeDividerProps(),setup(__props){const slots=vue.useSlots(),attrs=vue.useAttrs(),props=__props,densityClass=density.useDensity(props,"g-divider"),{tagName:tagName$1,tagAttrs}=tagName.useTagName(props,"div"),toCssLength=value=>value===!0?"var(--g-token-space-6)":value===!1||value===void 0||value===""?"0px":typeof value=="number"?`${value}px`:/^\d+(\.\d+)?$/.test(value)?`${value}px`:value,thickness=vue.computed(()=>toCssLength(props.thickness)),length=vue.computed(()=>toCssLength(props.length)),hasContent=vue.computed(()=>!!(slots.default||slots.prepend||slots.append||props.label||props.icon)),insetValue=vue.computed(()=>toCssLength(props.inset)),dividerStyles=vue.computed(()=>({"--g-divider-thickness":thickness.value,"--g-divider-length":length.value,"--g-divider-inset":insetValue.value})),resolvedGradient=colorResolver.useResolveGradientValue(()=>props.color??props.state),dividerGradientStyles=vue.computed(()=>({"--g-divider-gradient":resolvedGradient.value})),segmentClasses=vue.computed(()=>["g-divider__segment",`g-divider__segment_${props.variant}`,{[`g-divider__segment_texture-${props.texture}`]:props.texture!=="none"}]),semanticAttrs=vue.computed(()=>props.decorative?{"aria-hidden":"true"}:{role:"separator","aria-orientation":props.orientation}),{getMorphBlobStyle,morphBlobs,morphEnabled,surfaceStyles,surfaceMaterialMorphBlobClasses,surfaceMaterialMorphClasses,surfaceOverlayClasses,surfaceUnderlayClasses,surfaceTextureClasses}=materialSurface.useMaterialSurface(props,"g-divider__segment",{kind:"surface"});return(_ctx,_cache)=>(vue.openBlock(),vue.createBlock(vue.resolveDynamicComponent(vue.unref(tagName$1)),vue.mergeProps({class:["g-divider",[vue.unref(densityClass),`g-divider_${props.variant}`,`g-divider_orientation-${props.orientation}`,`g-divider_effect-${props.effect}`,`g-divider_align-${props.align}`,{"g-divider_with-content":hasContent.value,[`g-divider_texture-${props.texture}`]:props.texture!=="none"}]],style:[vue.unref(surfaceStyles),dividerGradientStyles.value,dividerStyles.value]},{...vue.unref(tagAttrs),...semanticAttrs.value,...vue.unref(attrs)}),{default:vue.withCtx(()=>[vue.createElementVNode("span",{class:vue.normalizeClass([segmentClasses.value,"g-divider__segment_start"]),"aria-hidden":"true"},[vue.createElementVNode("span",{class:vue.normalizeClass(vue.unref(surfaceUnderlayClasses))},null,2),vue.unref(morphEnabled)?(vue.openBlock(),vue.createElementBlock("span",{key:0,class:vue.normalizeClass(vue.unref(surfaceMaterialMorphClasses)),"aria-hidden":"true"},[(vue.openBlock(!0),vue.createElementBlock(vue.Fragment,null,vue.renderList(vue.unref(morphBlobs),(blob,index)=>(vue.openBlock(),vue.createElementBlock("span",{key:index,class:vue.normalizeClass(vue.unref(surfaceMaterialMorphBlobClasses)),style:vue.normalizeStyle(vue.unref(getMorphBlobStyle)(blob))},null,6))),128))],2)):vue.createCommentVNode("",!0),vue.createElementVNode("span",{class:vue.normalizeClass(vue.unref(surfaceOverlayClasses))},null,2),vue.createElementVNode("span",{class:vue.normalizeClass(vue.unref(surfaceTextureClasses))},null,2)],2),hasContent.value?(vue.openBlock(),vue.createElementBlock("span",_hoisted_1,[slots.prepend||props.icon?(vue.openBlock(),vue.createElementBlock("span",_hoisted_2,[vue.renderSlot(_ctx.$slots,"prepend",{},()=>[props.icon?(vue.openBlock(),vue.createBlock(components_GIcon.default,{key:0,icon:props.icon},null,8,["icon"])):vue.createCommentVNode("",!0)],!0)])):vue.createCommentVNode("",!0),vue.createElementVNode("span",_hoisted_3,[vue.renderSlot(_ctx.$slots,"default",{},()=>[vue.createTextVNode(vue.toDisplayString(props.label),1)],!0)]),slots.append?(vue.openBlock(),vue.createElementBlock("span",_hoisted_4,[vue.renderSlot(_ctx.$slots,"append",{},void 0,!0)])):vue.createCommentVNode("",!0)])):vue.createCommentVNode("",!0),hasContent.value?(vue.openBlock(),vue.createElementBlock("span",{key:1,class:vue.normalizeClass([segmentClasses.value,"g-divider__segment_end"]),"aria-hidden":"true"},[vue.createElementVNode("span",{class:vue.normalizeClass(vue.unref(surfaceUnderlayClasses))},null,2),vue.unref(morphEnabled)?(vue.openBlock(),vue.createElementBlock("span",{key:0,class:vue.normalizeClass(vue.unref(surfaceMaterialMorphClasses)),"aria-hidden":"true"},[(vue.openBlock(!0),vue.createElementBlock(vue.Fragment,null,vue.renderList(vue.unref(morphBlobs),(blob,index)=>(vue.openBlock(),vue.createElementBlock("span",{key:`end-${index}`,class:vue.normalizeClass(vue.unref(surfaceMaterialMorphBlobClasses)),style:vue.normalizeStyle(vue.unref(getMorphBlobStyle)(blob))},null,6))),128))],2)):vue.createCommentVNode("",!0),vue.createElementVNode("span",{class:vue.normalizeClass(vue.unref(surfaceOverlayClasses))},null,2),vue.createElementVNode("span",{class:vue.normalizeClass(vue.unref(surfaceTextureClasses))},null,2)],2)):vue.createCommentVNode("",!0)]),_:3},16,["class","style"]))}}),GDivider=_pluginVue_exportHelper._export_sfc(_sfc_main,[["__scopeId","data-v-9ccbe5c6"]]);exports.default=GDivider;