@ikatec/nebula-tokens 0.0.1-alpha.2 → 0.0.1-alpha.21

package/dist/index.js

@@ -46,6 +46,7 @@ var button = {
   },
   secondary: {
     background: {
+      default: "var(--button-secondary-background-default)",
       hover: "var(--button-secondary-background-hover)",
       active: "var(--button-secondary-background-active)",
       focus: "var(--button-secondary-background-focus)"
@@ -85,81 +86,17 @@ var button = {
   }
 };
 var badge = {
-  info: {
-    background: {
-      default: "var(--badge-info-background-default)",
-      hover: "var(--badge-info-background-hover)"
-    },
-    text: "var(--badge-info-text)"
-  },
-  "info-soft": {
-    background: {
-      default: "var(--badge-info-soft-background-default)",
-      hover: "var(--badge-info-soft-background-hover)"
-    },
-    text: "var(--badge-info-soft-text)"
-  },
-  warning: {
-    background: {
-      default: "var(--badge-warning-background-default)",
-      hover: "var(--badge-warning-background-hover)"
-    },
-    text: "var(--badge-warning-text)"
-  },
-  "warning-soft": {
-    background: {
-      default: "var(--badge-warning-soft-background-default)",
-      hover: "var(--badge-warning-soft-background-hover)"
-    },
-    text: "var(--badge-warning-soft-text)"
-  },
-  neutral: {
-    background: {
-      default: "var(--badge-neutral-background-default)",
-      hover: "var(--badge-neutral-background-hover)"
-    },
-    text: "var(--badge-neutral-text)"
-  },
-  "neutral-soft": {
-    background: {
-      default: "var(--badge-neutral-soft-background-default)",
-      hover: "var(--badge-neutral-soft-background-hover)"
-    },
-    text: "var(--badge-neutral-soft-text)"
-  },
-  success: {
-    background: {
-      default: "var(--badge-success-background-default)",
-      hover: "var(--badge-success-background-hover)"
-    },
-    text: "var(--badge-success-text)"
-  },
-  "success-soft": {
-    background: {
-      default: "var(--badge-success-soft-background-default)",
-      hover: "var(--badge-success-soft-background-hover)"
-    },
-    text: "var(--badge-success-soft-text)"
-  },
-  danger: {
-    background: {
-      default: "var(--badge-danger-background-default)",
-      hover: "var(--badge-danger-background-hover)"
-    },
-    text: "var(--badge-danger-text)"
+  primary: {
+    background: "var(--badge-primary-background)",
+    text: "var(--badge-primary-text)"
   },
-  "danger-soft": {
-    background: {
-      default: "var(--badge-danger-soft-background-default)",
-      hover: "var(--badge-danger-soft-background-hover)"
-    },
-    text: "var(--badge-danger-soft-text)"
+  secondary: {
+    background: "var(--badge-secondary-background)",
+    text: "var(--badge-secondary-text)"
   },
-  outline: {
-    border: {
-      default: "var(--badge-outline-border-default)"
-    },
-    text: "var(--badge-outline-text)"
+  alert: {
+    background: "var(--badge-alert-background-default)",
+    text: "var(--badge-alert-text)"
   }
 };
 var separator = {
@@ -230,19 +167,229 @@ var label = {
     active: "var(--label-text-active)"
   }
 };
-var input = {
-  background: "var(--input-background)",
+var inputText = {
+  background: {
+    default: "var(--inputText-background-default)",
+    disabled: "var(--inputText-background-disabled)"
+  },
+  border: {
+    default: "var(--inputText-border-default)",
+    focus: "var(--inputText-border-focus)",
+    active: "var(--inputText-border-active)",
+    danger: "var(--inputText-border-danger)",
+    disabled: "var(--inputText-border-disabled)",
+    filled: "var(--inputText-border-filled)"
+  },
+  text: {
+    default: "var(--inputText-text-default)",
+    focus: "var(--inputText-text-focus)",
+    active: "var(--inputText-text-active)",
+    filled: "var(--inputText-text-filled)",
+    disabled: "var(--inputText-text-disabled)"
+  },
+  icon: {
+    default: "var(--inputText-icon-default)",
+    focus: "var(--inputText-icon-focus)",
+    active: "var(--inputText-icon-active)",
+    filled: "var(--inputText-icon-filled)",
+    danger: "var(--inputText-icon-danger)",
+    disabled: "var(--inputText-icon-disabled)"
+  }
+};
+var dropdownMenu = {
+  background: "var(--dropdown-background)",
+  border: "var(--dropdown-border)",
+  shadow: "var(--dropdown-shadow)"
+};
+var pagination = {
+  text: "var(--pagination-text)",
+  background: {
+    default: "var(--pagination-background-default)",
+    hover: "var(--pagination-background-hover)",
+    disabled: "var(--pagination-background-disabled)"
+  },
+  border: {
+    default: "var(--pagination-border-default)",
+    disabled: "var(--pagination-border-disabled)"
+  },
+  icon: {
+    disabled: "var(--pagination-icon-disabled)",
+    default: "var(--pagination-icon-default)"
+  }
+};
+var listItem = {
+  background: {
+    default: "var(--listItem-background)",
+    hover: "var(--listItem-background-hover)"
+  },
   border: {
-    default: "var(--input-border-default)",
-    focus: "var(--input-border-focus)"
-  },
-  text: "var(--input-text)",
-  placeholder: "var(--input-placeholder)",
-  "helper-text": {
-    default: "var(--input-helper-text-default)",
-    error: "var(--input-helper-text-error)"
+    default: "var(--listItem-border)"
+  },
+  text: {
+    default: "var(--listItem-text)",
+    header: "var(--listItem-text-header)",
+    selected: "var(--listItem-text-selected)"
+  },
+  icon: {
+    default: "var(--listItem-icon)",
+    selected: "var(--listItem-icon-selected)"
+  }
+};
+var tag = {
+  border: "var(--tag-border)",
+  icon: "var(--tag-icon)",
+  text: "var(--tag-text)",
+  background: {
+    hover: "var(--tag-background-hover)"
+  },
+  colorIndicator: {
+    yellow: "var(--tag-colorIndicator-yellow)",
+    blue: "var(--tag-colorIndicator-blue)",
+    red: "var(--tag-colorIndicator-red)",
+    green: "var(--tag-colorIndicator-green)",
+    gray: "var(--tag-colorIndicator-gray)",
+    orange: "var(--tag-colorIndicator-orange)"
+  }
+};
+var table = {
+  background: "var(--table-background)",
+  border: "var(--table-border)",
+  header: {
+    background: "var(--table-header-background)",
+    border: "var(--table-header-border)",
+    text: "var(--table-header-text)",
+    helper: "var(--table-header-helper)"
+  },
+  cell: {
+    background: {
+      "first-layer": "var(--table-cell-background-first-layer)",
+      "second-layer": "var(--table-cell-background-second-layer)"
+    },
+    border: "var(--table-cell-border)",
+    text: "var(--table-cell-text)",
+    link: "var(--table-cell-link)",
+    icon: "var(--table-cell-icon)"
+  }
+};
+var inputSelect = {
+  default: {
+    background: "var(--inputSelect-background-default)",
+    border: "var(--inputSelect-border-default)",
+    text: "var(--inputSelect-text-default)",
+    icon: "var(--inputSelect-icon-default)"
+  },
+  focus: {
+    border: "var(--inputSelect-border-focus)",
+    text: "var(--inputSelect-text-focus)",
+    icon: "var(--inputSelect-icon-focus)"
+  },
+  active: {
+    border: "var(--inputSelect-border-active)",
+    text: "var(--inputSelect-text-active)",
+    icon: "var(--inputSelect-icon-active)"
+  },
+  filled: {
+    border: "var(--inputSelect-border-filled)",
+    text: "var(--inputSelect-text-filled)",
+    icon: "var(--inputSelect-icon-filled)"
+  },
+  disabled: {
+    background: "var(--inputSelect-background-disabled)"
   }
 };
+var dialog = {
+  background: {
+    default: "var(--dialog-background-default)",
+    overlay: "var(--dialog-background-overlay)"
+  },
+  title: "var(--dialog-title)",
+  text: "var(--dialog-text)",
+  icon: "var(--dialog-icon)"
+};
+var checkbox = {
+  unselected: {
+    background: {
+      default: "var(--checkbox-unselected-background-default)",
+      hover: "var(--checkbox-unselected-background-hover)",
+      focus: "var(--checkbox-unselected-background-focus)",
+      disabled: "var(--checkbox-unselected-background-disabled)"
+    },
+    border: {
+      default: "var(--checkbox-unselected-border-default)",
+      hover: "var(--checkbox-unselected-border-hover)",
+      focus: "var(--checkbox-unselected-border-focus)",
+      disabled: "var(--checkbox-unselected-border-disabled)",
+      external: {
+        focus: "var(--checkbox-unselected-border-external-focus)"
+      }
+    }
+  },
+  selected: {
+    background: {
+      default: "var(--checkbox-selected-background-default)",
+      hover: "var(--checkbox-selected-background-hover)",
+      focus: "var(--checkbox-selected-background-focus)",
+      disabled: "var(--checkbox-selected-background-disabled)"
+    },
+    border: {
+      focus: "var(--checkbox-selected-border-focus)"
+    },
+    icon: {
+      default: "var(--checkbox-selected-icon-default)",
+      disabled: "var(--checkbox-selected-icon-disabled)"
+    }
+  }
+};
+var drawer = {
+  overlay: "var(--drawer-background-overlay)",
+  header: {
+    background: "var(--drawer-header-background)",
+    border: "var(--drawer-header-border)",
+    title: "var(--drawer-header-title)",
+    description: "var(--drawer-header-description)"
+  },
+  body: {
+    background: "var(--drawer-body-background)",
+    text: "var(--drawer-body-text)"
+  },
+  footer: {
+    background: "var(--drawer-footer-background)",
+    label: "var(--drawer-footer-label)",
+    border: "var(--drawer-footer-border)"
+  }
+};
+var breadcrumb = {
+  text: {
+    default: "var(--breadcrumb-text-default)",
+    hover: "var(--breadcrumb-text-hover)",
+    active: "var(--breadcrumb-text-active)"
+  },
+  ellipsis: {
+    background: { hover: "var(--breadcrumb-ellipsis-bg-hover)" }
+  }
+};
+var switchColors = {
+  background: {
+    off: {
+      default: "var(--switch-background-off-default)",
+      hover: "var(--switch-background-off-hover)",
+      focus: "var(--switch-background-off-focus)",
+      disabled: "var(--switch-background-off-disabled)"
+    },
+    on: {
+      default: "var(--switch-background-on-default)",
+      hover: "var(--switch-background-on-hover)",
+      focus: "var(--switch-background-on-focus)",
+      disabled: "var(--switch-background-on-disabled)"
+    }
+  },
+  ring: "var(--switch-ring)",
+  circle: "var(--switch-circle)"
+};
+var tooltip = {
+  background: "var(--tooltip-background)",
+  text: "var(--tooltip-text)"
+};
 var colors = {
   primary: {
     50: "var(--primary-50)",
@@ -307,14 +454,27 @@ var colors = {
     700: "var(--neutral-700)",
     800: "var(--neutral-800)",
     900: "var(--neutral-900)",
-    950: "var(--neutral-950)"
+    950: "var(--neutral-950)",
+    1e3: "var(--neutral-1000)"
   },
   button,
   badge,
   separator,
   alert,
   label,
-  input
+  dropdownMenu,
+  pagination,
+  listItem,
+  tag,
+  table,
+  inputSelect,
+  inputText,
+  dialog,
+  checkbox,
+  drawer,
+  breadcrumb,
+  switch: switchColors,
+  tooltip
 };
 
 // src/space.ts