dsh-plugin-core 0.35.15 → 0.35.16
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,2 +1,2 @@
|
|
|
1
|
-
export declare const PICKER_CSS = "\n/* min-width:0 \u662F\u7ED9\u300C\u4F5C\u4E3A flex item\u300D\u51C6\u5907\u7684\uFF1A\u9ED8\u8BA4 min-width:auto \u4F1A\u88AB\u9009\u4E2D\u6587\u672C\u7684 min-content\n \u6491\u4F4F\uFF0C\u957F\u6A21\u578B\u540D\u5C31\u628A\u540C\u4E00\u884C\u7684\u5176\u5B83\u63A7\u4EF6\u5F80\u5DE6\u9876\uFF082026-11-10 \u7528\u6237\u771F\u673A\u622A\u56FE\uFF1A\u4E09\u4E2A\u8F93\u5165\u6846\u6574\u4F53\u5DE6\u79FB\uFF09\u3002\n \u7ED9 0 \u540E\u53EF\u6536\u7F29\uFF0C\u6587\u5B57\u7531 __label \u7684\u7701\u7565\u53F7\u63A5\u4F4F\u3002 */\n.dshpc-picker{position:relative;display:inline-block;max-width:100%;min-width:0;font-size:13px;line-height:20px}\n.dshpc-picker__trigger{\n display:inline-flex;align-items:center;justify-content:space-between;gap:6px;\n min-width:120px;max-width:100%;height:28px;padding:0 8px;\n color:var(--dshpc-fg);background:var(--dshpc-surface-1);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);cursor:pointer;\n}\n.dshpc-picker__trigger:disabled{color:var(--dshpc-fg-dim);cursor:not-allowed;opacity:.7}\n/* \u805A\u7126\uFF08\u952E\u76D8\u6216\u70B9\u51FB\u9009\u4E2D\uFF09\u65F6\u4E0E\u5168\u7AD9\u4E00\u81F4\u7684\u84DD\u8272\u63CF\u8FB9\uFF1B\u83DC\u5355\u6253\u5F00\u540E\u7126\u70B9\u4F1A\u8FDB\u53BB\uFF0C\u89E6\u53D1\u5668\u81EA\u7136\u5931\u53BB\u7126\u70B9\u3002 */\n.dshpc-picker__trigger:focus-visible{outline:2px solid var(--dshpc-focus);outline-offset:1px}\n/* \u6587\u5B57\u9ED8\u8BA4\u9760\u5DE6\uFF08\u5403\u6389\u5269\u4F59\u5BBD\u5EA6\uFF09\uFF0C\u4E0D\u7ED9 space-between \u628A\u77ED\u6587\u6848\u63A8\u5230\u4E2D\u95F4\u7684\u673A\u4F1A\uFF1B\n \u786E\u5B9E\u8981\u5C45\u4E2D\u5C31\u663E\u5F0F\u4F20 align=\"center\"\u3002 */\n.dshpc-picker__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}\n.dshpc-picker__trigger--center .dshpc-picker__label{text-align:center}\n.dshpc-picker__caret{flex:none;color:var(--dshpc-fg-3)}\n.dshpc-picker__icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n.dshpc-picker__option-icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n/* \u4E0B\u62C9\u9762\u677F\u53EA\u7559\u5B9A\u4F4D / \u88C1\u5207 / \u5B57\u53F7\uFF1A\u5E95\u8272\u00B7\u63CF\u8FB9\u00B7\u5706\u89D2\u00B7\u9634\u5F71\u6765\u81EA panel.css \u7684 menu \u6863\u3002 */\n.dshpc-picker__menu{\n z-index:var(--dshpc-z-popmenu);max-height:280px;overflow:hidden;\n display:flex;flex-direction:column;\n /* \u83DC\u5355\u7ECF FloatingPortal \u6302\u5230 body\uFF0C\u8131\u79BB .dshpc-picker\uFF0C\u987B\u663E\u5F0F\u5B57\u53F7\uFF0C\u5426\u5219\u7EE7\u627F body \u7684\u5927\u5B57\u53F7 */\n font-size:13px;line-height:20px;\n}\n/* \u56FA\u5B9A\u5934\u90E8\uFF08\u63D0\u793A + \u641C\u7D22\u6846\uFF09\uFF0C\u4E0D\u968F\u5217\u8868\u6EDA\uFF082026-11-06 \u7528\u6237\uFF09\u3002 */\n.dshpc-picker__head{flex:none;padding:4px 4px 0}\n/* \u6EDA\u52A8\u5728\u5185\u5C42\uFF1A\u5217\u8868\u8D34\u6EE1\u9762\u677F\u5185\u5BB9\u533A\uFF0C1px \u8BA9\u4F4D\u7531 .dshpc-scroll-thin \u7EDF\u4E00\u7ED9\n \uFF08\u4E0D\u7559\u7F1D\u5C31\u8D34\u6B7B\u5728\u8FB9\u6846\u5185\u58C1\u4E0A\uFF0C2026-11-06 \u7528\u6237\u53CD\u9988\uFF09\u3002\u4E0A\u4E0B\u89D2\u6EA2\u51FA\u7531\u9762\u677F overflow:hidden \u88C1\u6389\u3002 */\n.dshpc-picker__list{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 4px 4px}\n/* \u5C3A\u5BF8\u6863\uFF08\u4E0E Field \u7684 sm/md/lg \u5BF9\u5E94\uFF09\u3002 */\n.dshpc-picker__trigger--sm{height:24px;font-size:12px}\n.dshpc-picker__trigger--lg{height:32px}\n/* \u952E\u76D8\u6E38\u6807\u6240\u5728\u9879\uFF08\u65E0 hover \u4E5F\u8981\u770B\u5F97\u89C1\uFF09\u3002 */\n.dshpc-picker__option[data-active='true']{background:var(--dshpc-surface-sunken);outline:1px solid var(--dshpc-border)}\n.dshpc-picker__option--clear{color:var(--dshpc-fg-3)}\n.dshpc-picker__search{\n width:100%;height:28px;margin-bottom:4px;padding:0 8px;box-sizing:border-box;\n color:var(--dshpc-fg);background:var(--dshpc-surface-sunken);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);outline:none;\n}\n.dshpc-picker__search::placeholder{color:var(--dshpc-fg-3)}\n.dshpc-picker__group-label{\n padding:6px 8px 2px;color:var(--dshpc-fg-3);font-size:11px;\n}\n/* \
|
|
1
|
+
export declare const PICKER_CSS = "\n/* min-width:0 \u662F\u7ED9\u300C\u4F5C\u4E3A flex item\u300D\u51C6\u5907\u7684\uFF1A\u9ED8\u8BA4 min-width:auto \u4F1A\u88AB\u9009\u4E2D\u6587\u672C\u7684 min-content\n \u6491\u4F4F\uFF0C\u957F\u6A21\u578B\u540D\u5C31\u628A\u540C\u4E00\u884C\u7684\u5176\u5B83\u63A7\u4EF6\u5F80\u5DE6\u9876\uFF082026-11-10 \u7528\u6237\u771F\u673A\u622A\u56FE\uFF1A\u4E09\u4E2A\u8F93\u5165\u6846\u6574\u4F53\u5DE6\u79FB\uFF09\u3002\n \u7ED9 0 \u540E\u53EF\u6536\u7F29\uFF0C\u6587\u5B57\u7531 __label \u7684\u7701\u7565\u53F7\u63A5\u4F4F\u3002 */\n.dshpc-picker{position:relative;display:inline-block;max-width:100%;min-width:0;font-size:13px;line-height:20px}\n.dshpc-picker__trigger{\n display:inline-flex;align-items:center;justify-content:space-between;gap:6px;\n min-width:120px;max-width:100%;height:28px;padding:0 8px;\n color:var(--dshpc-fg);background:var(--dshpc-surface-1);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);cursor:pointer;\n}\n.dshpc-picker__trigger:disabled{color:var(--dshpc-fg-dim);cursor:not-allowed;opacity:.7}\n/* \u805A\u7126\uFF08\u952E\u76D8\u6216\u70B9\u51FB\u9009\u4E2D\uFF09\u65F6\u4E0E\u5168\u7AD9\u4E00\u81F4\u7684\u84DD\u8272\u63CF\u8FB9\uFF1B\u83DC\u5355\u6253\u5F00\u540E\u7126\u70B9\u4F1A\u8FDB\u53BB\uFF0C\u89E6\u53D1\u5668\u81EA\u7136\u5931\u53BB\u7126\u70B9\u3002 */\n.dshpc-picker__trigger:focus-visible{outline:2px solid var(--dshpc-focus);outline-offset:1px}\n/* \u6587\u5B57\u9ED8\u8BA4\u9760\u5DE6\uFF08\u5403\u6389\u5269\u4F59\u5BBD\u5EA6\uFF09\uFF0C\u4E0D\u7ED9 space-between \u628A\u77ED\u6587\u6848\u63A8\u5230\u4E2D\u95F4\u7684\u673A\u4F1A\uFF1B\n \u786E\u5B9E\u8981\u5C45\u4E2D\u5C31\u663E\u5F0F\u4F20 align=\"center\"\u3002 */\n.dshpc-picker__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}\n.dshpc-picker__trigger--center .dshpc-picker__label{text-align:center}\n.dshpc-picker__caret{flex:none;color:var(--dshpc-fg-3)}\n.dshpc-picker__icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n.dshpc-picker__option-icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n/* \u4E0B\u62C9\u9762\u677F\u53EA\u7559\u5B9A\u4F4D / \u88C1\u5207 / \u5B57\u53F7\uFF1A\u5E95\u8272\u00B7\u63CF\u8FB9\u00B7\u5706\u89D2\u00B7\u9634\u5F71\u6765\u81EA panel.css \u7684 menu \u6863\u3002 */\n.dshpc-picker__menu{\n z-index:var(--dshpc-z-popmenu);max-height:280px;overflow:hidden;\n display:flex;flex-direction:column;\n /* \u83DC\u5355\u7ECF FloatingPortal \u6302\u5230 body\uFF0C\u8131\u79BB .dshpc-picker\uFF0C\u987B\u663E\u5F0F\u5B57\u53F7\uFF0C\u5426\u5219\u7EE7\u627F body \u7684\u5927\u5B57\u53F7 */\n font-size:13px;line-height:20px;\n}\n/* \u56FA\u5B9A\u5934\u90E8\uFF08\u63D0\u793A + \u641C\u7D22\u6846\uFF09\uFF0C\u4E0D\u968F\u5217\u8868\u6EDA\uFF082026-11-06 \u7528\u6237\uFF09\u3002 */\n.dshpc-picker__head{flex:none;padding:4px 4px 0}\n/* \u6EDA\u52A8\u5728\u5185\u5C42\uFF1A\u5217\u8868\u8D34\u6EE1\u9762\u677F\u5185\u5BB9\u533A\uFF0C1px \u8BA9\u4F4D\u7531 .dshpc-scroll-thin \u7EDF\u4E00\u7ED9\n \uFF08\u4E0D\u7559\u7F1D\u5C31\u8D34\u6B7B\u5728\u8FB9\u6846\u5185\u58C1\u4E0A\uFF0C2026-11-06 \u7528\u6237\u53CD\u9988\uFF09\u3002\u4E0A\u4E0B\u89D2\u6EA2\u51FA\u7531\u9762\u677F overflow:hidden \u88C1\u6389\u3002 */\n.dshpc-picker__list{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 4px 4px}\n/* \u5C3A\u5BF8\u6863\uFF08\u4E0E Field \u7684 sm/md/lg \u5BF9\u5E94\uFF09\u3002 */\n.dshpc-picker__trigger--sm{height:24px;font-size:12px}\n.dshpc-picker__trigger--lg{height:32px}\n/* \u952E\u76D8\u6E38\u6807\u6240\u5728\u9879\uFF08\u65E0 hover \u4E5F\u8981\u770B\u5F97\u89C1\uFF09\u3002 */\n.dshpc-picker__option[data-active='true']{background:var(--dshpc-surface-sunken);outline:1px solid var(--dshpc-border)}\n.dshpc-picker__option--clear{color:var(--dshpc-fg-3)}\n.dshpc-picker__search{\n width:100%;height:28px;margin-bottom:4px;padding:0 8px;box-sizing:border-box;\n color:var(--dshpc-fg);background:var(--dshpc-surface-sunken);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);outline:none;\n}\n.dshpc-picker__search::placeholder{color:var(--dshpc-fg-3)}\n.dshpc-picker__group-label{\n padding:6px 8px 2px;color:var(--dshpc-fg-3);font-size:11px;\n}\n/* \u5706\u89D2\u53EA\u8DDF\u5168\u7AD9\u300C\u6846 / \u884C\u300D\u90A3\u4E00\u6863\u8D70\uFF1A--dshpc-radius-md\u3002\n \u771F\u6E90\u662F Surface\uFF08surface.css:4-5\u300C\u5BB9\u5668\u6863 = --dshpc-radius-md\uFF0C\u4E0E Button / Input \u540C\u6863\u300D\uFF09\uFF0CListRow \u7684\u884C\n \u5706\u89D2\u4E5F\u662F\u4ECE Surface \u7EE7\u627F\u7684 \u2014\u2014 \u6240\u4EE5\u8FD9\u91CC\u4E0D\u80FD\u81EA\u5DF1\u6311 xs/sm \u4E4B\u7C7B\u66F4\u5C0F\u7684\u6863\u30022026-11-10 \u7528\u6237\u771F\u673A\u622A\u56FE\uFF1A\n \u641C\u7D22\u6846\uFF08md\uFF09\u4E0E\u88AB\u9009\u4E2D\u7684\u84DD\u884C\uFF08xs\uFF09\u5706\u89D2\u660E\u663E\u4E0D\u9F50\uFF0C\u540C\u5728\u4E00\u4E2A\u9762\u677F\u91CC\u50CF\u4E24\u5957\u63A7\u4EF6\u3002\n \u5927\u5706\u89D2\u4ECD\u7136\u53EA\u5F52\u5916\u5C42\u83DC\u5355\uFF08panel.css \u7684 menu \u6863 + overflow:hidden\uFF09\u3002 */\n.dshpc-picker__option{\n display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:var(--dshpc-radius-md);cursor:pointer;\n color:var(--dshpc-fg);white-space:nowrap;\n}\n/* \u884C\u4E0E\u884C\u4E4B\u95F4\u7559\u4E00\u6863\u95F4\u8DDD\uFF084px\uFF09\uFF1Amd \u5706\u89D2\u7684\u4E24\u884C\u5E95\u8272\u76F4\u63A5\u76F8\u63A5\u4F1A\u8FDE\u6210\u4E00\u6839\u80F6\u56CA\uFF0C\u591A\u9009\u8FDE\u9009\u4E24\u9879\u65F6\n \u770B\u4E0D\u51FA\u662F\u4E24\u6761\uFF082026-11-10 \u7528\u6237\u622A\u56FE\uFF09\u3002\u53EA\u7528\u95F4\u8DDD\u56DB\u62CD\u91CC\u6700\u5C0F\u6863\uFF0C\u4E0D\u5199\u9B54\u6CD5\u6570\u3002 */\n.dshpc-picker__option + .dshpc-picker__option{margin-top:var(--dshpc-space-1)}\n/* hover / \u9009\u4E2D\u76F4\u63A5\u501F ListRow \u7684\u4E24\u6761 token \u2014\u2014 \u540C\u4E00\u4E2A\u300C\u884C\u300D\u8BED\u4E49\uFF0C\u4E0E\u5217\u8868\u6761\u76EE\u5BF9\u9F50\u3002\n \u9009\u4E2D\u4E0D\u67D3\u6587\u5B57\u8272\uFF1A\u84DD\u5B57\u662F\u300C\u94FE\u63A5\u300D\u8BED\u4E49\uFF0C\u884C\u9009\u4E2D\u53EA\u6362\u5E95\uFF08list-row.css:44-47 \u7684\u53E3\u5F84\uFF09\u3002\n 2026-11-10 \u7528\u6237\uFF1A\u539F\u6765\u84DD\u5E95\u84DD\u5B57 + \u4EAE\u4E00\u70B9\u7684\u7070\uFF0C\u548C ListRow \u5B8C\u5168\u4E0D\u662F\u4E00\u5957\u3002 */\n.dshpc-picker__option:hover{background:var(--dshpc-listrow-hover-bg)}\n.dshpc-picker__option--active{background:var(--dshpc-listrow-selected-bg);color:var(--dshpc-fg)}\n.dshpc-picker__option--disabled{color:var(--dshpc-fg-dim);cursor:not-allowed}\n/* \u9009\u9879\u6587\u5B57\u5403\u6389\u5269\u4F59\u5BBD\u5EA6\uFF1A\u8D85\u957F\u7701\u7565\u53F7\uFF08\u914D\u5408 MarqueeText hover \u8DD1\u9A6C\u706F\uFF09\uFF0C\u4E0D\u6491\u5BBD\u83DC\u5355\u3002 */\n.dshpc-picker__option-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.dshpc-picker__tick{width:12px;color:var(--dshpc-business)}\n.dshpc-picker__empty{padding:8px;color:var(--dshpc-fg-3);text-align:center}\n/* \u63D0\u793A\u6761\uFF08\u5019\u9009\u4E0D\u5B8C\u6574 / \u5DF2\u5230\u4E0A\u9650\uFF09\u4E0E\u5217\u8868\u884C\u540C\u4E00\u5957\u300C\u5757\u300D\uFF1Amd \u5706\u89D2 + \u884C\u5185\u8DDD\uFF0C\u5DE6\u53F3\u5BF9\u9F50\u641C\u7D22\u6846\u4E0E\u9009\u9879\n \uFF08\u4E0D\u518D\u9760\u8D1F margin \u4F38\u5230\u83DC\u5355\u5185\u58C1\uFF09\uFF0C\u53EA\u662F\u914D\u8272\u6362\u6210\u63D0\u793A\u9EC4\u30022026-11-10 \u7528\u6237\uFF1A\u90A3\u6761\u901A\u680F\u592A\u96BE\u770B\u4E86\uFF0C\n \u8981\u505A\u6210\u4E0B\u9762\u9009\u4E2D\u884C\u90A3\u79CD\u6846\u3001\u7528\u63D0\u793A\u8272\u3002 */\n.dshpc-picker__degraded{\n padding:6px 8px;margin:0 0 4px;border-radius:var(--dshpc-radius-md);\n color:var(--dshpc-warning-label);background:color-mix(in srgb,var(--dshpc-warning) 12%,transparent);\n font-size:11px;\n}\n.dshpc-picker__row{display:flex;align-items:center;gap:8px}\n/* \u300C\u663E\u793A\u66F4\u591A\u300D\u8DDF\u5728\u6700\u540E\u4E00\u6761\u540E\u9762\u3001\u957F\u5F97\u50CF\u591A\u4E00\u6761\u9009\u9879\uFF082026-11-06 \u7528\u6237\uFF1A\u7FFB\u5230\u5E95\u53D1\u73B0\u4E0D\u5168\u624D\u4F1A\u627E\u5B83\uFF09\u3002\n \u5706\u89D2\u540C\u6837\u8D70 md\uFF1A\u5B83\u89C6\u89C9\u4E0A\u5C31\u662F\u5217\u8868\u91CC\u591A\u51FA\u6765\u7684\u4E00\u884C\uFF0C\u6863\u4F4D\u4E0E\u9009\u9879\u4E00\u81F4\uFF0C\u522B\u518D\u5355\u72EC\u6311\u4E00\u4E2A\u3002 */\n.dshpc-picker__more{\n display:block;width:100%;margin-top:var(--dshpc-space-1);padding:6px 8px;\n color:var(--dshpc-business);background:none;\n border:0;border-radius:var(--dshpc-radius-md);cursor:pointer;\n font-size:12px;line-height:20px;text-align:center;\n}\n.dshpc-picker__more:hover{background:var(--dshpc-surface-sunken)}\n";
|
|
2
2
|
//# sourceMappingURL=picker-css.generated.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"picker-css.generated.d.ts","sourceRoot":"","sources":["../../../src/ui/inputs/picker-css.generated.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"picker-css.generated.d.ts","sourceRoot":"","sources":["../../../src/ui/inputs/picker-css.generated.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU,qoRAA61J,CAAA"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
// ⚠️ 生成物,勿手改。真源 = src/ui/inputs/picker.css
|
|
2
2
|
// 由 scripts/gen-css.mjs 生成(`pnpm run gen:css`):改样式请改那个 .css 文件后重新生成。
|
|
3
|
-
export const PICKER_CSS = "\n/* min-width:0 是给「作为 flex item」准备的:默认 min-width:auto 会被选中文本的 min-content\n 撑住,长模型名就把同一行的其它控件往左顶(2026-11-10 用户真机截图:三个输入框整体左移)。\n 给 0 后可收缩,文字由 __label 的省略号接住。 */\n.dshpc-picker{position:relative;display:inline-block;max-width:100%;min-width:0;font-size:13px;line-height:20px}\n.dshpc-picker__trigger{\n display:inline-flex;align-items:center;justify-content:space-between;gap:6px;\n min-width:120px;max-width:100%;height:28px;padding:0 8px;\n color:var(--dshpc-fg);background:var(--dshpc-surface-1);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);cursor:pointer;\n}\n.dshpc-picker__trigger:disabled{color:var(--dshpc-fg-dim);cursor:not-allowed;opacity:.7}\n/* 聚焦(键盘或点击选中)时与全站一致的蓝色描边;菜单打开后焦点会进去,触发器自然失去焦点。 */\n.dshpc-picker__trigger:focus-visible{outline:2px solid var(--dshpc-focus);outline-offset:1px}\n/* 文字默认靠左(吃掉剩余宽度),不给 space-between 把短文案推到中间的机会;\n 确实要居中就显式传 align=\"center\"。 */\n.dshpc-picker__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}\n.dshpc-picker__trigger--center .dshpc-picker__label{text-align:center}\n.dshpc-picker__caret{flex:none;color:var(--dshpc-fg-3)}\n.dshpc-picker__icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n.dshpc-picker__option-icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n/* 下拉面板只留定位 / 裁切 / 字号:底色·描边·圆角·阴影来自 panel.css 的 menu 档。 */\n.dshpc-picker__menu{\n z-index:var(--dshpc-z-popmenu);max-height:280px;overflow:hidden;\n display:flex;flex-direction:column;\n /* 菜单经 FloatingPortal 挂到 body,脱离 .dshpc-picker,须显式字号,否则继承 body 的大字号 */\n font-size:13px;line-height:20px;\n}\n/* 固定头部(提示 + 搜索框),不随列表滚(2026-11-06 用户)。 */\n.dshpc-picker__head{flex:none;padding:4px 4px 0}\n/* 滚动在内层:列表贴满面板内容区,1px 让位由 .dshpc-scroll-thin 统一给\n (不留缝就贴死在边框内壁上,2026-11-06 用户反馈)。上下角溢出由面板 overflow:hidden 裁掉。 */\n.dshpc-picker__list{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 4px 4px}\n/* 尺寸档(与 Field 的 sm/md/lg 对应)。 */\n.dshpc-picker__trigger--sm{height:24px;font-size:12px}\n.dshpc-picker__trigger--lg{height:32px}\n/* 键盘游标所在项(无 hover 也要看得见)。 */\n.dshpc-picker__option[data-active='true']{background:var(--dshpc-surface-sunken);outline:1px solid var(--dshpc-border)}\n.dshpc-picker__option--clear{color:var(--dshpc-fg-3)}\n.dshpc-picker__search{\n width:100%;height:28px;margin-bottom:4px;padding:0 8px;box-sizing:border-box;\n color:var(--dshpc-fg);background:var(--dshpc-surface-sunken);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);outline:none;\n}\n.dshpc-picker__search::placeholder{color:var(--dshpc-fg-3)}\n.dshpc-picker__group-label{\n padding:6px 8px 2px;color:var(--dshpc-fg-3);font-size:11px;\n}\n/*
|
|
3
|
+
export const PICKER_CSS = "\n/* min-width:0 是给「作为 flex item」准备的:默认 min-width:auto 会被选中文本的 min-content\n 撑住,长模型名就把同一行的其它控件往左顶(2026-11-10 用户真机截图:三个输入框整体左移)。\n 给 0 后可收缩,文字由 __label 的省略号接住。 */\n.dshpc-picker{position:relative;display:inline-block;max-width:100%;min-width:0;font-size:13px;line-height:20px}\n.dshpc-picker__trigger{\n display:inline-flex;align-items:center;justify-content:space-between;gap:6px;\n min-width:120px;max-width:100%;height:28px;padding:0 8px;\n color:var(--dshpc-fg);background:var(--dshpc-surface-1);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);cursor:pointer;\n}\n.dshpc-picker__trigger:disabled{color:var(--dshpc-fg-dim);cursor:not-allowed;opacity:.7}\n/* 聚焦(键盘或点击选中)时与全站一致的蓝色描边;菜单打开后焦点会进去,触发器自然失去焦点。 */\n.dshpc-picker__trigger:focus-visible{outline:2px solid var(--dshpc-focus);outline-offset:1px}\n/* 文字默认靠左(吃掉剩余宽度),不给 space-between 把短文案推到中间的机会;\n 确实要居中就显式传 align=\"center\"。 */\n.dshpc-picker__label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}\n.dshpc-picker__trigger--center .dshpc-picker__label{text-align:center}\n.dshpc-picker__caret{flex:none;color:var(--dshpc-fg-3)}\n.dshpc-picker__icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n.dshpc-picker__option-icon{display:inline-flex;flex:none;color:var(--dshpc-fg-2)}\n/* 下拉面板只留定位 / 裁切 / 字号:底色·描边·圆角·阴影来自 panel.css 的 menu 档。 */\n.dshpc-picker__menu{\n z-index:var(--dshpc-z-popmenu);max-height:280px;overflow:hidden;\n display:flex;flex-direction:column;\n /* 菜单经 FloatingPortal 挂到 body,脱离 .dshpc-picker,须显式字号,否则继承 body 的大字号 */\n font-size:13px;line-height:20px;\n}\n/* 固定头部(提示 + 搜索框),不随列表滚(2026-11-06 用户)。 */\n.dshpc-picker__head{flex:none;padding:4px 4px 0}\n/* 滚动在内层:列表贴满面板内容区,1px 让位由 .dshpc-scroll-thin 统一给\n (不留缝就贴死在边框内壁上,2026-11-06 用户反馈)。上下角溢出由面板 overflow:hidden 裁掉。 */\n.dshpc-picker__list{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 4px 4px}\n/* 尺寸档(与 Field 的 sm/md/lg 对应)。 */\n.dshpc-picker__trigger--sm{height:24px;font-size:12px}\n.dshpc-picker__trigger--lg{height:32px}\n/* 键盘游标所在项(无 hover 也要看得见)。 */\n.dshpc-picker__option[data-active='true']{background:var(--dshpc-surface-sunken);outline:1px solid var(--dshpc-border)}\n.dshpc-picker__option--clear{color:var(--dshpc-fg-3)}\n.dshpc-picker__search{\n width:100%;height:28px;margin-bottom:4px;padding:0 8px;box-sizing:border-box;\n color:var(--dshpc-fg);background:var(--dshpc-surface-sunken);\n border:1px solid var(--dshpc-border-heavy);border-radius:var(--dshpc-radius-md);outline:none;\n}\n.dshpc-picker__search::placeholder{color:var(--dshpc-fg-3)}\n.dshpc-picker__group-label{\n padding:6px 8px 2px;color:var(--dshpc-fg-3);font-size:11px;\n}\n/* 圆角只跟全站「框 / 行」那一档走:--dshpc-radius-md。\n 真源是 Surface(surface.css:4-5「容器档 = --dshpc-radius-md,与 Button / Input 同档」),ListRow 的行\n 圆角也是从 Surface 继承的 —— 所以这里不能自己挑 xs/sm 之类更小的档。2026-11-10 用户真机截图:\n 搜索框(md)与被选中的蓝行(xs)圆角明显不齐,同在一个面板里像两套控件。\n 大圆角仍然只归外层菜单(panel.css 的 menu 档 + overflow:hidden)。 */\n.dshpc-picker__option{\n display:flex;align-items:center;gap:6px;padding:6px 8px;border-radius:var(--dshpc-radius-md);cursor:pointer;\n color:var(--dshpc-fg);white-space:nowrap;\n}\n/* 行与行之间留一档间距(4px):md 圆角的两行底色直接相接会连成一根胶囊,多选连选两项时\n 看不出是两条(2026-11-10 用户截图)。只用间距四拍里最小档,不写魔法数。 */\n.dshpc-picker__option + .dshpc-picker__option{margin-top:var(--dshpc-space-1)}\n/* hover / 选中直接借 ListRow 的两条 token —— 同一个「行」语义,与列表条目对齐。\n 选中不染文字色:蓝字是「链接」语义,行选中只换底(list-row.css:44-47 的口径)。\n 2026-11-10 用户:原来蓝底蓝字 + 亮一点的灰,和 ListRow 完全不是一套。 */\n.dshpc-picker__option:hover{background:var(--dshpc-listrow-hover-bg)}\n.dshpc-picker__option--active{background:var(--dshpc-listrow-selected-bg);color:var(--dshpc-fg)}\n.dshpc-picker__option--disabled{color:var(--dshpc-fg-dim);cursor:not-allowed}\n/* 选项文字吃掉剩余宽度:超长省略号(配合 MarqueeText hover 跑马灯),不撑宽菜单。 */\n.dshpc-picker__option-label{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.dshpc-picker__tick{width:12px;color:var(--dshpc-business)}\n.dshpc-picker__empty{padding:8px;color:var(--dshpc-fg-3);text-align:center}\n/* 提示条(候选不完整 / 已到上限)与列表行同一套「块」:md 圆角 + 行内距,左右对齐搜索框与选项\n (不再靠负 margin 伸到菜单内壁),只是配色换成提示黄。2026-11-10 用户:那条通栏太难看了,\n 要做成下面选中行那种框、用提示色。 */\n.dshpc-picker__degraded{\n padding:6px 8px;margin:0 0 4px;border-radius:var(--dshpc-radius-md);\n color:var(--dshpc-warning-label);background:color-mix(in srgb,var(--dshpc-warning) 12%,transparent);\n font-size:11px;\n}\n.dshpc-picker__row{display:flex;align-items:center;gap:8px}\n/* 「显示更多」跟在最后一条后面、长得像多一条选项(2026-11-06 用户:翻到底发现不全才会找它)。\n 圆角同样走 md:它视觉上就是列表里多出来的一行,档位与选项一致,别再单独挑一个。 */\n.dshpc-picker__more{\n display:block;width:100%;margin-top:var(--dshpc-space-1);padding:6px 8px;\n color:var(--dshpc-business);background:none;\n border:0;border-radius:var(--dshpc-radius-md);cursor:pointer;\n font-size:12px;line-height:20px;text-align:center;\n}\n.dshpc-picker__more:hover{background:var(--dshpc-surface-sunken)}\n";
|
|
4
4
|
//# sourceMappingURL=picker-css.generated.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"picker-css.generated.js","sourceRoot":"","sources":["../../../src/ui/inputs/picker-css.generated.ts"],"names":[],"mappings":"AAAA,2CAA2C;AAC3C,qEAAqE;AACrE,MAAM,CAAC,MAAM,UAAU,GAAG,
|
|
1
|
+
{"version":3,"file":"picker-css.generated.js","sourceRoot":"","sources":["../../../src/ui/inputs/picker-css.generated.ts"],"names":[],"mappings":"AAAA,2CAA2C;AAC3C,qEAAqE;AACrE,MAAM,CAAC,MAAM,UAAU,GAAG,01JAA01J,CAAA"}
|
package/package.json
CHANGED