Browse Source

docs: add reference of typography utils, add inspired source of form & F/A

pointhalo 4 years ago
parent
commit
3f1e99ae84

+ 6 - 0
packages/semi-foundation/base/foundation.ts

@@ -1,3 +1,9 @@
+/**
+ * The Semi Foundation / Adapter architecture split was inspired by Material Component For Web. (https://github.com/material-components/material-components-web)
+ * We re-implemented our own code based on the principle and added more functions we need according to actual needs.
+ * 
+ */
+ 
 import log from '../utils/log';
 import { noop } from 'lodash-es';
 

+ 4 - 0
packages/semi-ui/_base/baseComponent.tsx

@@ -1,3 +1,7 @@
+/**
+ * The Semi Foundation / Adapter architecture split was inspired by Material Component For Web. (https://github.com/material-components/material-components-web)
+ * We re-implemented our own code based on the principle and added more functions we need according to actual needs.
+ */
 import React, { Component } from 'react';
 import log from '@douyinfe/semi-foundation/utils/log';
 import { DefaultAdapter } from '@douyinfe/semi-foundation/base/foundation';

+ 8 - 0
packages/semi-ui/form/index.tsx

@@ -1,3 +1,11 @@
+/**
+ * The early design of Semi Form was inspired by informed (https://github.com/joepuzzo/informed) and formik(https://github.com/formium/formik)
+ * The informed API design is very concise, and formik has very clear naming of the form status.
+ * However, due to the requirements of convenient scalability (we need to split into F/A architecture), in additional they have their own binding verification library,
+ * we cannot directly reuse such libraries.
+ * So we fully absorbed these excellent api designs. Combining the technical principles of the two to implement our own code,
+ */
+
 // FormComponent
 import Form from './baseForm';
 import Label from './label';

+ 7 - 0
packages/semi-ui/typography/util.tsx

@@ -1,6 +1,13 @@
 import ReactDOM from 'react-dom';
 import React from 'react';
 
+/**
+ * The logic of JS for text truncation is referenced from antd typography
+ * https://github.com/ant-design/ant-design/blob/master/components/typography/util.tsx
+ * 
+ * For more thinking and analysis about this function, please refer to Feishu document
+ * https://bytedance.feishu.cn/docs/doccnqovjjyoKm2U5O13bj30aTh
+ */
 
 let ellipsisContainer: HTMLElement;