ranui 0.1.0-alpha → 0.1.1-alpha

package/components/tabs/index.ts

@@ -1,207 +0,0 @@
-import { isDisabled } from '@/utils/index'
-class Tabs extends HTMLElement {
-  static get observedAttributes() {
-    return ["active", 'forceRender'];
-  }
-  _container: HTMLDivElement;
-  _header: HTMLDivElement;
-  _nav: HTMLDivElement;
-  _line: HTMLDivElement;
-  _content: HTMLDivElement;
-  _wrap: HTMLDivElement;
-  _slot: HTMLSlotElement;
-  tabHeaderKeyMapIndex: Record<string, number>;
-  constructor() {
-    super();
-    /**
-     * <div class="tab">
-     *   <div class="tab-header">
-     *      <div class="tab-header_nav">...</div>
-     *      <div class="tab-header_line"></div>
-     *   </div>
-     *   <div class="tab-content">
-     *      <div class="tab-content_wrap">
-     *         <slot></slot>
-     *      </div>
-     *   </div>
-     * </div>
-     */
-    this._container = document.createElement("div");
-    this._container.setAttribute("class", "tab");
-    this._header = document.createElement("div");
-    this._header.setAttribute("class", "tab-header");
-    this._nav = document.createElement("div");
-    this._nav.setAttribute("class", "tab-header_nav");
-    this._line = document.createElement("div");
-    this._line.setAttribute("class", "tab-header_line");
-    this._content = document.createElement("div");
-    this._content.setAttribute("class", "tab-content");
-    this._wrap = document.createElement("div");
-    this._wrap.setAttribute("class", "tab-content_wrap");
-    this._slot = document.createElement("slot");
-    this._wrap.appendChild(this._slot);
-    this._content.appendChild(this._wrap);
-    this._header.appendChild(this._nav);
-    this._header.appendChild(this._line);
-    this._container.appendChild(this._header);
-    this._container.appendChild(this._content);
-
-    this.tabHeaderKeyMapIndex = {}
-
-    const shadowRoot = this.attachShadow({ mode: "closed" });
-    shadowRoot.appendChild(this._container);
-  }
-
-  get align() {
-    return this.getAttribute("align") || "start";
-  }
-
-  set align(value) {
-    this.setAttribute("align", value);
-  }
-
-  get type() {
-    return this.getAttribute("type") || "flat";
-  }
-
-  get active() {
-    return this.getAttribute("active");
-  }
-
-  set active(value) {
-    if (value) {
-      this.setAttribute("active", value);
-      this.setTabLine(value)
-      this.setTabContent(value)
-    } else {
-      this.removeAttribute("active");
-    }
-  }
-
-  set type(value) {
-    this.setAttribute("type", value);
-  }
-  /**
-   * @description: 构建tabPane组件key值和index的映射，同时判断一个tabs下的tabPane key值不能重复
-   * @param {string} key
-   * @param {number} index
-   */
-  initTabHeaderKeyMapIndex = (key: string, index: number) => {
-    const value = this.tabHeaderKeyMapIndex[key]
-    if (value) {
-      throw new Error('tab 组件的 key 值存在重复, 或者某个 tab 组件缺少 key 属性')
-    } else {
-      this.tabHeaderKeyMapIndex[key] = index
-    }
-  }
-  /**
-   * @description: 根据传入的tabPane生成tabs的头部
-   * @param {Element} tabPane
-   * @param {number} index
-   * @return {Element}
-   */
-  createTabHeader(tabPane: Element, index: number) {
-    const label = tabPane.getAttribute("label") || '';
-    const key = tabPane.getAttribute('key') || `${index}`
-    const type = tabPane.getAttribute('type') || 'text'
-    this.initTabHeaderKeyMapIndex(key, index)
-    const tabHeader = document.createElement('r-button')
-    tabHeader.setAttribute('class', 'tab-header_nav__item')
-    tabHeader.setAttribute('type', type)
-    isDisabled(tabPane) && tabHeader.setAttribute('disabled', '')
-    tabHeader.setAttribute('ran-key', key)
-    tabHeader.innerHTML = label
-    return tabHeader
-  }
-  /**
-   * @description: 通过key值设置tabLine的位置
-   * @param {string} key
-   */
-  setTabLine = (key: string) => {
-    if (key) {
-      const index = this.tabHeaderKeyMapIndex[key]
-      this._line.style.setProperty('transform', `translateX(${100 * index}%)`)
-    }
-  }
-  /**
-   * @description: 通过传入的key值设置tabContent
-   */
-  setTabContent = (key: string) => {
-    if (key) {
-      const index = this.tabHeaderKeyMapIndex[key]
-      this._wrap.style.setProperty('transform', `translateX(${index * -100}%)`)
-    }
-  }
-  /**
-   * @description: 根据点击设置tabLine的位置
-   * @param {Event} e
-   * @param {number} index
-   * @param {number} width
-   */
-  clickTabHead = (e: Event) => {
-    const tabHeader = e.target as Element
-    const key = tabHeader.getAttribute('ran-key')
-    const disabled = isDisabled(tabHeader)
-    if (!disabled && key) {
-      this.setAttribute('active', key)
-      this.setTabLine(key)
-      this.setTabContent(key)
-    }
-  }
-  /**
-   * @description: 初始化tabs的active属性和tabLine,tabContent
-   */
-  initActive = () => {
-    const tabHeaderList = [...this._nav.children]
-    const initTabHeader = tabHeaderList.filter(item => !isDisabled(item)).shift()
-    if (!initTabHeader) return
-    const index = tabHeaderList.findIndex(item => item === initTabHeader)
-    const key = initTabHeader?.getAttribute('ran-key') || `${index}`
-    if (this.active === null && key !== null) {
-      this.setAttribute('active', `${key}`)
-      const { width = 0 } = initTabHeader.getBoundingClientRect()
-      this._line.style.setProperty("width", `${width}px`);
-      this.setTabLine(key)
-      this.setTabContent(key)
-    }
-  }
-  /**
-   * @description: 监听slot组件的添加/删除/替换操作，进行tabs初始化
-   * @return {*}
-   */
-  listenSlotChange = () => {
-    const slots = this._slot.assignedElements();
-    slots.forEach((item, index) => {
-      const tabPane = this.createTabHeader(item, index)
-      this._nav.appendChild(tabPane)
-      tabPane.addEventListener('click', this.clickTabHead)
-    });
-    this.initActive()
-  };
-
-  connectedCallback() {
-    this._slot.addEventListener("slotchange", this.listenSlotChange);
-  }
-
-  disconnectCallback() {
-    this._slot.removeEventListener("slotchange", this.listenSlotChange);
-  }
-
-  attributeChangedCallback(name: string, oldValue: string, newValue: string) {
-    if (oldValue !== newValue) {
-      this.dispatchEvent(new CustomEvent('change', {
-        detail: {
-          active: this.active,
-        }
-      }));
-    }
-  }
-}
-
-function CustomElement() {
-  if (!customElements.get("r-tabs")) {
-    customElements.define("r-tabs", Tabs);
-  }
-}
-
-export default CustomElement();

