@type-dom/ui 0.2.2 → 0.3.0

package/dist/src/components/navigation/td-tabs/td-tabs.const.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.const.js","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.const.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAI9D,MAAM,CAAC,MAAM,SAAS,GAAc;IAClC,WAAW,EAAE,KAAK;IAClB,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI;CACxB,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,KAAc,EAA4B,EAAE,CAC9D,QAAQ,CAAC,KAAK,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC;AAErC,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,CAAC,kBAAkB,CAAC,EAAE,CAAC,IAAiB,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC;IAC7D,QAAQ,EAAE,CAAC,IAAqB,EAAE,EAAS,EAAE,EAAE,CAAC,EAAE,YAAY,KAAK;IACnE,SAAS,EAAE,CAAC,IAAiB,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC;IAClD,IAAI,EAAE,CAAC,QAAiC,EAAE,MAAwB,EAAE,EAAE,CACpE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC;IACpC,SAAS,EAAE,CAAC,IAAiB,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC;IAClD,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI;CACnB,CAAC"}

package/dist/src/components/navigation/td-tabs/td-tabs.interface.d.ts

@@ -0,0 +1,66 @@
+import { IStyle } from '@type-dom/css-type';
+import { ITypeDiv, TypeDivProps } from '@type-dom/framework';
+import { TdIcon } from '../../basic/td-icon/td-icon.class';
+import { TdTabPane } from '../td-tab-pane/td-tab-pane.class';
+export interface ITdTabs extends ITypeDiv {
+    className: 'TdTabs';
+}
+export interface TabsProps extends TypeDivProps {
+    /**
+     * @description type of Tab
+     *     default: '',
+     */
+    type?: 'card' | 'border-card' | '';
+    /**
+     * @description whether Tab is closable
+     */
+    closable?: boolean;
+    /**
+     * @description whether Tab is addable
+     */
+    addable?: boolean;
+    /**
+     * @description binding value, name of the selected tab
+     */
+    modelValue?: string | number;
+    /**
+     * @description whether Tab is addable and closable
+     */
+    editable?: boolean;
+    /**
+     * @description position of tabs
+     *     default: 'top',
+     */
+    tabPosition?: 'top' | 'right' | 'bottom' | 'left';
+    /**
+     * @description hook function before switching tab. If `false` is returned or a `Promise` is returned and then is rejected, switching will be prevented
+     *     default: () => true,
+     */
+    beforeLeave?: (newName: TabPaneName, oldName: TabPaneName | undefined) => void | boolean;
+    /**
+     * @description whether width of tab automatically fits its container
+     */
+    stretch?: boolean;
+    contentStyle?: IStyle;
+    slot?: TdTabPane[];
+    slots?: {
+        addIcon?: TdIcon;
+    };
+}
+export type TabsPanes = Record<number, TabsPaneContext>;
+export type TabPaneName = string | number;
+export type TabsPaneContext = {
+    uid: number;
+    config: TabsProps;
+    paneName: TabPaneName;
+    active: boolean;
+    index: string | undefined;
+    isClosable: boolean;
+};
+export interface ITabsRootContext {
+    config: TabsProps;
+    currentName: TabPaneName;
+    registerPane: (pane: TabsPaneContext) => void;
+    unregisterPane: (uid: number) => void;
+}
+//# sourceMappingURL=td-tabs.interface.d.ts.map

package/dist/src/components/navigation/td-tabs/td-tabs.interface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.interface.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAC5C,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAE7D,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAC;AAE3D,OAAO,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAE7D,MAAM,WAAW,OAAQ,SAAQ,QAAQ;IACvC,SAAS,EAAE,QAAQ,CAAC;CACrB;AAED,MAAM,WAAW,SAAU,SAAQ,YAAY;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,aAAa,GAAG,EAAE,CAAC;IACnC;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,WAAW,CAAC,EAAE,KAAK,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAClD;;;OAGG;IACH,WAAW,CAAC,EAAE,CACZ,OAAO,EAAE,WAAW,EACpB,OAAO,EAAE,WAAW,GAAG,SAAS,KAC7B,IAAI,GAAG,OAAO,CAAC;IAIpB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,IAAI,CAAC,EAAE,SAAS,EAAE,CAAC;IACnB,KAAK,CAAC,EAAE;QACN,OAAO,CAAC,EAAE,MAAM,CAAC;KAClB,CAAC;CACH;AAED,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,eAAe,CAAC,CAAC;AAExD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAC1C,MAAM,MAAM,eAAe,GAAG;IAC5B,GAAG,EAAE,MAAM,CAAC;IAEZ,MAAM,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,WAAW,CAAC;IACtB,MAAM,EAAE,OAAO,CAAC;IAChB,KAAK,EAAE,MAAM,GAAG,SAAS,CAAC;IAC1B,UAAU,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,SAAS,CAAC;IAClB,WAAW,EAAE,WAAW,CAAC;IACzB,YAAY,EAAE,CAAC,IAAI,EAAE,eAAe,KAAK,IAAI,CAAC;IAC9C,cAAc,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;CACvC"}

