@things-factory/shell 10.0.19 → 10.1.1

package/client/themes/tooltip-theme.css

@@ -1,7 +1,29 @@
+/*
+ * 툴팁 — 화면 위에 잠깐 떠 있는 것.
+ *
+ * ── 반전 면을 쓴다 ─────────────────────────────────────────────────────────
+ * 툴팁은 화면과 같은 면이 아니다. 표나 카드와 같은 밝은 면에 두면 어디까지가 툴팁인지 안 보인다.
+ * 그래서 어두운 면에 밝은 글자다.
+ *
+ * 색을 직접 적지 않고 Material 의 반전 면에서 가져온다 — 그 값이 밝은 모드와 어두운 모드에서 함께
+ * 뒤집힌다. 직접 적으면 어두운 모드에서 어두운 배경에 어두운 툴팁이 된다.
+ *
+ *   --md-sys-color-inverse-surface       밝은 모드에서 rgb(43 49 56)
+ *   --md-sys-color-inverse-on-surface    그 위의 글자 rgb(236 239 242)
+ *
+ * ── 전에 무엇이었나 ────────────────────────────────────────────────────────
+ * `rgba(0, 0, 0, 0.7)` 검정 반투명 · 여백 4px · `bold 11px`. 앱의 색을 하나도 보지 않아서 화면이 어떤
+ * 테마를 쓰든 툴팁만 브라우저 기본처럼 보였다. 굵은 글씨도 어울리지 않는다 — 툴팁은 값이 아니라 값을
+ * 거드는 말이라 조용해야 한다.
+ *
+ * 글자 크기는 본문보다 한 단 작게 두고 굵기는 보통이다. 크기·여백·둥글기는 부품이 기본을 갖고 있어
+ * (`tooltip-reactive-controller.ts`) 여기서는 색과 글꼴만 정한다.
+ */
 body {
-  --tooltip-padding: 4px 4px 4px 4px;
-  --tooltip-background-color: rgba(0, 0, 0, 0.7);
-  --tooltip-font: bold 11px var(--theme-font);
-  /* 
-  */
+  --tooltip-background-color: var(--md-sys-color-inverse-surface, rgba(23, 36, 44, 0.94));
+  --tooltip-color: var(--md-sys-color-inverse-on-surface, #ffffff);
+  --tooltip-font-family: var(--theme-font);
+  --tooltip-font-size: 12px;
+  --tooltip-font-weight: 400;
+  --tooltip-padding: 6px 8px;
 }

package/client/themes/ui-tokens.css

@@ -10,8 +10,11 @@
  * 페이지는 `--ui-panel`(카드가 놓이는 면) 처럼 **무엇인지**로 고른다.
  *
  * ── 글자 눈금 ───────────────────────────────────────────────────────────────
- * 눈금을 정하지 않으면 페이지마다 0.72 / 0.78 / 0.83 / 0.88rem 같은 값이 생긴다(operato-mes 한
- * 파일에 아홉 가지가 있었다). 크기가 아홉이면 위계가 없는 것과 같다. 다섯이면 충분하다.
+ * 눈금을 정하지 않으면 페이지마다 0.72 / 0.78 / 0.83 / 0.88rem 같은 값이 생긴다(operato-plant 한
+ * 파일에 아홉 가지가 있었다). 크기가 아홉이면 위계가 없는 것과 같다.
+ *
+ * 단을 늘릴 때는 **역할이 새로 생겼을 때만** 늘린다 — 「14.5px 도 필요하다」는 늘릴 이유가 아니다.
+ * 눈금의 값은 고를 수 있는 것이 적다는 데 있다.
  *
  * ── 이 파일 이름 ────────────────────────────────────────────────────────────
  * 테마 파일은 같은 이름이면 파일 단위로 대체된다(builder 의 ThemeOverridePlugin). `ui-tokens.css`
@@ -26,6 +29,14 @@ body {
   --ui-bg: var(--md-sys-color-surface);
   /** 카드·표·패널이 놓이는 면. 바탕보다 한 단계 앞이다. */
   --ui-panel: var(--md-sys-color-surface-container-lowest);
+  /**
+   * 같은 면 안에서 한 단 구분되는 띠 — 구역 머리, 표 머리, 접히는 절의 손잡이.
+   *
+   * 이것이 없어서 화면들이 `--ui-surface-2` 같은 없는 이름에 `#f3f6f7` 폴백을 달아 썼다. 없는
+   * 이름은 야간 모드에서 폴백이 그대로 나온다 — **밝은 띠에 밝은 글자**가 되어 글이 사라진다
+   * (검사 명세의 「판단 기준」 머리. 2026-09-05 실측: 대비 1.05:1).
+   */
+  --ui-panel-2: var(--md-sys-color-surface-container);
   /** 면의 테두리. 회색으로 채우는 대신 이 선으로 구분한다. */
   --ui-line: var(--md-sys-color-outline-variant);
   /** 같은 면 안에서 행을 나누는 선. 테두리보다 흐리다. */
@@ -36,25 +47,82 @@ body {
   --ui-ink: var(--md-sys-color-on-surface);
   /** 라벨·보조 설명. */
   --ui-muted: var(--md-sys-color-on-surface-variant);
-  /** 곁말·단위·시각처럼 있어도 그만인 글자. */
-  --ui-faint: var(--md-sys-color-outline);
+  /**
+   * 곁말·단위·시각처럼 있어도 그만인 글자.
+   *
+   * ── outline 을 그대로 쓰면 안 읽힌다 (2026-09-05) ──────────────────────
+   * md 의 outline 은 **선을 그으라고** 있는 색이다. 글자에 쓰면 어두운 화면에서 3.42:1 밖에
+   * 안 나온다(실측: 성숙도 화면의 표준 이름 · 「선언」·「구현」 라벨, 11.8px). 표의 쪽 넘김
+   * 화살표는 2.35:1 이었다.
+   *
+   * 곁말이라도 글자는 글자다. 본문색을 바탕에 섞어 **AA(4.5:1)를 넘기는 자리**로 옮긴다.
+   *
+   * 60% 로 두었다가 65% 로 올렸다. 60% 를 고를 때 밝은 바탕을 흰색으로 잡았는데 이 제품의 밝은
+   * 바탕은 #f0f2f4 다 — 실제로 재니 4.38:1 로 아슬하게 모자랐다(성숙도 화면의 「담당자가 확인」).
+   * 65% 면 밝은 화면 5.0 · 어두운 화면 6.2 이고, 본문(--ui-ink)·라벨(--ui-muted)과의 단계는
+   * 그대로 남는다.
+   */
+  --ui-faint: color-mix(in srgb, var(--md-sys-color-on-surface) 65%, var(--md-sys-color-surface));
 
   /* ── 강조·상태 ───────────────────────────────────────────────────────── */
   --ui-accent: var(--md-sys-color-primary);
+  /** 강조색 위에 얹는 글자·아이콘. 강조색을 칠했으면 글자색은 반드시 이것이다. */
+  --ui-on-accent: var(--md-sys-color-on-primary);
+  /**
+   * 위험색 위에 얹는 글자.
+   *
+   * 흰색을 박아 두면 야간 모드에서 못 읽는다 — 어두운 팔레트의 error 는 밝은 살구색
+   * (rgb 255 138 124)이라 흰 글자와의 대비가 2.28:1 이다. 현장의 「폐기」 단추가 그랬다.
+   */
+  --ui-on-crit: var(--md-sys-color-on-error);
   /** 강조색을 아주 옅게 깐 면 — 마우스를 올린 행, 선택된 칩. */
   --ui-accent-wash: color-mix(in srgb, var(--md-sys-color-primary) 8%, transparent);
+
+  /* ── 손이 닿은 자리 ──────────────────────────────────────────────────── */
+  /*
+   * 누를 수 있는 것 위에 얹는 엷은 막이다. **색이 아니라 글자색을 섞는다** — 그래야 밝은 화면에서는
+   * 어둡게, 어두운 화면에서는 밝게 깔린다. 화면들이 `rgba(0,0,0,0.05)` 를 폴백으로 달아 쓰던 자리라,
+   * 야간 모드에서 검은 막이 검은 면에 얹혀 아무 일도 일어나지 않았다.
+   *
+   * 8% · 12% 는 Material 의 state layer 값이다.
+   */
+  --ui-hover: color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent);
+  --ui-active: color-mix(in srgb, var(--md-sys-color-on-surface) 12%, transparent);
   /* 상태 의미색은 state-color.css 가 정본이다. 여기서는 짧은 이름만 잇는다. */
   --ui-good: var(--status-success-color);
   --ui-warn: var(--status-warning-color);
   --ui-crit: var(--status-danger-color);
+  /*
+   * 알림 — 「지금 다른 사람의 판단을 기다리는 중」처럼 좋지도 나쁘지도 않은 상태.
+   *
+   * 셋만 있을 때는 이런 상태에 warn 을 쓰거나 각 화면이 자기 파랑을 골랐다. worklist 의 상태
+   * ribbon 이 후자였다 — 제출됨 #428df3 · 상위승인중 #595de5 · 위임됨 #8654b0 이 하드코딩되어
+   * 있었고 앱 팔레트를 따르지 않았다.
+   */
+  --ui-info: var(--status-info-color);
 
   /* ── 글꼴 ────────────────────────────────────────────────────────────── */
   /* 숫자·식별자·시각에 쓴다. 자릿수가 흔들리지 않아 값으로 읽힌다. */
   --ui-mono: ui-monospace, 'SF Mono', 'JetBrains Mono', Menlo, Consolas, monospace;
 
-  /* ── 글자 크기 다섯 ──────────────────────────────────────────────────── */
+  /* ── 글자 크기 ───────────────────────────────────────────────────────── */
   /** 화면에서 가장 큰 수 하나(지표 값). */
   --ui-t-hero: 26px;
+  /**
+   * **화면이 자기 제목을 그릴 때.**
+   *
+   * ── 왜 단이 하나 더 필요한가 (2026-09-06) ──────────────────────────────
+   * 나머지 다섯은 본문 계열이다(지표 값 · 구역 제목 · 본문 · 보조 · 라벨). 「화면 제목」은 그
+   * 계열에 없다.
+   *
+   * 대부분의 화면은 이 단이 필요 없다 — shell 제목줄(16px)이 제목을 갖는다. 필요한 것은 **자기
+   * frame 을 가진 화면**이다. twin console 이 그렇고, 그래서 그 화면 21곳이 18px 을 각자 적고
+   * 있었다. 어긋난 것이 아니라 이름이 없었다.
+   *
+   * `--ui-t-hero`(26px)로 대신하지 않는다. 그것은 「가장 큰 수 하나」의 자리이고 실제로 그렇게
+   * 쓰이고 있다(설비 OEE 지표 · 숫자패드). 제목이 그 이름을 빌리면 지표 값이 갈 곳을 잃는다.
+   */
+  --ui-t-page: 18px;
   /** 구역 제목. */
   --ui-t-title: 15px;
   /** 본문·표의 칸. */
@@ -109,3 +177,15 @@ body {
    */
   --ui-measure: min(1080px, 100%);
 }
+
+/*
+ * ── 글자색의 바닥 (2026-09-05) ──────────────────────────────────────────────
+ * body 에 color 가 없었다. 자기 색을 정하지 않은 부품은 브라우저 기본값인 **검정**으로 그려지고,
+ * 밝은 화면에서는 티가 나지 않다가 어두운 화면에서 사라진다.
+ *
+ * [재봤음] 2026-09-05 · 작업지시 화면(야간) 「레시피 전체」 체크상자 — 검정 글자, 대비 1.18:1.
+ * 부품 하나를 고치는 대신 바닥을 깐다. 자기 색을 정한 부품은 그대로 이긴다.
+ */
+body {
+  color: var(--ui-ink);
+}

package/dist-server/index.d.ts

@@ -8,6 +8,7 @@ export * from './middlewares/index.js';
 export * from './bootstrap-hooks.js';
 export * from './graphql-local-client.js';
 export * from './service/index.js';
+export * from './typeorm/long-text-column.js';
 export * from './typeorm/encrypt-transform.js';
 export * from './typeorm/encrypt-json-transform.js';
 export * from './typeorm/json5-transform.js';

package/dist-server/index.js

@@ -11,6 +11,7 @@ tslib_1.__exportStar(require("./middlewares/index.js"), exports);
 tslib_1.__exportStar(require("./bootstrap-hooks.js"), exports);
 tslib_1.__exportStar(require("./graphql-local-client.js"), exports);
 tslib_1.__exportStar(require("./service/index.js"), exports);
+tslib_1.__exportStar(require("./typeorm/long-text-column.js"), exports);
 tslib_1.__exportStar(require("./typeorm/encrypt-transform.js"), exports);
 tslib_1.__exportStar(require("./typeorm/encrypt-json-transform.js"), exports);
 tslib_1.__exportStar(require("./typeorm/json5-transform.js"), exports);

package/dist-server/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../server/index.ts"],"names":[],"mappings":";;;AAAA,gEAAqC;AACrC,4EAAiD;AACjD,qEAA0C;AAC1C,2DAAgC;AAChC,sDAA2B;AAC3B,oEAAyC;AACzC,iEAAsC;AACtC,+DAAoC;AACpC,oEAAyC;AACzC,6DAAkC;AAElC,yEAA8C;AAC9C,8EAAmD;AACnD,uEAA4C;AAC5C,uEAA4C","sourcesContent":["export * from './migrations/index.js'\nexport * from './initializers/naming-strategy.js'\nexport * from './initializers/database.js'\nexport * from './utils/index.js'\nexport * from './pubsub.js'\nexport * from './pubsub-log-transport.js'\nexport * from './middlewares/index.js'\nexport * from './bootstrap-hooks.js'\nexport * from './graphql-local-client.js'\nexport * from './service/index.js'\n\nexport * from './typeorm/encrypt-transform.js'\nexport * from './typeorm/encrypt-json-transform.js'\nexport * from './typeorm/json5-transform.js'\nexport * from './typeorm/round-transform.js'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../server/index.ts"],"names":[],"mappings":";;;AAAA,gEAAqC;AACrC,4EAAiD;AACjD,qEAA0C;AAC1C,2DAAgC;AAChC,sDAA2B;AAC3B,oEAAyC;AACzC,iEAAsC;AACtC,+DAAoC;AACpC,oEAAyC;AACzC,6DAAkC;AAElC,wEAA6C;AAC7C,yEAA8C;AAC9C,8EAAmD;AACnD,uEAA4C;AAC5C,uEAA4C","sourcesContent":["export * from './migrations/index.js'\nexport * from './initializers/naming-strategy.js'\nexport * from './initializers/database.js'\nexport * from './utils/index.js'\nexport * from './pubsub.js'\nexport * from './pubsub-log-transport.js'\nexport * from './middlewares/index.js'\nexport * from './bootstrap-hooks.js'\nexport * from './graphql-local-client.js'\nexport * from './service/index.js'\n\nexport * from './typeorm/long-text-column.js'\nexport * from './typeorm/encrypt-transform.js'\nexport * from './typeorm/encrypt-json-transform.js'\nexport * from './typeorm/json5-transform.js'\nexport * from './typeorm/round-transform.js'\n"]}