嘿，詹姆斯。

这是一个很好的主意！我喜欢上一个模型中的紧凑视图！
唯一出现的问题是控件变得太小而无法处理。
尝试一下会很有趣！

我很好奇。那些笨重的轨道上有什么想法？

对于列的排列，当使用自定义值时，您会怎么想？

如果滑块的新设计能够解决中描述的未设置/继承/默认问题，那就太好了#43082（评论）。在修改之前，这个设计看起来是否与“无”相同？

单独且更专注于此特定问题，您是否考虑过将它们安排为+形状，以明确与每一侧关联的滑块？

（请原谅我很快地重新排列了上面的屏幕截图，间距和对齐方式肯定很乱）

我真的很感激能够同时设置上/下和左/右，因为我通常希望左/右和上/下平衡。这样的东西怎么样？

（非常快速的粗略模型）

我不确定此布局所需的额外行是否值得。如果我们可以删除标签，可能会更好，但我们仍然需要容纳“自定义”图标，这意味着您最终会得到如下结果：

如果实际的距离控制是在popover中呢？同样，非常粗略的快速模型：

这也可能允许在有7个以上选项时使用范围控件，因为它可能会比边栏宽度更宽？

如何从单独的水平/垂直填充控件过渡到完全不链接？

连续单击。

如何为一侧指定自定义值，而为另一侧使用预设值？

是 啊。的确。我确实认为，正如科里所建议的那样，这可能发生在教皇内部。就压缩而言，就高级存在而言先进的，我确实认为可能需要popover来实现良好的默认压缩。

WFM公司。让我们用它来更新罚单。很高兴这样做，除非你准备好了？

我继续用新的设计方案更新了这个问题。它们是向前迈出的一大步，无论怎样，双色调图像都将有助于显示侧面，而且它们不排除未来的进一步增强。

👋 我已经开始处理提议的UI更新。虽然我有几个问题，但它还是会来的。

1. 是否可以将模型中的建议图标作为SVG或Figma链接？
   • 我可以从组件包中导出BoxControlIcon，并将其重新用于各个侧面&自定义
   • 我相信“水平和垂直”选项图标是新的
   • 我还想确认新的布局是否与所需的网格间距相匹配
2. 难道我们还需要此控件的“链接”视图，以便可以同时编辑所有边吗？
   • 它似乎不是模型下拉列表中的选项。
3. 选择选项时下拉列表是否应自动关闭？
   • 最近，由于种种担忧，这似乎被避免了。
4. 目前，在主干上，间距控件将显示一个提示，我们是否仍需要该功能和建议的UI更改？
   • 我们可能能够为链接视图和单个侧面执行此操作
   • 那些具有多个控件且只有一个标签的视图实际上没有地方呈现提示

下面是我迄今为止所拥有的非常粗糙的PoC的快速演示。它重用方框控制图标尽可能地。

是否可以将模型中的拟议图标作为SVG或Figma链接？

全部4项：

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”enable-background:new 0 0 24 24“viewBox=”0 0 24 24><path d=“M3.5 17H5V7H3.5v10zM7 20.5h10V19H7v1.5zM19 7v10h1.5V7H19zM7 5h10V3.5H7V5z”style=“fill:#1e1e1e”/></svg>

所有4个连接（轴向）：

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”启用背景：新建0 0 24 24“viewBox=”0 0 24 24“><path d=”M8.2 5.3h8V3.8h-8v1.5zm0 14.5h8v-1.5h-8v1.15zm3.5-6.5h1v-1h-1v1zm1-6.5h-1v.5h1v-1.5zm-1 4.5h1v-1 v1zm-2h1v-1v-1v1jm0 7.5h1v-0.5h-1 v1h1v-1-zm-8.5 1.5h1.5v-8H4.2v8zm14.5-8v8h1.5v-8 h-1.5zm-5 4.5v-1h-1 1h-.5v1zm-8-1v1h1v-1h-1zm6 0v1h1-v-1h-1'“style=”fill-rule:偶数；clip-rule：偶数；填充：#1e1e1e“/></svg>

