@oinone/kunlun-theme 6.3.1 → 6.4.0

package/src/style/dark-minimalism/button/info.ts

@@ -0,0 +1,146 @@
+import { DEFAULT_PREFIX } from '../../../mount';
+import { prefix } from './constant';
+
+export const defaultInfoCSSVars = {
+  // default-info
+  'default-info-background': `var(--${prefix}-background)`,
+  'default-info-border-width': `var(--${prefix}-border-width)`,
+  'default-info-border-style': `var(--${prefix}-border-style)`,
+  'default-info-border-color': `var(--${DEFAULT_PREFIX}-info-color)`,
+  'default-info-border-radius': `var(--${prefix}-border-radius)`,
+  'default-info-outline': 'none',
+  'default-info-shadow': 'none',
+  'default-info-text-color': `var(--${DEFAULT_PREFIX}-info-color)`,
+  // default-info-active
+  'default-info-background-active': `var(--${prefix}-default-info-background)`,
+  'default-info-border-width-active': `var(--${prefix}-default-info-border-width)`,
+  'default-info-border-style-active': `var(--${prefix}-default-info-border-style)`,
+  'default-info-border-color-active': `var(--${DEFAULT_PREFIX}-info-color-active)`,
+  'default-info-border-radius-active': `var(--${prefix}-default-info-border-radius)`,
+  'default-info-outline-active': `var(--${prefix}-default-info-outline)`,
+  'default-info-shadow-active': `var(--${prefix}-default-info-shadow)`,
+  'default-info-text-color-active': `var(--${DEFAULT_PREFIX}-info-color-active)`,
+  // default-info-focus
+  'default-info-background-focus': `var(--${prefix}-default-info-background)`,
+  'default-info-border-width-focus': `var(--${prefix}-default-info-border-width)`,
+  'default-info-border-style-focus': `var(--${prefix}-default-info-border-style)`,
+  'default-info-border-color-focus': `var(--${DEFAULT_PREFIX}-info-color-focus)`,
+  'default-info-border-radius-focus': `var(--${prefix}-default-info-border-radius)`,
+  'default-info-outline-focus': `var(--${prefix}-default-info-outline)`,
+  'default-info-shadow-focus': `var(--${prefix}-default-info-shadow)`,
+  'default-info-text-color-focus': `var(--${DEFAULT_PREFIX}-info-color-focus)`,
+  // default-info-hover
+  'default-info-background-hover': `var(--${prefix}-default-info-background)`,
+  'default-info-border-width-hover': `var(--${prefix}-default-info-border-width)`,
+  'default-info-border-style-hover': `var(--${prefix}-default-info-border-style)`,
+  'default-info-border-color-hover': `var(--${DEFAULT_PREFIX}-info-color-hover)`,
+  'default-info-border-radius-hover': `var(--${prefix}-default-info-border-radius)`,
+  'default-info-outline-hover': `var(--${prefix}-default-info-outline)`,
+  'default-info-shadow-hover': `var(--${prefix}-default-info-shadow)`,
+  'default-info-text-color-hover': `var(--${DEFAULT_PREFIX}-info-color-hover)`,
+  // default-info-visited
+  'default-info-background-visited': `var(--${prefix}-default-info-background)`,
+  'default-info-border-width-visited': `var(--${prefix}-default-info-border-width)`,
+  'default-info-border-style-visited': `var(--${prefix}-default-info-border-style)`,
+  'default-info-border-color-visited': `var(--${prefix}-default-info-border-color)`,
+  'default-info-border-radius-visited': `var(--${prefix}-default-info-border-radius)`,
+  'default-info-outline-visited': `var(--${prefix}-default-info-outline)`,
+  'default-info-shadow-visited': `var(--${prefix}-default-info-shadow)`,
+  'default-info-text-color-visited': `var(--${prefix}-default-info-text-color)`
+};
+
+export const primaryInfoCSSVars = {
+  // primary-info
+  'primary-info-background': `var(--${DEFAULT_PREFIX}-info-color)`,
+  'primary-info-border-width': `var(--${prefix}-primary-border-width)`,
+  'primary-info-border-style': `var(--${prefix}-primary-border-style)`,
+  'primary-info-border-color': `var(--${DEFAULT_PREFIX}-info-color)`,
+  'primary-info-border-radius': `var(--${prefix}-primary-border-radius)`,
+  'primary-info-outline': 'none',
+  'primary-info-shadow': 'none',
+  'primary-info-text-color': '#ffffff',
+  // primary-info-active
+  'primary-info-background-active': `var(--${DEFAULT_PREFIX}-info-color-active)`,
+  'primary-info-border-width-active': `var(--${prefix}-primary-info-border-width)`,
+  'primary-info-border-style-active': `var(--${prefix}-primary-info-border-style)`,
+  'primary-info-border-color-active': `var(--${DEFAULT_PREFIX}-info-color-active)`,
+  'primary-info-border-radius-active': `var(--${prefix}-primary-info-border-radius)`,
+  'primary-info-outline-active': `var(--${prefix}-primary-info-outline)`,
+  'primary-info-shadow-active': `var(--${prefix}-primary-info-shadow)`,
+  'primary-info-text-color-active': `var(--${prefix}-primary-info-text-color)`,
+  // primary-info-focus
+  'primary-info-background-focus': `var(--${DEFAULT_PREFIX}-info-color-focus)`,
+  'primary-info-border-width-focus': `var(--${prefix}-primary-info-border-width)`,
+  'primary-info-border-style-focus': `var(--${prefix}-primary-info-border-style)`,
+  'primary-info-border-color-focus': `var(--${DEFAULT_PREFIX}-info-color-focus)`,
+  'primary-info-border-radius-focus': `var(--${prefix}-primary-info-border-radius)`,
+  'primary-info-outline-focus': `var(--${prefix}-primary-info-outline)`,
+  'primary-info-shadow-focus': `var(--${prefix}-primary-info-shadow)`,
+  'primary-info-text-color-focus': `var(--${prefix}-primary-info-text-color)`,
+  // primary-info-hover
+  'primary-info-background-hover': `var(--${DEFAULT_PREFIX}-info-color-hover)`,
+  'primary-info-border-width-hover': `var(--${prefix}-primary-info-border-width)`,
+  'primary-info-border-style-hover': `var(--${prefix}-primary-info-border-style)`,
+  'primary-info-border-color-hover': `var(--${DEFAULT_PREFIX}-info-color-hover)`,
+  'primary-info-border-radius-hover': `var(--${prefix}-primary-info-border-radius)`,
+  'primary-info-outline-hover': `var(--${prefix}-primary-info-outline)`,
+  'primary-info-shadow-hover': `var(--${prefix}-primary-info-shadow)`,
+  'primary-info-text-color-hover': `var(--${prefix}-primary-info-text-color)`,
+  // primary-info-visited
+  'primary-info-background-visited': `var(--${prefix}-primary-info-background)`,
+  'primary-info-border-width-visited': `var(--${prefix}-primary-info-border-width)`,
+  'primary-info-border-style-visited': `var(--${prefix}-primary-info-border-style)`,
+  'primary-info-border-color-visited': `var(--${prefix}-primary-info-border-color)`,
+  'primary-info-border-radius-visited': `var(--${prefix}-primary-info-border-radius)`,
+  'primary-info-outline-visited': `var(--${prefix}-primary-info-outline)`,
+  'primary-info-shadow-visited': `var(--${prefix}-primary-info-shadow)`,
+  'primary-info-text-color-visited': `var(--${prefix}-primary-info-text-color)`
+};
+
+export const linkInfoCSSVars = {
+  // link-info
+  'link-info-background': `var(--${prefix}-link-background)`,
+  'link-info-border-width': `var(--${prefix}-link-border-width)`,
+  'link-info-border-style': `var(--${prefix}-link-border-style)`,
+  'link-info-border-color': `var(--${prefix}-link-border-color)`,
+  'link-info-border-radius': `var(--${prefix}-link-border-radius)`,
+  'link-info-outline': 'none',
+  'link-info-shadow': 'none',
+  'link-info-text-color': `var(--${DEFAULT_PREFIX}-info-color)`,
+  // link-info-active
+  'link-info-background-active': `var(--${prefix}-link-info-color)`,
+  'link-info-border-width-active': `var(--${prefix}-link-info-border-width)`,
+  'link-info-border-style-active': `var(--${prefix}-link-info-border-style)`,
+  'link-info-border-color-active': `var(--${prefix}-link-info-color)`,
+  'link-info-border-radius-active': `var(--${prefix}-link-info-border-radius)`,
+  'link-info-outline-active': `var(--${prefix}-link-info-outline)`,
+  'link-info-shadow-active': `var(--${prefix}-link-info-shadow)`,
+  'link-info-text-color-active': `var(--${DEFAULT_PREFIX}-info-color-active)`,
+  // link-info-focus
+  'link-info-background-focus': `var(--${prefix}-link-info-color)`,
+  'link-info-border-width-focus': `var(--${prefix}-link-info-border-width)`,
+  'link-info-border-style-focus': `var(--${prefix}-link-info-border-style)`,
+  'link-info-border-color-focus': `var(--${prefix}-link-info-color)`,
+  'link-info-border-radius-focus': `var(--${prefix}-link-info-border-radius)`,
+  'link-info-outline-focus': `var(--${prefix}-link-info-outline)`,
+  'link-info-shadow-focus': `var(--${prefix}-link-info-shadow)`,
+  'link-info-text-color-focus': `var(--${DEFAULT_PREFIX}-info-color-focus)`,
+  // link-info-hover
+  'link-info-background-hover': `var(--${prefix}-link-info-color)`,
+  'link-info-border-width-hover': `var(--${prefix}-link-info-border-width)`,
+  'link-info-border-style-hover': `var(--${prefix}-link-info-border-style)`,
+  'link-info-border-color-hover': `var(--${prefix}-link-info-color)`,
+  'link-info-border-radius-hover': `var(--${prefix}-link-info-border-radius)`,
+  'link-info-outline-hover': `var(--${prefix}-link-info-outline)`,
+  'link-info-shadow-hover': `var(--${prefix}-link-info-shadow)`,
+  'link-info-text-color-hover': `var(--${DEFAULT_PREFIX}-info-color-hover)`,
+  // link-info-visited
+  'link-info-background-visited': `var(--${prefix}-link-info-background)`,
+  'link-info-border-width-visited': `var(--${prefix}-link-info-border-width)`,
+  'link-info-border-style-visited': `var(--${prefix}-link-info-border-style)`,
+  'link-info-border-color-visited': `var(--${prefix}-link-info-border-color)`,
+  'link-info-border-radius-visited': `var(--${prefix}-link-info-border-radius)`,
+  'link-info-outline-visited': `var(--${prefix}-link-info-outline)`,
+  'link-info-shadow-visited': `var(--${prefix}-link-info-shadow)`,
+  'link-info-text-color-visited': `var(--${prefix}-link-info-text-color)`
+};

