@aristobyte-ui/label 1.0.43 → 1.0.45

package/dist/index.css

@@ -0,0 +1,14 @@
+/* components/Label/Label.scss */
+.label {
+  border-width: 1px;
+  border-style: solid;
+  border-color: #314158;
+  background-color: rgba(29, 41, 61, 0.3);
+  border-radius: 10px;
+  color: #ffffff;
+  font-family: "Inter", sans-serif;
+  font-size: 14px;
+  font-weight: 500;
+  padding: 4px 11px;
+}
+/*# sourceMappingURL=index.css.map */

package/dist/index.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Label.scss","../../../../node_modules/@aristobyte-ui/utils/styles/_settings.scss"],"sourcesContent":["@use \"@aristobyte-ui/utils/styles/settings\" as *;\n\n.label {\n  border-width: 1px;\n  border-style: solid;\n  border-color: #314158; //@TODO: @COLOR\n  background-color: rgba(29, 41, 61, 0.3); //@TODO: @COLOR\n  border-radius: 10px;\n  color: $white;\n  font-family: $font-family-sans;\n  font-size: 14px;\n  font-weight: 500;\n  padding: 4px 11px;\n}\n","// =========================================== //\n//        AristoByte UI - Style Settings       //\n// =========================================== //\n\n// === Design Tokens — Color Palette === //\n// Logo\n$logo-color-1: #ffee27;\n$logo-color-2: #fec800;\n$logo-color-3: #f18e35;\n$logo-color-4: #e95f32;\n$logo-color-5: #e2312d;\n$logo-gradient: linear-gradient(\n  90deg,\n  $logo-color-1,\n  $logo-color-2,\n  $logo-color-3,\n  $logo-color-4,\n  $logo-color-5\n);\n\n// Base\n$white: #ffffff;\n$white-hover: #dddddd;\n$black: #000000;\n$black-hover: #222222;\n$transparent: transparent;\n\n// === Black Transparent Scale === //\n$black-transparent-100: rgba(0, 0, 0, 0.1);\n$black-transparent-200: rgba(0, 0, 0, 0.2);\n$black-transparent-300: rgba(0, 0, 0, 0.3);\n$black-transparent-400: rgba(0, 0, 0, 0.4);\n$black-transparent-500: rgba(0, 0, 0, 0.5);\n$black-transparent-600: rgba(0, 0, 0, 0.6);\n$black-transparent-700: rgba(0, 0, 0, 0.7);\n$black-transparent-800: rgba(0, 0, 0, 0.8);\n$black-transparent-900: rgba(0, 0, 0, 0.9);\n\n// === Black Transparent Scale === //\n$white-transparent-100: rgba(255, 255, 255, 0.1);\n$white-transparent-200: rgba(255, 255, 255, 0.2);\n$white-transparent-300: rgba(255, 255, 255, 0.3);\n$white-transparent-400: rgba(255, 255, 255, 0.4);\n$white-transparent-500: rgba(255, 255, 255, 0.5);\n$white-transparent-600: rgba(255, 255, 255, 0.6);\n$white-transparent-700: rgba(255, 255, 255, 0.7);\n$white-transparent-800: rgba(255, 255, 255, 0.8);\n$white-transparent-900: rgba(255, 255, 255, 0.9);\n\n// === Neutral Scale (Grey) === //\n$grey-50: #f9fafb;\n$grey-100: #f3f4f6;\n$grey-200: #e5e7eb;\n$grey-300: #d1d5db;\n$grey-400: #9ca3af;\n$grey-500: #6b7280;\n$grey-600: #4b5563;\n$grey-700: #374151;\n$grey-800: #1f2937;\n$grey-900: #111827;\n\n// === Primary Scale (Blue) === //\n$blue-50: #eff6ff;\n$blue-100: #dbeafe;\n$blue-200: #bfdbfe;\n$blue-300: #93c5fd;\n$blue-400: #60a5fa;\n$blue-500: #3b82f6;\n$blue-600: #2563eb; // Main\n$blue-700: #1d4ed8; // Hover\n$blue-800: #1e40af;\n$blue-900: #1e3a8a;\n\n// === Secondary Scale (Indigo) === //\n$indigo-50: #eef2ff;\n$indigo-100: #e0e7ff;\n$indigo-200: #c7d2fe;\n$indigo-300: #a5b4fc;\n$indigo-400: #818cf8;\n$indigo-500: #6366f1;\n$indigo-600: #4f46e5; // Main\n$indigo-700: #4338ca; // Hover\n\n// === Error Scale (Red) === //\n$red-50: #fef2f2;\n$red-100: #fee2e2;\n$red-200: #fecaca;\n$red-300: #fca5a5;\n$red-400: #f87171;\n$red-500: #ef4444;\n$red-600: #dc2626; // Main\n$red-700: #b91c1c; // Hover\n\n// === Success Scale (Green) === //\n$green-50: #f0fdf4;\n$green-100: #dcfce7;\n$green-200: #bbf7d0;\n$green-300: #86efac;\n$green-400: #4ade80;\n$green-500: #22c55e;\n$green-600: #16a34a; // Main\n$green-700: #15803d; // Hover\n\n// === Warning Scale (Amber) === //\n$amber-50: #fffbeb;\n$amber-100: #fef3c7;\n$amber-200: #fde68a;\n$amber-300: #fcd34d;\n$amber-400: #fbbf24;\n$amber-500: #f59e0b;\n$amber-600: #d97706; // Main\n$amber-700: #b45309; // Hover\n\n// === Semantic Tokens === //\n$color-default: $grey-800;\n$color-default-hover: $grey-900;\n$color-default-disabled: rgba($color-default, 0.5);\n\n$color-primary: $blue-600;\n$color-primary-hover: $blue-700;\n$color-primary-disabled: rgba($color-primary, 0.5);\n\n$color-secondary: $indigo-600;\n$color-secondary-hover: $indigo-700;\n$color-secondary-disabled: rgba($color-secondary, 0.5);\n\n$color-error: $red-600;\n$color-error-hover: $red-700;\n$color-error-disabled: rgba($color-error, 0.5);\n\n$color-success: $green-600;\n$color-success-hover: $green-700;\n$color-success-disabled: rgba($color-success, 0.5);\n\n$color-warning: $amber-600;\n$color-warning-hover: $amber-700;\n$color-warning-disabled: rgba($color-warning, 0.5);\n\n$text-color-white: $white;\n$text-color-black: $black;\n$text-color-white-disabled: rgba($white, 0.5);\n$text-color-black-disabled: rgba($black, 0.5);\n\n$title-color-dark: $white;\n$subtitle-color-dark: #99a1af;\n$description-color-dark: #d1d5dc;\n$icon-color-dark: #99a1af;\n\n// === Shadows === //\n//@TODO: @SHADOW\n$shadow-sm: 0 1px 2px 0 rgba($black, 0.05);\n$shadow-md:\n  0 4px 6px -1px rgba($black, 0.1),\n  0 2px 4px -1px rgba($black, 0.06);\n$shadow-lg:\n  0 10px 15px -3px rgba($black, 0.1),\n  0 4px 6px -2px rgba($black, 0.05);\n\n// === Font families === //\n$font-family-sans: \"Inter\", sans-serif;\n$font-family-serif: \"Georgia\", serif;\n$font-family-mono: \"Fira Code\", monospace;\n\n// === Font weights === //\n$font-weight-regular: 400;\n$font-weight-medium: 500;\n$font-weight-semibold: 600;\n$font-weight-bold: 700;\n\n// === Line heights === //\n$line-height-tight: 1.2;\n$line-height-snug: 1.375;\n$line-height-normal: 1.5;\n$line-height-loose: 1.625;\n\n// === Font Sizes — Semantic Tokens === //\n\n// === Titles === //\n$font-size-hero: 3rem; // 48px\n$font-size-title-1: 2.25rem; // 36px\n$font-size-title-2: 1.875rem; // 30px\n$font-size-title-3: 1.5rem; // 24px\n\n// === Subtitles === //\n$font-size-subtitle-1: 1.25rem; // 20px\n$font-size-subtitle-2: 1.125rem; // 18px\n\n// === Body text === //\n$font-size-body-lg: 1rem; // 16px\n$font-size-body-md: 0.9375rem; // 15px\n$font-size-body-sm: 0.875rem; // 14px\n\n// === Captions / Descriptions === //\n$font-size-caption: 0.75rem; // 12px\n$font-size-footnote: 0.6875rem; // 11px\n\n// === Buttons === //\n$font-size-button-lg: 1rem; // 16px\n$font-size-button-md: 0.875rem; // 14px\n$font-size-button-sm: 0.75rem; // 12px\n\n// === Animations === //\n\n$cubic-bezier-primary: cubic-bezier(0.55, -0.19, 0.59, 0.95);\n$cubic-bezier-secondary: cubic-bezier(0.175, 0.885, 0.32, 1.275);\n"],"mappings":";AAEA,CAAA;AACE,gBAAA;AACA,gBAAA;AACA,gBAAA;AACA,oBAAA,KAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA;AACA,iBAAA;AACA,SCaM;ADZN,eCsJiB,OAAA,EAAA;ADrJjB,aAAA;AACA,eAAA;AACA,WAAA,IAAA;;","names":[]}

