@luxfi/ui 6.1.3 → 7.0.0

package/tokens.css

@@ -0,0 +1,438 @@
+/*
+ * Design tokens — CSS custom properties
+ *
+ * These mirror the Chakra semantic tokens defined in
+ * toolkit/theme/foundations/semanticTokens.ts and
+ * toolkit/theme/foundations/colors.ts (DEFAULT_THEME_COLORS).
+ *
+ * Light mode is the default (:root). Dark mode activates via .dark class
+ * (applied by next-themes with the "class" strategy).
+ *
+ * Palette reference (true neutral grays):
+ *   gray.50  = #FAFAFA    gray.500 = #737373
+ *   gray.100 = #F5F5F5    gray.600 = #525252
+ *   gray.200 = #E5E5E5    gray.700 = #404040
+ *   gray.300 = #D4D4D4    gray.800 = #262626
+ *   gray.400 = #A3A3A3    gray.900 = #171717
+ *
+ *   blackAlpha.50  = rgba(16,17,18,0.04)   whiteAlpha.50  = rgba(255,255,255,0.04)
+ *   blackAlpha.100 = rgba(16,17,18,0.06)   whiteAlpha.100 = rgba(255,255,255,0.06)
+ *   blackAlpha.200 = rgba(16,17,18,0.08)   whiteAlpha.200 = rgba(255,255,255,0.08)
+ *   blackAlpha.300 = rgba(16,17,18,0.16)   whiteAlpha.300 = rgba(255,255,255,0.16)
+ *   blackAlpha.400 = rgba(16,17,18,0.24)   whiteAlpha.400 = rgba(255,255,255,0.24)
+ *   blackAlpha.500 = rgba(16,17,18,0.36)   whiteAlpha.500 = rgba(255,255,255,0.36)
+ *   blackAlpha.600 = rgba(16,17,18,0.48)   whiteAlpha.600 = rgba(255,255,255,0.48)
+ *   blackAlpha.700 = rgba(16,17,18,0.64)   whiteAlpha.700 = rgba(255,255,255,0.64)
+ *   blackAlpha.800 = rgba(16,17,18,0.80)   whiteAlpha.800 = rgba(255,255,255,0.80)
+ *   blackAlpha.900 = rgba(16,17,18,0.92)   whiteAlpha.900 = rgba(255,255,255,0.92)
+ */
+
+/* ================================================================
+   LIGHT MODE (default)
+   ================================================================ */
+:root {
+  /* --- Backgrounds --- */
+  --color-bg-primary: #FFFFFF;
+  --color-bg-info: #FAFAFA;
+  --color-bg-body: #FFFFFF;
+
+  /* --- Foregrounds --- */
+  --color-fg-info: #525252;
+
+  /* --- Text --- */
+  --color-text-primary: rgba(16, 17, 18, 0.80);
+  --color-text-secondary: #737373;
+  --color-text-error: #E53E3E;
+  --color-text-success: #38A169;
+
+  /* --- Headings --- */
+  --color-heading: rgba(16, 17, 18, 0.80);
+
+  /* --- Icons --- */
+  --color-icon-primary: #737373;
+  --color-icon-secondary: #A3A3A3;
+
+  /* --- Borders --- */
+  --color-border-divider: rgba(16, 17, 18, 0.06);
+  --color-border-error: #E53E3E;
+  --color-border-info: #A3A3A3;
+
+  /* --- Links --- */
+  --color-link-primary: #404040;
+  --color-link-primary-hover: #525252;
+  --color-link-secondary: #737373;
+  --color-link-subtle: rgba(16, 17, 18, 0.80);
+  --color-link-subtle-hover: rgba(16, 17, 18, 0.80);
+  --color-link-menu: rgba(16, 17, 18, 0.80);
+  --color-link-underlaid-bg: #F5F5F5;
+  --color-link-nav-fg: rgba(16, 17, 18, 0.80);
+  --color-link-nav-fg-hover: #525252;
+  --color-link-nav-fg-selected: #171717;
+  --color-link-nav-fg-active: #525252;
+  --color-link-nav-bg-selected: #F5F5F5;
+
+  /* --- Buttons --- */
+  --color-button-solid-bg: #171717;
+  --color-button-solid-text: #FFFFFF;
+  --color-button-outline-fg: #171717;
+  --color-button-subtle-fg: rgba(16, 17, 18, 0.80);
+  --color-button-subtle-bg: rgba(16, 17, 18, 0.08);
+  --color-button-dropdown-fg: rgba(16, 17, 18, 0.80);
+  --color-button-dropdown-border: #F5F5F5;
+  --color-button-header-fg: rgba(16, 17, 18, 0.80);
+  --color-button-header-fg-selected: rgba(16, 17, 18, 0.80);
+  --color-button-header-fg-highlighted: rgba(16, 17, 18, 0.80);
+  --color-button-header-border: #F5F5F5;
+  --color-button-header-bg-selected: rgba(16, 17, 18, 0.04);
+  --color-button-header-bg-highlighted: #FEEBCB;
+  --color-button-pagination-fg: rgba(16, 17, 18, 0.80);
+  --color-button-pagination-border: #F5F5F5;
+  --color-button-icon-background-bg: #FAFAFA;
+  --color-button-hero-bg: #171717;
+  --color-button-hero-fg: #FFFFFF;
+  --color-button-hero-bg-hover: #525252;
+  --color-button-hero-fg-hover: #FFFFFF;
+  --color-button-hero-bg-selected: rgba(255, 255, 255, 0.06);
+  --color-button-hero-fg-selected: rgba(16, 17, 18, 0.80);
+  --color-button-segmented-fg: rgba(16, 17, 18, 0.80);
+  --color-button-icon-bg: rgba(16, 17, 18, 0.04);
+
+  /* --- Hover / Selected --- */
+  --color-hover: #525252;
+  --color-selected-control-bg: #F5F5F5;
+  --color-selected-control-text: #171717;
+  --color-selected-option-bg: #404040;
+
+  /* --- Navigation --- */
+  --color-nav-bg-selected: #F5F5F5;
+  --color-nav-text-selected: #171717;
+
+  /* --- Inputs --- */
+  --color-input-fg: #262626;
+  --color-input-bg: #FFFFFF;
+  --color-input-bg-readonly: #E5E5E5;
+  --color-input-border: #F5F5F5;
+  --color-input-border-hover: #E5E5E5;
+  --color-input-border-focus: #525252;
+  --color-input-placeholder: #A3A3A3;
+
+  /* --- Tags --- */
+  --color-tag-subtle-bg: rgba(16, 17, 18, 0.04);
+  --color-tag-subtle-fg: rgba(16, 17, 18, 0.80);
+  --color-tag-clickable-bg: #F5F5F5;
+  --color-tag-clickable-fg: rgba(16, 17, 18, 0.80);
+  --color-tag-filter-bg: #F5F5F5;
+  --color-tag-select-bg: #F5F5F5;
+  --color-tag-select-fg: #737373;
+  --color-tag-select-selected-bg: #404040;
+  --color-tag-select-selected-fg: rgba(255, 255, 255, 0.80);
+
+  /* --- Badges --- */
+  --color-badge-gray-bg: rgba(16, 17, 18, 0.04);
+  --color-badge-gray-fg: rgba(16, 17, 18, 0.80);
+  --color-badge-green-bg: #F0FFF4;
+  --color-badge-green-fg: #38A169;
+  --color-badge-red-bg: #FFF5F5;
+  --color-badge-red-fg: #E53E3E;
+  --color-badge-purple-bg: #F5F5F5;
+  --color-badge-purple-fg: #525252;
+  --color-badge-orange-bg: #FFFAF0;
+  --color-badge-orange-fg: #DD6B20;
+  --color-badge-blue-bg: #F5F5F5;
+  --color-badge-blue-fg: #525252;
+  --color-badge-yellow-bg: #FFFFF0;
+  --color-badge-yellow-fg: #D69E2E;
+  --color-badge-teal-bg: #F5F5F5;
+  --color-badge-teal-fg: #525252;
+  --color-badge-cyan-bg: #F5F5F5;
+  --color-badge-cyan-fg: #525252;
+  --color-badge-pink-bg: #FFF5F7;
+  --color-badge-pink-fg: #D53F8C;
+  --color-badge-purple-alt-bg: #F5F5F5;
+  --color-badge-purple-alt-fg: rgba(16, 17, 18, 0.80);
+  --color-badge-blue-alt-bg: #F5F5F5;
+  --color-badge-blue-alt-fg: rgba(16, 17, 18, 0.80);
+  --color-badge-bright-gray-bg: #F5F5F5;
+  --color-badge-bright-gray-fg: #525252;
+  --color-badge-bright-green-bg: #C6F6D5;
+  --color-badge-bright-green-fg: #25855A;
+  --color-badge-bright-red-bg: #FED7D7;
+  --color-badge-bright-red-fg: #C53030;
+  --color-badge-bright-blue-bg: #E5E5E5;
+  --color-badge-bright-blue-fg: #404040;
+  --color-badge-bright-yellow-bg: #FEFCBF;
+  --color-badge-bright-yellow-fg: #B7791F;
+  --color-badge-bright-teal-bg: #E5E5E5;
+  --color-badge-bright-teal-fg: #404040;
+  --color-badge-bright-cyan-bg: #E5E5E5;
+  --color-badge-bright-cyan-fg: #404040;
+  --color-badge-bright-orange-bg: #FEEBCB;
+  --color-badge-bright-orange-fg: #C05621;
+  --color-badge-bright-purple-bg: #E5E5E5;
+  --color-badge-bright-purple-fg: #404040;
+  --color-badge-bright-pink-bg: #FFF5F7;
+  --color-badge-bright-pink-fg: #B83280;
+
+  /* --- Alerts --- */
+  --color-alert-fg: rgba(16, 17, 18, 0.80);
+  --color-alert-bg-info: rgba(16, 17, 18, 0.04);
+  --color-alert-bg-warning: #FEEBCB;
+  --color-alert-bg-warning-table: #FFFAF0;
+  --color-alert-bg-success: #C6F6D5;
+  --color-alert-bg-error: #FED7D7;
+
+  /* --- Dialogs / Popovers / Drawers --- */
+  --color-dialog-bg: #FFFFFF;
+  --color-dialog-fg: rgba(16, 17, 18, 0.80);
+  --color-popover-bg: #FFFFFF;
+  --color-popover-shadow: rgba(16, 17, 18, 0.08);
+  --color-drawer-bg: #FFFFFF;
+
+  /* --- Tooltip --- */
+  --color-tooltip-bg: #171717;
+  --color-tooltip-fg: #FFFFFF;
+
+  /* --- Table --- */
+  --color-table-header-bg: rgba(16, 17, 18, 0.06);
+  --color-table-header-fg: rgba(16, 17, 18, 0.64);
+
+  /* --- Tabs --- */
+  --color-tabs-solid-fg: #171717;
+  --color-tabs-secondary-fg: rgba(16, 17, 18, 0.80);
+  --color-tabs-secondary-border: #D4D4D4;
+
+  /* --- Switch --- */
+  --color-switch-bg: #D4D4D4;
+
+  /* --- Skeleton --- */
+  --color-skeleton-start: rgba(16, 17, 18, 0.04);
+  --color-skeleton-end: rgba(16, 17, 18, 0.06);
+
+  /* --- Progress --- */
+  --color-progress-track: #F5F5F5;
+
+  /* --- Stats / Topbar --- */
+  --color-stats-bg: #FAFAFA;
+  --color-topbar-bg: #FAFAFA;
+
+  /* --- Graph --- */
+  --color-graph-line: #737373;
+  --color-graph-gradient-start: rgba(163, 163, 163, 0.3);
+  --color-graph-gradient-stop: rgba(163, 163, 163, 0);
+
+  /* --- Scrollbar --- */
+  --color-scrollbar-thumb: rgba(16, 17, 18, 0.16);
+
+  /* --- Selection --- */
+  --color-selection-bg: #E3CFE7;
+
+  /* --- Shadows --- */
+  --shadow-action-bar: 0 4px 4px -4px rgb(0 0 0 / 10%), 0 2px 4px -4px rgb(0 0 0 / 6%);
+  --shadow-popover: 0px 15px 50px -12px rgba(0, 0, 0, 0.25);
+  --shadow-drawer: 0px 4px 6px -2px rgba(0, 0, 0, 0.05), 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
+}
+
+/* ================================================================
+   DARK MODE
+   ================================================================ */
+.dark {
+  /* --- Backgrounds --- */
+  --color-bg-primary: #000000;
+  --color-bg-info: #171717;
+  --color-bg-body: #000000;
+
+  /* --- Foregrounds --- */
+  --color-fg-info: #D4D4D4;
+
+  /* --- Text --- */
+  --color-text-primary: rgba(255, 255, 255, 0.80);
+  --color-text-secondary: #A3A3A3;
+  --color-text-error: #E53E3E;
+  --color-text-success: #9AE6B4;
+
+  /* --- Headings --- */
+  --color-heading: rgba(255, 255, 255, 0.80);
+
+  /* --- Icons --- */
+  --color-icon-primary: #A3A3A3;
+  --color-icon-secondary: #737373;
+
+  /* --- Borders --- */
+  --color-border-divider: rgba(255, 255, 255, 0.06);
+  --color-border-error: #E53E3E;
+  --color-border-info: #737373;
+
+  /* --- Links --- */
+  --color-link-primary: rgba(255, 255, 255, 0.64);
+  --color-link-primary-hover: rgba(255, 255, 255, 0.64);
+  --color-link-secondary: #A3A3A3;
+  --color-link-subtle: #A3A3A3;
+  --color-link-subtle-hover: #A3A3A3;
+  --color-link-menu: rgba(255, 255, 255, 0.80);
+  --color-link-underlaid-bg: #262626;
+  --color-link-nav-fg: rgba(255, 255, 255, 0.80);
+  --color-link-nav-fg-hover: rgba(255, 255, 255, 0.64);
+  --color-link-nav-fg-selected: #FAFAFA;
+  --color-link-nav-fg-active: rgba(255, 255, 255, 0.64);
+  --color-link-nav-bg-selected: rgba(255, 255, 255, 0.06);
+
+  /* --- Buttons --- */
+  --color-button-solid-bg: rgba(255, 255, 255, 0.92);
+  --color-button-solid-text: #000000;
+  --color-button-outline-fg: rgba(255, 255, 255, 0.92);
+  --color-button-subtle-fg: rgba(255, 255, 255, 0.80);
+  --color-button-subtle-bg: rgba(255, 255, 255, 0.08);
+  --color-button-dropdown-fg: rgba(255, 255, 255, 0.80);
+  --color-button-dropdown-border: #525252;
+  --color-button-header-fg: #A3A3A3;
+  --color-button-header-fg-selected: rgba(255, 255, 255, 0.80);
+  --color-button-header-fg-highlighted: rgba(255, 255, 255, 0.80);
+  --color-button-header-border: #525252;
+  --color-button-header-bg-selected: rgba(255, 255, 255, 0.06);
+  --color-button-header-bg-highlighted: #7B341E;
+  --color-button-pagination-fg: #FAFAFA;
+  --color-button-pagination-border: rgba(255, 255, 255, 0.06);
+  --color-button-icon-background-bg: rgba(255, 255, 255, 0.04);
+  --color-button-hero-bg: rgba(255, 255, 255, 0.92);
+  --color-button-hero-fg: #FFFFFF;
+  --color-button-hero-bg-hover: rgba(255, 255, 255, 0.64);
+  --color-button-hero-fg-hover: #FFFFFF;
+  --color-button-hero-bg-selected: rgba(255, 255, 255, 0.06);
+  --color-button-hero-fg-selected: rgba(16, 17, 18, 0.80);
+  --color-button-segmented-fg: rgba(255, 255, 255, 0.80);
+  --color-button-icon-bg: rgba(255, 255, 255, 0.04);
+
+  /* --- Hover / Selected --- */
+  --color-hover: rgba(255, 255, 255, 0.64);
+  --color-selected-control-bg: rgba(255, 255, 255, 0.06);
+  --color-selected-control-text: #FAFAFA;
+  --color-selected-option-bg: rgba(255, 255, 255, 0.16);
+
+  /* --- Navigation --- */
+  --color-nav-bg-selected: rgba(255, 255, 255, 0.06);
+  --color-nav-text-selected: #FAFAFA;
+
+  /* --- Inputs --- */
+  --color-input-fg: #FAFAFA;
+  --color-input-bg: #000000;
+  --color-input-bg-readonly: #262626;
+  --color-input-border: #525252;
+  --color-input-border-hover: #737373;
+  --color-input-border-focus: rgba(255, 255, 255, 0.64);
+  --color-input-placeholder: #737373;
+
+  /* --- Tags --- */
+  --color-tag-subtle-bg: rgba(255, 255, 255, 0.06);
+  --color-tag-subtle-fg: rgba(255, 255, 255, 0.80);
+  --color-tag-clickable-bg: #262626;
+  --color-tag-clickable-fg: rgba(255, 255, 255, 0.80);
+  --color-tag-filter-bg: rgba(255, 255, 255, 0.08);
+  --color-tag-select-bg: #262626;
+  --color-tag-select-fg: rgba(255, 255, 255, 0.80);
+  --color-tag-select-selected-bg: rgba(255, 255, 255, 0.16);
+  --color-tag-select-selected-fg: rgba(255, 255, 255, 0.80);
+
+  /* --- Badges --- */
+  --color-badge-gray-bg: rgba(255, 255, 255, 0.06);
+  --color-badge-gray-fg: rgba(255, 255, 255, 0.80);
+  --color-badge-green-bg: #22543D;
+  --color-badge-green-fg: #9AE6B4;
+  --color-badge-red-bg: #822727;
+  --color-badge-red-fg: #FEB2B2;
+  --color-badge-purple-bg: #262626;
+  --color-badge-purple-fg: #D4D4D4;
+  --color-badge-orange-bg: #7B341E;
+  --color-badge-orange-fg: #FEEBCB;
+  --color-badge-blue-bg: #262626;
+  --color-badge-blue-fg: #D4D4D4;
+  --color-badge-yellow-bg: #744210;
+  --color-badge-yellow-fg: #FEFCBF;
+  --color-badge-teal-bg: #262626;
+  --color-badge-teal-fg: #D4D4D4;
+  --color-badge-cyan-bg: #262626;
+  --color-badge-cyan-fg: #D4D4D4;
+  --color-badge-pink-bg: #702459;
+  --color-badge-pink-fg: #FED7E2;
+  --color-badge-purple-alt-bg: #262626;
+  --color-badge-purple-alt-fg: rgba(255, 255, 255, 0.80);
+  --color-badge-blue-alt-bg: #262626;
+  --color-badge-blue-alt-fg: rgba(255, 255, 255, 0.80);
+  --color-badge-bright-gray-bg: #262626;
+  --color-badge-bright-gray-fg: #E5E5E5;
+  --color-badge-bright-green-bg: #22543D;
+  --color-badge-bright-green-fg: #9AE6B4;
+  --color-badge-bright-red-bg: #822727;
+  --color-badge-bright-red-fg: #FEB2B2;
+  --color-badge-bright-blue-bg: #404040;
+  --color-badge-bright-blue-fg: #E5E5E5;
+  --color-badge-bright-yellow-bg: #744210;
+  --color-badge-bright-yellow-fg: #FAF089;
+  --color-badge-bright-teal-bg: #404040;
+  --color-badge-bright-teal-fg: #E5E5E5;
+  --color-badge-bright-cyan-bg: #404040;
+  --color-badge-bright-cyan-fg: #E5E5E5;
+  --color-badge-bright-orange-bg: #C05621;
+  --color-badge-bright-orange-fg: #FEEBCB;
+  --color-badge-bright-purple-bg: #404040;
+  --color-badge-bright-purple-fg: #E5E5E5;
+  --color-badge-bright-pink-bg: #B83280;
+  --color-badge-bright-pink-fg: #FFF5F7;
+
+  /* --- Alerts --- */
+  --color-alert-fg: rgba(255, 255, 255, 0.80);
+  --color-alert-bg-info: rgba(255, 255, 255, 0.06);
+  --color-alert-bg-warning: rgba(124, 67, 16, 0.44);
+  --color-alert-bg-warning-table: rgba(123, 52, 30, 0.44);
+  --color-alert-bg-success: #1C4532;
+  --color-alert-bg-error: #63171B;
+
+  /* --- Dialogs / Popovers / Drawers --- */
+  --color-dialog-bg: #171717;
+  --color-dialog-fg: rgba(255, 255, 255, 0.80);
+  --color-popover-bg: #171717;
+  --color-popover-shadow: rgba(255, 255, 255, 0.16);
+  --color-drawer-bg: #171717;
+
+  /* --- Tooltip --- */
+  --color-tooltip-bg: #171717;
+  --color-tooltip-fg: #FFFFFF;
+
+  /* --- Table --- */
+  --color-table-header-bg: rgba(255, 255, 255, 0.08);
+  --color-table-header-fg: rgba(255, 255, 255, 0.64);
+
+  /* --- Tabs --- */
+  --color-tabs-solid-fg: rgba(255, 255, 255, 0.80);
+  --color-tabs-secondary-fg: rgba(255, 255, 255, 0.80);
+  --color-tabs-secondary-border: #525252;
+
+  /* --- Switch --- */
+  --color-switch-bg: rgba(255, 255, 255, 0.24);
+
+  /* --- Skeleton --- */
+  --color-skeleton-start: rgba(255, 255, 255, 0.04);
+  --color-skeleton-end: rgba(255, 255, 255, 0.06);
+
+  /* --- Progress --- */
+  --color-progress-track: rgba(255, 255, 255, 0.06);
+
+  /* --- Stats / Topbar --- */
+  --color-stats-bg: rgba(255, 255, 255, 0.04);
+  --color-topbar-bg: rgba(255, 255, 255, 0.04);
+
+  /* --- Graph --- */
+  --color-graph-line: rgba(255, 255, 255, 0.48);
+  --color-graph-gradient-start: rgba(255, 255, 255, 0.15);
+  --color-graph-gradient-stop: rgba(255, 255, 255, 0);
+
+  /* --- Scrollbar --- */
+  --color-scrollbar-thumb: rgba(255, 255, 255, 0.16);
+
+  /* --- Selection --- */
+  --color-selection-bg: #754B7D;
+
+  /* --- Shadows --- */
+  --shadow-action-bar: 0 4px 4px -4px rgb(0 0 0 / 10%), 0 2px 4px -4px rgb(0 0 0 / 6%);
+  --shadow-popover: 0px 15px 40px 0px rgba(0, 0, 0, 0.4), 0px 5px 10px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+  --shadow-drawer: 0px 15px 40px 0px rgba(0, 0, 0, 0.4), 0px 5px 10px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
+}

