@things-factory/board-ui 10.1.258 → 10.1.260

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.
@@ -1,4 +1,5 @@
1
1
  import { css } from 'lit';
2
+ import { MaterialDangerButtonStyles } from '@operato/styles';
2
3
  /**
3
4
  * The frame the three info dialogs share - board, group, play group.
4
5
  *
@@ -194,12 +195,6 @@ export const InfoFormStyles = css `
194
195
  flex: 1;
195
196
  }
196
197
 
197
- /* The irreversible action is a quiet text button on the far left, in the error colour. */
198
- md-text-button[danger] {
199
- --md-text-button-label-text-color: var(--md-sys-color-error);
200
- --md-text-button-icon-color: var(--md-sys-color-error);
201
- --md-text-button-hover-label-text-color: var(--md-sys-color-error);
202
- --md-text-button-hover-state-layer-color: var(--md-sys-color-error);
203
- }
198
+ ${MaterialDangerButtonStyles}
204
199
  `;
205
200
  //# sourceMappingURL=info-dialog-styles.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"info-dialog-styles.js","sourceRoot":"","sources":["../../client/viewparts/info-dialog-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqDlC,CAAA;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmIhC,CAAA","sourcesContent":["import { css } from 'lit'\n\n/**\n * The frame the three info dialogs share - board, group, play group.\n *\n * They open through openPopup (a centered card with its own title bar and close button), so this\n * owns only what is inside the card: an optional tab strip and a scrolling body. The tabs are the\n * underline kind the page title bar uses, not filled blocks - a filled tab strip inside a card\n * reads as a second header fighting the card's own.\n *\n * Height follows the card. A small card (the group forms) is content-sized; a medium card (board)\n * is viewport-sized, and the body scrolls inside it. Both work because the host takes 100% and\n * the body is the one flex child allowed to shrink.\n */\nexport const InfoDialogStyles = css`\n :host {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n box-sizing: border-box;\n /* One surface for every dialog; the theme sets --info-dialog-surface per scheme. */\n background-color: var(--info-dialog-surface, var(--md-sys-color-surface-container-lowest, var(--md-sys-color-surface)));\n color: var(--md-sys-color-on-surface);\n }\n\n [tab] {\n flex: none;\n display: flex;\n gap: var(--spacing-large, 16px);\n padding: 0 var(--spacing-large, 16px);\n border-bottom: 1px solid var(--md-sys-color-outline-variant);\n }\n\n [tab] > span {\n padding: 10px 2px 8px;\n font-size: 0.78rem;\n font-weight: 500;\n letter-spacing: 0.03em;\n text-transform: uppercase;\n color: var(--md-sys-color-on-surface-variant);\n border-bottom: 2px solid transparent;\n cursor: pointer;\n user-select: none;\n }\n\n [tab] > span:hover {\n color: var(--md-sys-color-on-surface);\n }\n\n [tab] > span[active] {\n color: var(--md-sys-color-on-surface);\n border-bottom-color: var(--md-sys-color-primary);\n }\n\n [content] {\n flex: 1;\n min-height: 0;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n [content] > * {\n flex: 1;\n min-height: 0;\n }\n`\n\n/**\n * The one form vocabulary the group and play-group dialogs use on top of CommonPopupStyles:\n * a stack of fields, a quiet provenance line, and the action row. Kept next to the frame so the\n * two forms cannot drift apart again (they had: same form, two sets of margins and button kinds).\n */\nexport const InfoFormStyles = css`\n :host {\n --popup-min-width: 0;\n background: var(--info-dialog-surface, var(--ui-bg, #ffffff));\n }\n\n .fields {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-medium, 8px);\n }\n\n /*\n * Inputs lighter than Material's filled field: a label over a thin-bordered box, the way the\n * suite's own create-domain popup draws them. The filled field's grey slab and underline made a\n * two-field dialog look heavier than the page behind it.\n */\n .fields label {\n display: flex;\n flex-direction: column;\n gap: 4px;\n font-size: var(--popup-font-size-small);\n color: var(--md-sys-color-on-surface-variant);\n /* Translations arrive in mixed case (\"Name\", \"description\"); one case for one form. */\n text-transform: capitalize;\n }\n\n .fields label > input,\n .fields label > textarea,\n .fields label > select {\n text-transform: none;\n }\n\n /* A button whose label comes from a lower-case translation (\"save\") says so with [cap]; labels\n * written in sentence case here (\"Open in modeller\") are left alone. */\n md-filled-button[cap],\n md-outlined-button[cap],\n md-text-button[cap] {\n text-transform: capitalize;\n }\n\n .fields input,\n .fields textarea,\n .fields select {\n box-sizing: border-box;\n width: 100%;\n padding: 8px 10px;\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: var(--md-sys-shape-corner-small, 6px);\n background-color: var(--md-sys-color-surface);\n color: var(--md-sys-color-on-surface);\n font: inherit;\n font-size: var(--popup-font-size);\n }\n\n .fields input:focus,\n .fields textarea:focus,\n .fields select:focus {\n outline: none;\n border-color: var(--md-sys-color-primary);\n box-shadow: 0 0 0 2px color-mix(in srgb, var(--md-sys-color-primary) 18%, transparent);\n }\n\n /* A section's name: small caps in the muted tone, never a heading competing with the title bar. */\n .section {\n margin-top: var(--spacing-medium, 8px);\n font-size: 0.7rem;\n font-weight: 600;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: var(--md-sys-color-on-surface-variant);\n }\n\n /* Read-only value with a copy affordance beside it (a link, an id). */\n .copyable {\n display: flex;\n align-items: center;\n gap: var(--spacing-small, 4px);\n }\n\n .copyable input {\n flex: 1;\n min-width: 0;\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 0.76rem;\n color: var(--md-sys-color-on-surface-variant);\n background: var(--md-sys-color-surface-container-low);\n }\n\n .copyable md-icon-button {\n --md-icon-button-icon-color: var(--md-sys-color-on-surface-variant);\n --md-icon-button-icon-size: 18px;\n }\n\n /* Who made it and when - a side note under the fields, never a row of its own with icons. */\n .provenance {\n display: flex;\n flex-wrap: wrap;\n gap: 2px var(--spacing-large, 16px);\n color: var(--md-sys-color-on-surface-variant);\n font-size: var(--popup-font-size-small);\n line-height: var(--popup-line-height);\n }\n\n .provenance b {\n font-weight: 500;\n color: var(--md-sys-color-on-surface);\n }\n\n /*\n * A tool row inside a dialog's body or footer - a menu, a copy-link button, an import option. It is\n * not the dialog's closing command row, which is <ox-popup-actions>; it only lines its tools up.\n */\n [tools] {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n gap: var(--spacing-small, 4px);\n }\n\n [tools] [filler] {\n flex: 1;\n }\n\n /* The irreversible action is a quiet text button on the far left, in the error colour. */\n md-text-button[danger] {\n --md-text-button-label-text-color: var(--md-sys-color-error);\n --md-text-button-icon-color: var(--md-sys-color-error);\n --md-text-button-hover-label-text-color: var(--md-sys-color-error);\n --md-text-button-hover-state-layer-color: var(--md-sys-color-error);\n }\n`\n"]}
1
+ {"version":3,"file":"info-dialog-styles.js","sourceRoot":"","sources":["../../client/viewparts/info-dialog-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AACzB,OAAO,EAAE,0BAA0B,EAAE,MAAM,iBAAiB,CAAA;AAE5D;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqDlC,CAAA;AAED;;;;GAIG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4H7B,0BAA0B;CAC7B,CAAA","sourcesContent":["import { css } from 'lit'\nimport { MaterialDangerButtonStyles } from '@operato/styles'\n\n/**\n * The frame the three info dialogs share - board, group, play group.\n *\n * They open through openPopup (a centered card with its own title bar and close button), so this\n * owns only what is inside the card: an optional tab strip and a scrolling body. The tabs are the\n * underline kind the page title bar uses, not filled blocks - a filled tab strip inside a card\n * reads as a second header fighting the card's own.\n *\n * Height follows the card. A small card (the group forms) is content-sized; a medium card (board)\n * is viewport-sized, and the body scrolls inside it. Both work because the host takes 100% and\n * the body is the one flex child allowed to shrink.\n */\nexport const InfoDialogStyles = css`\n :host {\n display: flex;\n flex-direction: column;\n height: 100%;\n min-height: 0;\n box-sizing: border-box;\n /* One surface for every dialog; the theme sets --info-dialog-surface per scheme. */\n background-color: var(--info-dialog-surface, var(--md-sys-color-surface-container-lowest, var(--md-sys-color-surface)));\n color: var(--md-sys-color-on-surface);\n }\n\n [tab] {\n flex: none;\n display: flex;\n gap: var(--spacing-large, 16px);\n padding: 0 var(--spacing-large, 16px);\n border-bottom: 1px solid var(--md-sys-color-outline-variant);\n }\n\n [tab] > span {\n padding: 10px 2px 8px;\n font-size: 0.78rem;\n font-weight: 500;\n letter-spacing: 0.03em;\n text-transform: uppercase;\n color: var(--md-sys-color-on-surface-variant);\n border-bottom: 2px solid transparent;\n cursor: pointer;\n user-select: none;\n }\n\n [tab] > span:hover {\n color: var(--md-sys-color-on-surface);\n }\n\n [tab] > span[active] {\n color: var(--md-sys-color-on-surface);\n border-bottom-color: var(--md-sys-color-primary);\n }\n\n [content] {\n flex: 1;\n min-height: 0;\n display: flex;\n flex-direction: column;\n overflow-y: auto;\n }\n\n [content] > * {\n flex: 1;\n min-height: 0;\n }\n`\n\n/**\n * The one form vocabulary the group and play-group dialogs use on top of CommonPopupStyles:\n * a stack of fields, a quiet provenance line, and the action row. Kept next to the frame so the\n * two forms cannot drift apart again (they had: same form, two sets of margins and button kinds).\n */\nexport const InfoFormStyles = css`\n :host {\n --popup-min-width: 0;\n background: var(--info-dialog-surface, var(--ui-bg, #ffffff));\n }\n\n .fields {\n display: flex;\n flex-direction: column;\n gap: var(--spacing-medium, 8px);\n }\n\n /*\n * Inputs lighter than Material's filled field: a label over a thin-bordered box, the way the\n * suite's own create-domain popup draws them. The filled field's grey slab and underline made a\n * two-field dialog look heavier than the page behind it.\n */\n .fields label {\n display: flex;\n flex-direction: column;\n gap: 4px;\n font-size: var(--popup-font-size-small);\n color: var(--md-sys-color-on-surface-variant);\n /* Translations arrive in mixed case (\"Name\", \"description\"); one case for one form. */\n text-transform: capitalize;\n }\n\n .fields label > input,\n .fields label > textarea,\n .fields label > select {\n text-transform: none;\n }\n\n /* A button whose label comes from a lower-case translation (\"save\") says so with [cap]; labels\n * written in sentence case here (\"Open in modeller\") are left alone. */\n md-filled-button[cap],\n md-outlined-button[cap],\n md-text-button[cap] {\n text-transform: capitalize;\n }\n\n .fields input,\n .fields textarea,\n .fields select {\n box-sizing: border-box;\n width: 100%;\n padding: 8px 10px;\n border: 1px solid var(--md-sys-color-outline-variant);\n border-radius: var(--md-sys-shape-corner-small, 6px);\n background-color: var(--md-sys-color-surface);\n color: var(--md-sys-color-on-surface);\n font: inherit;\n font-size: var(--popup-font-size);\n }\n\n .fields input:focus,\n .fields textarea:focus,\n .fields select:focus {\n outline: none;\n border-color: var(--md-sys-color-primary);\n box-shadow: 0 0 0 2px color-mix(in srgb, var(--md-sys-color-primary) 18%, transparent);\n }\n\n /* A section's name: small caps in the muted tone, never a heading competing with the title bar. */\n .section {\n margin-top: var(--spacing-medium, 8px);\n font-size: 0.7rem;\n font-weight: 600;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: var(--md-sys-color-on-surface-variant);\n }\n\n /* Read-only value with a copy affordance beside it (a link, an id). */\n .copyable {\n display: flex;\n align-items: center;\n gap: var(--spacing-small, 4px);\n }\n\n .copyable input {\n flex: 1;\n min-width: 0;\n font-family: ui-monospace, SFMono-Regular, Menlo, monospace;\n font-size: 0.76rem;\n color: var(--md-sys-color-on-surface-variant);\n background: var(--md-sys-color-surface-container-low);\n }\n\n .copyable md-icon-button {\n --md-icon-button-icon-color: var(--md-sys-color-on-surface-variant);\n --md-icon-button-icon-size: 18px;\n }\n\n /* Who made it and when - a side note under the fields, never a row of its own with icons. */\n .provenance {\n display: flex;\n flex-wrap: wrap;\n gap: 2px var(--spacing-large, 16px);\n color: var(--md-sys-color-on-surface-variant);\n font-size: var(--popup-font-size-small);\n line-height: var(--popup-line-height);\n }\n\n .provenance b {\n font-weight: 500;\n color: var(--md-sys-color-on-surface);\n }\n\n /*\n * A tool row inside a dialog's body or footer - a menu, a copy-link button, an import option. It is\n * not the dialog's closing command row, which is <ox-popup-actions>; it only lines its tools up.\n */\n [tools] {\n display: flex;\n justify-content: flex-end;\n align-items: center;\n gap: var(--spacing-small, 4px);\n }\n\n [tools] [filler] {\n flex: 1;\n }\n\n ${MaterialDangerButtonStyles}\n`\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@things-factory/board-ui",
3
- "version": "10.1.258",
3
+ "version": "10.1.260",
4
4
  "main": "dist-server/index.js",
5
5
  "browser": "dist-client/index.js",
6
6
  "things-factory": true,
@@ -42,14 +42,14 @@
42
42
  "@operato/pull-to-refresh": "^10.0.0",
43
43
  "@operato/scene-ops": "^10.14.1",
44
44
  "@operato/shell": "^10.29.69",
45
- "@operato/styles": "^10.0.0",
45
+ "@operato/styles": "^10.29.70",
46
46
  "@operato/utils": "^10.29.43",
47
- "@things-factory/ai-assistant": "^10.1.258",
48
- "@things-factory/barcode-base": "^10.1.258",
49
- "@things-factory/board-ai": "^10.1.258",
50
- "@things-factory/fav-base": "^10.1.258",
51
- "@things-factory/setting-base": "^10.1.258",
47
+ "@things-factory/ai-assistant": "^10.1.260",
48
+ "@things-factory/barcode-base": "^10.1.260",
49
+ "@things-factory/board-ai": "^10.1.260",
50
+ "@things-factory/fav-base": "^10.1.260",
51
+ "@things-factory/setting-base": "^10.1.260",
52
52
  "@things-factory/utils": "^10.1.179"
53
53
  },
54
- "gitHead": "c7b7e3b4e9aa1b36a246ccee312a4124a50924dd"
54
+ "gitHead": "72de583ba0394dcf8195ef723b0ee4217507e0e5"
55
55
  }
@@ -129,7 +129,6 @@
129
129
  "label.align-left": "left",
130
130
  "label.align-right": "right",
131
131
  "label.align-top": "top",
132
- "label.all": "all",
133
132
  "label.animation": "animation",
134
133
  "label.animation-interval": "animation-interval",
135
134
  "label.anti-alias": "anti aliasing",
@@ -129,7 +129,6 @@
129
129
  "label.align-left": "izquierda",
130
130
  "label.align-right": "derecha",
131
131
  "label.align-top": "arriba",
132
- "label.all": "todos",
133
132
  "label.animation": "animación",
134
133
  "label.animation-interval": "intervalo de animación",
135
134
  "label.anti-alias": "suavizado",
@@ -129,7 +129,6 @@
129
129
  "label.align-left": "左",
130
130
  "label.align-right": "右",
131
131
  "label.align-top": "上",
132
- "label.all": "全体",
133
132
  "label.animation": "アニメーション効果",
134
133
  "label.animation-interval": "アニメーション間隔",
135
134
  "label.anti-alias": "アンチエイリアシング",
@@ -129,7 +129,6 @@
129
129
  "label.align-left": "왼쪽",
130
130
  "label.align-right": "오른쪽",
131
131
  "label.align-top": "상단",
132
- "label.all": "전체",
133
132
  "label.animation": "애니메이션효과",
134
133
  "label.animation-interval": "재생 간격",
135
134
  "label.anti-alias": "안티앨리어싱",
@@ -129,7 +129,6 @@
129
129
  "label.align-left": "Kiri",
130
130
  "label.align-right": "Kanan",
131
131
  "label.align-top": "Atas",
132
- "label.all": "semua",
133
132
  "label.animation": "Animasi",
134
133
  "label.animation-interval": "selang animasi",
135
134
  "label.anti-alias": "anti-aliasing",
@@ -129,7 +129,6 @@
129
129
  "label.align-left": "左侧",
130
130
  "label.align-right": "右侧",
131
131
  "label.align-top": "顶部",
132
- "label.all": "all",
133
132
  "label.animation": "动画",
134
133
  "label.animation-interval": "动画间隔",
135
134
  "label.anti-alias": "图形保真",