package/dist/index.js

@@ -0,0 +1,41 @@
+"use client";
+import "./index.css";
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// index.ts
+var index_exports = {};
+__export(index_exports, {
+  Label: () => Label
+});
+module.exports = __toCommonJS(index_exports);
+
+// components/Label/index.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var Label = ({
+  text,
+  color,
+  backgroundColor,
+  borderColor
+}) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { className: "label", style: { backgroundColor, borderColor, color }, children: text });
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Label
+});
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../index.ts","../components/Label/index.tsx"],"sourcesContent":["export * from \"./components\";\n","import * as React from \"react\";\n\nimport \"./Label.scss\";\n\nexport interface ILabel {\n  text: string;\n  color?: string;\n  backgroundColor?: string;\n  borderColor?: string;\n}\n\nexport const Label: React.FC<ILabel> = ({\n  text,\n  color,\n  backgroundColor,\n  borderColor,\n}) => (\n  <label className=\"label\" style={{ backgroundColor, borderColor, color }}>\n    {text}\n  </label>\n);\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACiBE;AANK,IAAM,QAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE,4CAAC,WAAM,WAAU,SAAQ,OAAO,EAAE,iBAAiB,aAAa,MAAM,GACnE,gBACH;","names":[]}

package/dist/index.mjs

