@digitalwalletcorp/vue-core 0.1.1 → 0.1.2

package/lib/{components-D8RaavU9.cjs → components-CIzBo8qB.cjs}

@@ -1 +1 @@
-"use strict";const e=require("./label-button.vue_vue_type_script_setup_true_lang-CGLBJ0Vc.cjs"),t=require("./label-icon.vue_vue_type_style_index_0_lang-CbCZDSk8.cjs"),_=Object.freeze(Object.defineProperty({__proto__:null,LabelButton:e._sfc_main,LabelIcon:t._sfc_main},Symbol.toStringTag,{value:"Module"}));exports.components=_;
+"use strict";const e=require("./label-button.vue_vue_type_script_setup_true_lang-DqhdCgmJ.cjs"),t=require("./label-icon.vue_vue_type_style_index_0_lang-C2URq6GP.cjs"),_=Object.freeze(Object.defineProperty({__proto__:null,LabelButton:e._sfc_main,LabelIcon:t._sfc_main},Symbol.toStringTag,{value:"Module"}));exports.components=_;

package/lib/{components-BTso5UCT.js → components-D-qeo7yx.js}

@@ -1,5 +1,5 @@
-import { _ as o } from "./label-button.vue_vue_type_script_setup_true_lang-BQ7Yp-ge.js";
-import { _ as e } from "./label-icon.vue_vue_type_style_index_0_lang-B3Qc4kMj.js";
+import { _ as o } from "./label-button.vue_vue_type_script_setup_true_lang-CoHrTUSs.js";
+import { _ as e } from "./label-icon.vue_vue_type_style_index_0_lang-bQFkQ_gC.js";
 const r = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   LabelButton: o,

package/lib/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./label-button.vue_vue_type_script_setup_true_lang-CGLBJ0Vc.cjs"),t=require("./label-icon.vue_vue_type_style_index_0_lang-CbCZDSk8.cjs");exports.LabelButton=e._sfc_main;exports.LabelIcon=t._sfc_main;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./label-button.vue_vue_type_script_setup_true_lang-DqhdCgmJ.cjs"),t=require("./label-icon.vue_vue_type_style_index_0_lang-C2URq6GP.cjs");exports.LabelButton=e._sfc_main;exports.LabelIcon=t._sfc_main;

package/lib/index.js

@@ -1,5 +1,5 @@
-import { _ as e } from "./label-button.vue_vue_type_script_setup_true_lang-BQ7Yp-ge.js";
-import { _ as t } from "./label-icon.vue_vue_type_style_index_0_lang-B3Qc4kMj.js";
+import { _ as e } from "./label-button.vue_vue_type_script_setup_true_lang-CoHrTUSs.js";
+import { _ as t } from "./label-icon.vue_vue_type_style_index_0_lang-bQFkQ_gC.js";
 export {
   e as LabelButton,
   t as LabelIcon

package/lib/label-button.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./label-button.vue_vue_type_script_setup_true_lang-CGLBJ0Vc.cjs");exports.default=e._sfc_main;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./label-button.vue_vue_type_script_setup_true_lang-DqhdCgmJ.cjs");exports.default=e._sfc_main;

package/lib/label-button.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./label-button.vue_vue_type_script_setup_true_lang-BQ7Yp-ge.js";
+import { _ as f } from "./label-button.vue_vue_type_script_setup_true_lang-CoHrTUSs.js";
 export {
   f as default
 };

package/lib/{label-button.vue_vue_type_script_setup_true_lang-BQ7Yp-ge.js → label-button.vue_vue_type_script_setup_true_lang-CoHrTUSs.js}

@@ -1,5 +1,5 @@
 import { defineComponent as s, useSlots as r, openBlock as c, createElementBlock as i, createVNode as p, createSlots as y, withCtx as n, renderSlot as o } from "vue";
