@tangle-network/sandbox-ui 0.68.0 → 0.70.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/globals.css +28 -26
  2. package/dist/styles.css +28 -26
  3. package/package.json +3 -3
package/dist/globals.css CHANGED
@@ -356,6 +356,9 @@
356
356
  .top-2 {
357
357
  top: calc(var(--spacing) * 2);
358
358
  }
359
+ .top-3\.5 {
360
+ top: calc(var(--spacing) * 3.5);
361
+ }
359
362
  .top-4 {
360
363
  top: calc(var(--spacing) * 4);
361
364
  }
@@ -539,9 +542,6 @@
539
542
  .mt-6 {
540
543
  margin-top: calc(var(--spacing) * 6);
541
544
  }
542
- .mt-px {
543
- margin-top: 1px;
544
- }
545
545
  .mr-1 {
546
546
  margin-right: calc(var(--spacing) * 1);
547
547
  }
@@ -808,6 +808,9 @@
808
808
  .h-\[var\(--timeline-dot-size\)\] {
809
809
  height: var(--timeline-dot-size);
810
810
  }
811
+ .h-\[var\(--timeline-dot-size\,0\.5rem\)\] {
812
+ height: var(--timeline-dot-size,0.5rem);
813
+ }
811
814
  .h-\[var\(--tool-icon-size\)\] {
812
815
  height: var(--tool-icon-size);
813
816
  }
@@ -1132,6 +1135,9 @@
1132
1135
  .w-\[var\(--timeline-dot-size\)\] {
1133
1136
  width: var(--timeline-dot-size);
1134
1137
  }
1138
+ .w-\[var\(--timeline-dot-size\,0\.5rem\)\] {
1139
+ width: var(--timeline-dot-size,0.5rem);
1140
+ }
1135
1141
  .w-\[var\(--tool-icon-size\)\] {
1136
1142
  width: var(--tool-icon-size);
1137
1143
  }
@@ -1610,6 +1616,9 @@
1610
1616
  .gap-x-2 {
1611
1617
  column-gap: calc(var(--spacing) * 2);
1612
1618
  }
1619
+ .gap-x-3 {
1620
+ column-gap: calc(var(--spacing) * 3);
1621
+ }
1613
1622
  .gap-x-4 {
1614
1623
  column-gap: calc(var(--spacing) * 4);
1615
1624
  }
@@ -1686,15 +1695,9 @@
1686
1695
  .rounded-\[22px\] {
1687
1696
  border-radius: 22px;
1688
1697
  }
1689
- .rounded-\[24px\] {
1690
- border-radius: 24px;
1691
- }
1692
1698
  .rounded-\[26px\] {
1693
1699
  border-radius: 26px;
1694
1700
  }
1695
- .rounded-\[28px\] {
1696
- border-radius: 28px;
1697
- }
1698
1701
  .rounded-\[calc\(var\(--radius-xl\)\+2px\)\] {
1699
1702
  border-radius: calc(var(--radius-xl) + 2px);
1700
1703
  }
@@ -2111,6 +2114,9 @@
2111
2114
  .bg-\[var\(--border-hover\)\] {
2112
2115
  background-color: var(--border-hover);
2113
2116
  }
2117
+ .bg-\[var\(--border-subtle\)\] {
2118
+ background-color: var(--border-subtle);
2119
+ }
2114
2120
  .bg-\[var\(--brand-cool\)\] {
2115
2121
  background-color: var(--brand-cool);
2116
2122
  }
@@ -2606,9 +2612,6 @@
2606
2612
  .p-16 {
2607
2613
  padding: calc(var(--spacing) * 16);
2608
2614
  }
2609
- .px-0 {
2610
- padding-inline: calc(var(--spacing) * 0);
2611
- }
2612
2615
  .px-0\.5 {
2613
2616
  padding-inline: calc(var(--spacing) * 0.5);
2614
2617
  }
@@ -2654,9 +2657,6 @@
2654
2657
  .px-\[var\(--tool-card-px\)\] {
2655
2658
  padding-inline: var(--tool-card-px);
2656
2659
  }
2657
- .py-0 {
2658
- padding-block: calc(var(--spacing) * 0);
2659
- }
2660
2660
  .py-0\.5 {
2661
2661
  padding-block: calc(var(--spacing) * 0.5);
2662
2662
  }
@@ -2798,6 +2798,9 @@
2798
2798
  .pl-3\.5 {
2799
2799
  padding-left: calc(var(--spacing) * 3.5);
2800
2800
  }