package/dist/src/components/navigation/td-tabs/td-tabs.interface.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=td-tabs.interface.js.map

package/dist/src/components/navigation/td-tabs/td-tabs.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.interface.js","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.interface.ts"],"names":[],"mappings":""}

package/dist/src/components/navigation/td-tabs/td-tabs.style.d.ts

@@ -0,0 +1,20 @@
+import { IStyle } from '@type-dom/css-type';
+import { TabsProps } from './td-tabs.interface';
+export declare const $tabs: {
+    headerHeight: string;
+};
+export declare const $tabsStyle: IStyle;
+export declare const $tabsHeaderStyle: IStyle;
+export declare const $tabsHeaderVerticalStyle: IStyle;
+export declare const $tabsActiveBarStyle: IStyle;
+export declare const $tabsNewTabStyle: IStyle;
+export declare const $tabsNavWrapStyle: IStyle;
+export declare const $tabsNavScrollStyle: IStyle;
+export declare const $tabsNavWrapAfterStyle: IStyle;
+export declare const $tabNavNextStyle: IStyle;
+export declare const $tabsNavPrevStyle: IStyle;
+export declare const $tabsNavStyle: IStyle;
+export declare const $tabsItemStyle: IStyle;
+export declare const $tabsContentStyle: IStyle;
+export declare function useStyle(config?: TabsProps): void;
+//# sourceMappingURL=td-tabs.style.d.ts.map

package/dist/src/components/navigation/td-tabs/td-tabs.style.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.style.d.ts","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.style.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAW5C,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAGhD,eAAO,MAAM,KAAK;;CAEjB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,MAExB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,MAO9B,CAAC;AAEF,eAAO,MAAM,wBAAwB,EAAE,MAEtC,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,MAuBjC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,MAiB9B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,MAK/B,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,MASjC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,MAUpC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,MAS9B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,MAAoC,CAAC;AAErE,eAAO,MAAM,aAAa,EAAE,MAS3B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,MAe5B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,MAG/B,CAAC;AAEF,wBAAgB,QAAQ,CAAC,MAAM,CAAC,EAAE,SAAS,QAAI"}

package/dist/src/components/navigation/td-tabs/td-tabs.style.js

@@ -0,0 +1,131 @@
+import { $borderColor, $colorPrimary, $fontSizes, $textColor, } from '../../../styles/var';
+import { $transitionDuration, $transitionFunction, } from '../../../styles/transition';
+import { deepClone } from '@type-dom/utils';
+export const $tabs = {
+    headerHeight: '40px',
+};
+export const $tabsStyle = {
+    display: 'flex',
+};
+export const $tabsHeaderStyle = {
+    padding: 0,
+    position: 'relative',
+    margin: '0 0 15px',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+};
+export const $tabsHeaderVerticalStyle = {
+    flexDirection: 'column',
+};
+export const $tabsActiveBarStyle = {
+    position: 'absolute',
+    bottom: 0,
+    left: 0,
+    height: '2px',
+    // background-color: getCssVar('color-primary'),
+    backgroundColor: $colorPrimary,
+    zIndex: 1,
+    // transition: width getCssVar('transition-duration',
+    // getCssVar('transition-function-ease-in-out-bezier'),
+    //   transform getCssVar('transition-duration',
+    // getCssVar('transition-function-ease-in-out-bezier'),
+    transition: 'width ' +
+        $transitionDuration +
+        ', ' +
+        $transitionFunction.easeInOutBezier +
+        ', ' +
+        'transform ' +
+        $transitionDuration +
+        ', ' +
+        $transitionFunction.easeInOutBezier,
+    listStyle: 'none',
+};
+export const $tabsNewTabStyle = {
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    // border: 1px solid getCssVar('border-color'),
+    border: '1px solid ' + $borderColor,
+    height: '20px',
+    width: '20px',
+    lineHeight: '20px',
+    margin: '10px 0 10px 10px',
+    borderRadius: '3px',
+    textAlign: 'center',
+    fontSize: '12px',
+    // color: getCssVar('text-color', 'primary'),
+    color: $textColor.primary,
+    cursor: 'pointer',
+    transition: 'all 0.15s',
+};
+export const $tabsNavWrapStyle = {
+    overflow: 'hidden',
+    marginBottom: '-1px',
+    position: 'relative',
+    flex: '1 auto',
+};
+export const $tabsNavScrollStyle = {
+    position: 'absolute',
+    cursor: 'pointer',
+    lineHeight: '44px',
+    fontSize: '12px',
+    // color: getCssVar('text-color', 'secondary'),
+    color: $textColor.secondary,
+    width: '20px',
+    textAlign: 'center',
+};
+export const $tabsNavWrapAfterStyle = {
+    // content: '',
+    position: 'absolute',
+    left: 0,
+    bottom: 0,
+    width: '100%',
+    height: '2px',
+    // background-color: getCssVar('border-color-light'),
+    backgroundColor: $borderColor.light,
+    // zIndex: getCssVar('index-normal'),
+};
+export const $tabNavNextStyle = {
+    position: 'absolute',
+    cursor: 'pointer',
+    lineHeight: '44px',
+    fontSize: '12px',
+    // color: getCssVar('text-color', 'secondary'),
+    color: $textColor.secondary,
+    width: '20px',
+    textAlign: 'center',
+};
+export const $tabsNavPrevStyle = deepClone($tabNavNextStyle);
+export const $tabsNavStyle = {
+    display: 'flex',
+    whiteSpace: 'nowrap',
+    position: 'relative',
+    // transition: transform getCssVar('transition-duration'),
+    transition: 'transform ' + $transitionDuration,
+    float: 'left',
+    // zIndex: calc(#{getCssVar('index-normal')} + 1),
+    zIndex: 'calc(index-normal + 1)',
+};
+export const $tabsItemStyle = {
+    padding: '0 20px',
+    // height: getCssVar('tabs', 'header-height'),
+    height: $tabs.headerHeight,
+    boxSizing: 'border-box',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    listStyle: 'none',
+    // font-size: getCssVar('font-size-base'),
+    fontSize: $fontSizes.base,
+    fontWeight: 500,
+    // color: getCssVar('text-color', 'primary'),
+    color: $textColor.primary,
+    position: 'relative',
+};
+export const $tabsContentStyle = {
+    overflow: 'hidden',
+    position: 'relative',
+};
+export function useStyle(config) { }
+//# sourceMappingURL=td-tabs.style.js.map

