Skip to content

Commit ca91667

Browse files
erwinheldyerwinheldy
committed
v2.0.0
1 parent 3f5708a commit ca91667

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

59 files changed

+2806
-2587
lines changed

‎.eslintrc‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
{
2+
"plugins": ["react"],
23
"extends": "@antfu",
34
"rules": {
4-
"curly": ["error", "all"]
5+
"curly": ["error", "all"],
6+
"jsx-quotes": ["error", "prefer-double"],
7+
"react/jsx-indent": ["error", 2]
58
},
69
"ignorePatterns": ["docs/**/*"]
710
}

‎.prettierrc‎

Lines changed: 0 additions & 4 deletions
This file was deleted.

‎.vscode/extensions.json‎

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎.vscode/settings.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
"files.associations": {
33
"*.html.txt": "html",
44
"*.css.txt": "css",
5+
"*.scss.txt": "scss",
56
"*.js.txt": "javascript",
67
},
78
}

‎CHANGELOG.md‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,19 @@
1+
v2.0.0
2+
- Rewrite project back to vanilla-js to improve performance and reduce size.
3+
- Pressing Enter is now the default action for adding a tag. Previously, users had to include an attribute option.
4+
- Now pressing Backspace on a focused tag deletes it and shifts focus to the previous tag, while pressing Delete deletes the tag and moves focus to the next one.
5+
- Fixed the tag with long text not breaking words.
6+
- Fixed server-side validation styles.
7+
- Fixed where adding existing values programmatically did not trigger a warning for duplicate tags.
8+
19
v1.0.3
2-
- Remove placeholder when input value is not empty (native input placeholder behavior)
10+
- Remove placeholder when input value is not empty (native input placeholder behavior).
311

412
v1.0.2
513
- Fixed lost focus after deleting the focused tag with the backspace or delete key (Firefox only).
614

715
v1.0.1
8-
- Fixed docs
16+
- Fixed docs.
917

1018
v1.0.0
1119
- Named export to default export.