package/src/style/dark-minimalism/button/standard.ts

@@ -0,0 +1,146 @@
+import { DEFAULT_PREFIX } from '../../../mount';
+import { prefix } from './constant';
+
+export const defaultCSSVars = {
+  // default
+  background: `var(--${DEFAULT_PREFIX}-background)`,
+  'border-width': `var(--${DEFAULT_PREFIX}-border-width)`,
+  'border-style': `var(--${DEFAULT_PREFIX}-border-style)`,
+  'border-color': `var(--${DEFAULT_PREFIX}-border-color)`,
+  'border-radius': `var(--${DEFAULT_PREFIX}-border-radius)`,
+  outline: 'none',
+  shadow: 'none',
+  'text-color': `var(--${DEFAULT_PREFIX}-text-color)`,
+  // default-active
+  'background-active': `var(--${prefix}-background)`,
+  'border-width-active': `var(--${prefix}-border-width)`,
+  'border-style-active': `var(--${prefix}-border-style)`,
+  'border-color-active': `var(--${prefix}-border-color)`,
+  'border-radius-active': `var(--${prefix}-border-radius)`,
+  'outline-active': `var(--${prefix}-outline)`,
+  'shadow-active': `var(--${prefix}-shadow)`,
+  'text-color-active': `var(--${DEFAULT_PREFIX}-primary-color-active)`,
+  // default-focus
+  'background-focus': `var(--${prefix}-background)`,
+  'border-width-focus': `var(--${prefix}-border-width)`,
+  'border-style-focus': `var(--${prefix}-border-style)`,
+  'border-color-focus': `var(--${prefix}-border-color)`,
+  'border-radius-focus': `var(--${prefix}-border-radius)`,
+  'outline-focus': `var(--${prefix}-outline)`,
+  'shadow-focus': `var(--${prefix}-shadow)`,
+  'text-color-focus': `var(--${DEFAULT_PREFIX}-primary-color-focus)`,
+  // default-hover
+  'background-hover': `var(--${prefix}-background)`,
+  'border-width-hover': `var(--${prefix}-border-width)`,
+  'border-style-hover': `var(--${prefix}-border-style)`,
+  'border-color-hover': `var(--${prefix}-border-color)`,
+  'border-radius-hover': `var(--${prefix}-border-radius)`,
+  'outline-hover': `var(--${prefix}-outline)`,
+  'shadow-hover': `var(--${prefix}-shadow)`,
+  'text-color-hover': `var(--${DEFAULT_PREFIX}-primary-color-hover)`,
+  // default-visited
+  'background-visited': `var(--${prefix}-background)`,
+  'border-width-visited': `var(--${prefix}-border-width)`,
+  'border-style-visited': `var(--${prefix}-border-style)`,
+  'border-color-visited': `var(--${prefix}-border-color)`,
+  'border-radius-visited': `var(--${prefix}-border-radius)`,
+  'outline-visited': `var(--${prefix}-outline)`,
+  'shadow-visited': `var(--${prefix}-shadow)`,
+  'text-color-visited': `var(--${prefix}-text-color)`
+};
+
+export const primaryCSSVars = {
+  // primary
+  'primary-background': `var(--${DEFAULT_PREFIX}-primary-color)`,
+  'primary-border-width': `var(--${DEFAULT_PREFIX}-border-width)`,
+  'primary-border-style': `var(--${DEFAULT_PREFIX}-border-style)`,
+  'primary-border-color': `var(--${DEFAULT_PREFIX}-primary-color)`,
+  'primary-border-radius': `var(--${DEFAULT_PREFIX}-border-radius)`,
+  'primary-outline': `var(--${DEFAULT_PREFIX}-primary-color-outline)`,
+  'primary-shadow': 'none',
+  'primary-text-color': '#ffffff',
+  // primary-active
+  'primary-background-active': `var(--${DEFAULT_PREFIX}-primary-color-active)`,
+  'primary-border-width-active': `var(--${prefix}-primary-border-width)`,
+  'primary-border-style-active': `var(--${prefix}-primary-border-style)`,
+  'primary-border-color-active': `var(--${DEFAULT_PREFIX}-primary-color-active)`,
+  'primary-border-radius-active': `var(--${prefix}-primary-border-radius)`,
+  'primary-outline-active': `var(--${prefix}-primary-outline)`,
+  'primary-shadow-active': `var(--${prefix}-primary-shadow)`,
+  'primary-text-color-active': `var(--${prefix}-primary-text-color)`,
+  // primary-focus
+  'primary-background-focus': `var(--${DEFAULT_PREFIX}-primary-color-focus)`,
+  'primary-border-width-focus': `var(--${prefix}-primary-border-width)`,
+  'primary-border-style-focus': `var(--${prefix}-primary-border-style)`,
+  'primary-border-color-focus': `var(--${DEFAULT_PREFIX}-primary-color-focus)`,
+  'primary-border-radius-focus': `var(--${prefix}-primary-border-radius)`,
+  'primary-outline-focus': `var(--${prefix}-primary-outline)`,
+  'primary-shadow-focus': `var(--${prefix}-primary-shadow)`,
+  'primary-text-color-focus': `var(--${prefix}-primary-text-color)`,
+  // primary-hover
+  'primary-background-hover': `var(--${DEFAULT_PREFIX}-primary-color-hover)`,
+  'primary-border-width-hover': `var(--${prefix}-primary-border-width)`,
+  'primary-border-style-hover': `var(--${prefix}-primary-border-style)`,
+  'primary-border-color-hover': `var(--${DEFAULT_PREFIX}-primary-color-hover)`,
+  'primary-border-radius-hover': `var(--${prefix}-primary-border-radius)`,
+  'primary-outline-hover': `var(--${prefix}-primary-outline)`,
+  'primary-shadow-hover': `var(--${prefix}-primary-shadow)`,
+  'primary-text-color-hover': `var(--${prefix}-primary-text-color)`,
+  // primary-visited
+  'primary-background-visited': `var(--${prefix}-primary-background)`,
+  'primary-border-width-visited': `var(--${prefix}-primary-border-width)`,
+  'primary-border-style-visited': `var(--${prefix}-primary-border-style)`,
+  'primary-border-color-visited': `var(--${prefix}-primary-border-color)`,
+  'primary-border-radius-visited': `var(--${prefix}-primary-border-radius)`,
+  'primary-outline-visited': `var(--${prefix}-primary-outline)`,
+  'primary-shadow-visited': `var(--${prefix}-primary-shadow)`,
+  'primary-text-color-visited': `var(--${prefix}-primary-text-color)`
+};
+
+export const linkCSSVars = {
+  // link
+  'link-background': 'transparent',
+  'link-border-width': 'none',
+  'link-border-style': 'none',
+  'link-border-color': 'none',
+  'link-border-radius': 'none',
+  'link-outline': 'none',
+  'link-shadow': 'none',
+  'link-text-color': `var(--${DEFAULT_PREFIX}-primary-color)`,
+  // link-active
+  'link-background-active': `var(--${prefix}-link-background)`,
+  'link-border-width-active': `var(--${prefix}-link-border-width)`,
+  'link-border-style-active': `var(--${prefix}-link-border-style)`,
+  'link-border-color-active': `var(--${prefix}-link-border-color)`,
+  'link-border-radius-active': `var(--${prefix}-link-border-radius)`,
+  'link-outline-active': `var(--${prefix}-link-outline)`,
+  'link-shadow-active': `var(--${prefix}-link-shadow)`,
+  'link-text-color-active': `var(--${prefix}-link-text-color)`,
+  // link-focus
+  'link-background-focus': `var(--${prefix}-link-background)`,
+  'link-border-width-focus': `var(--${prefix}-link-border-width)`,
+  'link-border-style-focus': `var(--${prefix}-link-border-style)`,
+  'link-border-color-focus': `var(--${prefix}-link-border-color)`,
+  'link-border-radius-focus': `var(--${prefix}-link-border-radius)`,
+  'link-outline-focus': `var(--${prefix}-link-outline)`,
+  'link-shadow-focus': `var(--${prefix}-link-shadow)`,
+  'link-text-color-focus': `var(--${prefix}-link-text-color)`,
+  // link-hover
+  'link-background-hover': `var(--${prefix}-link-background)`,
+  'link-border-width-hover': `var(--${prefix}-link-border-width)`,
+  'link-border-style-hover': `var(--${prefix}-link-border-style)`,
+  'link-border-color-hover': `var(--${prefix}-link-border-color)`,
+  'link-border-radius-hover': `var(--${prefix}-link-border-radius)`,
+  'link-outline-hover': `var(--${prefix}-link-outline)`,
+  'link-shadow-hover': `var(--${prefix}-link-shadow)`,
+  'link-text-color-hover': `var(--${prefix}-link-text-color)`,
+  // link-visited
+  'link-background-visited': `var(--${prefix}-link-background)`,
+  'link-border-width-visited': `var(--${prefix}-link-border-width)`,
+  'link-border-style-visited': `var(--${prefix}-link-border-style)`,
+  'link-border-color-visited': `var(--${prefix}-link-border-color)`,
+  'link-border-radius-visited': `var(--${prefix}-link-border-radius)`,
+  'link-outline-visited': `var(--${prefix}-link-outline)`,
+  'link-shadow-visited': `var(--${prefix}-link-shadow)`,
+  'link-text-color-visited': `var(--${prefix}-link-text-color)`
+};