左/右

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”enable-background:new 0 24 24“viewBox=”0 0 24 24”><path d=“M3.5 17H5V7H3.5v10zM19 7v10h1.5V7H19z”style=“fill:#1e1e1e”/><path-d=“M7 20.5h10V19H7v1.5zm0-17V5h10V3.5H7z”style:“不透明度：.1；填充：#1e1e1e；启用背景：新“/></svg>

顶部/底部

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”enable-background:new 0 0 24 24“viewBox=”0 0 24 24><path d=“M3.5 17H5V7H3.5v10zM19 7v10h1.5V7H19z”style=“不透明度：.1；填充：#1e1e1e；启用背景：new“/><path d=”M7 20.5h10V19H7v1.5zm0-17V5h10V3.5H7z“style=”fill:#1e1e1e“/></svg>

左侧：

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”enable-background:new 0 24 24“viewBox=”0 0 24 24”><path d=“M5 17H3.5V7H5v10z”style=“fill:#1e1e1e”/><path=“M7 20.5h10V19H7v1.5zM19 7v10h1.5V7H19zM7 5h10V3.5H7V5z”style=“不透明度：.1；填充：#1e1e1e；启用背景：新“/></svg>

底部

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”enable-background:new 0 0 24 24“viewBox=”0 0 24 24><path d=“M7 20.5h10V19H7v1.5z”style=“fill:#1e1e1e”/><patch d=“M3.5 17H5V7H3.5v10zM19 7v10h1.5V7H19zM7 5h10V3.5H7V5z”style:“不透明度：.1；填充：#1e1e1e；启用背景：新“/></svg>

赖特

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”enable-background:new 0 0 24 24“viewBox=”0 0 24 24><path d=“M20.5 7H19v10h1.5V7z”style=“fill:#1e1e1e”/><path d=“M3.5 17H5V7H3.5v10zM7 20.5h10V19H7v1.5zm0-17V5h10V3.5H7z”样式=“不透明度：.1；填充：#1e1e1e；启用背景：新“/></svg>

顶部

<svg xmlns=“http://www.w3.org/2000/svg“xml:space=”preserve“style=”enable-background:new 0 0 24 24“viewBox=”0 0 24 24><path d=“M3.5 17H5V7H3.5v10zM7 20.5h10V19H7v1.5zM19 7v10h1.5V7H19z”style=“opacity:.1；填充：#1e1e1e；启用背景：new“/><path d=”M7 5h10V3.5H7V5z“style=”fill:#1e1e1e“/></svg>

难道我们还需要此控件的“链接”视图，以便可以同时编辑所有边吗？

@詹姆斯科斯特我想知道这是否是我们的疏忽？我忘了我们在这里讨论了什么。

选择选项时下拉列表是否应自动关闭？

我认为两者都可以在这里工作。大多数情况下，我是团队自动关闭，需要更多地了解可访问性反馈。我认为关于一致性的更大对话可以分开进行。

看起来不错！

Iirc我们决定使用单独的控件，将水平+垂直作为适当的默认值，而不需要全方位链接状态。如果需要的话，这个设计可能可以容纳一个。

感谢您的图标和反馈👍

我有一份公关草案#50660。还有很多东西要擦亮，所以还是加点盐吧。

它还保留控件的链接/所有边视图。主要是因为涵盖了自定义块上可能出现的奇数侧支撑配置，例如[“顶部”、“右侧”、“底部”]它还将最初的足迹保持在最低限度，这似乎符合本问题的精神，但我很高兴在此重复。

除此之外，我还有两个问题；

1. 我们仍然想保留与旧版本控件类似的提示吗？
   • 在旧控件中，我们将在标签旁边显示提示。
   • 有了新的设计，我们不必在旁边贴上标签来显示提示。
2. 如果我们要保持链接/所有侧视图，如果只支持一个轴，我们是否应该忽略轴向视图？
   • 如果我们有一个侧面配置[“顶部”、“底部”]，轴视图（“垂直”）与所有侧视图几乎相同。
   • 主要区别是轴向视图有一个重复的垂直图标

毫无疑问，随着我们的迭代，我会有更多的问题，但这是我今天大脑能处理的全部问题🙂

对我来说，这些提示并不是非常有用，只是增加了噪音。所以我不会介意失去他们。

如果我们要保持链接/所有侧视图，如果只支持一个轴，我们是否应该忽略轴向视图？

侧面配置是否已内置在控件中？限制用户可以添加/编辑填充的边似乎有点奇怪🤔 如果是，那么显示禁用配置的选项可能没有意义。如果我误解了这个问题，请道歉。FWIW我仍然倾向于忽略链接/所有方面的视图。很少需要相同的垂直和水平填充。

对我来说，这些提示并不是非常有用，只是增加了噪音。所以我不会介意失去他们。

👍 听起来像是个计划。我会把它们放在外面。

侧面配置是否已内置在控件中？

这是正确的。从顶部、右侧、底部和左侧配置任何受支持侧的功能是补充早在2021年4月。之后不久，它被扩展，以允许在block.json sides配置中支持轴向侧（水平和垂直）。

限制用户可以添加/编辑填充的边似乎有点奇怪

我同意。有几个块将填料仅限制在轴向侧，即水平和垂直侧，不支持单个侧。按钮块是其中的主要示例。

第三方模块可以根据需要配置其侧面。因此[上、右、下、左、水平、垂直]

这里值得注意的另一件事是，这种侧边配置方法同样适用于所有限位块支架，它们（边缘、块间隙等）共享相同的间距控制。

如果是，那么是的，显示禁用配置的选项可能没有意义

的当前状态#50660没有显示任何禁用侧的控件。问题是只有一个轴向侧通过[“顶部”、“底部”]，“链接”视图实际上与仅显示单个控件的“轴向”视图相同。

关于包含“链接”视图，我暂时保留了它，以覆盖与水平和垂直轴向视图不整齐对齐的侧面配置。

一个人为的示例可能是第三方块，使用内部块模板带有自定义子块。它可能会将自定义子块样式设置为显示在右上角，并且他们希望只允许为左侧和底部配置边距。（我确实说过是人为的🙂). 在这种情况下，我认为默认为“轴向”视图是没有意义的。

我们可以默认为包含所有独立控件的“自定义”视图。这会不会破坏减少这种控制所带来的影响？或者这是一个我们暂时可以安全忽略的边缘情况吗？

我很高兴迭代#50660我当然可以删除“链接”视图，或者我们只能将其包含在诸如[上、下、左]等可能更有用的地方。

感谢您对此的指导和指导🙇

我们可以默认为包含所有独立控件的“自定义”视图。

在您的示例中，这对我来说最有意义。我认为这不会破坏“减少占用空间”的目标，因为只会表示可编辑的边，所以在本例中有两个控件。它确实让人觉得有点边缘化，我们也许可以回过头来看。

谢谢你的努力，这是一个棘手的问题！

我有一个与这个特定的公关无关的问题，但在观察当前WIP时，我想到了这个问题：对于不同书写方向的语言（如RTL，甚至自上而下），我们如何处理这些边距？也就是说，无论书写方向如何，“左边距”总是应用于容器的左侧吗？

我们是否考虑过使用类似于逻辑CSS属性所以我们的布局不确定方向？这在多语言网站的环境中尤其有趣。

（请原谅我的暂停，绝对不会阻止这个问题）。

在你的例子中，这对我来说最有意义。

我已经删除了链接视图，控件现在默认为轴视图（如果可用），单侧视图（如果仅支持此视图），以及自定义视图（用于边案例配置），或者当单个边具有混合值时。

这个公共关系仍然需要一些改进，但它处于一种状态，您可以运行它并感受到新的用户体验。

我们如何处理这些利润？例如，不管书写方向如何，“左边距”总是应用于容器的左侧吗？

在这个阶段，风格引擎就是这样的将值映射到CSS样式，它遵循块支持的最初方法。

我们是否考虑过使用类似于逻辑CSS属性所以我们的布局不确定方向？这在多语言网站的环境中尤其有趣。

好问题。从长远来看，我预计我们将需要实现这样的目标。

更新块支持和样式引擎以生成具有逻辑CSS属性的正确样式应该非常简单。操纵控件的UI以反映物理间距可能会更复杂一些。我希望样式对象保持相当一致，所以幸运的是，技巧是将适当的标签和图标应用于各个间距大小控件。

这将是一个很好的后续探索，以便在其需求变得更加紧迫之前保持稳定。