@globalbrain/sefirot 4.18.0 → 4.19.1

package/lib/components/SInputBase.vue

@@ -197,7 +197,7 @@ function getErrorMsg(validation: Validatable) {
   width: 100%;
   max-width: 65ch;
   margin: 0;
-  padding: 6px 0 0 0;
+  padding: 4px 0 0 0;
   line-height: 20px;
   font-size: 12px;
   font-weight: 400;

package/lib/components/SInputSelect.vue

@@ -1,12 +1,18 @@
 <script setup lang="ts">
 import IconCaretDown from '~icons/ph/caret-down-bold'
 import IconCaretUp from '~icons/ph/caret-up-bold'
-import { type Component, computed, ref } from 'vue'
-import { type Validatable } from '../composables/Validation'
-import SInputBase from './SInputBase.vue'
+import { computed, ref } from 'vue'
+import SInputBase, { type Props as BaseProps } from './SInputBase.vue'
+
+export interface Props extends BaseProps {
+  placeholder?: string
+  options: Option[]
+  nullable?: boolean
+  disabled?: boolean
+  value?: Value
+  modelValue?: Value
+}
 
-export type Size = 'mini' | 'small' | 'medium'
-export type Color = 'neutral' | 'mute' | 'info' | 'success' | 'warning' | 'danger'
 export type Value = any
 
 export interface Option {
@@ -15,24 +21,7 @@ export interface Option {
   disabled?: boolean
 }
 
-const props = withDefaults(defineProps<{
-  size?: Size
-  label?: string
-  info?: string
-  note?: string
-  help?: string
-  placeholder?: string
-  checkIcon?: Component
-  checkText?: string
-  checkColor?: Color
-  options: Option[]
-  nullable?: boolean
-  disabled?: boolean
-  value?: Value
-  modelValue?: Value
-  validation?: Validatable
-  hideError?: boolean
-}>(), {
+const props = withDefaults(defineProps<Props>(), {
   value: undefined,
   modelValue: undefined
 })
@@ -80,15 +69,16 @@ function emitChange(e: any): void {
   <SInputBase
     class="SInputSelect"
     :class="classes"
-    :label="label"
-    :note="note"
-    :info="info"
-    :help="help"
-    :check-icon="checkIcon"
-    :check-text="checkText"
-    :check-color="checkColor"
-    :hide-error="hideError"
-    :validation="validation"
+    :size
+    :label
+    :note
+    :info
+    :help
+    :check-icon
+    :check-text
+    :check-color
+    :hide-error
+    :validation
   >
     <div class="box" :class="{ focus: isFocused }">
       <select

package/lib/components/SState.vue

@@ -28,10 +28,10 @@ const classes = computed(() => [
 .SState {
   display: inline-flex;
   align-items: center;
-  border: 1px solid var(--c-border-mute-1);
+  border: 1px solid var(--c-divider);
   font-weight: 500;
   white-space: nowrap;
-  background-color: var(--c-bg-mute-1);
+  background-color: transparent;
 }
 
 .SState.mini {

package/lib/styles/variables.css

@@ -229,6 +229,10 @@
  * -------------------------------------------------------------------------- */
 
 :root {
+  --c-bg-1: var(--c-white);
+  --c-bg-2: var(--c-gray-3);
+  --c-bg-3: var(--c-gray-4);
+
   --c-bg-elv-1: #ffffff;
   --c-bg-elv-2: #f5f5f7;
   --c-bg-elv-3: #ffffff;
@@ -264,6 +268,10 @@
 }
 
 .dark {
+  --c-bg-1: var(--c-gray-1);
+  --c-bg-2: var(--c-gray-3);
+  --c-bg-3: var(--c-gray-4);
+
   --c-bg-elv-1: #000000;
   --c-bg-elv-2: #151517;
   --c-bg-elv-3: #1b1b1f;
@@ -719,17 +727,17 @@
  * -------------------------------------------------------------------------- */
 
 :root {
-  --pill-dimm-default-border-color: var(--c-border-mute-1);
+  --pill-dimm-default-border-color: var(--c-divider);
   --pill-dimm-default-text-color: var(--c-text-1);
-  --pill-dimm-default-bg-color: var(--c-bg-mute-1);
-  --pill-dimm-default-hover-bg-color: var(--c-bg-mute-2);
-  --pill-dimm-default-active-bg-color: var(--c-bg-mute-3);
+  --pill-dimm-default-bg-color: transparent;
+  --pill-dimm-default-hover-bg-color: var(--c-bg-2);
+  --pill-dimm-default-active-bg-color: var(--c-bg-3);
 
-  --pill-dimm-mute-border-color: var(--c-border-mute-1);
+  --pill-dimm-mute-border-color: var(--c-divider);
   --pill-dimm-mute-text-color: var(--c-text-2);
-  --pill-dimm-mute-bg-color: var(--c-bg-mute-1);
-  --pill-dimm-mute-hover-bg-color: var(--c-bg-mute-2);
-  --pill-dimm-mute-active-bg-color: var(--c-bg-mute-3);
+  --pill-dimm-mute-bg-color: transparent;
+  --pill-dimm-mute-hover-bg-color: var(--c-bg-2);
+  --pill-dimm-mute-active-bg-color: var(--c-bg-3);
 
   --pill-dimm-neutral-border-color: var(--c-neutral-1);
   --pill-dimm-neutral-text-color: var(--c-text-inverse-1);

package/lib/validation/rules/ymd.ts

@@ -4,8 +4,8 @@ import { ymd as baseYmd } from '../validators/ymd'
 type YmdType = 'y' | 'm' | 'd'
 
 export const message = {
-  en: 'The field is required.',
-  ja: 'この項目は必須です。'
+  en: 'The date is invalid.',
+  ja: '日付表記が正しくありません。'
 }
 
 export function ymd(required?: YmdType[], msg?: string) {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@globalbrain/sefirot",
   "type": "module",
-  "version": "4.18.0",
+  "version": "4.19.1",
   "packageManager": "pnpm@9.15.4",
   "description": "Vue Components for Global Brain Design System.",
   "author": "Kia Ishii <ka.ishii@globalbrains.com>",
@@ -58,7 +58,7 @@
     "lodash-es": "^4.17.21",
     "markdown-it": "^14.1.0",
     "normalize.css": "^8.0.1",
-    "pinia": "^3.0.1",
+    "pinia": "^3.0.2",
     "postcss": "^8.5.3",
     "postcss-nested": "^7.0.2",
     "v-calendar": "3.0.1",
@@ -66,8 +66,8 @@
     "vue-router": "^4.5.0"
   },
   "dependencies": {
-    "@sentry/browser": "^9.5.0",
-    "@sentry/vue": "^9.5.0",
+    "@sentry/browser": "^9.14.0",
+    "@sentry/vue": "^9.14.0",
     "@tanstack/vue-virtual": "3.0.0-beta.62",
     "@tinyhttp/content-disposition": "^2.2.2",
     "@tinyhttp/cookie": "^2.1.1",
@@ -87,13 +87,13 @@
     "@histoire/plugin-vue": "0.16.5",
     "@iconify-json/ph": "^1.2.2",
     "@iconify-json/ri": "^1.2.5",
-    "@release-it/conventional-changelog": "^10.0.0",
+    "@release-it/conventional-changelog": "^10.0.1",
     "@types/body-scroll-lock": "^3.1.2",
     "@types/lodash-es": "^4.17.12",
     "@types/markdown-it": "^14.1.2",
-    "@types/node": "^22.13.10",
-    "@vitejs/plugin-vue": "^5.2.1",
-    "@vitest/coverage-v8": "^3.0.8",
+    "@types/node": "^22.14.1",
+    "@vitejs/plugin-vue": "^5.2.3",
+    "@vitest/coverage-v8": "^3.1.2",
     "@vue/reactivity": "^3.5.13",
     "@vue/test-utils": "^2.4.6",
     "@vuelidate/core": "^2.0.3",
@@ -108,18 +108,18 @@
     "lodash-es": "^4.17.21",
     "markdown-it": "^14.1.0",
     "normalize.css": "^8.0.1",
-    "pinia": "^3.0.1",
+    "pinia": "^3.0.2",
     "postcss": "^8.5.3",
     "postcss-nested": "^7.0.2",
     "punycode": "^2.3.1",
-    "release-it": "^18.1.2",
-    "typescript": "~5.8.2",
+    "release-it": "^19.0.1",
+    "typescript": "~5.8.3",
     "v-calendar": "3.0.1",
-    "vite": "^6.2.1",
+    "vite": "^6.3.3",
     "vitepress": ">=2.0.0-alpha.3",
-    "vitest": "^3.0.8",
+    "vitest": "^3.1.2",
     "vue": "^3.5.13",
     "vue-router": "^4.5.0",
-    "vue-tsc": "^2.2.8"
+    "vue-tsc": "^2.2.10"
   }
 }