‎README.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,13 +63,12 @@ All options are embedded in attributes:
6363
data-ub-tag-separator
6464
data-ub-tag-duplicate
6565
data-ub-tag-transform
66-
data-ub-tag-enter
6766
data-ub-tag-variant
6867
data-ub-tag-x-position
6968
```
7069

7170
```html
72-
<input class="form-control" data-ub-tag-separator=" " data-ub-tag-duplicate data-ub-tag-transform="input => input.toUpperCase()" data-ub-tag-enter data-ub-tag-variant="primary" data-ub-tag-x-position="left">
71+
<input class="form-control" data-ub-tag-separator=" " data-ub-tag-duplicate data-ub-tag-transform="input => input.toUpperCase()" data-ub-tag-variant="primary" data-ub-tag-x-position="left">
7372
```
7473
## Methods
7574

‎docs/api/index.html‎

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,12 @@
55
<meta name="keywords" content="bootstrap tag, tag input, bootstrap input">
66
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
77
<title>use-bootstrap-tag | Tag input for Bootstrap 5</title>
8-
<script type="module" crossorigin="" src="/assets/index-d07bd47f.js"></script>
9-
<link rel="stylesheet" href="/assets/index-088aae3b.css">
8+
<script type="module" crossorigin="" src="/assets/index-f8151f00.js"></script>
9+
<link rel="stylesheet" href="/assets/index-6904ed1c.css">
1010
</head>
1111

1212
<body>
13-
<div id="app"><nav class="navbar navbar-expand bg-body-tertiary sticky-top" data-bs-theme="dark"><div class="container justify-content-start"><a class="navbar-brand d-flex align-items-center gap-2" href="/"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16"><path d="M3 2v4.586l7 7L14.586 9l-7-7H3zM2 2a1 1 0 0 1 1-1h4.586a1 1 0 0 1 .707.293l7 7a1 1 0 0 1 0 1.414l-4.586 4.586a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 2 6.586V2z"></path><path d="M5.5 5a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1zm0 1a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zM1 7.086a1 1 0 0 0 .293.707L8.75 15.25l-.043.043a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 0 7.586V3a1 1 0 0 1 1-1v5.086z"></path></svg> use-bootstrap-tag</a> <div class="ms-auto navbar-nav align-items-center gap-3"><a class="fs-5 nav-link p-0" href="https://github.com/use-bootstrap/use-bootstrap-tag" target="_blank" aria-label="GitHub Project"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"></path></svg></a> <label class="btn nav-link p-0 border-0 fs-5" for="bs-theme" title="Toggle color schema"><svg viewBox="0 0 24 24" width="1em" height="1em" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></label> <input type="checkbox" class="btn-check" id="bs-theme" autocomplete="off"></div></div></nav> <div class="bg-body-tertiary" style="border-bottom: var(--bs-border-width) solid var(--bs-border-color);"><div class="container pt-3"><nav style="margin-bottom: -1px;"><ul class="nav nav-tabs"><li class="nav-item"><a class="nav-link" href="/">Home</a></li> <li class="nav-item"><a class="nav-link" href="/install">Install</a></li> <li class="nav-item"><a class="nav-link" href="/demo">Demo</a></li> <li class="nav-item"><a class="nav-link active" href="/api">API</a></li> <li class="nav-item"><a class="nav-link" href="/customize">Customize</a></li></ul></nav></div></div> <div class="container py-3"><div class="pt-4" role="main"><div><h2 class="fw-bold mb-4">API</h2> <div class="table-responsive"><table class="table table-bordered" style="max-width: 600px"><thead><tr><th>Name</th> <th>Params</th> <th>Returns</th> <th>Example</th></tr></thead> <tbody><tr><td><code>addValue</code></td> <td class="text-nowrap"><code>string | array</code></td> <td><code>void</code></td> <td><pre class="mb-1 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">addValue</span><span class="token punctuation">(</span><span class="token string">'cyan'</span><span class="token punctuation">)</span></code></pre> <pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">addValue</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'light'</span><span class="token punctuation">,</span> <span class="token string">'dark'</span><span class="token punctuation">]</span><span class="token punctuation">)</span></code></pre></td></tr> <tr><td><code>removeValue</code></td> <td><code>string | array</code></td> <td><code>void</code></td> <td><pre class="mb-1 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">removeValue</span><span class="token punctuation">(</span><span class="token string">'cyan'</span><span class="token punctuation">)</span></code></pre> <pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">removeValue</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'light'</span><span class="token punctuation">,</span> <span class="token string">'dark'</span><span class="token punctuation">]</span><span class="token punctuation">)</span></code></pre></td></tr> <tr><td><code>getValue</code></td> <td><code>null</code></td> <td><code>string</code></td> <td><pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">getValue</span><span class="token punctuation">(</span><span class="token punctuation">)</span></code></pre></td></tr> <tr><td><code>getValues</code></td> <td><code>null</code></td> <td><code>array</code></td> <td><pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">getValues</span><span class="token punctuation">(</span><span class="token punctuation">)</span></code></pre></td></tr></tbody></table></div> <div class="d-flex justify-content-between gap-3 mt-4"><a href="/demo" class="btn btn-link link-body-emphasis text-decoration-none border d-inline-flex flex-column align-items-start w-50"><span class="text-body-secondary small">Previous page</span>
14-
Demo</a> <a href="/customize" class="btn btn-link link-body-emphasis text-decoration-none border d-inline-flex flex-column align-items-end w-50"><span class="text-body-secondary small">Next page</span>
15-
Customize</a></div></div></div></div></div>
13+
<div id="app"><nav class="navbar navbar-expand bg-body-tertiary sticky-top" data-bs-theme="dark"><div class="container justify-content-start"><a class="navbar-brand d-flex align-items-center gap-2" href="/"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16"><path d="M3 2v4.586l7 7L14.586 9l-7-7H3zM2 2a1 1 0 0 1 1-1h4.586a1 1 0 0 1 .707.293l7 7a1 1 0 0 1 0 1.414l-4.586 4.586a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 2 6.586V2z"></path><path d="M5.5 5a.5.5 0 1 1 0-1 .5.5 0 0 1 0 1zm0 1a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3zM1 7.086a1 1 0 0 0 .293.707L8.75 15.25l-.043.043a1 1 0 0 1-1.414 0l-7-7A1 1 0 0 1 0 7.586V3a1 1 0 0 1 1-1v5.086z"></path></svg>use-bootstrap-tag</a><div class="ms-auto navbar-nav align-items-center gap-3"><a class="fs-5 nav-link p-0" target="_blank" aria-label="GitHub Project" href="https://github.com/use-bootstrap/use-bootstrap-tag"><svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill="currentColor" viewBox="0 0 16 16"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"></path></svg></a><label class="btn nav-link p-0 border-0 fs-5" for="bs-theme" title="Toggle color schema"><svg viewBox="0 0 24 24" width="1em" height="1em" stroke="currentColor" stroke-width="2" fill="none" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg></label><input type="checkbox" class="btn-check" id="bs-theme" autocomplete="off"></div></div></nav><div class="bg-body-tertiary" style="border-bottom:var(--bs-border-width) solid var(--bs-border-color)"><div class="container pt-3"><nav class="overflow-x-auto" id="main-nav" style="margin-bottom:-1px"><ul class="nav nav-tabs flex-nowrap"><li class="nav-item"><a href="/" class="nav-link ">Home</a></li><li class="nav-item"><a href="/install" class="nav-link ">Install</a></li><li class="nav-item"><a href="/demo" class="nav-link ">Demo</a></li><li class="nav-item"><a href="/api" class="nav-link active">API</a></li><li class="nav-item"><a href="/customize" class="nav-link ">Customize</a></li></ul></nav></div></div><div class="container py-3"><div class="pt-4" role="main"><div><h2 class="fw-bold mb-4">API</h2><div class="table-responsive"><table class="table table-bordered" style="max-width:600px"><thead><tr><th>Name</th><th>Params</th><th>Returns</th><th>Example</th></tr></thead><tbody><tr><td><code>addValue</code></td><td class="text-nowrap"><code>string | array</code></td><td><code>void</code></td><td><pre class="mb-1 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">addValue</span><span class="token punctuation">(</span><span class="token string">'react'</span><span class="token punctuation">)</span></code></pre><pre class="mb-1 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">addValue</span><span class="token punctuation">(</span><span class="token string">'vue,svelte'</span><span class="token punctuation">)</span></code></pre><pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">addValue</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'solid'</span><span class="token punctuation">,</span> <span class="token string">'qwik'</span><span class="token punctuation">]</span><span class="token punctuation">)</span></code></pre></td></tr><tr><td><code>removeValue</code></td><td><code>string | array</code></td><td><code>void</code></td><td><pre class="mb-1 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">removeValue</span><span class="token punctuation">(</span><span class="token string">'react'</span><span class="token punctuation">)</span></code></pre><pre class="mb-1 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">removeValue</span><span class="token punctuation">(</span><span class="token string">'vue,svelte'</span><span class="token punctuation">)</span></code></pre><pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">removeValue</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'solid'</span><span class="token punctuation">,</span> <span class="token string">'qwik'</span><span class="token punctuation">]</span><span class="token punctuation">)</span></code></pre></td></tr><tr><td><code>getValue</code></td><td><code>null</code></td><td><code>string</code></td><td><pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">getValue</span><span class="token punctuation">(</span><span class="token punctuation">)</span></code></pre></td></tr><tr><td><code>getValues</code></td><td><code>null</code></td><td><code>array</code></td><td><pre class="mb-0 language-javascript" tabindex="0"><code class="language-javascript">example<span class="token punctuation">.</span><span class="token function">getValues</span><span class="token punctuation">(</span><span class="token punctuation">)</span></code></pre></td></tr></tbody></table></div><div class="d-flex justify-content-between gap-3 mt-4"><a href="/demo" class="btn btn-link link-body-emphasis text-decoration-none border d-inline-flex flex-column align-items-start w-50"><span class="text-body-secondary small">Previous page</span>Demo</a><a href="/customize" class="btn btn-link link-body-emphasis text-decoration-none border d-inline-flex flex-column align-items-end w-50"><span class="text-body-secondary small">Next page</span>Customize</a></div></div></div></div></div>
1614

1715

1816

‎docs/assets/index-088aae3b.css‎

Lines changed: 0 additions & 5 deletions
This file was deleted.

‎docs/assets/index-6904ed1c.css‎

Lines changed: 5 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)