2801
+ .pl-6 {
2802
+ padding-left: calc(var(--spacing) * 6);
2803
+ }
2801
2804
  .pl-7 {
2802
2805
  padding-left: calc(var(--spacing) * 7);
2803
2806
  }
@@ -3440,10 +3443,6 @@
3440
3443
  --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
3441
3444
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
3442
3445
  }
3443
- .shadow-none {
3444
- --tw-shadow: 0 0 #0000;
3445
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
3446
- }
3447
3446
  .shadow-sm {
3448
3447
  --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
3449
3448
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -4002,6 +4001,16 @@
4002
4001
  }
4003
4002
  }
4004
4003
  }
4004
+ .hover\:bg-\[var\(--surface-container-high\)\]\/40 {
4005
+ &:hover {
4006
+ @media (hover: hover) {
4007
+ background-color: var(--surface-container-high);
4008
+ @supports (color: color-mix(in lab, red, red)) {
4009
+ background-color: color-mix(in oklab, var(--surface-container-high) 40%, transparent);
4010
+ }
4011
+ }
4012
+ }
4013
+ }
4005
4014
  .hover\:bg-\[var\(--surface-danger-bg\)\] {
4006
4015
  &:hover {
4007
4016
  @media (hover: hover) {
@@ -4272,13 +4281,6 @@
4272
4281
  }
4273
4282
  }
4274
4283
  }
4275
- .hover\:bg-transparent {
4276
- &:hover {
4277
- @media (hover: hover) {
4278
- background-color: transparent;
4279
- }
4280
- }
4281
- }
4282
4284
  .hover\:bg-white\/5 {
4283
4285
  &:hover {
4284
4286
  @media (hover: hover) {
package/dist/styles.css CHANGED
@@ -356,6 +356,9 @@
356
356
  .top-2 {
357
357
  top: calc(var(--spacing) * 2);
358
358
  }
359
+ .top-3\.5 {
360
+ top: calc(var(--spacing) * 3.5);
361
+ }
359
362
  .top-4 {
360
363
  top: calc(var(--spacing) * 4);
361
364
  }
@@ -539,9 +542,6 @@
539
542
  .mt-6 {
540
543
  margin-top: calc(var(--spacing) * 6);
541
544
  }
542
- .mt-px {
543
- margin-top: 1px;
544
- }
545
545
  .mr-1 {
546
546
  margin-right: calc(var(--spacing) * 1);
547
547
  }
@@ -808,6 +808,9 @@
808
808
  .h-\[var\(--timeline-dot-size\)\] {
809
809
  height: var(--timeline-dot-size);
810
810
  }
811
+ .h-\[var\(--timeline-dot-size\,0\.5rem\)\] {
812
+ height: var(--timeline-dot-size,0.5rem);
813
+ }
811
814
  .h-\[var\(--tool-icon-size\)\] {
812
815
  height: var(--tool-icon-size);
813
816
  }
@@ -1132,6 +1135,9 @@
1132
1135
  .w-\[var\(--timeline-dot-size\)\] {
1133
1136
  width: var(--timeline-dot-size);
1134
1137
  }
1138
+ .w-\[var\(--timeline-dot-size\,0\.5rem\)\] {
1139
+ width: var(--timeline-dot-size,0.5rem);
1140
+ }
1135
1141
  .w-\[var\(--tool-icon-size\)\] {
1136
1142
  width: var(--tool-icon-size);
1137
1143
  }
@@ -1610,6 +1616,9 @@
1610
1616
  .gap-x-2 {
1611
1617
  column-gap: calc(var(--spacing) * 2);
1612
1618
  }
1619
+ .gap-x-3 {
1620
+ column-gap: calc(var(--spacing) * 3);
1621
+ }
1613
1622
  .gap-x-4 {
1614
1623
  column-gap: calc(var(--spacing) * 4);
1615
1624
  }
@@ -1686,15 +1695,9 @@
1686
1695
  .rounded-\[22px\] {
1687
1696
  border-radius: 22px;
1688
1697
  }
1689
- .rounded-\[24px\] {
1690
- border-radius: 24px;
1691
- }
1692
1698
  .rounded-\[26px\] {
1693
1699
  border-radius: 26px;
1694
1700
  }
1695
- .rounded-\[28px\] {
1696
- border-radius: 28px;
1697
- }
1698
1701
  .rounded-\[calc\(var\(--radius-xl\)\+2px\)\] {
1699
1702
  border-radius: calc(var(--radius-xl) + 2px);
1700
1703
  }
@@ -2111,6 +2114,9 @@
2111
2114
  .bg-\[var\(--border-hover\)\] {
2112
2115
  background-color: var(--border-hover);
2113
2116
  }
2117
+ .bg-\[var\(--border-subtle\)\] {
2118
+ background-color: var(--border-subtle);
2119
+ }
2114
2120
  .bg-\[var\(--brand-cool\)\] {
2115
2121
  background-color: var(--brand-cool);
2116
2122
  }
@@ -2606,9 +2612,6 @@
2606
2612
  .p-16 {
2607
2613
  padding: calc(var(--spacing) * 16);
2608
2614
  }
2609
- .px-0 {
2610
- padding-inline: calc(var(--spacing) * 0);
2611
- }
2612
2615
  .px-0\.5 {
2613
2616
  padding-inline: calc(var(--spacing) * 0.5);
2614
2617
  }
@@ -2654,9 +2657,6 @@
2654
2657
  .px-\[var\(--tool-card-px\)\] {
2655
2658
  padding-inline: var(--tool-card-px);
2656
2659
  }
2657
- .py-0 {
2658
- padding-block: calc(var(--spacing) * 0);
2659
- }
2660
2660
  .py-0\.5 {
2661
2661
  padding-block: calc(var(--spacing) * 0.5);
2662
2662
  }
@@ -2798,6 +2798,9 @@
2798
2798
  .pl-3\.5 {
2799
2799
  padding-left: calc(var(--spacing) * 3.5);
2800
2800
  }
2801
+ .pl-6 {
2802
+ padding-left: calc(var(--spacing) * 6);
2803
+ }
2801
2804
  .pl-7 {
2802
2805
  padding-left: calc(var(--spacing) * 7);
2803
2806
  }
@@ -3440,10 +3443,6 @@
3440
3443
  --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
3441
3444
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
3442
3445
  }
3443
- .shadow-none {
3444
- --tw-shadow: 0 0 #0000;
3445
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
3446
- }
3447
3446
  .shadow-sm {
3448
3447
  --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
3449
3448
  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -4002,6 +4001,16 @@
4002
4001
  }
4003
4002
  }
4004
4003
  }