-import { _ as u } from "./label-icon.vue_vue_type_style_index_0_lang-B3Qc4kMj.js";
+import { _ as u } from "./label-icon.vue_vue_type_style_index_0_lang-bQFkQ_gC.js";
 const f = /* @__PURE__ */ s({
   __name: "label-button",
   props: {

package/lib/{label-button.vue_vue_type_script_setup_true_lang-CGLBJ0Vc.cjs → label-button.vue_vue_type_script_setup_true_lang-DqhdCgmJ.cjs}

@@ -1 +1 @@
-"use strict";const e=require("vue"),a=require("./label-icon.vue_vue_type_style_index_0_lang-CbCZDSk8.cjs"),o=e.defineComponent({__name:"label-button",props:{preset:{},gap:{},iconClass:{type:[Boolean,null,String,Object,Array]},iconStyle:{type:[Boolean,null,String,Object,Array]},labelClass:{type:[Boolean,null,String,Object,Array]},labelStyle:{type:[Boolean,null,String,Object,Array]}},setup(s){const l=s,t=e.useSlots();return(n,c)=>(e.openBlock(),e.createElementBlock("button",null,[e.createVNode(a._sfc_main,{preset:l.preset,gap:l.gap,"icon-class":l.iconClass,"icon-style":l.iconStyle,"label-class":l.labelClass,"label-style":l.labelStyle},e.createSlots({_:2},[t.icon!=null?{name:"icon",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"icon")]),key:"0"}:void 0,t.default!=null?{name:"default",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"default")]),key:"1"}:void 0]),1032,["preset","gap","icon-class","icon-style","label-class","label-style"])]))}});exports._sfc_main=o;
+"use strict";const e=require("vue"),a=require("./label-icon.vue_vue_type_style_index_0_lang-C2URq6GP.cjs"),o=e.defineComponent({__name:"label-button",props:{preset:{},gap:{},iconClass:{type:[Boolean,null,String,Object,Array]},iconStyle:{type:[Boolean,null,String,Object,Array]},labelClass:{type:[Boolean,null,String,Object,Array]},labelStyle:{type:[Boolean,null,String,Object,Array]}},setup(s){const l=s,t=e.useSlots();return(n,c)=>(e.openBlock(),e.createElementBlock("button",null,[e.createVNode(a._sfc_main,{preset:l.preset,gap:l.gap,"icon-class":l.iconClass,"icon-style":l.iconStyle,"label-class":l.labelClass,"label-style":l.labelStyle},e.createSlots({_:2},[t.icon!=null?{name:"icon",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"icon")]),key:"0"}:void 0,t.default!=null?{name:"default",fn:e.withCtx(()=>[e.renderSlot(n.$slots,"default")]),key:"1"}:void 0]),1032,["preset","gap","icon-class","icon-style","label-class","label-style"])]))}});exports._sfc_main=o;

package/lib/label-icon.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./label-icon.vue_vue_type_style_index_0_lang-CbCZDSk8.cjs");exports.default=e._sfc_main;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("./label-icon.vue_vue_type_style_index_0_lang-C2URq6GP.cjs");exports.default=e._sfc_main;

package/lib/label-icon.js

@@ -1,4 +1,4 @@
-import { _ as f } from "./label-icon.vue_vue_type_style_index_0_lang-B3Qc4kMj.js";
+import { _ as f } from "./label-icon.vue_vue_type_style_index_0_lang-bQFkQ_gC.js";
 export {
   f as default
 };

package/lib/label-icon.vue_vue_type_style_index_0_lang-C2URq6GP.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),s=e.defineComponent({__name:"label-icon",props:{preset:{},gap:{},iconClass:{type:[Boolean,null,String,Object,Array]},iconStyle:{type:[Boolean,null,String,Object,Array]},labelClass:{type:[Boolean,null,String,Object,Array]},labelStyle:{type:[Boolean,null,String,Object,Array]}},setup(n){const l=n,o=e.useSlots();return(t,a)=>(e.openBlock(),e.createElementBlock("span",{class:"dwui-label-icon",style:e.normalizeStyle(l.gap==null?void 0:{"--dwui-label-icon-gap":l.gap})},[e.renderSlot(t.$slots,"icon",{},()=>[l.preset!=null?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(l.preset.icon),e.mergeProps({key:0},l.preset.iconProps,{class:l.iconClass,style:l.iconStyle}),null,16,["class","style"])):e.createCommentVNode("",!0)]),o.default!=null||l.preset!=null?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["dwui-label",l.labelClass]),style:e.normalizeStyle(l.labelStyle)},[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(typeof l.preset?.label=="function"?l.preset.label():l.preset?.label),1)])],6)):e.createCommentVNode("",!0)],4))}});exports._sfc_main=s;