package/src/style/dark-minimalism/button/success.ts

@@ -0,0 +1,146 @@
+import { DEFAULT_PREFIX } from '../../../mount';
+import { prefix } from './constant';
+
+export const defaultSuccessCSSVars = {
+  // default-success
+  'default-success-background': `var(--${prefix}-background)`,
+  'default-success-border-width': `var(--${prefix}-border-width)`,
+  'default-success-border-style': `var(--${prefix}-border-style)`,
+  'default-success-border-color': `var(--${DEFAULT_PREFIX}-success-color)`,
+  'default-success-border-radius': `var(--${prefix}-border-radius)`,
+  'default-success-outline': 'none',
+  'default-success-shadow': 'none',
+  'default-success-text-color': `var(--${DEFAULT_PREFIX}-success-color)`,
+  // default-success-active
+  'default-success-background-active': `var(--${prefix}-default-success-background)`,
+  'default-success-border-width-active': `var(--${prefix}-default-success-border-width)`,
+  'default-success-border-style-active': `var(--${prefix}-default-success-border-style)`,
+  'default-success-border-color-active': `var(--${DEFAULT_PREFIX}-success-color-active)`,
+  'default-success-border-radius-active': `var(--${prefix}-default-success-border-radius)`,
+  'default-success-outline-active': `var(--${prefix}-default-success-outline)`,
+  'default-success-shadow-active': `var(--${prefix}-default-success-shadow)`,
+  'default-success-text-color-active': `var(--${DEFAULT_PREFIX}-success-color-active)`,
+  // default-success-focus
+  'default-success-background-focus': `var(--${prefix}-default-success-background)`,
+  'default-success-border-width-focus': `var(--${prefix}-default-success-border-width)`,
+  'default-success-border-style-focus': `var(--${prefix}-default-success-border-style)`,
+  'default-success-border-color-focus': `var(--${DEFAULT_PREFIX}-success-color-focus)`,
+  'default-success-border-radius-focus': `var(--${prefix}-default-success-border-radius)`,
+  'default-success-outline-focus': `var(--${prefix}-default-success-outline)`,
+  'default-success-shadow-focus': `var(--${prefix}-default-success-shadow)`,
+  'default-success-text-color-focus': `var(--${DEFAULT_PREFIX}-success-color-focus)`,
+  // default-success-hover
+  'default-success-background-hover': `var(--${prefix}-default-success-background)`,
+  'default-success-border-width-hover': `var(--${prefix}-default-success-border-width)`,
+  'default-success-border-style-hover': `var(--${prefix}-default-success-border-style)`,
+  'default-success-border-color-hover': `var(--${DEFAULT_PREFIX}-success-color-hover)`,
+  'default-success-border-radius-hover': `var(--${prefix}-default-success-border-radius)`,
+  'default-success-outline-hover': `var(--${prefix}-default-success-outline)`,
+  'default-success-shadow-hover': `var(--${prefix}-default-success-shadow)`,
+  'default-success-text-color-hover': `var(--${DEFAULT_PREFIX}-success-color-hover)`,
+  // default-success-visited
+  'default-success-background-visited': `var(--${prefix}-default-success-background)`,
+  'default-success-border-width-visited': `var(--${prefix}-default-success-border-width)`,
+  'default-success-border-style-visited': `var(--${prefix}-default-success-border-style)`,
+  'default-success-border-color-visited': `var(--${prefix}-default-success-border-color)`,
+  'default-success-border-radius-visited': `var(--${prefix}-default-success-border-radius)`,
+  'default-success-outline-visited': `var(--${prefix}-default-success-outline)`,
+  'default-success-shadow-visited': `var(--${prefix}-default-success-shadow)`,
+  'default-success-text-color-visited': `var(--${prefix}-default-success-text-color)`
+};
+
+export const primarySuccessCSSVars = {
+  // primary-success
+  'primary-success-background': `var(--${DEFAULT_PREFIX}-success-color)`,
+  'primary-success-border-width': `var(--${prefix}-primary-border-width)`,
+  'primary-success-border-style': `var(--${prefix}-primary-border-style)`,
+  'primary-success-border-color': `var(--${DEFAULT_PREFIX}-success-color)`,
+  'primary-success-border-radius': `var(--${prefix}-primary-border-radius)`,
+  'primary-success-outline': 'none',
+  'primary-success-shadow': 'none',
+  'primary-success-text-color': '#ffffff',
+  // primary-success-active
+  'primary-success-background-active': `var(--${DEFAULT_PREFIX}-success-color-active)`,
+  'primary-success-border-width-active': `var(--${prefix}-primary-success-border-width)`,
+  'primary-success-border-style-active': `var(--${prefix}-primary-success-border-style)`,
+  'primary-success-border-color-active': `var(--${DEFAULT_PREFIX}-success-color-active)`,
+  'primary-success-border-radius-active': `var(--${prefix}-primary-success-border-radius)`,
+  'primary-success-outline-active': `var(--${prefix}-primary-success-outline)`,
+  'primary-success-shadow-active': `var(--${prefix}-primary-success-shadow)`,
+  'primary-success-text-color-active': `var(--${prefix}-primary-success-text-color)`,
+  // primary-success-focus
+  'primary-success-background-focus': `var(--${DEFAULT_PREFIX}-success-color-focus)`,
+  'primary-success-border-width-focus': `var(--${prefix}-primary-success-border-width)`,
+  'primary-success-border-style-focus': `var(--${prefix}-primary-success-border-style)`,
+  'primary-success-border-color-focus': `var(--${DEFAULT_PREFIX}-success-color-focus)`,
+  'primary-success-border-radius-focus': `var(--${prefix}-primary-success-border-radius)`,
+  'primary-success-outline-focus': `var(--${prefix}-primary-success-outline)`,
+  'primary-success-shadow-focus': `var(--${prefix}-primary-success-shadow)`,
+  'primary-success-text-color-focus': `var(--${prefix}-primary-success-text-color)`,
+  // primary-success-hover
+  'primary-success-background-hover': `var(--${DEFAULT_PREFIX}-success-color-hover)`,
+  'primary-success-border-width-hover': `var(--${prefix}-primary-success-border-width)`,
+  'primary-success-border-style-hover': `var(--${prefix}-primary-success-border-style)`,
+  'primary-success-border-color-hover': `var(--${DEFAULT_PREFIX}-success-color-hover)`,
+  'primary-success-border-radius-hover': `var(--${prefix}-primary-success-border-radius)`,
+  'primary-success-outline-hover': `var(--${prefix}-primary-success-outline)`,
+  'primary-success-shadow-hover': `var(--${prefix}-primary-success-shadow)`,
+  'primary-success-text-color-hover': `var(--${prefix}-primary-success-text-color)`,
+  // primary-success-visited
+  'primary-success-background-visited': `var(--${prefix}-primary-success-background)`,
+  'primary-success-border-width-visited': `var(--${prefix}-primary-success-border-width)`,
+  'primary-success-border-style-visited': `var(--${prefix}-primary-success-border-style)`,
+  'primary-success-border-color-visited': `var(--${prefix}-primary-success-border-color)`,
+  'primary-success-border-radius-visited': `var(--${prefix}-primary-success-border-radius)`,
+  'primary-success-outline-visited': `var(--${prefix}-primary-success-outline)`,
+  'primary-success-shadow-visited': `var(--${prefix}-primary-success-shadow)`,
+  'primary-success-text-color-visited': `var(--${prefix}-primary-success-text-color)`
+};
+
+export const linkSuccessCSSVars = {
+  // link-success
+  'link-success-background': `var(--${prefix}-link-background)`,
+  'link-success-border-width': `var(--${prefix}-link-border-width)`,
+  'link-success-border-style': `var(--${prefix}-link-border-style)`,
+  'link-success-border-color': `var(--${prefix}-link-border-color)`,
+  'link-success-border-radius': `var(--${prefix}-link-border-radius)`,
+  'link-success-outline': 'none',
+  'link-success-shadow': 'none',
+  'link-success-text-color': `var(--${DEFAULT_PREFIX}-success-color)`,
+  // link-success-active
+  'link-success-background-active': `var(--${prefix}-link-success-color)`,
+  'link-success-border-width-active': `var(--${prefix}-link-success-border-width)`,
+  'link-success-border-style-active': `var(--${prefix}-link-success-border-style)`,
+  'link-success-border-color-active': `var(--${prefix}-link-success-color)`,
+  'link-success-border-radius-active': `var(--${prefix}-link-success-border-radius)`,
+  'link-success-outline-active': `var(--${prefix}-link-success-outline)`,
+  'link-success-shadow-active': `var(--${prefix}-link-success-shadow)`,
+  'link-success-text-color-active': `var(--${DEFAULT_PREFIX}-success-color-active)`,
+  // link-success-focus
+  'link-success-background-focus': `var(--${prefix}-link-success-color)`,
+  'link-success-border-width-focus': `var(--${prefix}-link-success-border-width)`,
+  'link-success-border-style-focus': `var(--${prefix}-link-success-border-style)`,
+  'link-success-border-color-focus': `var(--${prefix}-link-success-color)`,
+  'link-success-border-radius-focus': `var(--${prefix}-link-success-border-radius)`,
+  'link-success-outline-focus': `var(--${prefix}-link-success-outline)`,
+  'link-success-shadow-focus': `var(--${prefix}-link-success-shadow)`,
+  'link-success-text-color-focus': `var(--${DEFAULT_PREFIX}-success-color-focus)`,
+  // link-success-hover
+  'link-success-background-hover': `var(--${prefix}-link-success-color)`,
+  'link-success-border-width-hover': `var(--${prefix}-link-success-border-width)`,
+  'link-success-border-style-hover': `var(--${prefix}-link-success-border-style)`,
+  'link-success-border-color-hover': `var(--${prefix}-link-success-color)`,
+  'link-success-border-radius-hover': `var(--${prefix}-link-success-border-radius)`,
+  'link-success-outline-hover': `var(--${prefix}-link-success-outline)`,
+  'link-success-shadow-hover': `var(--${prefix}-link-success-shadow)`,
+  'link-success-text-color-hover': `var(--${DEFAULT_PREFIX}-success-color-hover)`,
+  // link-success-visited
+  'link-success-background-visited': `var(--${prefix}-link-success-background)`,
+  'link-success-border-width-visited': `var(--${prefix}-link-success-border-width)`,
+  'link-success-border-style-visited': `var(--${prefix}-link-success-border-style)`,
+  'link-success-border-color-visited': `var(--${prefix}-link-success-border-color)`,
+  'link-success-border-radius-visited': `var(--${prefix}-link-success-border-radius)`,
+  'link-success-outline-visited': `var(--${prefix}-link-success-outline)`,
+  'link-success-shadow-visited': `var(--${prefix}-link-success-shadow)`,
+  'link-success-text-color-visited': `var(--${prefix}-link-success-text-color)`
+};