4004
+ .hover\:bg-\[var\(--surface-container-high\)\]\/40 {
4005
+ &:hover {
4006
+ @media (hover: hover) {
4007
+ background-color: var(--surface-container-high);
4008
+ @supports (color: color-mix(in lab, red, red)) {
4009
+ background-color: color-mix(in oklab, var(--surface-container-high) 40%, transparent);
4010
+ }
4011
+ }
4012
+ }
4013
+ }
4005
4014
  .hover\:bg-\[var\(--surface-danger-bg\)\] {
4006
4015
  &:hover {
4007
4016
  @media (hover: hover) {
@@ -4272,13 +4281,6 @@
4272
4281
  }
4273
4282
  }
4274
4283
  }
4275
- .hover\:bg-transparent {
4276
- &:hover {
4277
- @media (hover: hover) {
4278
- background-color: transparent;
4279
- }
4280
- }
4281
- }
4282
4284
  .hover\:bg-white\/5 {
4283
4285
  &:hover {
4284
4286
  @media (hover: hover) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tangle-network/sandbox-ui",
3
- "version": "0.68.0",
3
+ "version": "0.70.0",
4
4
  "description": "Unified UI component library for Tangle Sandbox — primitives, chat, dashboard, terminal, editor, and workspace components",
5
5
  "repository": {
6
6
  "type": "git",
@@ -124,7 +124,7 @@
124
124
  "peerDependencies": {
125
125
  "@tangle-network/agent-interface": ">=0.17.0 <1.0.0",
126
126
  "@tangle-network/brand": "^0.8.0",
127
- "@tangle-network/ui": "^8.0.0",
127
+ "@tangle-network/ui": "^9.0.0",
128
128
  "@xyflow/react": "^12.0.0",
129
129
  "react": "^18 || ^19",
130
130
  "react-dom": "^18 || ^19"
@@ -179,7 +179,7 @@
179
179
  "@tailwindcss/vite": "^4.2.2",
180
180
  "@tangle-network/agent-interface": ">=0.17.0 <1.0.0",
181
181
  "@tangle-network/brand": "^0.8.0",
182
- "@tangle-network/ui": "^8.0.0",
182
+ "@tangle-network/ui": "^9.0.0",
183
183
  "@tanstack/react-query": "^5.91.0",
184
184
  "@testing-library/dom": "^10.4.1",
185
185
  "@testing-library/jest-dom": "^6.9.1",