package/dist/assets/image/failImage.d.ts

@@ -1,2 +0,0 @@
-declare const failImage = "\n    data:image/png;base64,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\n";
-export default failImage;

package/dist/components/button/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: void;
-export default _default;

package/dist/components/image/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: void;
-export default _default;

package/dist/components/input/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: void;
-export default _default;

package/dist/components/modal/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: void;
-export default _default;

package/dist/components/tabPane/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: void;
-export default _default;

package/dist/components/tabs/index.d.ts

@@ -1,2 +0,0 @@
-declare const _default: void;
-export default _default;

package/dist/typings.d.ts

@@ -1,4 +0,0 @@
-declare module "*.less"
-declare module '@/assets'
-declare module '@/components'
-declare module '@/plugins'

package/dist/utils/index.d.ts

@@ -1,7 +0,0 @@
-export declare const falseList: (string | boolean | null | undefined)[];
-/**
-  * @description: 判断这个元素上是否有disabled属性
-  * @param {Element} element
-  * @return {*}
-  */
-export declare const isDisabled: (element: Element) => boolean;

package/docs/button/index.md

@@ -1,25 +0,0 @@
-# Button 按钮
-按钮用于开始一个即时操作。
-
-## 代码演示
-
-<div style="display:inline-block;margin-right: 8px;margin-bottom: 12px;">
-    <r-button type="primary"><span slot="r-btn_content">主要按钮</span></r-button>
-</div>
-<div style="display:inline-block;margin-right: 8px;margin-bottom: 12px;">
-    <r-button type="warning"><span slot="r-btn_content">警告按钮</span></r-button>
-</div>
-<div style="display:inline-block;margin-right: 8px;margin-bottom: 12px;">
-    <r-button><span slot="r-btn_content">默认按钮</span></r-button>
-</div>
-<div style="display:inline-block;margin-right: 8px;margin-bottom: 12px;">
-    <r-button type="text"><span slot="r-btn_content">文本按钮</span></r-button>
-</div>
-
-
-```xml
- <r-button type="primary"><span slot="r-btn_content">主要按钮</span></r-button>
- <r-button type="warning"><span slot="r-btn_content">警告按钮</span></r-button>
- <r-button type="text"><span slot="r-btn_content">文本按钮</span></r-button>
- <r-button><span slot="r-btn_content">默认按钮</span></r-button>
-```