package/LICENSE

@@ -1,122 +0,0 @@
-Lux Ecosystem License
-Version 1.2, December 2025
-
-Copyright (c) 2020-2025 Lux Industries Inc.
-All rights reserved.
-
-TECHNOLOGY PORTFOLIO - PATENT APPLICATIONS PLANNED
-Contact: licensing@lux.network
-
-================================================================================
-                          TERMS AND CONDITIONS
-================================================================================
-
-1. DEFINITIONS
-
-   "Lux Primary Network" means the official Lux blockchain with Network ID=1
-   and EVM Chain ID=96369.
-   
-   "Authorized Network" means the Lux Primary Network, official testnets/devnets,
-   and any L1/L2/L3 chain descending from the Lux Primary Network.
-   
-   "Descending Chain" means an L1/L2/L3 chain built on, anchored to, or deriving
-   security from the Lux Primary Network or its authorized testnets.
-   
-   "Research Use" means non-commercial academic research, education, personal
-   study, or evaluation purposes.
-   
-   "Commercial Use" means any use in connection with a product or service
-   offered for sale or fee, internal use by a for-profit entity, or any use
-   to generate revenue.
-
-2. GRANT OF LICENSE
-
-   Subject to these terms, Lux Industries Inc grants you a non-exclusive,
-   royalty-free license to:
-   
-   (a) Use for Research Use without restriction;
-   
-   (b) Operate on the Lux Primary Network (Network ID=1, EVM Chain ID=96369);
-   
-   (c) Operate on official Lux testnets and devnets;
-   
-   (d) Operate L1/L2/L3 chains descending from the Lux Primary Network;
-   
-   (e) Build applications within the Lux ecosystem;
-   
-   (f) Contribute improvements back to the original repositories.
-
-3. RESTRICTIONS
-
-   Without a commercial license from Lux Industries Inc, you may NOT:
-   
-   (a) Fork the Lux Network or any Lux software;
-   
-   (b) Create competing networks not descending from Lux Primary Network;
-   
-   (c) Use for Commercial Use outside the Lux ecosystem;
-   
-   (d) Sublicense or transfer rights outside the Lux ecosystem;
-   
-   (e) Use to create competing blockchain networks, exchanges, custody
-       services, or cryptographic systems outside the Lux ecosystem.
-
-4. NO FORKS POLICY
-
-   Lux Industries Inc maintains ZERO TOLERANCE for unauthorized forks.
-   Any fork or deployment on an unauthorized network constitutes:
-   
-   (a) Breach of this license;
-   (b) Grounds for immediate legal action.
-
-5. RIGHTS RESERVATION
-
-   All rights not explicitly granted are reserved by Lux Industries Inc.
-   
-   We plan to apply for patent protection for the technology in this
-   repository. Any implementation outside the Lux ecosystem may require
-   a separate commercial license.
-
-6. DISCLAIMER OF WARRANTY
-
-   THIS SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
-   EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
-   MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
-
-7. LIMITATION OF LIABILITY
-
-   IN NO EVENT SHALL LUX INDUSTRIES INC BE LIABLE FOR ANY CLAIM, DAMAGES
-   OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
-   ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE.
-
-8. TERMINATION
-
-   This license terminates immediately upon any breach, including but not
-   limited to deployment on unauthorized networks or creation of forks.
-
-9. GOVERNING LAW
-
-   This License shall be governed by the laws of the State of Delaware.
-
-10. COMMERCIAL LICENSING
-
-    For commercial use outside the Lux ecosystem:
-    
-    Lux Industries Inc.
-    Email: licensing@lux.network
-    Subject: Commercial License Request
-
-================================================================================
-                              TL;DR
-================================================================================
-
-- Research/academic use = OK
-- Lux Primary Network (Network ID=1, Chain ID=96369) = OK
-- L1/L2/L3 chains descending from Lux Primary Network = OK
-- Commercial products outside Lux ecosystem = Contact licensing@lux.network
-- Forks = Absolutely not
-
-================================================================================
-
-See LP-0012 for full licensing documentation:
-https://github.com/luxfi/lps/blob/main/LPs/lp-0012-ecosystem-licensing.md