package/dist/src/components/navigation/td-tabs/td-tabs.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"td-tabs.style.js","sourceRoot":"","sources":["../../../../../src/components/navigation/td-tabs/td-tabs.style.ts"],"names":[],"mappings":"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"}

package/dist/src/components/others/collapsible-box/collapsible-box.d.ts

@@ -0,0 +1,15 @@
+import { TypeDiv } from '@type-dom/framework';
+import { CollapsibleBoxContents } from './contents/contents';
+import { ExpandHeading } from './heading/expand-heading';
+/**
+ * 可收缩盒子组件
+ */
+export declare class CollapsibleBox extends TypeDiv {
+    className: 'CollapsibleBox' | string;
+    childNodes: [ExpandHeading, CollapsibleBoxContents];
+    heading: ExpandHeading;
+    contents: CollapsibleBoxContents;
+    constructor();
+    get children(): (CollapsibleBoxContents | ExpandHeading)[];
+}
+//# sourceMappingURL=collapsible-box.d.ts.map

package/dist/src/components/others/collapsible-box/collapsible-box.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible-box.d.ts","sourceRoot":"","sources":["../../../../../src/components/others/collapsible-box/collapsible-box.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD;;GAEG;AACH,qBAAa,cAAe,SAAQ,OAAO;IACzC,SAAS,EAAE,gBAAgB,GAAG,MAAM,CAAC;IAC5B,UAAU,EAAE,CAAC,aAAa,EAAE,sBAAsB,CAAC,CAAC;IAC7D,OAAO,EAAE,aAAa,CAAC;IACvB,QAAQ,EAAE,sBAAsB,CAAC;;IAsBjC,IAAa,QAAQ,+CAEpB;CACF"}

package/dist/src/components/others/collapsible-box/collapsible-box.js

@@ -0,0 +1,31 @@
+import { TypeDiv } from '@type-dom/framework';
+import { CollapsibleBoxContents } from './contents/contents';
+import { ExpandHeading } from './heading/expand-heading';
+/**
+ * 可收缩盒子组件
+ */
+export class CollapsibleBox extends TypeDiv {
+    constructor() {
+        super();
+        this.className = 'CollapsibleBox';
+        this.style.addObj({
+            // borderTop: '1px solid #dddddd',
+            // borderBottom: '1px solid #dddddd',
+            listStyle: 'none',
+            padding: '3px',
+            marginBottom: '5px',
+        });
+        this.attr.addName('collapsible-box');
+        this.heading = new ExpandHeading('标题');
+        this.heading.parent = this;
+        this.contents = new CollapsibleBoxContents();
+        // 继承的类不能赋值this.contents;只能给this.contents添加子元素
+        this.contents.parent = this;
+        this.childNodes = [this.heading, this.contents];
+    }
+    // contents重新赋值后，children刷新。render渲染会变。
+    get children() {
+        return [this.heading, this.contents];
+    }
+}
+//# sourceMappingURL=collapsible-box.js.map

