fumidesign
93eb42812d
feat: animation
|
3 years ago | |
|---|---|---|
| .. | ||
| _portal | 4 years ago | |
| anchor | 3 years ago | |
| autoComplete | 3 years ago | |
| avatar | 3 years ago | |
| backtop | 4 years ago | |
| badge | 4 years ago | |
| banner | 4 years ago | |
| base | 3 years ago | |
| breadcrumb | 3 years ago | |
| button | 3 years ago | |
| calendar | 3 years ago | |
| card | 4 years ago | |
| carousel | 3 years ago | |
| cascader | 3 years ago | |
| checkbox | 3 years ago | |
| collapse | 3 years ago | |
| collapsible | 4 years ago | |
| datePicker | 3 years ago | |
| descriptions | 4 years ago | |
| divider | 3 years ago | |
| dropdown | 3 years ago | |
| empty | 4 years ago | |
| form | 3 years ago | |
| grid | 4 years ago | |
| icons | 3 years ago | |
| input | 3 years ago | |
| inputNumber | 3 years ago | |
| keyframes | 4 years ago | |
| layout | 4 years ago | |
| list | 3 years ago | |
| modal | 3 years ago | |
| navigation | 3 years ago | |
| notification | 3 years ago | |
| overflowList | 3 years ago | |
| pagination | 3 years ago | |
| popconfirm | 3 years ago | |
| popover | 3 years ago | |
| progress | 4 years ago | |
| radio | 3 years ago | |
| rating | 3 years ago | |
| scripts | 4 years ago | |
| scrollList | 3 years ago | |
| select | 3 years ago | |
| sideSheet | 3 years ago | |
| skeleton | 4 years ago | |
| slider | 3 years ago | |
| space | 4 years ago | |
| spin | 4 years ago | |
| steps | 3 years ago | |
| switch | 3 years ago | |
| table | 3 years ago | |
| tabs | 3 years ago | |
| tag | 3 years ago | |
| tagInput | 3 years ago | |
| timePicker | 3 years ago | |
| timeline | 3 years ago | |
| toast | 3 years ago | |
| tooltip | 3 years ago | |
| transfer | 3 years ago | |
| tree | 3 years ago | |
| treeSelect | 3 years ago | |
| typography | 4 years ago | |
| upload | 3 years ago | |
| utils | 3 years ago | |
| README.md | 4 years ago | |
| getBabelConfig.js | 3 years ago | |
| gulpfile.js | 3 years ago | |
| package.json | 3 years ago | |
| tsconfig.json | 3 years ago | |
README.md
The infrastructure layer is used to build modern component libraries.
Semi UI adopts a set of cross-front-end framework technical solutions to split the JavaScript of each component into two parts: Foundation and Adapter.
This allows us to reuse Foundation code across frameworks by only re-implementing the adapter, e.g, React and Vue. Quickly build common component libraries on different platforms.
Foundation
Foundationcontains the business logic that best representsSemi Designwithout actually referencing any DOM elements.FoundationdelegatesAdaptermethods for any logic that requires DOM manipulationAdapter
Adapteris an interface that has all the methods needed byFoundationto implementSemi Designbusiness logic.Adaptercan have many implementations, allowing interoperability with different frameworks.
Directory Structure
├── semi-foundation // Foundation and Stylesheet of component
│ ├── utils
│ └── tooltip
│ ├── constants.js // Constant definition, including numbers, strings, cssClass
│ ├── foundation.js // Core foundation
│ ├── tooltip.scss // Stylesheet
│ ├── mixin.scss // Scss mixin
│ ├── rtl.scss // Rtl
│ ├── variables.scss // Scss variable
Related documents
License
MIT