package/src/style/dark-minimalism/button/warning.ts

@@ -0,0 +1,146 @@
+import { DEFAULT_PREFIX } from '../../../mount';
+import { prefix } from './constant';
+
+export const defaultWarningCSSVars = {
+  // default-warning
+  'default-warning-background': `var(--${prefix}-background)`,
+  'default-warning-border-width': `var(--${prefix}-border-width)`,
+  'default-warning-border-style': `var(--${prefix}-border-style)`,
+  'default-warning-border-color': `var(--${DEFAULT_PREFIX}-warning-color)`,
+  'default-warning-border-radius': `var(--${prefix}-border-radius)`,
+  'default-warning-outline': 'none',
+  'default-warning-shadow': 'none',
+  'default-warning-text-color': `var(--${DEFAULT_PREFIX}-warning-color)`,
+  // default-warning-active
+  'default-warning-background-active': `var(--${prefix}-default-warning-background)`,
+  'default-warning-border-width-active': `var(--${prefix}-default-warning-border-width)`,
+  'default-warning-border-style-active': `var(--${prefix}-default-warning-border-style)`,
+  'default-warning-border-color-active': `var(--${DEFAULT_PREFIX}-warning-color-active)`,
+  'default-warning-border-radius-active': `var(--${prefix}-default-warning-border-radius)`,
+  'default-warning-outline-active': `var(--${prefix}-default-warning-outline)`,
+  'default-warning-shadow-active': `var(--${prefix}-default-warning-shadow)`,
+  'default-warning-text-color-active': `var(--${DEFAULT_PREFIX}-warning-color-active)`,
+  // default-warning-focus
+  'default-warning-background-focus': `var(--${prefix}-default-warning-background)`,
+  'default-warning-border-width-focus': `var(--${prefix}-default-warning-border-width)`,
+  'default-warning-border-style-focus': `var(--${prefix}-default-warning-border-style)`,
+  'default-warning-border-color-focus': `var(--${DEFAULT_PREFIX}-warning-color-focus)`,
+  'default-warning-border-radius-focus': `var(--${prefix}-default-warning-border-radius)`,
+  'default-warning-outline-focus': `var(--${prefix}-default-warning-outline)`,
+  'default-warning-shadow-focus': `var(--${prefix}-default-warning-shadow)`,
+  'default-warning-text-color-focus': `var(--${DEFAULT_PREFIX}-warning-color-focus)`,
+  // default-warning-hover
+  'default-warning-background-hover': `var(--${prefix}-default-warning-background)`,
+  'default-warning-border-width-hover': `var(--${prefix}-default-warning-border-width)`,
+  'default-warning-border-style-hover': `var(--${prefix}-default-warning-border-style)`,
+  'default-warning-border-color-hover': `var(--${DEFAULT_PREFIX}-warning-color-hover)`,
+  'default-warning-border-radius-hover': `var(--${prefix}-default-warning-border-radius)`,
+  'default-warning-outline-hover': `var(--${prefix}-default-warning-outline)`,
+  'default-warning-shadow-hover': `var(--${prefix}-default-warning-shadow)`,
+  'default-warning-text-color-hover': `var(--${DEFAULT_PREFIX}-warning-color-hover)`,
+  // default-warning-visited
+  'default-warning-background-visited': `var(--${prefix}-default-warning-background)`,
+  'default-warning-border-width-visited': `var(--${prefix}-default-warning-border-width)`,
+  'default-warning-border-style-visited': `var(--${prefix}-default-warning-border-style)`,
+  'default-warning-border-color-visited': `var(--${prefix}-default-warning-border-color)`,
+  'default-warning-border-radius-visited': `var(--${prefix}-default-warning-border-radius)`,
+  'default-warning-outline-visited': `var(--${prefix}-default-warning-outline)`,
+  'default-warning-shadow-visited': `var(--${prefix}-default-warning-shadow)`,
+  'default-warning-text-color-visited': `var(--${prefix}-default-warning-text-color)`
+};
+
+export const primaryWarningCSSVars = {
+  // primary-warning
+  'primary-warning-background': `var(--${DEFAULT_PREFIX}-warning-color)`,
+  'primary-warning-border-width': `var(--${prefix}-primary-border-width)`,
+  'primary-warning-border-style': `var(--${prefix}-primary-border-style)`,
+  'primary-warning-border-color': `var(--${DEFAULT_PREFIX}-warning-color)`,
+  'primary-warning-border-radius': `var(--${prefix}-primary-border-radius)`,
+  'primary-warning-outline': 'none',
+  'primary-warning-shadow': 'none',
+  'primary-warning-text-color': '#ffffff',
+  // primary-warning-active
+  'primary-warning-background-active': `var(--${DEFAULT_PREFIX}-warning-color-active)`,
+  'primary-warning-border-width-active': `var(--${prefix}-primary-warning-border-width)`,
+  'primary-warning-border-style-active': `var(--${prefix}-primary-warning-border-style)`,
+  'primary-warning-border-color-active': `var(--${DEFAULT_PREFIX}-warning-color-active)`,
+  'primary-warning-border-radius-active': `var(--${prefix}-primary-warning-border-radius)`,
+  'primary-warning-outline-active': `var(--${prefix}-primary-warning-outline)`,
+  'primary-warning-shadow-active': `var(--${prefix}-primary-warning-shadow)`,
+  'primary-warning-text-color-active': `var(--${prefix}-primary-warning-text-color)`,
+  // primary-warning-focus
+  'primary-warning-background-focus': `var(--${DEFAULT_PREFIX}-warning-color-focus)`,
+  'primary-warning-border-width-focus': `var(--${prefix}-primary-warning-border-width)`,
+  'primary-warning-border-style-focus': `var(--${prefix}-primary-warning-border-style)`,
+  'primary-warning-border-color-focus': `var(--${DEFAULT_PREFIX}-warning-color-focus)`,
+  'primary-warning-border-radius-focus': `var(--${prefix}-primary-warning-border-radius)`,
+  'primary-warning-outline-focus': `var(--${prefix}-primary-warning-outline)`,
+  'primary-warning-shadow-focus': `var(--${prefix}-primary-warning-shadow)`,
+  'primary-warning-text-color-focus': `var(--${prefix}-primary-warning-text-color)`,
+  // primary-warning-hover
+  'primary-warning-background-hover': `var(--${DEFAULT_PREFIX}-warning-color-hover)`,
+  'primary-warning-border-width-hover': `var(--${prefix}-primary-warning-border-width)`,
+  'primary-warning-border-style-hover': `var(--${prefix}-primary-warning-border-style)`,
+  'primary-warning-border-color-hover': `var(--${DEFAULT_PREFIX}-warning-color-hover)`,
+  'primary-warning-border-radius-hover': `var(--${prefix}-primary-warning-border-radius)`,
+  'primary-warning-outline-hover': `var(--${prefix}-primary-warning-outline)`,
+  'primary-warning-shadow-hover': `var(--${prefix}-primary-warning-shadow)`,
+  'primary-warning-text-color-hover': `var(--${prefix}-primary-warning-text-color)`,
+  // primary-warning-visited
+  'primary-warning-background-visited': `var(--${prefix}-primary-warning-background)`,
+  'primary-warning-border-width-visited': `var(--${prefix}-primary-warning-border-width)`,
+  'primary-warning-border-style-visited': `var(--${prefix}-primary-warning-border-style)`,
+  'primary-warning-border-color-visited': `var(--${prefix}-primary-warning-border-color)`,
+  'primary-warning-border-radius-visited': `var(--${prefix}-primary-warning-border-radius)`,
+  'primary-warning-outline-visited': `var(--${prefix}-primary-warning-outline)`,
+  'primary-warning-shadow-visited': `var(--${prefix}-primary-warning-shadow)`,
+  'primary-warning-text-color-visited': `var(--${prefix}-primary-warning-text-color)`
+};
+
+export const linkWarningCSSVars = {
+  // link-warning
+  'link-warning-background': `var(--${prefix}-link-background)`,
+  'link-warning-border-width': `var(--${prefix}-link-border-width)`,
+  'link-warning-border-style': `var(--${prefix}-link-border-style)`,
+  'link-warning-border-color': `var(--${prefix}-link-border-color)`,
+  'link-warning-border-radius': `var(--${prefix}-link-border-radius)`,
+  'link-warning-outline': 'none',
+  'link-warning-shadow': 'none',
+  'link-warning-text-color': `var(--${DEFAULT_PREFIX}-warning-color)`,
+  // link-warning-active
+  'link-warning-background-active': `var(--${prefix}-link-warning-color)`,
+  'link-warning-border-width-active': `var(--${prefix}-link-warning-border-width)`,
+  'link-warning-border-style-active': `var(--${prefix}-link-warning-border-style)`,
+  'link-warning-border-color-active': `var(--${prefix}-link-warning-color)`,
+  'link-warning-border-radius-active': `var(--${prefix}-link-warning-border-radius)`,
+  'link-warning-outline-active': `var(--${prefix}-link-warning-outline)`,
+  'link-warning-shadow-active': `var(--${prefix}-link-warning-shadow)`,
+  'link-warning-text-color-active': `var(--${DEFAULT_PREFIX}-warning-color-active)`,
+  // link-warning-focus
+  'link-warning-background-focus': `var(--${prefix}-link-warning-color)`,
+  'link-warning-border-width-focus': `var(--${prefix}-link-warning-border-width)`,
+  'link-warning-border-style-focus': `var(--${prefix}-link-warning-border-style)`,
+  'link-warning-border-color-focus': `var(--${prefix}-link-warning-color)`,
+  'link-warning-border-radius-focus': `var(--${prefix}-link-warning-border-radius)`,
+  'link-warning-outline-focus': `var(--${prefix}-link-warning-outline)`,
+  'link-warning-shadow-focus': `var(--${prefix}-link-warning-shadow)`,
+  'link-warning-text-color-focus': `var(--${DEFAULT_PREFIX}-warning-color-focus)`,
+  // link-warning-hover
+  'link-warning-background-hover': `var(--${prefix}-link-warning-color)`,
+  'link-warning-border-width-hover': `var(--${prefix}-link-warning-border-width)`,
+  'link-warning-border-style-hover': `var(--${prefix}-link-warning-border-style)`,
+  'link-warning-border-color-hover': `var(--${prefix}-link-warning-color)`,
+  'link-warning-border-radius-hover': `var(--${prefix}-link-warning-border-radius)`,
+  'link-warning-outline-hover': `var(--${prefix}-link-warning-outline)`,
+  'link-warning-shadow-hover': `var(--${prefix}-link-warning-shadow)`,
+  'link-warning-text-color-hover': `var(--${DEFAULT_PREFIX}-warning-color-hover)`,
+  // link-warning-visited
+  'link-warning-background-visited': `var(--${prefix}-link-warning-background)`,
+  'link-warning-border-width-visited': `var(--${prefix}-link-warning-border-width)`,
+  'link-warning-border-style-visited': `var(--${prefix}-link-warning-border-style)`,
+  'link-warning-border-color-visited': `var(--${prefix}-link-warning-border-color)`,
+  'link-warning-border-radius-visited': `var(--${prefix}-link-warning-border-radius)`,
+  'link-warning-outline-visited': `var(--${prefix}-link-warning-outline)`,
+  'link-warning-shadow-visited': `var(--${prefix}-link-warning-shadow)`,
+  'link-warning-text-color-visited': `var(--${prefix}-link-warning-text-color)`
+};

package/src/style/dark-minimalism/card/card.ts

@@ -0,0 +1,10 @@
+import { DEFAULT_PREFIX } from '../../../mount';
+
+export const component = 'card';
+
+export const cssVars = {
+  'action-background': `var(--${DEFAULT_PREFIX}-background)`,
+  'action-border-color': `var(--${DEFAULT_PREFIX}-border-color)`,
+  'action-divider-color': `var(--${DEFAULT_PREFIX}-border-color)`,
+  'action-text-color': `var(--${DEFAULT_PREFIX}-primary-color)`
+};

package/src/style/dark-minimalism/checkbox/checkbox.ts

@@ -0,0 +1,10 @@
+import { DEFAULT_PREFIX } from '../../../mount';
+
+export const component = 'checkbox';
+
+export const cssVars = {
+  color: `var(--${DEFAULT_PREFIX}-text-color)`,
+  background: `var(--${DEFAULT_PREFIX}-background)`,
+  'border-color': `var(--${DEFAULT_PREFIX}-border-color)`,
+  'disabled-border-color': `var(--${DEFAULT_PREFIX}-disabled-border-color)`
+};