package/dist/src/components/others/collapsible-box/collapsible-box.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"collapsible-box.js","sourceRoot":"","sources":["../../../../../src/components/others/collapsible-box/collapsible-box.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,OAAO;IAMzC;QACE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,gBAAgB,CAAC;QAClC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YAChB,kCAAkC;YAClC,qCAAqC;YACrC,SAAS,EAAE,MAAM;YACjB,OAAO,EAAE,KAAK;YACd,YAAY,EAAE,KAAK;SACpB,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAC;QACrC,IAAI,CAAC,OAAO,GAAG,IAAI,aAAa,CAAC,IAAI,CAAC,CAAC;QACvC,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC;QAC3B,IAAI,CAAC,QAAQ,GAAG,IAAI,sBAAsB,EAAE,CAAC;QAC7C,8CAA8C;QAC9C,IAAI,CAAC,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC;QAC5B,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IAClD,CAAC;IAED,uCAAuC;IACvC,IAAa,QAAQ;QACnB,OAAO,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;IACvC,CAAC;CACF"}

package/dist/src/components/others/collapsible-box/contents/contents.d.ts

@@ -0,0 +1,8 @@
+import { TypeDiv } from '@type-dom/framework';
+import { CollapsibleBox } from '../collapsible-box';
+export declare class CollapsibleBoxContents extends TypeDiv {
+    className: 'CollapsibleBoxContents' | string;
+    parent?: CollapsibleBox;
+    constructor();
+}
+//# sourceMappingURL=contents.d.ts.map

package/dist/src/components/others/collapsible-box/contents/contents.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"contents.d.ts","sourceRoot":"","sources":["../../../../../../src/components/others/collapsible-box/contents/contents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AAEpD,qBAAa,sBAAuB,SAAQ,OAAO;IACjD,SAAS,EAAE,wBAAwB,GAAG,MAAM,CAAC;IAC7B,MAAM,CAAC,EAAE,cAAc,CAAC;;CAgBzC"}

package/dist/src/components/others/collapsible-box/contents/contents.js

@@ -0,0 +1,18 @@
+import { TypeDiv } from '@type-dom/framework';
+export class CollapsibleBoxContents extends TypeDiv {
+    // childNodes: ControlMenu[];
+    constructor() {
+        super();
+        this.className = 'CollapsibleBoxContents';
+        this.style.addObj({
+            display: 'flex',
+            flexWrap: 'wrap',
+            justifyContent: 'flex-start',
+            // width: '194px',
+            border: '1px solid #a0a0a0',
+        });
+        this.attr.addName('collapsible-box-contents');
+        this.childNodes = [];
+    }
+}
+//# sourceMappingURL=contents.js.map

package/dist/src/components/others/collapsible-box/contents/contents.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contents.js","sourceRoot":"","sources":["../../../../../../src/components/others/collapsible-box/contents/contents.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAG9C,MAAM,OAAO,sBAAuB,SAAQ,OAAO;IAIjD,6BAA6B;IAC7B;QACE,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,wBAAwB,CAAC;QAC1C,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YAChB,OAAO,EAAE,MAAM;YACf,QAAQ,EAAE,MAAM;YAChB,cAAc,EAAE,YAAY;YAC5B,kBAAkB;YAClB,MAAM,EAAE,mBAAmB;SAC5B,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,0BAA0B,CAAC,CAAC;QAC9C,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;IACvB,CAAC;CACF"}

package/dist/src/components/others/collapsible-box/heading/expand-heading.d.ts

@@ -0,0 +1,12 @@
+import { Span, TextNode, TypeDiv } from '@type-dom/framework';
+import { ElCaretBottomSvg } from '@type-dom/svgs';
+export declare class ExpandHeading extends TypeDiv {
+    className: 'ExpandHeading';
+    childNodes: [ElCaretBottomSvg, Span];
+    svg: ElCaretBottomSvg;
+    title: TextNode;
+    constructor(title: string);
+    setTitle(title: string): void;
+    setup(): void;
+}
+//# sourceMappingURL=expand-heading.d.ts.map

package/dist/src/components/others/collapsible-box/heading/expand-heading.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"expand-heading.d.ts","sourceRoot":"","sources":["../../../../../../src/components/others/collapsible-box/heading/expand-heading.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAY,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,qBAAa,aAAc,SAAQ,OAAO;IACxC,SAAS,EAAE,eAAe,CAAC;IAClB,UAAU,EAAE,CAAC,gBAAgB,EAAE,IAAI,CAAC,CAAC;IAC9C,GAAG,EAAE,gBAAgB,CAAC;IACtB,KAAK,EAAE,QAAQ,CAAC;gBAEJ,KAAK,EAAE,MAAM;IA+BzB,QAAQ,CAAC,KAAK,EAAE,MAAM;IAIb,KAAK,IAAI,IAAI;CA4BvB"}

package/dist/src/components/others/collapsible-box/heading/expand-heading.js