package/docs/image/index.md

@@ -1,9 +0,0 @@
-# Image 图片
-
-## 代码演示
-
-```xml
- <r-img src="" fallback=""></r-img>
- ```
-
- <r-img fallback="data:image/png;base64,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"></r-img>

package/docs/input/index.md

@@ -1,146 +0,0 @@
-# Input 输入框
-通过鼠标或键盘输入内容，是最基础的表单域的包装。
-
-## 代码演示
-
-<div style="width:300px;">
-    输入框：<r-input></r-input>
-</div>
-
-
-```xml
-<r-input></r-input>
-```
-
-## 属性
-### 标签`label`
-
-提供类似于Metiral Design的输入体验。
-
-<r-input label="user"></r-input>
-
-```html
-<r-input label="user"></r-input>
-```
-
-### 占位`placeholder`
-
-与原生`placeholder`一致。
-
-<r-input placeholder="user"></r-input>
-
-```html
-<r-input placeholder="user"></r-input>
-```
-
-### 禁用`disabled`
-
-通过`disabled`可以禁用输入框，禁用后该按钮上的事件失效。
-
-<r-input label="user" disabled></r-input>
-
-```html
-<r-input label="user" disabled></r-input>
-```
-
-### 值`value`
-
-设置或返回输入框的`value`属性值。
-
-<r-input value="1234"></r-input>
-
-### 类型`type`
-
-目前支持`password`、`number`这几种类型，设置后会出现额外的`ui`控件。
-
-#### 密码输入框
-
-支持密码明文和密文切换。
-
-<r-input icon="lock" type="password"></r-input>
-
-```html
-<r-input icon="lock" type="password"></r-input>
-```
-
-### 图标`icon`
-
-可以设置一个`icon`来表示标签标识。
-
-<r-input icon="user"></r-input>
-
-```html
-<r-input icon="user"></r-input>
-```
-
-#### 数字输入框
-
-数字输入框，类似于原生`input[type=number]`，支持`min`、`max`、`step`属性，支持键盘上下键切换数字。
-
-<r-input type="number" min="-10" max="10" step="0.5" ></r-input>
-
-```html
-<r-input type="number" min="-10" max="10" step="0.5" ></r-input>
-```
-
-### 必填项`required`
-
-<r-input icon="user" required placeholder="required"></r-input>
-
-```html
-<r-input icon="user" required placeholder="required"></r-input>
-```
-
-### 正则校验pattern
-
-设置`pattern`属性，这是一个正则。
-
-<r-input icon="phone" pattern="^1(3|4|5|6|7|8|9)\d{9}$" placeholder="请输入手机号"></r-input>
-
-```html
-<r-input icon="phone" pattern="^1(3|4|5|6|7|8|9)\d{9}$" placeholder="请输入手机号"></r-input>
-```
-
-### 自定义错误提示
-可以自定义提示信息`warning`
-
-<r-input icon="phone" pattern="^1(3|4|5|6|7|8|9)\d{9}$" placeholder="请输入手机号" warning="手机号格式有误"></r-input>
-
-```html
-<r-input icon="phone" pattern="^1(3|4|5|6|7|8|9)\d{9}$" placeholder="请输入手机号" warning="手机号格式有误"></r-input>
-```
-### name属性名
-跟form组件联动的时候有效，form提交时收集的字段名字
-
-## 事件`event`
-
-常见的回调事件。
-
-### onchange
-
-文本改变的时候触发（失焦后）。
-
-<r-input onchange="XyMessage.info(this.value)"></r-input>
-
-```html
-<r-input onchange="fn(event)"></r-input>
-```
-
-### oninput
-
-输入时触发。
-<r-input oninput="XyMessage.info(this.value)"></r-input>
-
-```html
-<r-input oninput="fn(event)"></r-input>
-```
-
-### checkout
-
-主动校验，弹出提示信息。
-
-<r-input required placeholder="required"></r-input>
-
-```js
-input.checkout();
-```