package/README.md

@@ -1,109 +0,0 @@
-# `ui` Package
-
-This package holds a component library and themes that can be used across all apps.
-
-## UI Package Philosophy
-
-The `ui` package contains all low level components that are shared between apps. It should *not* contain components that are specific to any one app or Uniswap business logic. Each component should be guided by the following principles:
-
-- All components should be compatible with all platforms.
-- Wrap as many implementation details as possible, including any direct exports from Tamagui.
-- Export only what’s needed from `ui/src` or another allowlisted path.
-- Only include components that will be used beyond a single feature.
-
-Components that are shared between all applications but encode Uniswap business logic should most likely be placed in the `uniswap` package!
-
-## Icons and Logos
-
-Icons and logos are placed in `ui/src/components/{icons|logos}`. These files are generated from placing the file in `packages/ui/src/assets/icons` or `packages/ui/src/assets/logos/svg` and running the generate command(s):
-
-```bash
-# Generate all icons
-bun ui build:icons
-# Generate any icons that do not yet have an existing TS file
-bun ui build:icons:missing
-```
-
-When adding an SVG, please ensure you replace color references as needed with `currentColor` to ensure the asset respects the color property when used.
-
-Custom icons that take props can be added to the same icons import by adding the file in `packages/ui/src/components/icons/index.ts`.
-
-## Core Components
-
-Many base components are available in the UI library. While some are customized `tamagui` elements or even fully custom elements, many are simple or direct exposure of `tamagui` elements. If you would like to use any `tamagui` elements, please add them through this library to ensure a layer of abstraction between tamagui and our usage when possible.
-
-Below are summaries of the most commonly used elements.
-
-### Flex
-
-The `Flex` component is the core organizational element of the UI library, acting as a base of a flexbox styling approach. Shortcuts are available for `row`, `grow`, `shrink`, `fill`, and `centered`. All other styling props can be added directly as needed.
-
-### Text
-
-The `Text` element is the core element for displaying text through the app. The `variant` prop takes in the text variant from our design system (e.g `heading1`, `body2`, etc.) that is desired. All other text styling props can be added directly as needed.
-
-## Theme and Platform
-
-### Theming
-
-Theming is applied through two primary methods:
-
-1. Any components that take in design systems values (e.g `heading1`, `body2`, etc.) will automatically respect the theme.
-2. In all other cases, `useSporeColors` will return the current theme colors to be used in any component.
-
-To force a specific theme usage, the `Theme` wrapper will ensure other theme elements pick up the specific theme.
-
-```javascript
-<Theme name="dark">
-  ...
-</Theme>
-```
-
-### Screen Size Differences
-
-All breakpoints for both vertical and horizontal sizing have been defined in `packages/ui/src/theme/breakpoints.ts`.
-
-To account for screen size references, components take in props to adapt custom style per breakpoint, like so:
-
-```javascript
-<Flex
-  margin="20"
-  $short={{ margin: 10 }}
->
-  ...
-</Flex>
-```
-
-When components cannot take in these props or a value needs to be resued multiple times, the `useMedia` hook allows these same breakpoint values to be defined programmatically.
-
-### Colors
-
-We've made a hook `useSporeColors()` which gives you access to the current theme, and you can access the values off it as follows:
-
-```tsx
-import { useSporeColors } from 'ui/src'
-
-function MyComponent() {
-  const colors = useSporeColors()
-
-  colors.accent1.val // returns something like #fff
-  colors.accent1.get() // returns a "dynamic" color value
-}
-```
-
-#### When to use `.get()` vs `.val`
-
-After some discussion we've come to prefer `.val` by default. This will always return the raw string color (in our case hex color) on all platforms, whereas `.get()` returns either an Object (iOS) or a string, which can cause issues when used with things like animations, or external components.
-
-Using .val has some performance downside vs .get in that all usages of .val will re-render when themes change, whereas .get will avoid re-renders on iOS and Web by optimizing to platform-specific constructs. On iOS, it optimizes to [DynamicColorIOS](https://reactnative.dev/docs/dynamiccolorios), on web a CSS variable like `var(--accent1)`.
-
-So if/when we notice slowness in our light/dark mode change, we'll want to check if our usages of .val are causing expensive re-renders and see if we can convert them to .get.
-
-In summary:
-
-- Prefer `.val` which always returns the original color string, like `#fff`.
-- Using `.get()` returns a dynamic value depending on the platform and avoids re-rendering when themes change between light and dark. This is nice for fast light/dark mode switching (and in the future if we use sub-themes, it would also avoid re-renders there).
-  - On Android it returns the same as .val, `#fff`
-  - On iOS, it returns an object like `{ dynamic: { light: '#fff', dark: '#000' } }`
-  - On the web, it returns a CSS variable string, `var(--colorName)`
-  - You can call `.get('web')` to only optimize for web, or `.get('ios')` to only optimize for ios.