package/lib/{label-icon.vue_vue_type_style_index_0_lang-B3Qc4kMj.js → label-icon.vue_vue_type_style_index_0_lang-bQFkQ_gC.js}

@@ -1,5 +1,5 @@
-import { defineComponent as c, useSlots as i, openBlock as l, createElementBlock as s, normalizeStyle as n, renderSlot as o, createBlock as y, resolveDynamicComponent as u, mergeProps as b, createCommentVNode as a, normalizeClass as m, createTextVNode as S, toDisplayString as g } from "vue";
-const f = /* @__PURE__ */ c({
+import { defineComponent as p, useSlots as i, openBlock as l, createElementBlock as s, normalizeStyle as n, renderSlot as o, createBlock as y, resolveDynamicComponent as u, mergeProps as b, createCommentVNode as a, normalizeClass as m, createTextVNode as S, toDisplayString as d } from "vue";
+const f = /* @__PURE__ */ p({
   __name: "label-icon",
   props: {
     preset: {},
@@ -10,10 +10,10 @@ const f = /* @__PURE__ */ c({
     labelStyle: { type: [Boolean, null, String, Object, Array] }
   },
   setup(r) {
-    const e = r, p = i();
-    return (t, d) => (l(), s("span", {
+    const e = r, c = i();
+    return (t, g) => (l(), s("span", {
       class: "dwui-label-icon",
-      style: n(e.gap == null ? void 0 : { gap: e.gap })
+      style: n(e.gap == null ? void 0 : { "--dwui-label-icon-gap": e.gap })
     }, [
       o(t.$slots, "icon", {}, () => [
         e.preset != null ? (l(), y(u(e.preset.icon), b({ key: 0 }, e.preset.iconProps, {
@@ -21,13 +21,13 @@ const f = /* @__PURE__ */ c({
           style: e.iconStyle
         }), null, 16, ["class", "style"])) : a("", !0)
       ]),
-      p.default != null || e.preset != null ? (l(), s("span", {
+      c.default != null || e.preset != null ? (l(), s("span", {
         key: 0,
         class: m(["dwui-label", e.labelClass]),
         style: n(e.labelStyle)
       }, [
         o(t.$slots, "default", {}, () => [
-          S(g(typeof e.preset?.label == "function" ? e.preset.label() : e.preset?.label), 1)
+          S(d(typeof e.preset?.label == "function" ? e.preset.label() : e.preset?.label), 1)
         ])
       ], 6)) : a("", !0)
     ], 4));

package/lib/nuxt.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@nuxt/kit"),r=require("./components-D8RaavU9.cjs");var t=typeof document<"u"?document.currentScript:null;const u=e.defineNuxtModule({meta:{name:"@digitalwalletcorp/vue-core",configKey:"vueCore"},setup(){const n=e.createResolver(typeof document>"u"?require("url").pathToFileURL(__filename).href:t&&t.tagName.toUpperCase()==="SCRIPT"&&t.src||new URL("nuxt.cjs",document.baseURI).href);for(const o of Object.keys(r.components))e.addComponent({name:o,export:o,filePath:n.resolve("./index")})}});exports.default=u;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("@nuxt/kit"),r=require("./components-CIzBo8qB.cjs");var t=typeof document<"u"?document.currentScript:null;const u=e.defineNuxtModule({meta:{name:"@digitalwalletcorp/vue-core",configKey:"vueCore"},setup(){const n=e.createResolver(typeof document>"u"?require("url").pathToFileURL(__filename).href:t&&t.tagName.toUpperCase()==="SCRIPT"&&t.src||new URL("nuxt.cjs",document.baseURI).href);for(const o of Object.keys(r.components))e.addComponent({name:o,export:o,filePath:n.resolve("./index")})}});exports.default=u;

package/lib/nuxt.js

@@ -1,5 +1,5 @@
 import { defineNuxtModule as t, createResolver as r, addComponent as n } from "@nuxt/kit";
-import { c as a } from "./components-BTso5UCT.js";
+import { c as a } from "./components-D-qeo7yx.js";
 const c = t({
   meta: {
     name: "@digitalwalletcorp/vue-core",

package/lib/register.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./components-D8RaavU9.cjs");function r(e){for(const[o,n]of Object.entries(t.components))e.component(o,n)}exports.registerComponents=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./components-CIzBo8qB.cjs");function r(e){for(const[o,n]of Object.entries(t.components))e.component(o,n)}exports.registerComponents=r;

package/lib/register.js

@@ -1,4 +1,4 @@
-import { c as t } from "./components-BTso5UCT.js";
+import { c as t } from "./components-D-qeo7yx.js";
 function m(o) {
   for (const [n, e] of Object.entries(t))
     o.component(n, e);

package/lib/style.css

@@ -1 +1 @@
-:where(.dwui-label-icon){display:inline-flex;align-items:center;gap:.25em}:where(.dwui-label-icon>.dwui-label){align-self:baseline}
+:where(.dwui-label-icon){display:inline-block}:where(.dwui-label-icon>.dwui-label){display:inline-block}:where(.dwui-label-icon>.dwui-label:not(:first-child)){margin-left:var(--dwui-label-icon-gap, .25em)}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digitalwalletcorp/vue-core",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "type": "module",
   "description": "Basic UI components for Vue 3",
   "main": "lib/index.cjs",

package/src/label-icon.vue

@@ -4,7 +4,7 @@
 <template>
   <span
     class="dwui-label-icon"
-    :style="props.gap == null ? undefined : { gap: props.gap }"
+    :style="props.gap == null ? undefined : { '--dwui-label-icon-gap': props.gap }"
   >
     <slot name="icon">
       <component
@@ -15,7 +15,7 @@
         :style="props.iconStyle"
       />
     </slot>
-    <!-- スロットに複数の要素が入っても、flexの子要素に分かれて間にgapが入らないよう1つにまとめる -->
+    <!-- スロットに複数の要素が入ってもラベルとして1つにまとめ、アイコンとの間隔をラベル側で空ける -->
     <span
       v-if="slots.default != null || props.preset != null"
       class="dwui-label"
@@ -55,14 +55,21 @@ const slots = defineSlots<Slots>();
 </script>
 
 <style>
+/*
+ * flexにせず通常のインライン配置に任せる。flexアイテムになるとvertical-alignが無視され、
+ * vue-svg-iconsがアイコンを文字の縦位置中央に揃える調整が効かなくなるため
+ */
 :where(.dwui-label-icon) {
-  display: inline-flex;
-  align-items: center;
-  gap: 0.25em;
+  display: inline-block;
 }
 
-/* inline-flexのベースラインは先頭の子(アイコン)から決まり、周囲の文字より浮くため、ラベルから決まるようにする */
+/* スロットに複数の要素が入っても1つにまとめ、前後の空白が隙間にならないようinline-blockにする */
 :where(.dwui-label-icon > .dwui-label) {
-  align-self: baseline;
+  display: inline-block;
+}
+
+/* アイコンとラベルの間隔。gapはflex専用のためmarginで空ける */
+:where(.dwui-label-icon > .dwui-label:not(:first-child)) {
+  margin-left: var(--dwui-label-icon-gap, 0.25em);
 }
 </style>

package/lib/label-icon.vue_vue_type_style_index_0_lang-CbCZDSk8.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("vue"),s=e.defineComponent({__name:"label-icon",props:{preset:{},gap:{},iconClass:{type:[Boolean,null,String,Object,Array]},iconStyle:{type:[Boolean,null,String,Object,Array]},labelClass:{type:[Boolean,null,String,Object,Array]},labelStyle:{type:[Boolean,null,String,Object,Array]}},setup(n){const l=n,o=e.useSlots();return(t,a)=>(e.openBlock(),e.createElementBlock("span",{class:"dwui-label-icon",style:e.normalizeStyle(l.gap==null?void 0:{gap:l.gap})},[e.renderSlot(t.$slots,"icon",{},()=>[l.preset!=null?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(l.preset.icon),e.mergeProps({key:0},l.preset.iconProps,{class:l.iconClass,style:l.iconStyle}),null,16,["class","style"])):e.createCommentVNode("",!0)]),o.default!=null||l.preset!=null?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["dwui-label",l.labelClass]),style:e.normalizeStyle(l.labelStyle)},[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(typeof l.preset?.label=="function"?l.preset.label():l.preset?.label),1)])],6)):e.createCommentVNode("",!0)],4))}});exports._sfc_main=s;