package/docs/tabs/index.md

@@ -1,121 +0,0 @@
-# Tab
-
-## 代码展示
-
-<r-tabs>
-    <r-tab label="tab1">tab1</r-tab>
-    <r-tab label="tab2">tab2</r-tab>
-    <r-tab label="tab3">tab3</r-tab>
-</r-tabs>
-
-```xml
-<r-tabs>
-    <r-tab label="tab1">tab1</r-tab>
-    <r-tab label="tab2">tab2</r-tab>
-    <r-tab label="tab3">tab3</r-tab>
-</r-tabs>
-```
-
-## 属性
-
-### 名称`label`
-
-每个`r-tab`需要指定一个名称`label`，用于显示标签头。
-
-<r-tabs>
-    <r-tab label="tab1">tab1</r-tab>
-    <r-tab label="tab2">tab2</r-tab>
-    <r-tab label="tab3">tab3</r-tab>
-</r-tabs>
-
-```xml
-<r-tabs>
-    <r-tab label="tab1">tab1</r-tab>
-    <r-tab label="tab2">tab2</r-tab>
-    <r-tab label="tab3">tab3</r-tab>
-</r-tabs>
-```
-
-### 禁用`disabled`
-
-每个`r-tab`可以指定`disabled`属性，用来禁用该标签页。
-
-<r-tabs>
-    <r-tab label="tab1">tab1</r-tab>
-    <r-tab id="tab-content-disabled" label="tab2" disabled>tab2</r-tab>
-    <r-tab label="tab3">tab3</r-tab>
-</r-tabs>
-
-```xml
-<r-tabs>
-    <r-tab label="tab1">tab1</r-tab>
-    <r-tab label="tab2" disabled>tab2</r-tab>
-    <r-tab label="tab3">tab3</r-tab>
-</r-tabs>
-```
-
-### 标识`key`,`active`
-
-每个`r-tab`需要指定一个标识`key`，没有会默认以序列号为`key`，
-
-`active`作用在`r-tabs`上，可以指定切换到具体标签页，也可以指定初始值。
-
-<r-tabs active="B">
-    <r-tab label="tab1" key="A">tab1</r-tab>
-    <r-tab label="tab2" key="B">tab2</r-tab>
-    <r-tab label="tab3" key="C">tab3</r-tab>
-</r-tabs>
-
-```html
-<r-tabs active="B">
-    <r-tab label="tab1" key="A">tab1</r-tab>
-    <r-tab label="tab2" key="B">tab2</r-tab>
-    <r-tab label="tab3" key="C">tab3</r-tab>
-</r-tabs>
-```
-
-### 图标`icon`
-
-
-每个`r-tab`可以指定`icon`，配合`label`实现图标加文字的效果。
-
-<r-tabs>
-    <r-tab label="home" icon="home">tab1</r-tab>
-    <r-tab label="message" icon="message">tab2</r-tab>
-    <r-tab label="user" icon="user">tab3</r-tab>
-</r-tabs>
-
-```html
-<r-tabs>
-    <r-tab label="home" icon="home">tab1</r-tab>
-    <r-tab label="message" icon="message">tab2</r-tab>
-    <r-tab label="user" icon="user">tab3</r-tab>
-</r-tabs>
-```
-
-也可以单独指定`icon`，不使用`label`。
-
-<r-tabs>
-    <r-tab icon="home">tab1</r-tab>
-    <r-tab icon="message">tab2</r-tab>
-    <r-tab icon="user">tab3</r-tab>
-</r-tabs>
-
-```html
-<r-tabs>
-    <r-tab icon="home">tab1</r-tab>
-    <r-tab icon="message">tab2</r-tab>
-    <r-tab icon="user">tab3</r-tab>
-</r-tabs>
-```
-
-### 风格`type`
-
-### 对齐`align`
-
-## 事件`event`
-
-### onchange 
-
-切换完成时触发。
-

