refactor: migrate UI styles to canonical properties
This commit is contained in:
parent
c590ed08eb
commit
7f465fc6d7
@ -26,7 +26,7 @@ definition and API names.
|
||||
|
||||
Button and Checkbox are controlled Components. `etaf-button` accepts `:label`,
|
||||
`:on-press`, `:disabled`, `:ref`, and the small presentation set
|
||||
`:class`, `:color`, `:bgcolor`, `:border`, `:padding`, `:face`, `:tab-index`,
|
||||
`:class`, `:color`, `:bgcolor`, `:border`, `:padding`, `:font-weight`, `:tab-index`,
|
||||
and `:aria-label`, plus `:use` for a public Behavior list. An enabled button
|
||||
defaults to role `button` and tab index `0`; a disabled button keeps its label
|
||||
and disabled styling but has no press handler, Behavior, or tab stop.
|
||||
@ -70,8 +70,9 @@ Spacing is owned by the parent layout, not by Button. Put adjacent controls in
|
||||
a `row`/`flex` with an explicit horizontal `:gap`; this keeps each control's
|
||||
mouse-face and hit range semantically separate.
|
||||
|
||||
`etaf-label` accepts `:text`, `:face`, `:class`, `:color`, `:bgcolor`, `:width`,
|
||||
`:border`, `:padding`, and `:ref`. `etaf-panel` accepts `:title`, the same
|
||||
`etaf-label` accepts `:text`, `:class`, `:color`, `:bgcolor`, `:font-weight`,
|
||||
`:width`, `:border`, `:padding`, and `:ref`.
|
||||
`etaf-panel` accepts `:title`, the same
|
||||
surface presentation props, and projects the named `header` slot plus the
|
||||
default slot.
|
||||
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
|
||||
Button 和 Checkbox 都是受控组件。`etaf-button` 支持 `:label`、
|
||||
`:on-press`、`:disabled`、`:ref`,以及最小 presentation 属性
|
||||
`:class`、`:color`、`:bgcolor`、`:border`、`:padding`、`:face`、
|
||||
`:class`、`:color`、`:bgcolor`、`:border`、`:padding`、`:font-weight`、
|
||||
`:tab-index`、`:aria-label` 和公共 Behavior 列表 `:use`。启用按钮默认使用
|
||||
`button` role 和 `tab-index 0`;禁用按钮仍显示标签和禁用样式,但没有 press
|
||||
回调、Behavior,也不进入 tab 顺序。`etaf-checkbox` 支持 `:checked`、`:label`、`:on-change`、
|
||||
@ -61,8 +61,9 @@ Component 的 `:styles` 声明负责默认外观。调用者提供的非 nil pre
|
||||
间距由父布局负责,而不是由 Button 偷塞。相邻控件应放在带明确横向 `:gap`
|
||||
的 `row`/`flex` 中,这样每个控件的 mouse-face 和命中范围才保持语义独立。
|
||||
|
||||
`etaf-label` 支持 `:text`、`:face`、`:class`、`:color`、`:bgcolor`、`:width`、
|
||||
`:border`、`:padding` 和 `:ref`。`etaf-panel` 支持 `:title`、相同的
|
||||
`etaf-label` 支持 `:text`、`:class`、`:color`、`:bgcolor`、`:font-weight`、
|
||||
`:width`、`:border`、`:padding` 和 `:ref`。
|
||||
`etaf-panel` 支持 `:title`、相同的
|
||||
surface presentation 属性,并投影命名的 `header` slot 和默认 slot。
|
||||
|
||||
DataGrid 支持列描述、函数型 `:row-key`,以及可选的
|
||||
|
||||
14
etaf-ui.el
14
etaf-ui.el
@ -145,15 +145,15 @@ Component render depend on the Theme source."
|
||||
"Return Ebox border VALUE, preserving complete caller-owned specs.
|
||||
|
||||
Semantic Theme border tokens conventionally contain a color string. The
|
||||
catalog turns a hex color into its one-cell border shape; an existing border
|
||||
plist or a legacy caller-owned string remains untouched for compatibility."
|
||||
catalog turns a hex color into a one-pixel solid border; an existing canonical
|
||||
border value remains unchanged."
|
||||
(cond
|
||||
((etaf-theme-token-p value)
|
||||
(etaf-theme-token (nth 1 value) (nth 2 value)
|
||||
#'etaf-ui--theme-border))
|
||||
((and (stringp value)
|
||||
(string-match-p "\\`#[[:xdigit:]]+\\'" value))
|
||||
(list (list 1) 'solid value))
|
||||
(list 1 'solid value))
|
||||
(t value)))
|
||||
|
||||
(defun etaf-ui--class-value (base state custom)
|
||||
@ -200,7 +200,8 @@ plist or a legacy caller-owned string remains untouched for compatibility."
|
||||
"Return a Button Host showing LABEL.
|
||||
|
||||
ON-PRESS and USE provide callbacks and Behaviors. DISABLED controls whether
|
||||
the Host is interactive. REF, CLASS, COLOR, BGCOLOR, BORDER, PADDING, FACE,
|
||||
the Host is interactive. REF, CLASS, COLOR, BGCOLOR, BORDER, PADDING,
|
||||
FONT-WEIGHT,
|
||||
TAB-INDEX, and ARIA-LABEL provide Host identity and presentation."
|
||||
(let ((class-value (etaf-ui--class-value
|
||||
"etaf-button"
|
||||
@ -384,7 +385,8 @@ ROW-ACTIONS owns stable keyed callbacks across body reevaluation."
|
||||
:ref host-ref
|
||||
:role (when interactive-p 'button)
|
||||
:tab-index (when interactive-p 0)
|
||||
:border-bottom-p t
|
||||
:border-bottom-width 1
|
||||
:border-bottom-style 'solid
|
||||
:border-bottom-color (plist-get theme :ui-grid-border)
|
||||
:on-press (when interactive-p
|
||||
(etaf-ui--grid-row-action
|
||||
@ -897,7 +899,7 @@ readable in both GUI and text review."
|
||||
(plist-get theme :ui-fg)))
|
||||
(parent-bgcolor (or (etaf-current-prop :bgcolor)
|
||||
(plist-get theme :ui-bg)))
|
||||
(arrow-border '((0) solid "transparent")))
|
||||
(arrow-border '(0 solid "transparent")))
|
||||
(setq current-controller controller-value
|
||||
current-parent-color parent-color
|
||||
current-parent-bgcolor parent-bgcolor)
|
||||
|
||||
@ -665,8 +665,10 @@
|
||||
(should (equal "light-grid-border"
|
||||
(etaf-ui-test--paint-color
|
||||
border-slot :border-bottom-color)))
|
||||
(should (plist-get (etaf-ui-test--props-with-key buffer-name 1)
|
||||
:border-bottom-p))
|
||||
(let ((row-props
|
||||
(etaf-ui-test--props-with-key buffer-name 1)))
|
||||
(should (= (plist-get row-props :border-bottom-width) 1))
|
||||
(should (eq (plist-get row-props :border-bottom-style) 'solid)))
|
||||
(setf (etaf-value theme) '(:color "dark-ink"
|
||||
:ui-grid-border "dark-grid-border"
|
||||
:ui-grid-selected-fg "dark-selected"
|
||||
|
||||
Loading…
Reference in New Issue
Block a user