@@ -0,0 +1,68 @@
+import { Span, TextNode, TypeDiv, TypeHtml } from '@type-dom/framework';
+import { ElCaretBottomSvg } from '@type-dom/svgs';
+export class ExpandHeading extends TypeDiv {
+    constructor(title) {
+        super();
+        this.className = 'ExpandHeading';
+        this.style.addObj({
+            margin: '0',
+            paddingLeft: '10px',
+            boxSizing: 'border-box',
+            backgroundColor: '#a0a0a0',
+            color: '#fff',
+            textIndent: '20px',
+            borderRadius: '4px 4px 0 0',
+            width: '100%',
+            display: 'flex',
+            alignItems: 'center',
+            height: '36px',
+        });
+        this.attr.addName('expand-heading');
+        this.svg = new ElCaretBottomSvg({
+            attrObj: {
+                fill: '#FFF',
+            },
+        });
+        this.title = new TextNode(title);
+        // span.setStyle('verticalAlign', 'middle');
+        const span = new Span({
+            parent: this,
+            slot: [this.title],
+        });
+        this.childNodes = [this.svg, span];
+    }
+    setTitle(title) {
+        this.title.setText(title);
+    }
+    setup() {
+        this.svg.addEvents({
+            click: (e) => {
+                var _a, _b;
+                // console.log('expand-heading svg.dom clicked');
+                e === null || e === void 0 ? void 0 : e.stopPropagation();
+                // const style = getComputedStyle(this.svg.dom);
+                // console.log('style.transform is ', style.transform);
+                if (this.svg.style.get('transform') === 'rotate(-90deg)') {
+                    this.svg.style.setObj({
+                        transform: 'rotate(0deg)',
+                        transition: 'transform 0.3s',
+                    });
+                    // console.log('style.transform is ', style.transform);
+                    if (((_a = this.parent) === null || _a === void 0 ? void 0 : _a.lastChild) instanceof TypeHtml) {
+                        this.parent.lastChild.style.set('display', 'flex'); // flex
+                    }
+                }
+                else {
+                    this.svg.style.setObj({
+                        transform: 'rotate(-90deg)',
+                        transition: 'transform 0.3s',
+                    });
+                    if (((_b = this.parent) === null || _b === void 0 ? void 0 : _b.lastChild) instanceof TypeHtml) {
+                        this.parent.lastChild.style.set('display', 'none');
+                    }
+                }
+            },
+        });
+    }
+}
+//# sourceMappingURL=expand-heading.js.map

package/dist/src/components/others/collapsible-box/heading/expand-heading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"expand-heading.js","sourceRoot":"","sources":["../../../../../../src/components/others/collapsible-box/heading/expand-heading.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAElD,MAAM,OAAO,aAAc,SAAQ,OAAO;IAMxC,YAAY,KAAa;QACvB,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,eAAe,CAAC;QACjC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YAChB,MAAM,EAAE,GAAG;YACX,WAAW,EAAE,MAAM;YACnB,SAAS,EAAE,YAAY;YACvB,eAAe,EAAE,SAAS;YAC1B,KAAK,EAAE,MAAM;YACb,UAAU,EAAE,MAAM;YAClB,YAAY,EAAE,aAAa;YAC3B,KAAK,EAAE,MAAM;YACb,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,MAAM,EAAE,MAAM;SACf,CAAC,CAAC;QACH,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC;QACpC,IAAI,CAAC,GAAG,GAAG,IAAI,gBAAgB,CAAC;YAC9B,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF,CAAC,CAAC;QACH,IAAI,CAAC,KAAK,GAAG,IAAI,QAAQ,CAAC,KAAK,CAAC,CAAC;QACjC,4CAA4C;QAC5C,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC;YACpB,MAAM,EAAE,IAAI;YACZ,IAAI,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC;SACnB,CAAC,CAAC;QACH,IAAI,CAAC,UAAU,GAAG,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;IACrC,CAAC;IAED,QAAQ,CAAC,KAAa;QACpB,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC;IAEQ,KAAK;QACZ,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC;YACjB,KAAK,EAAE,CAAC,CAAC,EAAE,EAAE;;gBACX,iDAAiD;gBACjD,CAAC,aAAD,CAAC,uBAAD,CAAC,CAAE,eAAe,EAAE,CAAC;gBACrB,gDAAgD;gBAChD,uDAAuD;gBACvD,IAAI,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,KAAK,gBAAgB,EAAE,CAAC;oBACzD,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC;wBACpB,SAAS,EAAE,cAAc;wBACzB,UAAU,EAAE,gBAAgB;qBAC7B,CAAC,CAAC;oBACH,uDAAuD;oBACvD,IAAI,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,SAAS,aAAY,QAAQ,EAAE,CAAC;wBAC/C,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,OAAO;oBAC7D,CAAC;gBACH,CAAC;qBAAM,CAAC;oBACN,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,CAAC;wBACpB,SAAS,EAAE,gBAAgB;wBAC3B,UAAU,EAAE,gBAAgB;qBAC7B,CAAC,CAAC;oBACH,IAAI,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,SAAS,aAAY,QAAQ,EAAE,CAAC;wBAC/C,IAAI,CAAC,MAAM,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;oBACrD,CAAC;gBACH,CAAC;YACH,CAAC;SACF,CAAC,CAAC;IACL,CAAC;CACF"}

package/dist/src/components/others/custom-block/custom-block.d.ts

@@ -0,0 +1,12 @@
+import { TypeProps, TextNode, TypeDiv, TypeElement } from '@type-dom/framework';
+export interface ICustomBlockConfig extends TypeProps {
+    type?: 'tip' | 'warning';
+    title: string;
+    paragraphs: (TypeElement | TextNode | string)[];
+    blockquote?: TypeElement | TextNode;
+}
+export declare class CustomBlock extends TypeDiv {
+    className: 'CustomBlock';
+    constructor(params: ICustomBlockConfig);
+}
+//# sourceMappingURL=custom-block.d.ts.map

package/dist/src/components/others/custom-block/custom-block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-block.d.ts","sourceRoot":"","sources":["../../../../../src/components/others/custom-block/custom-block.ts"],"names":[],"mappings":"AAAA,OAAO,EAEL,SAAS,EAET,QAAQ,EACR,OAAO,EACP,WAAW,EACZ,MAAM,qBAAqB,CAAC;AAS7B,MAAM,WAAW,kBAAmB,SAAQ,SAAS;IACnD,IAAI,CAAC,EAAE,KAAK,GAAG,SAAS,CAAC;IAEzB,KAAK,EAAE,MAAM,CAAC;IACd,UAAU,EAAE,CAAC,WAAW,GAAG,QAAQ,GAAG,MAAM,CAAC,EAAE,CAAC;IAChD,UAAU,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAC;CACrC;AAED,qBAAa,WAAY,SAAQ,OAAO;IACtC,SAAS,EAAE,aAAa,CAAC;gBAEb,MAAM,EAAE,kBAAkB;CA0DvC"}

package/dist/src/components/others/custom-block/custom-block.js

@@ -0,0 +1,55 @@
+import { BlockQuote, P, TypeDiv, } from '@type-dom/framework';
+import { $borderColor, $colorDangerRgb, $colorPrimaryRgb, $colors, $textColor, } from '../../../styles/var';
+export class CustomBlock extends TypeDiv {
+    constructor(params) {
+        super();
+        this.className = 'CustomBlock';
+        this.attr.addName('tip');
+        const bgColor = params.type === 'warning' ? $colorDangerRgb : $colorPrimaryRgb;
+        const borderLeftColor = params.type === 'warning' ? $colors.danger.base : $colors.primary.base;
+        this.style.addObj({
+            padding: '8px 16px',
+            // background-color: var(--block-tip-bg-color),
+            backgroundColor: 'rgba(' + bgColor + ', 0.1)',
+            borderRadius: '4px',
+            // border-left: 5px solid var(--el-color-primary),
+            borderLeft: '5px solid ' + borderLeftColor,
+            margin: '20px 0',
+        });
+        if (params.title) {
+            this.addChild(new P({
+                slot: params.title,
+                styleObj: {
+                    fontSize: '1.1rem',
+                    fontWeight: 700,
+                    marginTop: '0',
+                },
+            }));
+        }
+        if (params.paragraphs) {
+            params.paragraphs.forEach((paragraph) => {
+                this.addChild(new P({
+                    styleObj: {
+                        fontSize: '0.9rem',
+                    },
+                    slot: [paragraph],
+                }));
+            });
+        }
+        if (params.blockquote) {
+            this.addChild(new BlockQuote({
+                styleObj: {
+                    margin: '1rem 0',
+                    // border-left: .2rem solid var(--el-border-color),
+                    borderLeft: '.2rem solid ' + $borderColor.base,
+                    padding: '.25rem 0 .25rem 1rem',
+                    fontSize: '1rem',
+                    // color: var(--text-color-lighter),
+                    color: $textColor.secondary,
+                },
+                slot: [params.blockquote],
+            }));
+        }
+    }
+}
+//# sourceMappingURL=custom-block.js.map

package/dist/src/components/others/custom-block/custom-block.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"custom-block.js","sourceRoot":"","sources":["../../../../../src/components/others/custom-block/custom-block.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,UAAU,EAEV,CAAC,EAED,OAAO,GAER,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EACL,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,OAAO,EACP,UAAU,GACX,MAAM,qBAAqB,CAAC;AAU7B,MAAM,OAAO,WAAY,SAAQ,OAAO;IAGtC,YAAY,MAA0B;QACpC,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,aAAa,CAAC;QAC/B,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACzB,MAAM,OAAO,GACX,MAAM,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,CAAC;QACjE,MAAM,eAAe,GACnB,MAAM,CAAC,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC;QACzE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YAChB,OAAO,EAAE,UAAU;YACnB,+CAA+C;YAC/C,eAAe,EAAE,OAAO,GAAG,OAAO,GAAG,QAAQ;YAC7C,YAAY,EAAE,KAAK;YACnB,kDAAkD;YAClD,UAAU,EAAE,YAAY,GAAG,eAAe;YAC1C,MAAM,EAAE,QAAQ;SACjB,CAAC,CAAC;QACH,IAAI,MAAM,CAAC,KAAK,EAAE,CAAC;YACjB,IAAI,CAAC,QAAQ,CACX,IAAI,CAAC,CAAC;gBACJ,IAAI,EAAE,MAAM,CAAC,KAAK;gBAClB,QAAQ,EAAE;oBACR,QAAQ,EAAE,QAAQ;oBAClB,UAAU,EAAE,GAAG;oBACf,SAAS,EAAE,GAAG;iBACf;aACF,CAAC,CACH,CAAC;QACJ,CAAC;QACD,IAAI,MAAM,CAAC,UAAU,EAAE,CAAC;YACtB,MAAM,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,SAAS,EAAE,EAAE;gBACtC,IAAI,CAAC,QAAQ,CACX,IAAI,CAAC,CAAC;oBACJ,QAAQ,EAAE;wBACR,QAAQ,EAAE,QAAQ;qBACnB;oBACD,IAAI,EAAE,CAAC,SAAS,CAAC;iBAClB,CAAC,CACH,CAAC;YACJ,CAAC,CAAC,CAAC;QACL,CAAC;QACD,IAAI,MAAM,CAAC,UAAU,EAAE,CAAC;YACtB,IAAI,CAAC,QAAQ,CACX,IAAI,UAAU,CAAC;gBACb,QAAQ,EAAE;oBACR,MAAM,EAAE,QAAQ;oBAChB,mDAAmD;oBACnD,UAAU,EAAE,cAAc,GAAG,YAAY,CAAC,IAAI;oBAC9C,OAAO,EAAE,sBAAsB;oBAC/B,QAAQ,EAAE,MAAM;oBAChB,oCAAoC;oBACpC,KAAK,EAAE,UAAU,CAAC,SAAS;iBAC5B;gBACD,IAAI,EAAE,CAAC,MAAM,CAAC,UAAU,CAAC;aAC1B,CAAC,CACH,CAAC;QACJ,CAAC;IACH,CAAC;CACF"}

package/dist/src/components/others/example/example-float-control.d.ts

@@ -0,0 +1,9 @@
+import { TypeProps, TypeDiv } from '@type-dom/framework';
+import { Example } from './example';
+export declare class ExampleFloatControl extends TypeDiv {
+    className: 'ExampleFloatControl';
+    parent: Example;
+    constructor(params: TypeProps);
+    setup(): void;
+}
+//# sourceMappingURL=example-float-control.d.ts.map

package/dist/src/components/others/example/example-float-control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"example-float-control.d.ts","sourceRoot":"","sources":["../../../../../src/components/others/example/example-float-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAQ,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAI/D,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,qBAAa,mBAAoB,SAAQ,OAAO;IAC9C,SAAS,EAAE,qBAAqB,CAAC;IACxB,MAAM,EAAG,OAAO,CAAC;gBAEd,MAAM,EAAE,SAAS;IAgDpB,KAAK;CASf"}

package/dist/src/components/others/example/example-float-control.js

@@ -0,0 +1,60 @@
+import { Span, TypeDiv } from '@type-dom/framework';
+import { ElCaretTopSvg } from '@type-dom/svgs';
+import { $bgColor, $borderColor, $textColor } from '../../../styles/var';
+import { TdIcon } from '../../basic/td-icon/td-icon.class';
+export class ExampleFloatControl extends TypeDiv {
+    constructor(params) {
+        super();
+        this.className = 'ExampleFloatControl';
+        this.attr.addName('example-float-control');
+        this.attr.addObj({
+            role: 'button',
+            tabIndex: 0,
+        });
+        this.style.addObj({
+            display: 'flex',
+            alignItems: 'center',
+            justifyContent: 'center',
+            // border-top: 1px solid var(--border-color),
+            borderTop: '1px solid ' + $borderColor.base,
+            height: '44px',
+            boxSizing: 'border-box',
+            // background-color: var(--bg-color, #fff),
+            backgroundColor: $bgColor.default,
+            borderBottomLeftRadius: '4px',
+            borderBottomRightRadius: '4px',
+            marginTop: '-1px',
+            // color: var(--el-text-color-secondary),
+            color: $textColor.secondary,
+            cursor: 'pointer',
+            position: 'sticky',
+            left: '0',
+            right: '0',
+            bottom: '0',
+            zIndex: 10,
+        });
+        this.addChildren(new TdIcon({
+            slot: new ElCaretTopSvg(),
+            styleObj: {
+                fontSize: '16px',
+            },
+        }), new Span({
+            slot: '隐藏源代码',
+            styleObj: {
+                fontSize: '14px',
+                marginLeft: '10px',
+            },
+        }));
+        this.useParams(params);
+    }
+    setup() {
+        this.addEvents({
+            click: () => {
+                // 隐藏 代码
+                this.style.hide();
+                this.parent.sourceWrapper.style.hide();
+            },
+        });
+    }
+}
+//# sourceMappingURL=example-float-control.js.map