package/index.html

@@ -1,67 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Document</title>
-    <script src="./index.ts" type="module"></script>
-  </head>
-
-  <body>
-    <!-- <h1>Hello RanUI</h1> -->
-    <div style="margin: 20px">
-      <!-- <div>按钮</div>
-         <r-button type="primary">主要按钮</r-button>
-        <r-button type="warning">警告按钮</r-button>
-        <r-button type="default">默认按钮</r-button>
-        <r-button type="primary" disabled="true">disable按钮</r-button>
-        <div style="margin:20px">输入框</div>
-      <r-input label="user" type="password"></r-input>
-      <div>图片</div> -->
-      <!-- <r-button type="text" disabled>默认按钮</r-button> -->
-      <span>加载失败</span>
-      <r-img fallback=""></r-img>
-      <div>表单</div>
-      <r-tabs>
-        <r-tab label="tab1" >11111</r-tab>
-        <r-tab label="tab2" type="line">22222</r-tab>
-        <r-tab label="tab3" >33333</r-tab>
-      </r-tabs>
-      <!-- <iframe name="hidden" style="display:none;"></iframe> -->
-      <form id="form">
-            <fieldset>
-                <legend>Choose your favorite monster</legend>
-
-                <input type="radio" id="kraken" name="monster" value="K">
-                <label for="kraken">Kraken</label><br>
-
-                <input type="radio" id="sasquatch" name="monster" value="S">
-                <label for="sasquatch">Sasquatch</label><br>
-
-                <input type="radio" id="mothman" name="monster" value="M" />
-                <label for="mothman">Mothman</label>
-                <button type="submit">提交按钮</button>
-            </fieldset>
-        </form>
-    </div>
-    <script>
-      const form = document.getElementById("form");
-      const onFinish = (e) => {
-        e.preventDefault();
-        const jsonData = {};
-        const formData = new FormData(form);
-        formData.forEach((value, key) => {
-          if (!jsonData[key]) {
-            jsonData[key] =
-              formData.getAll(key).length > 1
-                ? formData.getAll(key)
-                : formData.get(key);
-          }
-        });
-        console.log("e---->", jsonData);
-      };
-      form.addEventListener("submit", onFinish);
-    </script>
-  </body>
-</html>

package/index.ts

@@ -1,6 +0,0 @@
-import './components/button/index.ts';
-import './components/image/index.ts';
-import './components/input/index.ts';
-import './components/modal/index.ts';
-import './components/tabPane/index.ts';
-import './components/tabs/index.ts';