nuxt-hs-ui 2.12.7 → 4.0.0-beta.1

package/README.md

@@ -1,33 +1,221 @@
-# nuxt-hs-ui
+# nuxt-hs-ui-next
 
-.......
- 
+A Nuxt 4 UI component library for business management applications, built on top of [@nuxt/ui](https://ui.nuxt.com/) and Tailwind CSS v4.
+
+**Version:** 3.x  |  **License:** MIT  |  **Author:** [Ryo@Hare-Systems](https://github.com/hare-systems-ryo)
+
+---
+
+## Requirements
+
+| Dependency | Version |
+|---|---|
+| Nuxt | `^4.x` |
+| @nuxt/ui | `^4.x` |
+| @pinia/nuxt | `^0.11` |
+| pinia-plugin-persistedstate | `^4.x` |
+| @vueuse/nuxt | `^13.x` |
+| sass-embedded | `^1.x` |
+
+---
 
 ## Installation
 
 ```sh
-npm i nuxt-hs-ui
+npm install nuxt-hs-ui
 ```
 
-### Nuxt
+---
+
+## Setup
+
+### 1. `nuxt.config.ts`
+
+Add the module and configure your theme colors. The `theme` object generates TypeScript type definitions for color tokens — **the actual CSS is applied via Tailwind (see step 2).**
 
 ```ts
-import twConfig from "./tailwind.config";
 export default defineNuxtConfig({
+  colorMode: {
+    preference: 'light',
+    fallback: 'light',
+    classSuffix: '',
+  },
+  build: {
+    transpile: ['nuxt-hs-ui'],
+  },
+  vite: {
+    optimizeDeps: { exclude: ['nuxt-hs-ui'] },
+    ssr: { noExternal: ['nuxt-hs-ui'] },
+  },
   modules: [
-    //
+    '@nuxt/eslint',
+    '@nuxt/image',
+    '@nuxt/ui',
+    '@pinia/nuxt',
+    'pinia-plugin-persistedstate/nuxt',
     [
-      "nuxt-hs-ui",
+      'nuxt-hs-ui',
       {
-        tailwind: twConfig,
-        prefix: {
-          nuxtUi: "",
-          form: "",
-          interactive: "",
-          layout: "",
+        theme: {
+          main0: '#183C5E',
+          main1: '#2C5A85',
+          main2: '#487CB4',
+          main3: '#A7CDED',
+          main4: '#C4E1FF',
+          accent1: '#FF6600',
+          accent2: '#FFAC7C',
+          info: '#2BABB5',
+          success: '#2BB60C',
+          warn: '#EAB000',
+          error: '#D80329',
+          link: '#6200EE',
+          download: '#11691F',
+          dark: '#224466',
+          back1: '#EDF2F7',
+          back2: '#AABED1',
+          back3: '#B5C3D8',
+          back4: '#7487a3',
         },
       },
     ],
   ],
 });
 ```
+
+### 2. CSS (e.g. `assets/css/main.css`)
+
+Import Tailwind and define the same colors as CSS custom properties under `@theme static`. The `@source` directive ensures Tailwind scans the library's `dist` folder for utility classes used inside components.
+
+```css
+@import "tailwindcss";
+@import "@nuxt/ui";
+@source "../../node_modules/nuxt-hs-ui/dist";
+
+@theme static {
+  --color-main0   : #183C5E;
+  --color-main1   : #2C5A85;
+  --color-main2   : #487CB4;
+  --color-main3   : #A7CDED;
+  --color-main4   : #C4E1FF;
+  --color-accent1 : #FF6600;
+  --color-accent2 : #ffac7c;
+  --color-info    : #2BABB5;
+  --color-success : #2BB60C;
+  --color-warn    : #EAB000;
+  --color-error   : #D80329;
+  --color-link    : #6200EE;
+  --color-download: #11691f;
+  --color-dark    : #224466;
+  --color-back1   : #EDF2F7;
+  --color-back2   : #D5D9DD;
+  --color-back3   : #B5C3D8;
+  --color-back4   : #7487a3;
+}
+```
+
+> **Note:** The `theme` object in `nuxt.config.ts` is used only for generating TypeScript color token types. The actual CSS values must be declared here in `@theme static`.
+
+---
+
+## Components
+
+All components are auto-imported when the module is registered.
+
+### Form
+
+| Component | Description |
+|---|---|
+| `Btn` | Themed button with loading / disabled states |
+| `BtnLineLoading` | Button with inline loading indicator |
+| `TextBox` | Styled text input |
+| `Textarea` | Styled multi-line input |
+| `CheckBox` | Single checkbox with label |
+| `CheckList` | List of checkboxes |
+| `Radio` | Radio button group |
+| `Select` | Dropdown select with search |
+| `SelectImgIcon` | Select with image/icon support |
+| `DatePicker` | Date picker (powered by flatpickr) |
+| `ValueBox` | Read-only value display field |
+| `InputFrame` | Generic wrapper for custom form inputs |
+
+### Interactive
+
+| Component | Description |
+|---|---|
+| `Alert` | Inline alert banner |
+| `BlockLoading` | Full-area loading overlay |
+| `Dialog` | Confirmation / prompt dialog |
+| `Modal` | Base modal with focus-trap and scroll-lock |
+| `ModalBg` | Backdrop layer for modals |
+| `Toast` | Toast notification |
+| `WindowLoader` | Full-window loading screen |
+
+### Layout
+
+| Component | Description |
+|---|---|
+| `Card` | Themed content card |
+| `CardItem` | Row item inside a `Card` |
+| `Container` | Page-level container |
+| `Accordion` | Collapsible section |
+| `AccordionDown` | Bottom-anchored collapsible section |
+| `AspectBox` | Fixed aspect-ratio container |
+| `DividerH` | Horizontal divider |
+
+### Misc
+
+| Component | Description |
+|---|---|
+| `Breadcrumb` | Page breadcrumb navigation |
+| `Tabulator` | Data grid (powered by tabulator-tables) |
+| `ViewNameDisplay` | Current page / view name label |
+
+---
+
+## Composables
+
+All composables are auto-imported.
+
+| Composable | Description |
+|---|---|
+| `useHsDialog` | Open/close/control `Dialog` imperatively |
+| `useHsModal` | Open/close/control `Modal` imperatively |
+| `useHsToast` | Fire toast notifications |
+| `useHsWindowLoader` | Show/hide the window-level loader |
+| `useHsScrollLock` | Lock/unlock body scroll |
+| `useHsFocus` | Focus management helpers |
+| `useHsIsMobile` | Reactive mobile breakpoint detection |
+| `useHsMultiLang` | Multilingual label resolution |
+| `useHsMisc` | Miscellaneous utilities |
+
+---
+
+## Utils
+
+Available via `nuxt-hs-ui-next/utils/*` named exports.
+
+| Module | Description |
+|---|---|
+| `string` | String manipulation helpers |
+| `number` | Number formatting and parsing |
+| `float` | Floating-point safe arithmetic (BigNumber.js) |
+| `object` | Object / Map utilities |
+| `select` | Select item builder helpers |
+| `select-item` | Select item type definitions |
+| `multi-lang` | Multilingual string utilities |
+| `multi-lang-object` | Multilingual object utilities |
+| `wareki` | Japanese era (和暦) conversion |
+| `dayjs` | Pre-configured dayjs instance |
+| `tabulator` | Tabulator helper types and formatters |
+| `class-style` | Tailwind class merging utilities |
+| `modal` | Modal state helpers |
+| `stop-watch` | Stopwatch / timer utility |
+| `tv` | tailwind-variants wrapper |
+| `theme` | Theme token accessor |
+| `com` | Common utility functions |
+
+---
+
+## License
+
+MIT © [Ryo@Hare-Systems](https://github.com/hare-systems-ryo)

package/dist/module.d.mts

@@ -1,16 +1,15 @@
 import * as _nuxt_schema from '@nuxt/schema';
 
-type Config = any;
 interface ModuleOptions {
     prefix: {
-        nuxtUi: string;
         form: string;
         interactive: string;
         layout: string;
         misc: string;
     };
-    tailwind?: Partial<Config>;
+    theme: Record<string, string>;
 }
 declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
 
-export { type ModuleOptions, _default as default };
+export { _default as default };
+export type { ModuleOptions };

package/dist/module.json

@@ -1,12 +1,15 @@
 {
-  "name": "nuxt-hs-ui",
-  "configKey": "hsui",
+  "name": "my-module",
+  "configKey": "myModule",
+  "dependencies": [
+    "@nuxt/ui"
+  ],
   "compatibility": {
-    "nuxt": ">=3.15.0"
+    "nuxt": ">=4.0.0"
   },
-  "version": "2.12.7",
+  "version": "4.0.0-beta.1",
   "builder": {
-    "@nuxt/module-builder": "0.8.4",
-    "unbuild": "2.0.0"
+    "@nuxt/module-builder": "1.0.2",
+    "unbuild": "3.6.0"
   }
 }

package/dist/module.mjs

@@ -1,130 +1,156 @@
-import { defineNuxtModule, createResolver, addImportsDir, addComponentsDir, installModule, addPlugin } from '@nuxt/kit';
-import { defu } from 'defu';
+import { addTemplate, defineNuxtModule, createResolver, addComponentsDir, addImportsDir } from '@nuxt/kit';
 
-const defaultTwConfig = {
-  future: {
-    hoverOnlyWhenSupported: true
-  },
-  theme: {
-    screens: {
-      400: "400px",
-      600: "600px",
-      sm: "640px",
-      md: "768px",
-      800: "800px",
-      1e3: "1000px",
-      lg: "1024px",
-      1200: "1200px",
-      xl: "1280px",
-      1400: "1400px",
-      "2xl": "1536px",
-      1600: "1600px",
-      1800: "1800px"
-    },
-    extend: {
-      colors: {
-        main0: "#192a61",
-        main1: "#1c03a2",
-        main2: "#4443ff",
-        main3: "#628cff",
-        accent1: "#FF6600",
-        accent2: "#ffac7c",
-        info: "#2badd5",
-        link: "#6200EE",
-        download: "#11691f",
-        success: "#2bb60c",
-        warn: "#EAB000",
-        error: "#d80329",
-        white: "#FFFFFF",
-        black: "#000000",
-        dark: "#224466",
-        back: "#EDF2F7"
+const AddTheme = (theme) => {
+  const themeColor = JSON.stringify(theme, null, 2);
+  const themekey = Object.keys(theme || {});
+  const Theme = themekey.reduce((ret, key) => {
+    ret[key] = key;
+    return ret;
+  }, {});
+  addTemplate({
+    filename: "nuxt-hs-ui-next/runtime/theme.mjs",
+    getContents: () => `
+export const Theme = ${JSON.stringify(Theme, null, 2)};
+const themeColor = ${themeColor};
+export function GetColorCode(key){
+  return themeColor[key] ?? '#000000';
+}
+`
+  });
+  addTemplate({
+    filename: "nuxt-hs-ui-next/types/theme.d.ts",
+    getContents: () => {
+      const union = themekey.length ? themekey.map((k) => `'${k}'`).join(" | ") : "never";
+      return `
+declare module '#build/nuxt-hs-ui-next/runtime/theme' {
+  export type ThemeColor = ${union};
+  export const Theme: Record<ThemeColor, ThemeColor>;
+  export function GetColorCode(key: ThemeColor): string;
+}
+declare module '#build/nuxt-hs-ui-next/runtime/theme-internal' {
+  export function GetColorCode(key: string): string;
+}
+export type ThemeColor = ${union};
+ const theme = ${JSON.stringify(Theme, null, 2).replace(/"(\w*)":/g, "$1:").replace(/"/g, "'")};
+export type Theme =typeof  theme
+export {}
+`;
+    }
+  });
+};
+
+const AddCss = (nuxt, resolve, {
+  // moduleName = 'nuxt-hs-ui',
+  mode = "bundle",
+  // ← 今はここを固定で使う（将来オプション化）
+  files = [
+    "flatpickr-dark.css",
+    "flatpickr-month-select-style.css",
+    "tabulator.css",
+    "tabulator-custom.css",
+    // // 'vue-select.css',
+    "main.css"
+  ]
+} = {}) => {
+  if (mode === "none") return;
+  if (mode === "bundle") {
+    for (const name of files) {
+      const ref = resolve(`./runtime/assets/${name}`);
+      if (!nuxt.options.css.includes(ref)) {
+        nuxt.options.css.push(ref);
       }
     }
   }
 };
-const module = defineNuxtModule({
+
+const module$1 = defineNuxtModule({
   meta: {
-    name: "nuxt-hs-ui",
-    configKey: "hsui",
+    name: "my-module",
+    configKey: "myModule",
+    dependencies: [
+      "@nuxt/ui"
+      //
+      // '@vueuse/nuxt',
+      // '@pinia/nuxt',
+      // 'pinia-plugin-persistedstate/nuxt',
+    ],
     compatibility: {
-      nuxt: ">=3.15.0"
+      nuxt: ">=4.0.0"
     }
   },
   // Default configuration options of the Nuxt module
   defaults: {
     prefix: {
-      nuxtUi: "",
       form: "",
       interactive: "",
       layout: "",
       misc: ""
     },
-    tailwind: {}
+    theme: {
+      main0: "#183C5E",
+      main1: "#2C5A85",
+      main2: "#487CB4",
+      main3: "#A7CDED",
+      main4: "#C4E1FF",
+      accent1: "#FF6600",
+      accent2: "#FFAC7C",
+      info: "#2BABB5",
+      link: "#6200EE",
+      download: "#11691F",
+      success: "#2BB60C",
+      warn: "#EAB000",
+      error: "#D80329",
+      dark: "#224466",
+      back1: "#EDF2F7",
+      back2: "#AABED1",
+      white: "#FFFFFF"
+    }
   },
-  async setup(_options, _nuxt) {
-    const resolver = createResolver(import.meta.url);
-    const resolve = resolver.resolve;
-    const runtimeDir = resolve("./runtime");
-    const isDevelopment = runtimeDir.endsWith("src/runtime") || runtimeDir.endsWith("src\\runtime");
-    const extension = isDevelopment ? "scss" : "css";
-    const twReqConfig = {
-      content: {
-        files: [
-          //
-          resolve("./runtime/components/**/*.{vue,mjs,ts}"),
-          resolve("./runtime/**/*.{mjs,js,ts}")
-        ]
-      }
-    };
-    const twConfig = defu(
-      twReqConfig,
-      defu(_options.tailwind, defaultTwConfig)
-    );
-    const pConfig = _nuxt.options.runtimeConfig.public;
-    pConfig.hsui = {
-      colors: twConfig.theme.extend.colors
-    };
-    _nuxt.options.appConfig.tv = {
-      twMerge: true,
-      twMergeConfig: {
-        theme: twConfig.theme
-      }
-    };
-    addImportsDir(resolve("runtime/composables"));
+  async setup(options, nuxt) {
+    const { resolve } = createResolver(import.meta.url);
+    AddTheme(options.theme);
     addComponentsDir({
       path: resolve("runtime/components/form"),
-      prefix: _options.prefix.form
-    });
-    addComponentsDir({
-      path: resolve("runtime/components/interactive"),
-      prefix: _options.prefix.interactive
+      prefix: options.prefix.form,
+      pattern: "**/*.vue",
+      ignore: [
+        "**/_*/**",
+        // 深さ問わず、"_xxx" という名前のフォルダ配下を全部除外
+        "**/*/_**"
+        // 深さ問わず、"_xxx" という名前のフォルダ配下を全部除外
+      ]
     });
     addComponentsDir({
       path: resolve("runtime/components/layout"),
-      prefix: _options.prefix.layout
+      prefix: options.prefix.layout
     });
     addComponentsDir({
       path: resolve("runtime/components/misc"),
-      prefix: _options.prefix.misc
+      prefix: options.prefix.misc
     });
-    _nuxt.options.css.push(resolve("runtime/style." + extension));
-    _nuxt.options.css.push(resolve("runtime/tailwind." + extension));
-    _nuxt.options.css.push(resolve("runtime/assets/flatpickr-dark.css"));
-    _nuxt.options.css.push(
-      resolve("runtime/assets/flatpickr-month-select-style.css")
-    );
-    _nuxt.options.css.push(resolve("runtime/assets/vue-select.css"));
-    _nuxt.options.css.push(resolve("runtime/assets/tabulator.css"));
-    _nuxt.options.css.push(resolve("runtime/assets/tabulator-custom.css"));
-    await installModule("@nuxtjs/tailwindcss", {
-      exposeConfig: true,
-      config: twConfig
+    addComponentsDir({
+      path: resolve("runtime/components/interactive"),
+      prefix: options.prefix.interactive
     });
-    await installModule("@pinia/nuxt");
-    await installModule("@vueuse/nuxt");
-    addPlugin(resolve("runtime/plugin/v-select"));
+    addImportsDir(resolve("runtime/composables"));
+    AddCss(nuxt, resolve, { mode: "bundle" });
+    nuxt.options.vite ||= {};
+    nuxt.options.vite.optimizeDeps ||= {};
+    nuxt.options.vite.optimizeDeps.include ||= [];
+    nuxt.options.vite.optimizeDeps.include.push(
+      "@vueuse/integrations/useFocusTrap",
+      "body-scroll-lock",
+      "tailwind-merge",
+      "tailwind-variants",
+      "@internationalized/date",
+      "dayjs/esm/index",
+      "dayjs/esm/locale/en.js",
+      "dayjs/esm/locale/ja.js",
+      "dayjs/esm/plugin/advancedFormat",
+      "dayjs/esm/plugin/timezone",
+      "dayjs/esm/plugin/utc"
+    );
   }
 });
 
-export { module as default };
+export { module$1 as default };

package/dist/runtime/assets/flatpickr-dark.css

@@ -1 +1 @@
-.flatpickr-calendar{animation:none;background:transparent;background:#3f4458;border:0;border-radius:5px;box-shadow:1px 0 0 #20222c,-1px 0 0 #20222c,0 1px 0 #20222c,0 -1px 0 #20222c,0 3px 13px rgba(0,0,0,.08);box-sizing:border-box;direction:ltr;display:none;font-size:14px;line-height:24px;opacity:0;padding:0;position:absolute;text-align:center;touch-action:manipulation;visibility:hidden;width:307.875px}.flatpickr-calendar.inline,.flatpickr-calendar.open{max-height:640px;opacity:1;visibility:visible}.flatpickr-calendar.open{display:inline-block;z-index:99999}.flatpickr-calendar.animate.open{animation:fpFadeInDown .3s cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.inline{display:block;position:relative;top:2px}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{display:block;z-index:999}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){box-shadow:none!important}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6}.flatpickr-calendar .hasTime .dayContainer,.flatpickr-calendar .hasWeeks .dayContainer{border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}.flatpickr-calendar.hasTime .flatpickr-time{border-top:1px solid #20222c;height:40px}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:after,.flatpickr-calendar:before{border:solid transparent;content:"";display:block;height:0;left:22px;pointer-events:none;position:absolute;width:0}.flatpickr-calendar.arrowRight:after,.flatpickr-calendar.arrowRight:before,.flatpickr-calendar.rightMost:after,.flatpickr-calendar.rightMost:before{left:auto;right:22px}.flatpickr-calendar.arrowCenter:after,.flatpickr-calendar.arrowCenter:before{left:50%;right:50%}.flatpickr-calendar:before{border-width:5px;margin:0 -5px}.flatpickr-calendar:after{border-width:4px;margin:0 -4px}.flatpickr-calendar.arrowTop:after,.flatpickr-calendar.arrowTop:before{bottom:100%}.flatpickr-calendar.arrowTop:before{border-bottom-color:#20222c}.flatpickr-calendar.arrowTop:after{border-bottom-color:#3f4458}.flatpickr-calendar.arrowBottom:after,.flatpickr-calendar.arrowBottom:before{top:100%}.flatpickr-calendar.arrowBottom:before{border-top-color:#20222c}.flatpickr-calendar.arrowBottom:after{border-top-color:#3f4458}.flatpickr-calendar:focus{outline:0}.flatpickr-wrapper{display:inline-block;position:relative}.flatpickr-months{display:flex}.flatpickr-months .flatpickr-month{background:#3f4458;color:#fff;fill:#fff;flex:1;height:34px;line-height:1;overflow:hidden;position:relative;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}.flatpickr-months .flatpickr-next-month,.flatpickr-months .flatpickr-prev-month{color:#fff;cursor:pointer;height:34px;padding:10px;position:absolute;text-decoration:none;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:3;fill:#fff}.flatpickr-months .flatpickr-next-month.flatpickr-disabled,.flatpickr-months .flatpickr-prev-month.flatpickr-disabled{display:none}.flatpickr-months .flatpickr-next-month i,.flatpickr-months .flatpickr-prev-month i{position:relative}.flatpickr-months .flatpickr-next-month.flatpickr-prev-month,.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month{left:0}.flatpickr-months .flatpickr-next-month.flatpickr-next-month,.flatpickr-months .flatpickr-prev-month.flatpickr-next-month{right:0}.flatpickr-months .flatpickr-next-month:hover,.flatpickr-months .flatpickr-prev-month:hover{color:#eee}.flatpickr-months .flatpickr-next-month:hover svg,.flatpickr-months .flatpickr-prev-month:hover svg{fill:#f64747}.flatpickr-months .flatpickr-next-month svg,.flatpickr-months .flatpickr-prev-month svg{height:14px;width:14px}.flatpickr-months .flatpickr-next-month svg path,.flatpickr-months .flatpickr-prev-month svg path{transition:fill .1s;fill:inherit}.numInputWrapper{height:auto;position:relative}.numInputWrapper input,.numInputWrapper span{display:inline-block}.numInputWrapper input{width:100%}.numInputWrapper input::-ms-clear{display:none}.numInputWrapper input::-webkit-inner-spin-button,.numInputWrapper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.numInputWrapper span{border:1px solid hsla(0,0%,100%,.15);box-sizing:border-box;cursor:pointer;height:50%;line-height:50%;opacity:0;padding:0 4px 0 2px;position:absolute;right:0;width:14px}.numInputWrapper span:hover{background:hsla(48,17%,70%,.1)}.numInputWrapper span:active{background:hsla(48,17%,70%,.2)}.numInputWrapper span:after{content:"";display:block;position:absolute}.numInputWrapper span.arrowUp{border-bottom:0;top:0}.numInputWrapper span.arrowUp:after{border-bottom:4px solid hsla(0,0%,100%,.6);border-left:4px solid transparent;border-right:4px solid transparent;top:26%}.numInputWrapper span.arrowDown{top:50%}.numInputWrapper span.arrowDown:after{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid hsla(0,0%,100%,.6);top:40%}.numInputWrapper span svg{height:auto;width:inherit}.numInputWrapper span svg path{fill:hsla(0,0%,100%,.5)}.numInputWrapper:hover{background:hsla(48,17%,70%,.05)}.numInputWrapper:hover span{opacity:1}.flatpickr-current-month{color:inherit;display:inline-block;font-size:135%;font-weight:300;height:34px;left:12.5%;line-height:inherit;line-height:1;padding:7.48px 0 0;position:absolute;text-align:center;transform:translateZ(0);width:75%}.flatpickr-current-month span.cur-month{color:inherit;display:inline-block;font-family:inherit;font-weight:700;margin-left:.5ch;padding:0}.flatpickr-current-month span.cur-month:hover{background:hsla(48,17%,70%,.05)}.flatpickr-current-month .numInputWrapper{display:inline-block;width:6ch;width:7ch\0}.flatpickr-current-month .numInputWrapper span.arrowUp:after{border-bottom-color:#fff}.flatpickr-current-month .numInputWrapper span.arrowDown:after{border-top-color:#fff}.flatpickr-current-month input.cur-year{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;background:transparent;border:0;border-radius:0;box-sizing:border-box;color:inherit;cursor:text;display:inline-block;font-family:inherit;font-size:inherit;font-weight:300;height:auto;line-height:inherit;margin:0;padding:0 0 0 .5ch;vertical-align:initial}.flatpickr-current-month input.cur-year:focus{outline:0}.flatpickr-current-month input.cur-year[disabled],.flatpickr-current-month input.cur-year[disabled]:hover{background:transparent;color:hsla(0,0%,100%,.5);font-size:100%;pointer-events:none}.flatpickr-current-month .flatpickr-monthDropdown-months{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;background:#3f4458;border:none;border-radius:0;box-sizing:border-box;-webkit-box-sizing:border-box;color:inherit;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:300;height:auto;line-height:inherit;margin:-1px 0 0;outline:none;padding:0 0 0 .5ch;position:relative;vertical-align:initial;width:auto}.flatpickr-current-month .flatpickr-monthDropdown-months:active,.flatpickr-current-month .flatpickr-monthDropdown-months:focus{outline:none}.flatpickr-current-month .flatpickr-monthDropdown-months:hover{background:hsla(48,17%,70%,.05)}.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:#3f4458;outline:none;padding:0}.flatpickr-weekdays{align-items:center;background:transparent;display:flex;height:28px;overflow:hidden;text-align:center;width:100%}.flatpickr-weekdays .flatpickr-weekdaycontainer{display:flex;flex:1}span.flatpickr-weekday{background:#3f4458;color:#fff;cursor:default;display:block;flex:1;font-size:90%;font-weight:bolder;line-height:1;margin:0;text-align:center}.dayContainer,.flatpickr-weeks{padding:1px 0 0}.flatpickr-days{align-items:flex-start;display:flex;overflow:hidden;position:relative;width:307.875px}.flatpickr-days:focus{outline:0}.dayContainer{box-sizing:border-box;display:inline-block;display:flex;flex-wrap:wrap;-ms-flex-wrap:wrap;justify-content:space-around;max-width:307.875px;min-width:307.875px;opacity:1;outline:0;padding:0;text-align:left;transform:translateZ(0);width:307.875px}.dayContainer+.dayContainer{box-shadow:-1px 0 0 #20222c}.flatpickr-day{background:none;border:1px solid transparent;border-radius:150px;box-sizing:border-box;color:hsla(0,0%,100%,.95);cursor:pointer;display:inline-block;flex-basis:14.2857143%;font-weight:400;height:39px;justify-content:center;line-height:39px;margin:0;max-width:39px;position:relative;text-align:center;width:14.2857143%}.flatpickr-day.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day.nextMonthDay:focus,.flatpickr-day.nextMonthDay:hover,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.today.inRange,.flatpickr-day:focus,.flatpickr-day:hover{background:#646c8c;border-color:#646c8c;cursor:pointer;outline:0}.flatpickr-day.today{border-color:#eee}.flatpickr-day.today:focus,.flatpickr-day.today:hover{background:#eee;border-color:#eee;color:#3f4458}.flatpickr-day.endRange,.flatpickr-day.endRange.inRange,.flatpickr-day.endRange.nextMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.endRange:focus,.flatpickr-day.endRange:hover,.flatpickr-day.selected,.flatpickr-day.selected.inRange,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.selected:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange,.flatpickr-day.startRange.inRange,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.startRange:focus,.flatpickr-day.startRange:hover{background:#80cbc4;border-color:#80cbc4;box-shadow:none;color:#fff}.flatpickr-day.endRange.startRange,.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange{border-radius:50px 0 0 50px}.flatpickr-day.endRange.endRange,.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange{border-radius:0 50px 50px 0}.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)){box-shadow:-10px 0 0 #80cbc4}.flatpickr-day.endRange.startRange.endRange,.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange{border-radius:50px}.flatpickr-day.inRange{border-radius:0;box-shadow:-5px 0 0 #646c8c,5px 0 0 #646c8c}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.nextMonthDay,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.prevMonthDay{background:transparent;border-color:transparent;color:hsla(0,0%,100%,.3);cursor:default}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{color:hsla(0,0%,100%,.1);cursor:not-allowed}.flatpickr-day.week.selected{border-radius:0;box-shadow:-5px 0 0 #80cbc4,5px 0 0 #80cbc4}.flatpickr-day.hidden{visibility:hidden}.rangeMode .flatpickr-day{margin-top:1px}.flatpickr-weekwrapper{float:left}.flatpickr-weekwrapper .flatpickr-weeks{box-shadow:1px 0 0 #20222c;padding:0 12px}.flatpickr-weekwrapper .flatpickr-weekday{float:none;line-height:28px;width:100%}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{background:transparent;border:none;color:hsla(0,0%,100%,.3);cursor:default;display:block;max-width:none;width:100%}.flatpickr-innerContainer{box-sizing:border-box;display:block;display:flex;overflow:hidden}.flatpickr-rContainer{box-sizing:border-box;display:inline-block;padding:0}.flatpickr-time{box-sizing:border-box;display:block;display:flex;height:0;line-height:40px;max-height:40px;outline:0;overflow:hidden;text-align:center}.flatpickr-time:after{clear:both;content:"";display:table}.flatpickr-time .numInputWrapper{flex:1;float:left;height:40px;width:40%}.flatpickr-time .numInputWrapper span.arrowUp:after{border-bottom-color:hsla(0,0%,100%,.95)}.flatpickr-time .numInputWrapper span.arrowDown:after{border-top-color:hsla(0,0%,100%,.95)}.flatpickr-time.hasSeconds .numInputWrapper{width:26%}.flatpickr-time.time24hr .numInputWrapper{width:49%}.flatpickr-time input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;background:transparent;border:0;border-radius:0;box-shadow:none;box-sizing:border-box;color:hsla(0,0%,100%,.95);font-size:14px;height:inherit;line-height:inherit;margin:0;padding:0;position:relative;text-align:center}.flatpickr-time input.flatpickr-hour{font-weight:700}.flatpickr-time input.flatpickr-minute,.flatpickr-time input.flatpickr-second{font-weight:400}.flatpickr-time input:focus{border:0;outline:0}.flatpickr-time .flatpickr-am-pm,.flatpickr-time .flatpickr-time-separator{align-self:center;color:hsla(0,0%,100%,.95);float:left;font-weight:700;height:inherit;line-height:inherit;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:2%}.flatpickr-time .flatpickr-am-pm{cursor:pointer;font-weight:400;outline:0;text-align:center;width:18%}.flatpickr-time .flatpickr-am-pm:focus,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time input:hover{background:#6a7395}.flatpickr-input[readonly]{cursor:pointer}@keyframes fpFadeInDown{0%{opacity:0;transform:translate3d(0,-20px,0)}to{opacity:1;transform:translateZ(0)}}
+.flatpickr-calendar{animation:none;background:transparent;background:#3f4458;border:0;border-radius:5px;box-shadow:1px 0 0 #20222c,-1px 0 0 #20222c,0 1px 0 #20222c,0 -1px 0 #20222c,0 3px 13px rgba(0,0,0,.08);box-sizing:border-box;direction:ltr;display:none;font-size:14px;line-height:24px;opacity:0;padding:0;position:absolute;text-align:center;touch-action:manipulation;visibility:hidden;width:307.875px}.flatpickr-calendar.inline,.flatpickr-calendar.open{max-height:640px;opacity:1;visibility:visible}.flatpickr-calendar.open{display:inline-block;z-index:99999}.flatpickr-calendar.animate.open{animation:fpFadeInDown .3s cubic-bezier(.23,1,.32,1)}.flatpickr-calendar.inline{display:block;position:relative;top:2px}.flatpickr-calendar.static{position:absolute;top:calc(100% + 2px)}.flatpickr-calendar.static.open{display:block;z-index:999}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7){box-shadow:none!important}.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1){box-shadow:-2px 0 0 #e6e6e6,5px 0 0 #e6e6e6}.flatpickr-calendar .hasTime .dayContainer,.flatpickr-calendar .hasWeeks .dayContainer{border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.flatpickr-calendar .hasWeeks .dayContainer{border-left:0}.flatpickr-calendar.hasTime .flatpickr-time{border-top:1px solid #20222c;height:40px}.flatpickr-calendar.noCalendar.hasTime .flatpickr-time{height:auto}.flatpickr-calendar:after,.flatpickr-calendar:before{border:solid transparent;content:"";display:block;height:0;left:22px;pointer-events:none;position:absolute;width:0}.flatpickr-calendar.arrowRight:after,.flatpickr-calendar.arrowRight:before,.flatpickr-calendar.rightMost:after,.flatpickr-calendar.rightMost:before{left:auto;right:22px}.flatpickr-calendar.arrowCenter:after,.flatpickr-calendar.arrowCenter:before{left:50%;right:50%}.flatpickr-calendar:before{border-width:5px;margin:0 -5px}.flatpickr-calendar:after{border-width:4px;margin:0 -4px}.flatpickr-calendar.arrowTop:after,.flatpickr-calendar.arrowTop:before{bottom:100%}.flatpickr-calendar.arrowTop:before{border-bottom-color:#20222c}.flatpickr-calendar.arrowTop:after{border-bottom-color:#3f4458}.flatpickr-calendar.arrowBottom:after,.flatpickr-calendar.arrowBottom:before{top:100%}.flatpickr-calendar.arrowBottom:before{border-top-color:#20222c}.flatpickr-calendar.arrowBottom:after{border-top-color:#3f4458}.flatpickr-calendar:focus{outline:0}.flatpickr-wrapper{display:inline-block;position:relative}.flatpickr-months{display:flex}.flatpickr-months .flatpickr-month{background:#3f4458;color:#fff;fill:#fff;flex:1;height:34px;line-height:1;overflow:hidden;position:relative;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none}.flatpickr-months .flatpickr-next-month,.flatpickr-months .flatpickr-prev-month{color:#fff;cursor:pointer;fill:#fff;height:34px;padding:10px;position:absolute;text-decoration:none;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;z-index:3}.flatpickr-months .flatpickr-next-month.flatpickr-disabled,.flatpickr-months .flatpickr-prev-month.flatpickr-disabled{display:none}.flatpickr-months .flatpickr-next-month i,.flatpickr-months .flatpickr-prev-month i{position:relative}.flatpickr-months .flatpickr-next-month.flatpickr-prev-month,.flatpickr-months .flatpickr-prev-month.flatpickr-prev-month{left:0}.flatpickr-months .flatpickr-next-month.flatpickr-next-month,.flatpickr-months .flatpickr-prev-month.flatpickr-next-month{right:0}.flatpickr-months .flatpickr-next-month:hover,.flatpickr-months .flatpickr-prev-month:hover{color:#eee}.flatpickr-months .flatpickr-next-month:hover svg,.flatpickr-months .flatpickr-prev-month:hover svg{fill:#f64747}.flatpickr-months .flatpickr-next-month svg,.flatpickr-months .flatpickr-prev-month svg{height:14px;width:14px}.flatpickr-months .flatpickr-next-month svg path,.flatpickr-months .flatpickr-prev-month svg path{fill:inherit;transition:fill .1s}.numInputWrapper{height:auto;position:relative}.numInputWrapper input,.numInputWrapper span{display:inline-block}.numInputWrapper input{width:100%}.numInputWrapper input::-ms-clear{display:none}.numInputWrapper input::-webkit-inner-spin-button,.numInputWrapper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.numInputWrapper span{border:1px solid hsla(0,0%,100%,.15);box-sizing:border-box;cursor:pointer;height:50%;line-height:50%;opacity:0;padding:0 4px 0 2px;position:absolute;right:0;width:14px}.numInputWrapper span:hover{background:hsla(48,17%,70%,.1)}.numInputWrapper span:active{background:hsla(48,17%,70%,.2)}.numInputWrapper span:after{content:"";display:block;position:absolute}.numInputWrapper span.arrowUp{border-bottom:0;top:0}.numInputWrapper span.arrowUp:after{border-bottom:4px solid hsla(0,0%,100%,.6);border-left:4px solid transparent;border-right:4px solid transparent;top:26%}.numInputWrapper span.arrowDown{top:50%}.numInputWrapper span.arrowDown:after{border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid hsla(0,0%,100%,.6);top:40%}.numInputWrapper span svg{height:auto;width:inherit}.numInputWrapper span svg path{fill:hsla(0,0%,100%,.5)}.numInputWrapper:hover{background:hsla(48,17%,70%,.05)}.numInputWrapper:hover span{opacity:1}.flatpickr-current-month{color:inherit;display:inline-block;font-size:135%;font-weight:300;height:34px;left:12.5%;line-height:inherit;line-height:1;padding:7.48px 0 0;position:absolute;text-align:center;transform:translateZ(0);width:75%}.flatpickr-current-month span.cur-month{color:inherit;display:inline-block;font-family:inherit;font-weight:700;margin-left:.5ch;padding:0}.flatpickr-current-month span.cur-month:hover{background:hsla(48,17%,70%,.05)}.flatpickr-current-month .numInputWrapper{display:inline-block;width:6ch;width:7ch\0}.flatpickr-current-month .numInputWrapper span.arrowUp:after{border-bottom-color:#fff}.flatpickr-current-month .numInputWrapper span.arrowDown:after{border-top-color:#fff}.flatpickr-current-month input.cur-year{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;background:transparent;border:0;border-radius:0;box-sizing:border-box;color:inherit;cursor:text;display:inline-block;font-family:inherit;font-size:inherit;font-weight:300;height:auto;line-height:inherit;margin:0;padding:0 0 0 .5ch;vertical-align:initial}.flatpickr-current-month input.cur-year:focus{outline:0}.flatpickr-current-month input.cur-year[disabled],.flatpickr-current-month input.cur-year[disabled]:hover{background:transparent;color:hsla(0,0%,100%,.5);font-size:100%;pointer-events:none}.flatpickr-current-month .flatpickr-monthDropdown-months{appearance:menulist;-webkit-appearance:menulist;-moz-appearance:menulist;background:#3f4458;border:none;border-radius:0;box-sizing:border-box;-webkit-box-sizing:border-box;color:inherit;cursor:pointer;font-family:inherit;font-size:inherit;font-weight:300;height:auto;line-height:inherit;margin:-1px 0 0;outline:none;padding:0 0 0 .5ch;position:relative;vertical-align:initial;width:auto}.flatpickr-current-month .flatpickr-monthDropdown-months:active,.flatpickr-current-month .flatpickr-monthDropdown-months:focus{outline:none}.flatpickr-current-month .flatpickr-monthDropdown-months:hover{background:hsla(48,17%,70%,.05)}.flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month{background-color:#3f4458;outline:none;padding:0}.flatpickr-weekdays{align-items:center;background:transparent;display:flex;height:28px;overflow:hidden;text-align:center;width:100%}.flatpickr-weekdays .flatpickr-weekdaycontainer{display:flex;flex:1}span.flatpickr-weekday{background:#3f4458;color:#fff;cursor:default;display:block;flex:1;font-size:90%;font-weight:bolder;line-height:1;margin:0;text-align:center}.dayContainer,.flatpickr-weeks{padding:1px 0 0}.flatpickr-days{align-items:flex-start;display:flex;overflow:hidden;position:relative;width:307.875px}.flatpickr-days:focus{outline:0}.dayContainer{box-sizing:border-box;display:inline-block;display:flex;flex-wrap:wrap;-ms-flex-wrap:wrap;justify-content:space-around;max-width:307.875px;min-width:307.875px;opacity:1;outline:0;padding:0;text-align:left;transform:translateZ(0);width:307.875px}.dayContainer+.dayContainer{box-shadow:-1px 0 0 #20222c}.flatpickr-day{background:none;border:1px solid transparent;border-radius:150px;box-sizing:border-box;color:hsla(0,0%,100%,.95);cursor:pointer;display:inline-block;flex-basis:14.2857143%;font-weight:400;height:39px;justify-content:center;line-height:39px;margin:0;max-width:39px;position:relative;text-align:center;width:14.2857143%}.flatpickr-day.inRange,.flatpickr-day.nextMonthDay.inRange,.flatpickr-day.nextMonthDay.today.inRange,.flatpickr-day.nextMonthDay:focus,.flatpickr-day.nextMonthDay:hover,.flatpickr-day.prevMonthDay.inRange,.flatpickr-day.prevMonthDay.today.inRange,.flatpickr-day.prevMonthDay:focus,.flatpickr-day.prevMonthDay:hover,.flatpickr-day.today.inRange,.flatpickr-day:focus,.flatpickr-day:hover{background:#646c8c;border-color:#646c8c;cursor:pointer;outline:0}.flatpickr-day.today{border-color:#eee}.flatpickr-day.today:focus,.flatpickr-day.today:hover{background:#eee;border-color:#eee;color:#3f4458}.flatpickr-day.endRange,.flatpickr-day.endRange.inRange,.flatpickr-day.endRange.nextMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.endRange:focus,.flatpickr-day.endRange:hover,.flatpickr-day.selected,.flatpickr-day.selected.inRange,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.selected:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange,.flatpickr-day.startRange.inRange,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.startRange:focus,.flatpickr-day.startRange:hover{background:#80cbc4;border-color:#80cbc4;box-shadow:none;color:#fff}.flatpickr-day.endRange.startRange,.flatpickr-day.selected.startRange,.flatpickr-day.startRange.startRange{border-radius:50px 0 0 50px}.flatpickr-day.endRange.endRange,.flatpickr-day.selected.endRange,.flatpickr-day.startRange.endRange{border-radius:0 50px 50px 0}.flatpickr-day.endRange.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.selected.startRange+.endRange:not(:nth-child(7n+1)),.flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)){box-shadow:-10px 0 0 #80cbc4}.flatpickr-day.endRange.startRange.endRange,.flatpickr-day.selected.startRange.endRange,.flatpickr-day.startRange.startRange.endRange{border-radius:50px}.flatpickr-day.inRange{border-radius:0;box-shadow:-5px 0 0 #646c8c,5px 0 0 #646c8c}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover,.flatpickr-day.nextMonthDay,.flatpickr-day.notAllowed,.flatpickr-day.notAllowed.nextMonthDay,.flatpickr-day.notAllowed.prevMonthDay,.flatpickr-day.prevMonthDay{background:transparent;border-color:transparent;color:hsla(0,0%,100%,.3);cursor:default}.flatpickr-day.flatpickr-disabled,.flatpickr-day.flatpickr-disabled:hover{color:hsla(0,0%,100%,.1);cursor:not-allowed}.flatpickr-day.week.selected{border-radius:0;box-shadow:-5px 0 0 #80cbc4,5px 0 0 #80cbc4}.flatpickr-day.hidden{visibility:hidden}.rangeMode .flatpickr-day{margin-top:1px}.flatpickr-weekwrapper{float:left}.flatpickr-weekwrapper .flatpickr-weeks{box-shadow:1px 0 0 #20222c;padding:0 12px}.flatpickr-weekwrapper .flatpickr-weekday{float:none;line-height:28px;width:100%}.flatpickr-weekwrapper span.flatpickr-day,.flatpickr-weekwrapper span.flatpickr-day:hover{background:transparent;border:none;color:hsla(0,0%,100%,.3);cursor:default;display:block;max-width:none;width:100%}.flatpickr-innerContainer{box-sizing:border-box;display:block;display:flex;overflow:hidden}.flatpickr-rContainer{box-sizing:border-box;display:inline-block;padding:0}.flatpickr-time{box-sizing:border-box;display:block;display:flex;height:0;line-height:40px;max-height:40px;outline:0;overflow:hidden;text-align:center}.flatpickr-time:after{clear:both;content:"";display:table}.flatpickr-time .numInputWrapper{flex:1;float:left;height:40px;width:40%}.flatpickr-time .numInputWrapper span.arrowUp:after{border-bottom-color:hsla(0,0%,100%,.95)}.flatpickr-time .numInputWrapper span.arrowDown:after{border-top-color:hsla(0,0%,100%,.95)}.flatpickr-time.hasSeconds .numInputWrapper{width:26%}.flatpickr-time.time24hr .numInputWrapper{width:49%}.flatpickr-time input{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;background:transparent;border:0;border-radius:0;box-shadow:none;box-sizing:border-box;color:hsla(0,0%,100%,.95);font-size:14px;height:inherit;line-height:inherit;margin:0;padding:0;position:relative;text-align:center}.flatpickr-time input.flatpickr-hour{font-weight:700}.flatpickr-time input.flatpickr-minute,.flatpickr-time input.flatpickr-second{font-weight:400}.flatpickr-time input:focus{border:0;outline:0}.flatpickr-time .flatpickr-am-pm,.flatpickr-time .flatpickr-time-separator{align-self:center;color:hsla(0,0%,100%,.95);float:left;font-weight:700;height:inherit;line-height:inherit;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:2%}.flatpickr-time .flatpickr-am-pm{cursor:pointer;font-weight:400;outline:0;text-align:center;width:18%}.flatpickr-time .flatpickr-am-pm:focus,.flatpickr-time .flatpickr-am-pm:hover,.flatpickr-time input:focus,.flatpickr-time input:hover{background:#6a7395}.flatpickr-input[readonly]{cursor:pointer}@keyframes fpFadeInDown{0%{opacity:0;transform:translate3d(0,-20px,0)}to{opacity:1;transform:translateZ(0)}}

package/dist/runtime/assets/main.css

@@ -0,0 +1 @@
+@import url(//use.fontawesome.com/releases/v6.4.0/css/all.css);:focus{outline:none!important}:root{color-scheme:light!important}.flatpickr-monthSelect-theme-dark{background:#3f4458}.flatpickr-day.flatpickr-disabled{background-color:rgba(255,34,34,.164)!important;border:1px solid #b99!important;color:#fff!important}

package/dist/runtime/assets/tabulator-custom.css

@@ -1 +1 @@
-.tabulator-row+.tabulator-row{border-top:1px solid rgba(121,165,201,.741)}.tabulator .darkendarken .tabulator-col-content,.tabulator .tabulator-col-title,.tabulator .tabulator-col-title-holder{height:100%}.tabulator .tabulator-cell,.tabulator .tabulator-col-content{padding:0!important}.tabulator .v-cell-container{align-items:center;cursor:default;display:flex;flex-direction:column;height:100%;justify-content:center;line-height:1em;width:100%}.tabulator .v-cell-row{align-items:center;display:flex;font-weight:400;width:100%}.tabulator .v-cell{align-items:center;display:flex;height:100%;max-width:none;overflow:hidden;padding:2px 6px;text-overflow:ellipsis;white-space:nowrap}.tabulator>.tabulator-header .v-cell-container{--row-height:20px}.tabulator>.tabulator-header .v-cell-container .border-bottom{border-bottom:1px solid #9dafec!important}.tabulator>.tabulator-header .v-cell-container .border-right{border-right:1px solid #9dafec!important}.tabulator>.tabulator-tableholder .v-cell-container{--row-height:26px}.tabulator>.tabulator-tableholder .v-cell-container .border-bottom{border-bottom:1px solid #cdd3e6!important}.tabulator>.tabulator-tableholder .v-cell-container .border-right{border-right:1px solid #cdd3e6!important}.tabulator .v-cell-row{--row-size:1;height:calc(var(--row-height)*var(--row-size))}.tabulator .v-cell,.tabulator .v-cell>*,.tabulator .v-cell>:after,.tabulator .v-cell>:before{font-size:14px;line-height:calc(var(--row-height) - 2px);line-height:1.2em}.tabulator .table-cell-btn{align-items:center;background-color:#fff;border-color:rgba(var(--v-border-color),var(--v-border-opacity));border-radius:4px;border-style:solid;border-width:2px;display:inline-grid;flex-shrink:0;font-size:.875rem;font-weight:500;grid-template-areas:"prepend content append";grid-template-columns:max-content auto max-content;height:100%;justify-content:center;letter-spacing:0;line-height:normal;max-width:100%;min-width:64px;outline:none;overflow:hidden;padding:0 8px;position:relative;text-decoration:none;text-indent:0;text-transform:uppercase;transition-duration:.28s;transition-property:box-shadow,transform,opacity,background;transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:100%}.tabulator .table-cell-btn:hover:before{background-color:#fff;content:"";inset:0 0 0 0;opacity:.2;position:absolute}.tabulator .table-cell-btn>*{pointer-events:none}.tabulator .table-cell-btn .overlay{background-color:#fff;border-radius:100%;height:0;left:0;opacity:0;position:absolute;top:0;transform:scale(0);transform-origin:center center;transition:transform .3s ease,opacity .2s ease;width:0;will-change:transform;z-index:1}.tabulator .table-cell-btn .overlay.flash{opacity:.3;transform:scale(1)}.table-sort-icon{color:#ffcd94;cursor:pointer;pointer-events:none}.table-sort-icon:before{content:"";font-family:Font Awesome\ 5 Free;font-weight:900}.table-sort-icon.up:before{content:""}.table-sort-icon.down:before{content:""}.tabulator-page-size{color:#1b1b1c}.tabulator-page.active{background-color:#3e7edd!important;color:#fff!important}.tabulator-page{border:1px solid #fff!important}.tabulator .w-full{width:100%}.tabulator .h-full{height:100%}.tabulator .text-end{justify-content:end;text-align:right}.tabulator .text-center{justify-content:center;text-align:center}.tabulator .cursor-pointer{cursor:pointer}
+.tabulator-row+.tabulator-row{border-top:1px solid rgba(121,165,201,.741)}.tabulator .darkendarken .tabulator-col-content,.tabulator .tabulator-col-title,.tabulator .tabulator-col-title-holder{height:100%}.tabulator .tabulator-cell,.tabulator .tabulator-col-content{padding:0!important}.tabulator .v-cell-container{align-items:center;cursor:default;display:flex;flex-direction:column;height:100%;justify-content:center;line-height:1em;width:100%}.tabulator .v-cell-row{align-items:center;display:flex;font-weight:400;width:100%}.tabulator .v-cell{align-items:center;display:flex;height:100%;max-width:none;overflow:hidden;padding:2px 6px;text-overflow:ellipsis;white-space:nowrap}.tabulator>.tabulator-header .v-cell-container{--row-height:20px}.tabulator>.tabulator-header .v-cell-container .border-bottom{border-bottom:1px solid #9dafec}.tabulator>.tabulator-header .v-cell-container .border-right{border-right:1px solid #9dafec}.tabulator>.tabulator-tableholder .v-cell-container{--row-height:26px}.tabulator>.tabulator-tableholder .v-cell-container .border-bottom{border-bottom:1px solid #cdd3e6}.tabulator>.tabulator-tableholder .v-cell-container .border-right{border-right:1px solid #cdd3e6}.tabulator .v-cell-row{--row-size:1;height:calc(var(--row-height)*var(--row-size))}.tabulator .v-cell,.tabulator .v-cell>*,.tabulator .v-cell>:after,.tabulator .v-cell>:before{font-size:14px;line-height:calc(var(--row-height) - 2px);line-height:1.2em}.tabulator .table-cell-btn{align-items:center;background-color:#fff;border-color:rgba(var(--v-border-color),var(--v-border-opacity));border-radius:4px;border-style:solid;border-width:2px;display:inline-grid;flex-shrink:0;font-size:.875rem;font-weight:500;grid-template-areas:"prepend content append";grid-template-columns:max-content auto max-content;height:100%;justify-content:center;letter-spacing:0;line-height:normal;max-width:100%;min-width:64px;outline:none;overflow:hidden;padding:0 8px;position:relative;text-decoration:none;text-indent:0;text-transform:uppercase;transition-duration:.28s;transition-property:box-shadow,transform,opacity,background;transition-timing-function:cubic-bezier(.4,0,.2,1);-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:100%}.tabulator .table-cell-btn:hover:before{background-color:#fff;content:"";inset:0 0 0 0;opacity:.2;position:absolute}.tabulator .table-cell-btn>*{pointer-events:none}.tabulator .table-cell-btn .overlay{background-color:#fff;border-radius:100%;height:0;left:0;opacity:0;position:absolute;top:0;transform:scale(0);transform-origin:center center;transition:transform .3s ease,opacity .2s ease;width:0;will-change:transform;z-index:1}.tabulator .table-cell-btn .overlay.flash{opacity:.3;transform:scale(1)}.table-sort-icon{color:#ffcd94;cursor:pointer;pointer-events:none}.table-sort-icon:before{content:"";font-family:Font Awesome\ 5 Free;font-weight:900}.table-sort-icon.up:before{content:""}.table-sort-icon.down:before{content:""}.tabulator-page-size{color:#1b1b1c}.tabulator-page.active{background-color:#3e7edd!important;color:#fff!important}.tabulator-page{border:1px solid #fff!important}.tabulator .w-full{width:100%}.tabulator .h-full{height:100%}.tabulator .text-end{justify-content:end;text-align:right}.tabulator .text-center{justify-content:center;text-align:center}.tabulator .cursor-pointer{cursor:pointer}

package/dist/runtime/components/form/_select/hidden-item-toggle.vue

@@ -0,0 +1,28 @@
+<script setup>
+import { useHsPinia } from "../../../composables/use-pinia";
+import { useHsMultiLang } from "../../../composables/use-hs-multi-lang";
+const props = defineProps({
+  hiddenItemVisible: { type: Boolean, required: true }
+});
+const emit = defineEmits(["update:hiddenItemVisible"]);
+const multiLang = useHsMultiLang(useHsPinia());
+const tx = multiLang.tx;
+</script>
+
+<template>
+  <Btn
+    theme="accent1"
+    variant="outlined"
+    class="w-full bg-white"
+    size="xs"
+    @mousedown.stop.prevent
+    @click.stop="emit('update:hiddenItemVisible', !props.hiddenItemVisible)"
+  >
+    <!-- -->
+
+    <span class="me-1"> {{ tx({ ja: "\u975E\u8868\u793A\u30A2\u30A4\u30C6\u30E0", en: "Hidden options" }) }} </span>
+    <i class="fas" :class="[!props.hiddenItemVisible ? 'fa-eye-slash text-error' : 'fa-eye text-success']"></i>
+    <i class="fas fa-caret-right mx-1"></i>
+    <i class="fas" :class="[props.hiddenItemVisible ? 'fa-eye-slash text-error' : 'fa-eye text-success']"></i>
+  </Btn>
+</template>

package/dist/runtime/components/form/_select/hidden-item-toggle.vue.d.ts

@@ -0,0 +1,10 @@
+type Props = {
+    hiddenItemVisible: boolean;
+};
+declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:hiddenItemVisible": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:hiddenItemVisible"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;