46dcf3a8f0
## Description
1. Add new ```appPositioningType``` : ANVIL.
2. Create new code path and folder structure for Anvil layout system.
3. Move common pieces of functionalities between autoLayout and anvil to
anvil folder structure (e.g. ```CanvasResizer```).
4. Create ```AnvilFlexComponent```.
5. Use WDS Flex component in AnvilFlexComponent.
6. Pass min max size props in a data structure that is supported by
container queries in the Flex component.
e.g. min-width: { base: "120px", "480px": "200px" }
7. Supply the following flex properties (flex-grow flex-shrink
flex-basis) to widgets depending on their ```responsiveBehvaiour```:
a) Fill: ```flex: 1 1 0%;```
b) Hug: ```flex: 0 0 auto;```
#### PR fixes following issue(s)
Fixes # (issue number)
1. [#26987](https://github.com/appsmithorg/appsmith/issues/26987)
2. [#26609](https://github.com/appsmithorg/appsmith/issues/26609)
3. [#26611](https://github.com/appsmithorg/appsmith/issues/26611)
#### Type of change
- New feature (non-breaking change which adds functionality)
## Testing
>
#### How Has This Been Tested?
> Please describe the tests that you ran to verify your changes. Also
list any relevant details for your test configuration.
> Delete anything that is not relevant
- [x] Manual
- [ ] JUnit
- [x] Jest
- [ ] Cypress
## Checklist:
#### Dev activity
- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my own code
- [x] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [x] PR is being merged under a feature flag
#### QA activity:
- [ ] [Speedbreak
features](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#speedbreakers-)
have been covered
- [ ] Test plan covers all impacted features and [areas of
interest](https://github.com/appsmithorg/TestSmith/wiki/Guidelines-for-test-plans#areas-of-interest-)
- [ ] Test plan has been peer reviewed by project stakeholders and other
QA members
- [ ] Manually tested functionality on DP
- [ ] We had an implementation alignment call with stakeholders post QA
Round 2
- [ ] Cypress test cases have been added and approved by SDET/manual QA
- [ ] Added `Test Plan Approved` label after Cypress tests were reviewed
- [ ] Added `Test Plan Approved` label after JUnit tests were reviewed
---------
Co-authored-by: Ashok Kumar M <35134347+marks0351@users.noreply.github.com>
Co-authored-by: Aswath K <aswath.sana@gmail.com>
Co-authored-by: rahulramesha <rahul@appsmith.com>
Co-authored-by: rahulramesha <71900764+rahulramesha@users.noreply.github.com>
76 lines
1.3 KiB
TypeScript
76 lines
1.3 KiB
TypeScript
export enum LayoutDirection {
|
|
Horizontal = "Horizontal",
|
|
Vertical = "Vertical",
|
|
}
|
|
|
|
export enum JustifyContent {
|
|
FlexStart = "flex-start",
|
|
Center = "center",
|
|
SpaceAround = "space-around",
|
|
SpaceBetween = "space-between",
|
|
SpaceEvenly = "space-evenly",
|
|
FlexEnd = "flex-end",
|
|
}
|
|
|
|
export enum AlignItems {
|
|
FlexStart = "flex-start",
|
|
Center = "center",
|
|
Stretch = "stretch",
|
|
FlexEnd = "flex-end",
|
|
}
|
|
|
|
export enum Positioning {
|
|
Fixed = "fixed",
|
|
Horizontal = "horizontal",
|
|
Vertical = "vertical",
|
|
}
|
|
|
|
export enum ResponsiveBehavior {
|
|
Fill = "fill",
|
|
Hug = "hug",
|
|
}
|
|
|
|
export enum FlexDirection {
|
|
Row = "row",
|
|
RowReverse = "row-reverse",
|
|
Column = "column",
|
|
ColumnReverse = "column-reverse",
|
|
}
|
|
|
|
export enum Alignment {
|
|
Top = "top",
|
|
Bottom = "bottom",
|
|
Left = "left",
|
|
Right = "right",
|
|
}
|
|
|
|
export enum Spacing {
|
|
None = "none",
|
|
Equal = "equal",
|
|
SpaceBetween = "space-between",
|
|
}
|
|
|
|
export enum Overflow {
|
|
Wrap = "wrap",
|
|
NoWrap = "nowrap",
|
|
Hidden = "hidden",
|
|
Scroll = "scroll",
|
|
Auto = "auto",
|
|
}
|
|
|
|
export enum FlexLayerAlignment {
|
|
None = "none",
|
|
Start = "start",
|
|
Center = "center",
|
|
End = "end",
|
|
}
|
|
|
|
export enum FlexVerticalAlignment {
|
|
Top = "start",
|
|
Center = "center",
|
|
Bottom = "end",
|
|
}
|
|
|
|
export const ROW_GAP = 12;
|
|
export const MOBILE_ROW_GAP = 8;
|