Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: add overflow.lockedPoints #73

Open
wants to merge 2 commits into
base: master
Choose a base branch
from

Conversation

jencia
Copy link

@jencia jencia commented Mar 3, 2023

动机

项目里使用了 antd 的 Popover 组件,然后发现他的对齐适配规则不符合需求,阅读源码后发现底层依赖的是 dom-align ,也就是当前这个库。研究完发现想要解决问题最好的方式是优化下这个库,相信这个问题很多人也会这类需求。

目标

当容器空间不足于放下元素时,经常需要做适配调整,而适配规则可以有三种:

  1. 不做适配
  2. 切换另一种对齐规则,例如原本是顶端对齐,切换到底端对齐
  3. 往空间充裕的地方偏移

这个库目前支持前面两种,我期望能实现第三种。

1. 不做适配

不配置 overflow 值

image

2. 切换对齐规则

overflow.adjustY = 1

image

3. 往空间充裕的地方偏移

overflow.adjustY = 1
overflow.lockedPoints = 1

image

提案内容

支持第三种适配规则

overflow 增加 lockedPoints 字段

{
    points: [string, string];
    offset: [nubmer, number];
    targetOffset: [number, number];
    overflow: {
        adjustX: boolean;
        adjustY: boolean;
        alwaysByViewport: boolean;
+       lockedPoints: boolean
    }
}

为什么字段名叫 lockedPoints 呢?

在原有的适配规则是切换对齐规则,也就是对 points 做反下,偏移量相应的也反下。在新的适配规则里,只是不做对齐规则切换,其他的逻辑都保持一致。这个动作更像是把 points 对齐规则锁定住,也就是 points 是否被锁定的问题。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant