@digitalwalletcorp/vue-core 1.1.0 → 1.2.1

package/src/tab-group.vue

@@ -178,68 +178,79 @@ const onChangeTab = (labelId: string) => {
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
+  position: relative;
   margin-top: 5px;
   padding-bottom: 4px;
 }
 
 :where(.dwui-tab-radio) {
-  display: none;
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: 0;
+  opacity: 0;
+  pointer-events: none;
 }
 
 :where(.dwui-tab-item) {
   display: block;
   min-width: 100px;
   padding: 0 4px;
-  border: 1px solid var(--dwui-tab-border, #565656);
-  border-bottom: 1px solid var(--dwui-tab-header-accent, #5ab4bd);
-  background: var(--dwui-tab-header-bg, linear-gradient(#1313c7, navy));
+  border: 1px solid var(--dwui-border-color-tab, light-dark(#565656, #8a8a8a));
+  border-bottom: 1px solid var(--dwui-border-color-tab-header-accent, #5ab4bd);
+  background: var(--dwui-background-tab-header, linear-gradient(light-dark(#1313c7, #2a3a8f), light-dark(navy, #141c4d)));
   line-height: 2em;
   text-align: center;
   white-space: nowrap;
-  color: var(--dwui-tab-header-text, azure);
+  color: var(--dwui-color-text-tab-header, azure);
   text-overflow: ellipsis;
   cursor: pointer;
   transition: all 0.2s ease;
 }
 
 :where(.dwui-tab-radio:checked + .dwui-tab-item) {
-  background: var(--dwui-tab-header-selected-bg, linear-gradient(#1313c7, rgb(149, 149, 234), #1313c7));
-  color: var(--dwui-tab-header-selected-text, azure);
+  background: var(--dwui-background-tab-header-selected, linear-gradient(light-dark(#1313c7, #2a3a8f), light-dark(rgb(149, 149, 234), #5a62b8), light-dark(#1313c7, #2a3a8f)));
+  color: var(--dwui-color-text-tab-header-selected, azure);
   /* 選択済みのタブは操作の対象ではないためカーソルを既定にする */
   cursor: default;
 }
 
 :where(.dwui-tab-radio:disabled + .dwui-tab-item) {
-  background: var(--dwui-tab-header-disabled-bg, gray);
+  background: var(--dwui-background-tab-header-disabled, light-dark(gray, #4a4a4a));
   cursor: not-allowed;
 }
 
 :where(.dwui-tab-item.dwui-tab-warn) {
-  background: var(--dwui-tab-header-warn-bg, #efef13);
-  color: var(--dwui-tab-header-warn-text, midnightblue);
+  background: var(--dwui-background-tab-header-warn, light-dark(#efef13, #8a8a10));
+  color: var(--dwui-color-text-tab-header-warn, light-dark(midnightblue, #fffbd0));
 }
 
 :where(.dwui-tab-radio:checked + .dwui-tab-item.dwui-tab-warn) {
-  background: var(--dwui-tab-header-warn-selected-bg, linear-gradient(#fafa06, rgb(232, 238, 206), #fafa06));
+  background: var(--dwui-background-tab-header-warn-selected, linear-gradient(light-dark(#fafa06, #8a8a10), light-dark(rgb(232, 238, 206), #a8a860), light-dark(#fafa06, #8a8a10)));
 }
 
 :where(.dwui-tab-item.dwui-tab-error) {
-  background: var(--dwui-tab-header-error-bg, red);
-  color: var(--dwui-tab-header-error-text, azure);
+  background: var(--dwui-background-tab-header-error, light-dark(red, #a01818));
+  color: var(--dwui-color-text-tab-header-error, azure);
 }
 
 :where(.dwui-tab-radio:checked + .dwui-tab-item.dwui-tab-error) {
-  background: var(--dwui-tab-header-error-selected-bg, linear-gradient(#ff0000, rgb(240, 136, 136), #ff0000));
+  background: var(--dwui-background-tab-header-error-selected, linear-gradient(light-dark(#ff0000, #a01818), light-dark(rgb(240, 136, 136), #c86060), light-dark(#ff0000, #a01818)));
 }
 
 :where(.dwui-tab-radio:not(:checked) + .dwui-tab-item:hover) {
   /* 背景の上に半透明の白を重ね、枠線と文字はそのままで背景だけを明るくする */
-  box-shadow: inset 0 0 0 999px var(--dwui-tab-header-hover-overlay, rgba(255, 255, 255, 0.35));
+  box-shadow: inset 0 0 0 999px var(--dwui-overlay-color-tab-header-hover, light-dark(rgba(255, 255, 255, 0.35), rgba(255, 255, 255, 0.15)));
+}
+
+:where(.dwui-tab-radio:focus-visible + .dwui-tab-item) {
+  outline: var(--dwui-width-focus-ring, 2px) solid var(--dwui-outline-color-focus-ring, Highlight);
+  outline-offset: var(--dwui-offset-focus-ring, 2px);
 }
 
 :where(.dwui-tab-items) {
   height: 100%;
-  border: 1px solid var(--dwui-tab-border, #565656);
+  border: 1px solid var(--dwui-border-color-tab, light-dark(#565656, #8a8a8a));
   /* 中身を切り替えたときのスライドを枠内に収める */
   overflow: hidden;
 }

package/lib/accordion-fieldset.vue_vue_type_style_index_0_lang-Dd8HXuVm.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("vue"),r=require("@digitalwalletcorp/vue-svg-icons"),c=require("./label-icon.vue_vue_type_style_index_0_lang-C2URq6GP.cjs"),u=require("./use-shrinkable-Cu9JQZll.cjs"),p=["disabled"],_=["aria-expanded"],f=e.defineComponent({__name:"accordion-fieldset",props:{legend:{},disabled:{type:Boolean},initialExpand:{type:Boolean}},setup(a){const t=a,o=e.useSlots(),l=e.ref(),n=e.reactive({expanded:!0}),i=u.useShrinkable(l),s=()=>{n.expanded=!n.expanded};return e.onMounted(()=>{n.expanded=!!t.initialExpand}),(d,g)=>(e.openBlock(),e.createElementBlock("fieldset",{class:"dwui-accordion-fieldset",disabled:t.disabled},[e.createElementVNode("legend",null,[e.createElementVNode("button",{type:"button",class:"dwui-accordion-toggle","aria-expanded":n.expanded,onClick:s},[e.createVNode(e.unref(r.SvgTriangleButton),{direction:n.expanded?"up":"down"},null,8,["direction"]),t.legend!=null||o.legend!=null||o.icon!=null?(e.openBlock(),e.createBlock(c._sfc_main,{key:0},e.createSlots({_:2},[o.icon!=null?{name:"icon",fn:e.withCtx(()=>[e.renderSlot(d.$slots,"icon")]),key:"0"}:void 0,t.legend!=null||o.legend!=null?{name:"default",fn:e.withCtx(()=>[e.renderSlot(d.$slots,"legend",{},()=>[e.createTextVNode(e.toDisplayString(t.legend),1)])]),key:"1"}:void 0]),1024)):e.createCommentVNode("",!0)],8,_)]),e.createElementVNode("div",{ref_key:"refContents",ref:l,class:e.normalizeClass(["dwui-accordion-contents",e.unref(i)?n.expanded?"dwui-expanded":"dwui-shrunk":""])},[e.renderSlot(d.$slots,"default")],2)],8,p))}});exports._sfc_main=f;

package/lib/components-YAonMRcW.cjs

@@ -1 +0,0 @@
-"use strict";const e=require("./accordion-fieldset.vue_vue_type_style_index_0_lang-Dd8HXuVm.cjs"),_=require("./accordion-section.vue_vue_type_style_index_0_lang-BBEywIH3.cjs"),n=require("./hourglass-loading.vue_vue_type_style_index_0_lang-C72UVA9W.cjs"),t=require("./label-button.vue_vue_type_script_setup_true_lang-DqhdCgmJ.cjs"),i=require("./label-icon.vue_vue_type_style_index_0_lang-C2URq6GP.cjs"),o=require("./page-section.vue_vue_type_style_index_0_lang-bvQeBjUP.cjs"),c=require("./page-title.vue_vue_type_style_index_0_lang-DcmGICoo.cjs"),s=require("./tab-content.vue_vue_type_style_index_0_lang-BeCi7Xkp.cjs"),u=require("./tab-group.vue_vue_type_style_index_0_lang-CwVGYZAo.cjs"),a=Object.freeze(Object.defineProperty({__proto__:null,AccordionFieldset:e._sfc_main,AccordionSection:_._sfc_main,HourglassLoading:n._sfc_main,LabelButton:t._sfc_main,LabelIcon:i._sfc_main,PageSection:o._sfc_main,PageTitle:c._sfc_main,TabContent:s._sfc_main,TabGroup:u._sfc_main},Symbol.toStringTag,{value:"Module"}));exports.components=a;

package/lib/label-button.vue_vue_type_script_setup_true_lang-DqhdCgmJ.cjs

@@ -1 +0,0 @@
-"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;