package/dist/src/components/others/example/example-float-control.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"example-float-control.js","sourceRoot":"","sources":["../../../../../src/components/others/example/example-float-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,IAAI,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,mCAAmC,CAAC;AAG3D,MAAM,OAAO,mBAAoB,SAAQ,OAAO;IAI9C,YAAY,MAAiB;QAC3B,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,qBAAqB,CAAC;QACvC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,uBAAuB,CAAC,CAAC;QAC3C,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC;YACf,IAAI,EAAE,QAAQ;YACd,QAAQ,EAAE,CAAC;SACZ,CAAC,CAAC;QACH,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YAChB,OAAO,EAAE,MAAM;YACf,UAAU,EAAE,QAAQ;YACpB,cAAc,EAAE,QAAQ;YACxB,6CAA6C;YAC7C,SAAS,EAAE,YAAY,GAAG,YAAY,CAAC,IAAI;YAC3C,MAAM,EAAE,MAAM;YACd,SAAS,EAAE,YAAY;YACvB,2CAA2C;YAC3C,eAAe,EAAE,QAAQ,CAAC,OAAO;YACjC,sBAAsB,EAAE,KAAK;YAC7B,uBAAuB,EAAE,KAAK;YAC9B,SAAS,EAAE,MAAM;YACjB,yCAAyC;YACzC,KAAK,EAAE,UAAU,CAAC,SAAS;YAC3B,MAAM,EAAE,SAAS;YACjB,QAAQ,EAAE,QAAQ;YAClB,IAAI,EAAE,GAAG;YACT,KAAK,EAAE,GAAG;YACV,MAAM,EAAE,GAAG;YACX,MAAM,EAAE,EAAE;SACX,CAAC,CAAC;QACH,IAAI,CAAC,WAAW,CACd,IAAI,MAAM,CAAC;YACT,IAAI,EAAE,IAAI,aAAa,EAAE;YACzB,QAAQ,EAAE;gBACR,QAAQ,EAAE,MAAM;aACjB;SACF,CAAC,EACF,IAAI,IAAI,CAAC;YACP,IAAI,EAAE,OAAO;YACb,QAAQ,EAAE;gBACR,QAAQ,EAAE,MAAM;gBAChB,UAAU,EAAE,MAAM;aACnB;SACF,CAAC,CACH,CAAC;QACF,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;IACzB,CAAC;IAEQ,KAAK;QACZ,IAAI,CAAC,SAAS,CAAC;YACb,KAAK,EAAE,GAAG,EAAE;gBACV,QAAQ;gBACR,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;gBAClB,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;YACzC,CAAC;SACF,CAAC,CAAC;IACL,CAAC;CACF"}

package/dist/src/components/others/example/example-showcase.d.ts

@@ -0,0 +1,8 @@
+import { TypeProps, TypeDiv } from '@type-dom/framework';
+import { Example } from './example';
+export declare class ExampleShowcase extends TypeDiv {
+    className: 'ExampleShowcase';
+    parent: Example;
+    constructor(params: TypeProps);
+}
+//# sourceMappingURL=example-showcase.d.ts.map

package/dist/src/components/others/example/example-showcase.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"example-showcase.d.ts","sourceRoot":"","sources":["../../../../../src/components/others/example/example-showcase.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAEzD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC,qBAAa,eAAgB,SAAQ,OAAO;IAC1C,SAAS,EAAE,iBAAiB,CAAC;IACpB,MAAM,EAAG,OAAO,CAAC;gBAEd,MAAM,EAAE,SAAS;CAY9B"}

package/dist/src/components/others/example/example-showcase.js

@@ -0,0 +1,17 @@
+import { TypeDiv } from '@type-dom/framework';
+import { $bgColor } from '../../../styles/var';
+export class ExampleShowcase extends TypeDiv {
+    constructor(params) {
+        super();
+        this.className = 'ExampleShowcase';
+        this.attr.addName('example-showcase');
+        this.style.addObj({
+            padding: '1.5rem',
+            margin: '.5px',
+            // background-color: var(--bg-color),
+            backgroundColor: $bgColor.default,
+        });
+        this.useParams(params);
+    }
+}
+//# sourceMappingURL=example-showcase.js.map

package/dist/src/components/others/example/example-showcase.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"example-showcase.js","sourceRoot":"","sources":["../../../../../src/components/others/example/example-showcase.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,OAAO,EAAE,MAAM,qBAAqB,CAAC;AACzD,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAG/C,MAAM,OAAO,eAAgB,SAAQ,OAAO;IAI1C,YAAY,MAAiB;QAC3B,KAAK,EAAE,CAAC;QACR,IAAI,CAAC,SAAS,GAAG,iBAAiB,CAAC;QACnC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;QACtC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;YAChB,OAAO,EAAE,QAAQ;YACjB,MAAM,EAAE,MAAM;YACd,qCAAqC;YACrC,eAAe,EAAE,QAAQ,CAAC,OAAO;SAClC,CAAC,CAAC;QACH,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC;IACzB,CAAC;CACF"}