@tensor_1/tokens 2.29.0 → 2.30.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.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tensor_1/tokens",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.30.0",
|
|
4
4
|
"description": "UIx v2 design tokens — the --uix-* contract for house products (Tensor, POSx, SHOPx). One DTCG source -> CSS variables, Tailwind theme, and typed TS constants.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": [
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
@layer uix.components {
|
|
2
2
|
.uix-scheduling-calendar { display:grid; gap:var(--uix-space-3); color:var(--uix-text); }
|
|
3
3
|
.uix-scheduling-calendar__header { display:flex; align-items:center; justify-content:space-between; gap:var(--uix-space-3); flex-wrap:wrap; }
|
|
4
|
-
|
|
4
|
+
/* position:relative makes the scroller the containing block, so visually hidden text in a day (entry states, badge words) is clipped with it instead of widening the page */
|
|
5
|
+
.uix-scheduling-calendar__grid { position:relative; display:grid; grid-template-columns:repeat(7,minmax(6.5rem,1fr)); border-top:1px solid var(--uix-border); border-left:1px solid var(--uix-border); overflow:auto; }
|
|
5
6
|
.uix-scheduling-calendar__day { min-height:8rem; padding:var(--uix-space-2); border-right:1px solid var(--uix-border); border-bottom:1px solid var(--uix-border); background:var(--uix-surface); }
|
|
6
7
|
.uix-scheduling-calendar__day[data-outside] { background:var(--uix-bg-subtle); color:var(--uix-text-muted); }
|
|
7
8
|
.uix-scheduling-calendar__weekday { padding:var(--uix-space-1) var(--uix-space-2); border-right:1px solid var(--uix-border); border-bottom:1px solid var(--uix-border); background:var(--uix-bg-subtle); color:var(--uix-text-muted); font-size:var(--uix-text-meta); font-weight:600; text-align:right; }
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/* uix scheduling timeline (React `SchedulingTimeline`, HAR-1364) — lanes of bars on a time
|
|
2
|
+
axis. Depends only on --uix-* tokens. The lane label column is sticky; the axis scrolls. */
|
|
3
|
+
@layer uix.components {
|
|
4
|
+
.uix-scheduling-timeline { display: grid; gap: var(--uix-space-3); color: var(--uix-text); min-width: 0; }
|
|
5
|
+
.uix-scheduling-timeline__scroller { position: relative; overflow-x: auto; border: 1px solid var(--uix-border); border-radius: var(--uix-radius-md); background: var(--uix-surface); }
|
|
6
|
+
.uix-scheduling-timeline__grid { display: grid; width: max-content; min-width: 100%; }
|
|
7
|
+
.uix-scheduling-timeline__row { display: flex; border-bottom: 1px solid var(--uix-border); }
|
|
8
|
+
.uix-scheduling-timeline__row:last-child { border-bottom: 0; }
|
|
9
|
+
.uix-scheduling-timeline__lane-label {
|
|
10
|
+
position: sticky; left: 0; z-index: var(--uix-z-sticky); flex: 0 0 clamp(7.5rem, 30vw, 12rem); display: grid; align-content: center; gap: var(--uix-space-1);
|
|
11
|
+
padding: var(--uix-space-2) var(--uix-space-3); border-right: 1px solid var(--uix-border); background: var(--uix-surface); min-width: 0;
|
|
12
|
+
}
|
|
13
|
+
.uix-scheduling-timeline__row--axis .uix-scheduling-timeline__lane-label { background: var(--uix-bg-subtle); color: var(--uix-text-muted); font-size: var(--uix-text-meta); font-weight: 600; }
|
|
14
|
+
.uix-scheduling-timeline__lane-name { font-weight: 500; overflow-wrap: break-word; hyphens: auto; }
|
|
15
|
+
.uix-scheduling-timeline__lane-meta { font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
|
|
16
|
+
.uix-scheduling-timeline__track { position: relative; flex: 1 0 auto; min-height: calc(var(--uix-timeline-rows, 1) * 2.25rem + 2 * var(--uix-space-2)); }
|
|
17
|
+
.uix-scheduling-timeline__axis { min-height: 2.25rem; background: var(--uix-bg-subtle); }
|
|
18
|
+
.uix-scheduling-timeline__tick { position: absolute; top: 0; bottom: 0; border-left: 1px solid var(--uix-border); }
|
|
19
|
+
.uix-scheduling-timeline__tick[data-major] { border-left-color: var(--uix-border-strong); }
|
|
20
|
+
.uix-scheduling-timeline__tick-label { position: absolute; top: 50%; left: var(--uix-space-1); transform: translateY(-50%); white-space: nowrap; font-size: var(--uix-text-meta); color: var(--uix-text-muted); }
|
|
21
|
+
.uix-scheduling-timeline__tick[data-major] .uix-scheduling-timeline__tick-label { color: var(--uix-text); font-weight: 600; }
|
|
22
|
+
.uix-scheduling-timeline__gridline { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--uix-border); }
|
|
23
|
+
.uix-scheduling-timeline__gridline[data-major] { background: var(--uix-border-strong); }
|
|
24
|
+
.uix-scheduling-timeline__overlay { position: absolute; top: 0; bottom: 0; background: var(--uix-info-bg); }
|
|
25
|
+
.uix-scheduling-timeline__overlay[data-kind="freeze"],
|
|
26
|
+
.uix-scheduling-timeline__overlay[data-kind="blackout"] { background: var(--uix-danger-bg); border-inline: 1px dashed var(--uix-danger-border); }
|
|
27
|
+
.uix-scheduling-timeline__overlay-label { position: absolute; top: var(--uix-space-1); left: var(--uix-space-1); right: var(--uix-space-1); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--uix-text-eyebrow); letter-spacing: var(--uix-tracking-eyebrow); text-transform: uppercase; color: var(--uix-text); }
|
|
28
|
+
.uix-scheduling-timeline__now { position: absolute; top: 0; bottom: 0; z-index: var(--uix-z-raised); width: 2px; transform: translateX(-50%); background: var(--uix-danger); }
|
|
29
|
+
.uix-scheduling-timeline__now-label { position: absolute; top: 0; left: var(--uix-space-1); padding: 0 var(--uix-space-1); border-radius: var(--uix-radius-xs); background: var(--uix-danger); color: var(--uix-danger-fg); font-size: var(--uix-text-eyebrow); white-space: nowrap; }
|
|
30
|
+
.uix-scheduling-timeline__marker { position: absolute; top: 0; bottom: 0; z-index: var(--uix-z-raised); border-left: 2px dashed var(--uix-warning); }
|
|
31
|
+
.uix-scheduling-timeline__items { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
|
|
32
|
+
.uix-scheduling-timeline__slot { position: absolute; top: calc(var(--uix-space-2) + var(--uix-timeline-row, 0) * 2.25rem); height: 2rem; min-width: 0.5rem; }
|
|
33
|
+
.uix-scheduling-timeline__item {
|
|
34
|
+
display: flex; align-items: center; gap: var(--uix-space-2); width: 100%; height: 100%; padding: 0 var(--uix-space-2); overflow: hidden;
|
|
35
|
+
border: 0; border-left: 3px solid var(--uix-info); border-radius: var(--uix-radius-sm); background: var(--uix-info-bg); color: var(--uix-info-text);
|
|
36
|
+
font: inherit; font-size: var(--uix-text-meta); text-align: start; white-space: nowrap; cursor: pointer;
|
|
37
|
+
}
|
|
38
|
+
.uix-scheduling-timeline__item-title { overflow: hidden; text-overflow: ellipsis; font-weight: 600; }
|
|
39
|
+
.uix-scheduling-timeline__item-meta { overflow: hidden; text-overflow: ellipsis; opacity: .85; }
|
|
40
|
+
.uix-scheduling-timeline__item[data-state="conflicted"], .uix-scheduling-timeline__item[data-state="blackout-violation"] { border-color: var(--uix-danger); background: var(--uix-danger-bg); color: var(--uix-danger-text); }
|
|
41
|
+
.uix-scheduling-timeline__item[data-state="in-progress"] { border-color: var(--uix-success); background: var(--uix-success-bg); color: var(--uix-text); }
|
|
42
|
+
/* overlap with another bar in the lane: hatched, so it reads without colour */
|
|
43
|
+
.uix-scheduling-timeline__item[data-conflict] { background-image: repeating-linear-gradient(135deg, transparent 0 6px, color-mix(in srgb, currentColor 20%, transparent) 6px 9px); }
|
|
44
|
+
.uix-scheduling-timeline__item[data-clipped-start] { border-top-left-radius: 0; border-bottom-left-radius: 0; border-left-style: dashed; }
|
|
45
|
+
.uix-scheduling-timeline__item[data-clipped-end] { border-top-right-radius: 0; border-bottom-right-radius: 0; }
|
|
46
|
+
.uix-scheduling-timeline__item[data-movable] { cursor: grab; touch-action: none; }
|
|
47
|
+
.uix-scheduling-timeline__item[data-dragging] { cursor: grabbing; box-shadow: var(--uix-shadow-popover); position: relative; z-index: var(--uix-z-raised); }
|
|
48
|
+
.uix-scheduling-timeline__item:focus-visible { outline: 2px solid var(--uix-ring); outline-offset: 2px; position: relative; z-index: var(--uix-z-raised); }
|
|
49
|
+
.uix-scheduling-timeline__empty { margin: 0; color: var(--uix-text-muted); font-size: var(--uix-text-meta); }
|
|
50
|
+
.uix-scheduling-timeline__state { padding: var(--uix-space-8); border: 1px dashed var(--uix-border-strong); border-radius: var(--uix-radius-lg); text-align: center; }
|
|
51
|
+
}
|