@@ -0,0 +1,15 @@
+"use client";
+import "./index.css";
+
+// components/Label/index.tsx
+import { jsx } from "react/jsx-runtime";
+var Label = ({
+  text,
+  color,
+  backgroundColor,
+  borderColor
+}) => /* @__PURE__ */ jsx("label", { className: "label", style: { backgroundColor, borderColor, color }, children: text });
+export {
+  Label
+};
+//# sourceMappingURL=index.mjs.map

package/dist/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../components/Label/index.tsx"],"sourcesContent":["import * as React from \"react\";\n\nimport \"./Label.scss\";\n\nexport interface ILabel {\n  text: string;\n  color?: string;\n  backgroundColor?: string;\n  borderColor?: string;\n}\n\nexport const Label: React.FC<ILabel> = ({\n  text,\n  color,\n  backgroundColor,\n  borderColor,\n}) => (\n  <label className=\"label\" style={{ backgroundColor, borderColor, color }}>\n    {text}\n  </label>\n);\n"],"mappings":";;;;AAiBE;AANK,IAAM,QAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE,oBAAC,WAAM,WAAU,SAAQ,OAAO,EAAE,iBAAiB,aAAa,MAAM,GACnE,gBACH;","names":[]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@aristobyte-ui/label",
   "description": "AristoByteUI Label component: a reusable, styled label for forms and UI elements.",
-  "version": "1.0.43",
+  "version": "1.0.45",
   "license": "MIT",
   "private": false,
   "author": "AristoByte <info@aristobyte.com>",
@@ -56,7 +56,7 @@
     "check-types": "tsc --noEmit"
   },
   "dependencies": {
-    "@aristobyte-ui/utils": "^1.0.43",
+    "@aristobyte-ui/utils": "^1.0.45",
     "esbuild-sass-plugin": "^3.3.1",
     "framer-motion": "^12.23.9",
     "react": "^19.1.0",
@@ -66,8 +66,8 @@
     "tsup": "^8.5.0"
   },
   "devDependencies": {
-    "@aristobyte-ui/eslint-config": "^1.0.43",
-    "@aristobyte-ui/typescript-config": "^1.0.43",
+    "@aristobyte-ui/eslint-config": "^1.0.45",
+    "@aristobyte-ui/typescript-config": "^1.0.45",
     "@turbo/gen": "^2.5.0",
     "@types/node": "^24.3.0",
     "@types/react": "19.1.0",