minora 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +29 -33
- package/dist/minora.css +1 -1
- package/dist/minora.js +1 -1
- package/dist/minora.min.js +1 -1
- package/package.json +3 -3
package/README.md
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
[]()
|
|
6
6
|
[](LICENSE)
|
|
7
7
|
[](dist/minora.min.css)
|
|
8
|
-
[](https://www.jsdelivr.com/package/gh/
|
|
8
|
+
[](https://www.jsdelivr.com/package/gh/ilzamafif/minora)
|
|
9
9
|
|
|
10
10
|
Minora is a handcrafted UI kit built with **vanilla HTML, CSS, and JavaScript**. Every component uses CSS custom properties from a single source of truth — change one token, the entire system adapts. No frameworks. No dependencies. Just clean, elegant components.
|
|
11
11
|
|
|
@@ -37,37 +37,33 @@ Minora is a handcrafted UI kit built with **vanilla HTML, CSS, and JavaScript**.
|
|
|
37
37
|
### CSS Only
|
|
38
38
|
|
|
39
39
|
```html
|
|
40
|
-
<link rel="stylesheet"
|
|
41
|
-
href="https://cdn.jsdelivr.net/gh/username/minora@latest/dist/minora.min.css">
|
|
40
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ilzamafif/minora@latest/dist/minora.min.css">
|
|
42
41
|
```
|
|
43
42
|
|
|
44
43
|
### JS Only (modals, toasts, selects, tooltips)
|
|
45
44
|
|
|
46
45
|
```html
|
|
47
|
-
<script src="https://cdn.jsdelivr.net/gh/
|
|
46
|
+
<script src="https://cdn.jsdelivr.net/gh/ilzamafif/minora@latest/dist/minora.min.js"></script>
|
|
48
47
|
```
|
|
49
48
|
|
|
50
49
|
### CSS + JS (complete)
|
|
51
50
|
|
|
52
51
|
```html
|
|
53
|
-
<link rel="stylesheet"
|
|
54
|
-
|
|
55
|
-
<script src="https://cdn.jsdelivr.net/gh/username/minora@latest/dist/minora.min.js"></script>
|
|
52
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ilzamafif/minora@latest/dist/minora.min.css">
|
|
53
|
+
<script src="https://cdn.jsdelivr.net/gh/ilzamafif/minora@latest/dist/minora.min.js"></script>
|
|
56
54
|
```
|
|
57
55
|
|
|
58
56
|
### Specific Version (recommended for production)
|
|
59
57
|
|
|
60
58
|
```html
|
|
61
|
-
<link rel="stylesheet"
|
|
62
|
-
|
|
63
|
-
<script src="https://cdn.jsdelivr.net/gh/username/minora@v0.1.0/dist/minora.min.js"></script>
|
|
59
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ilzamafif/minora@v0.1.0/dist/minora.min.css">
|
|
60
|
+
<script src="https://cdn.jsdelivr.net/gh/ilzamafif/minora@v0.1.0/dist/minora.min.js"></script>
|
|
64
61
|
```
|
|
65
62
|
|
|
66
63
|
### Design Tokens Only
|
|
67
64
|
|
|
68
65
|
```html
|
|
69
|
-
<link rel="stylesheet"
|
|
70
|
-
href="https://cdn.jsdelivr.net/gh/username/minora@latest/dist/tokens.css">
|
|
66
|
+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/ilzamafif/minora@latest/dist/tokens.css">
|
|
71
67
|
```
|
|
72
68
|
|
|
73
69
|
---
|
|
@@ -84,7 +80,7 @@ Copy-paste this into an `.html` file and open in your browser:
|
|
|
84
80
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
85
81
|
<title>Minora Quick Start</title>
|
|
86
82
|
<link rel="stylesheet"
|
|
87
|
-
href="https://cdn.jsdelivr.net/gh/
|
|
83
|
+
href="https://cdn.jsdelivr.net/gh/ilzamafif/minora@latest/dist/minora.min.css">
|
|
88
84
|
</head>
|
|
89
85
|
<body style="max-width:480px; margin:4rem auto; padding:0 1rem;">
|
|
90
86
|
|
|
@@ -104,7 +100,7 @@ Copy-paste this into an `.html` file and open in your browser:
|
|
|
104
100
|
</div>
|
|
105
101
|
|
|
106
102
|
<!-- Toast (needs JS) -->
|
|
107
|
-
<script src="https://cdn.jsdelivr.net/gh/
|
|
103
|
+
<script src="https://cdn.jsdelivr.net/gh/ilzamafif/minora@latest/dist/minora.min.js"></script>
|
|
108
104
|
<script>
|
|
109
105
|
function demo() {
|
|
110
106
|
ToastManager.show({
|
|
@@ -124,24 +120,24 @@ Copy-paste this into an `.html` file and open in your browser:
|
|
|
124
120
|
|
|
125
121
|
| Component | Description | Status |
|
|
126
122
|
|---|---|---|
|
|
127
|
-
| **[Button](https://github.com/
|
|
128
|
-
| **[Badge](https://github.com/
|
|
129
|
-
| **[Tag](https://github.com/
|
|
130
|
-
| **[Avatar](https://github.com/
|
|
131
|
-
| **[Divider](https://github.com/
|
|
132
|
-
| **[Input](https://github.com/
|
|
133
|
-
| **[Textarea](https://github.com/
|
|
134
|
-
| **[Select](https://github.com/
|
|
135
|
-
| **[Multiselect](https://github.com/
|
|
136
|
-
| **[Checkbox](https://github.com/
|
|
137
|
-
| **[Toggle](https://github.com/
|
|
138
|
-
| **[Form Validation](https://github.com/
|
|
139
|
-
| **[Toast](https://github.com/
|
|
140
|
-
| **[Modal](https://github.com/
|
|
141
|
-
| **[Dialog](https://github.com/
|
|
142
|
-
| **[Tooltip](https://github.com/
|
|
143
|
-
| **[Popover](https://github.com/
|
|
144
|
-
| **[Alert](https://github.com/
|
|
123
|
+
| **[Button](https://github.com/ilzamafif/minora#button)** | Solid, outline, ghost, destructive — 3 sizes, icon-only, loading spinner | ✅ Stable |
|
|
124
|
+
| **[Badge](https://github.com/ilzamafif/minora#badge)** | Solid/subtle/outline — with dot indicator, notification overlay | ✅ Stable |
|
|
125
|
+
| **[Tag](https://github.com/ilzamafif/minora#tag)** | Dismissible tags with fade animation, clickable, icon support | ✅ Stable |
|
|
126
|
+
| **[Avatar](https://github.com/ilzamafif/minora#avatar)** | Image/initials/icon fallback, status dots, overlapping groups | ✅ Stable |
|
|
127
|
+
| **[Divider](https://github.com/ilzamafif/minora#divider)** | Horizontal rules, text/icon separators, vertical separators | ✅ Stable |
|
|
128
|
+
| **[Input](https://github.com/ilzamafif/minora#input)** | Default/filled/underline variants, icon addons, clear button | ✅ Stable |
|
|
129
|
+
| **[Textarea](https://github.com/ilzamafif/minora#textarea)** | Auto-resize, character counter, validation states | ✅ Stable |
|
|
130
|
+
| **[Select](https://github.com/ilzamafif/minora#select)** | Custom dropdown with search, grouped options, keyboard nav | ✅ Stable |
|
|
131
|
+
| **[Multiselect](https://github.com/ilzamafif/minora#multiselect)** | Tag-based selection, select all/clear, counter badge | ✅ Stable |
|
|
132
|
+
| **[Checkbox](https://github.com/ilzamafif/minora#checkbox)** | Standard/filled/card, radio buttons, segmented controls | ✅ Stable |
|
|
133
|
+
| **[Toggle](https://github.com/ilzamafif/minora#toggle)** | Smooth animated switches with icon support | ✅ Stable |
|
|
134
|
+
| **[Form Validation](https://github.com/ilzamafif/minora#form-validation)** | Inline errors, password strength, form-level alerts | ✅ Stable |
|
|
135
|
+
| **[Toast](https://github.com/ilzamafif/minora#toast)** | 6 positions, progress bar, stacking, auto-dismiss, actions | ✅ Stable |
|
|
136
|
+
| **[Modal](https://github.com/ilzamafif/minora#modal)** | Focus trap, scroll lock, nested stacking, multi-step | ✅ Stable |
|
|
137
|
+
| **[Dialog](https://github.com/ilzamafif/minora#dialog)** | Confirm, destructive, info, input-based confirmation | ✅ Stable |
|
|
138
|
+
| **[Tooltip](https://github.com/ilzamafif/minora#tooltip)** | 9 positions, auto-flip, rich content, interactive | ✅ Stable |
|
|
139
|
+
| **[Popover](https://github.com/ilzamafif/minora#popover)** | Click-triggered panels with header/body/footer | ✅ Stable |
|
|
140
|
+
| **[Alert](https://github.com/ilzamafif/minora#alert)** | Subtle/filled/outline, inline messages, page banners | ✅ Stable |
|
|
145
141
|
|
|
146
142
|
---
|
|
147
143
|
|
|
@@ -227,7 +223,7 @@ See [tokens.css](src/tokens.css) for all available custom properties:
|
|
|
227
223
|
## Build from Source
|
|
228
224
|
|
|
229
225
|
```bash
|
|
230
|
-
git clone https://github.com/
|
|
226
|
+
git clone https://github.com/ilzamafif/minora.git
|
|
231
227
|
cd minora
|
|
232
228
|
npm install
|
|
233
229
|
npm run build:all # CSS + JS concat + minify
|
package/dist/minora.css
CHANGED
package/dist/minora.js
CHANGED
package/dist/minora.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! Minora UI Kit v0.1.0 — https://github.com/
|
|
1
|
+
/*! Minora UI Kit v0.1.0 — https://github.com/ilzamafif/minora */
|
|
2
2
|
"use strict";!function(){var e=function(){var e=[],t=[],n=0;function i(){0===e.length&&(n=function(){var e=document.createElement("div");e.style.cssText="position:absolute;top:-9999px;width:50px;height:50px;overflow:hidden;",document.body.appendChild(e);var t=e.offsetWidth;e.style.overflow="scroll";var n=document.createElement("div");n.style.cssText="width:100%;height:50px;",e.appendChild(n);var i=n.offsetWidth;return document.body.removeChild(e),t-i}(),document.body.style.paddingRight=n+"px",document.body.classList.add("is-modal-open"))}function o(e){return Array.from(e.querySelectorAll('a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"])')).filter(function(e){return null!==e.offsetParent})}function s(n){var i=document.getElementById(n);if(i){i.classList.remove("is-open"),i.setAttribute("aria-hidden","true"),i._focusHandler&&i.removeEventListener("keydown",i._focusHandler),i._backdropHandler&&i.removeEventListener("click",i._backdropHandler),i._escapeHandler&&document.removeEventListener("keydown",i._escapeHandler),0===(e=e.filter(function(e){return e!==i})).length&&(document.body.style.paddingRight="",document.body.classList.remove("is-modal-open"));var o=t.pop();o&&o.focus&&setTimeout(function(){o.focus()},50)}}return{open:function(n){var a=document.getElementById(n);a&&(t.push(document.activeElement),i(),e.push(a),a.classList.add("is-open"),a.setAttribute("aria-hidden","false"),a._focusHandler=function(e){!function(e,t){if("Tab"===e.key){var n=o(t);if(0!==n.length){var i=n[0],s=n[n.length-1];e.shiftKey?document.activeElement===i&&(e.preventDefault(),s.focus()):document.activeElement===s&&(e.preventDefault(),i.focus())}}}(e,a)},a.addEventListener("keydown",a._focusHandler),a._backdropHandler=function(e){e.target===a&&s(n)},a.addEventListener("click",a._backdropHandler),a._escapeHandler=function(t){"Escape"===t.key&&e[e.length-1]===a&&s(n)},document.addEventListener("keydown",a._escapeHandler),requestAnimationFrame(function(){var e=o(a);e.length>0&&e[0].focus()}))},close:s}}();window.ModalManager=e,document.querySelectorAll(".modal-overlay").forEach(function(e){e.setAttribute("aria-hidden","true")})}(),function(){function e(e){document.querySelectorAll(".select-open").forEach(function(t){if(t!==e){t.classList.remove("select-open");var n=t.querySelector(".select-trigger");n&&n.setAttribute("aria-expanded","false"),t.classList.remove("select-flip-up")}})}function t(t){if(!t.classList.contains("select-disabled")){var n=t.querySelector(".select-trigger"),i=t.querySelector(".select-dropdown"),o=t.querySelector("select"),s=t.querySelector(".select-search-input"),a=t.querySelectorAll(".select-option"),r=t.querySelector(".select-placeholder"),l=t.querySelector(".select-value");if(n&&i&&o){if(o.value){var c=o.options[o.selectedIndex];if(c&&c.value){r&&(r.hidden=!0),l&&(l.hidden=!1,l.textContent=c.text);var d=t.querySelector('.select-option[data-value="'+c.value+'"]');d&&d.classList.add("is-selected")}}n.addEventListener("click",function(o){o.stopPropagation(),t.classList.contains("select-open")?(t.classList.remove("select-open"),n.setAttribute("aria-expanded","false"),t.classList.remove("select-flip-up")):(e(),t.classList.add("select-open"),n.setAttribute("aria-expanded","true"),s&&setTimeout(function(){s.focus()},50),requestAnimationFrame(function(){i.getBoundingClientRect().bottom>window.innerHeight-16&&t.classList.add("select-flip-up")}))}),a.forEach(function(e){e.addEventListener("click",function(i){if(i.stopPropagation(),!e.classList.contains("is-disabled")){var c=e.getAttribute("data-value"),d=e.querySelector("span").textContent;a.forEach(function(e){e.classList.remove("is-selected")}),e.classList.add("is-selected"),o.value=c,r&&(r.hidden=!0),l&&(l.hidden=!1,l.textContent=d),t.classList.remove("select-open"),n.setAttribute("aria-expanded","false"),t.classList.remove("select-flip-up"),s&&(s.value="",a.forEach(function(e){e.classList.remove("is-hidden")})),o.dispatchEvent(new Event("change",{bubbles:!0}))}})}),s&&(s.addEventListener("input",function(e){e.stopPropagation();var n=s.value.toLowerCase().trim();a.forEach(function(e){var t=e.querySelector("span").textContent.toLowerCase();e.classList.toggle("is-hidden",n&&-1===t.indexOf(n))}),t.querySelectorAll(".select-group-label").forEach(function(e){for(var t=e.nextElementSibling,n=!1;t&&!t.classList.contains("select-group-label");){if(t.classList.contains("select-option")&&!t.classList.contains("is-hidden")){n=!0;break}t=t.nextElementSibling}e.style.display=n?"":"none"}),a.forEach(function(e){e.classList.remove("is-focused")})}),s.addEventListener("click",function(e){e.stopPropagation()})),n.addEventListener("keydown",function(e){var i=t.classList.contains("select-open"),o=Array.from(a).filter(function(e){return!e.classList.contains("is-hidden")&&!e.classList.contains("is-disabled")});if(!i&&("Enter"===e.key||" "===e.key||"ArrowDown"===e.key))return e.preventDefault(),void n.click();if(i){var s=t.querySelector(".select-option.is-focused"),r=o.indexOf(s);if("ArrowDown"===e.key){e.preventDefault(),s&&s.classList.remove("is-focused");var l=r<o.length-1?r+1:0;o[l].classList.add("is-focused"),o[l].scrollIntoView({block:"nearest"})}else if("ArrowUp"===e.key){e.preventDefault(),s&&s.classList.remove("is-focused");var c=r>0?r-1:o.length-1;o[c].classList.add("is-focused"),o[c].scrollIntoView({block:"nearest"})}else"Enter"===e.key?(e.preventDefault(),s&&s.click()):"Escape"===e.key&&(e.preventDefault(),t.classList.remove("select-open"),n.setAttribute("aria-expanded","false"),t.classList.remove("select-flip-up"))}}),document.addEventListener("click",function(e){t.contains(e.target)||(t.classList.remove("select-open"),n.setAttribute("aria-expanded","false"),t.classList.remove("select-flip-up"),s&&(s.value="",a.forEach(function(e){e.classList.remove("is-hidden")})))})}}}function n(t){if(!t.classList.contains("select-disabled")){var n=t.querySelector(".select-trigger"),i=t.querySelector(".select-dropdown"),o=t.querySelector("select"),s=t.querySelectorAll(".select-option"),a=t.querySelector(".multiselect-tags"),r=t.querySelector(".multiselect-search-input"),l=t.querySelector(".multiselect-tag-placeholder"),c=[];if(n&&i&&o&&a){Array.from(o.selectedOptions).forEach(function(e){c.push(e.value)}),n.addEventListener("click",function(e){e.stopPropagation(),t.classList.contains("select-open")?g():m()}),s.forEach(function(e){e.addEventListener("click",function(t){if(t.stopPropagation(),!e.classList.contains("is-disabled")){var n=e.getAttribute("data-value");e.classList.contains("is-selected")?f(n):v(n)}})}),r&&(r.addEventListener("input",function(e){e.stopPropagation();var n=r.value.toLowerCase().trim();s.forEach(function(e){var t=e.querySelector("span").textContent.toLowerCase();e.classList.toggle("is-hidden",n&&-1===t.indexOf(n))}),t.querySelectorAll(".select-group-label").forEach(function(e){for(var t=e.nextElementSibling,n=!1;t&&!t.classList.contains("select-group-label");){if(t.classList.contains("select-option")&&!t.classList.contains("is-hidden")){n=!0;break}t=t.nextElementSibling}e.style.display=n?"":"none"}),s.forEach(function(e){e.classList.remove("is-focused")})}),r.addEventListener("click",function(e){e.stopPropagation()}));var d=t.querySelector(".multiselect-select-all");d&&d.addEventListener("click",function(e){e.stopPropagation(),s.forEach(function(e){e.classList.contains("is-disabled")||(v(e.getAttribute("data-value")),e.classList.add("is-selected"))})});var u=t.querySelector(".multiselect-clear-all");u&&u.addEventListener("click",function(e){e.stopPropagation(),c=[],h(),p(),s.forEach(function(e){e.classList.remove("is-selected")})}),n.addEventListener("keydown",function(e){var n=t.classList.contains("select-open"),i=Array.from(s).filter(function(e){return!e.classList.contains("is-hidden")&&!e.classList.contains("is-disabled")});if(!n&&("Enter"===e.key||" "===e.key||"ArrowDown"===e.key))return e.preventDefault(),void m();if(n){var o=t.querySelector(".select-option.is-focused"),a=i.indexOf(o);if("ArrowDown"===e.key){e.preventDefault(),o&&o.classList.remove("is-focused");var r=a<i.length-1?a+1:0;i[r].classList.add("is-focused"),i[r].scrollIntoView({block:"nearest"})}else if("ArrowUp"===e.key){e.preventDefault(),o&&o.classList.remove("is-focused");var l=a>0?a-1:i.length-1;i[l].classList.add("is-focused"),i[l].scrollIntoView({block:"nearest"})}else"Enter"===e.key?(e.preventDefault(),o&&o.click()):"Escape"===e.key&&(e.preventDefault(),g())}}),p(),document.addEventListener("click",function(e){t.contains(e.target)||g()})}}function p(){if(a.querySelectorAll(".multiselect-tag, .multiselect-counter").forEach(function(e){e.remove()}),0!==c.length){l&&(l.style.display="none");for(var e=Math.min(c.length,2),n=0;n<e;n++){var i=c[n],o=t.querySelector('.select-option[data-value="'+i+'"]'),s=o?o.querySelector("span").textContent:i,d=document.createElement("span");d.className="multiselect-tag",d.setAttribute("data-value",i),d.innerHTML='<span class="multiselect-tag-label">'+s+'</span><button class="multiselect-tag-remove" type="button" aria-label="Remove"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg></button>',a.insertBefore(d,r),d.querySelector(".multiselect-tag-remove").addEventListener("click",function(e){e.stopPropagation(),f(i)})}var u=c.length-2;if(u>0){var p=document.createElement("span");p.className="multiselect-counter",p.textContent="+"+u,a.insertBefore(p,r)}}else l&&(l.style.display="")}function f(e){c=c.filter(function(t){return t!==e}),h(),p();var n=t.querySelector('.select-option[data-value="'+e+'"]');n&&n.classList.remove("is-selected")}function v(e){-1===c.indexOf(e)&&c.push(e),h(),p();var n=t.querySelector('.select-option[data-value="'+e+'"]');n&&n.classList.add("is-selected")}function h(){Array.from(o.options).forEach(function(e){e.selected=-1!==c.indexOf(e.value)}),o.dispatchEvent(new Event("change",{bubbles:!0}))}function m(){e(),t.classList.add("select-open"),n.setAttribute("aria-expanded","true"),r&&(r.style.display="",setTimeout(function(){r.focus()},50)),requestAnimationFrame(function(){i.getBoundingClientRect().bottom>window.innerHeight-16&&t.classList.add("select-flip-up")})}function g(){t.classList.remove("select-open"),n.setAttribute("aria-expanded","false"),t.classList.remove("select-flip-up"),0===c.length&&r&&(r.style.display="none"),r&&(r.value="",s.forEach(function(e){e.classList.remove("is-hidden")}))}}function i(){document.querySelectorAll("[data-select]").forEach(t),document.querySelectorAll("[data-multiselect]").forEach(n)}"loading"===document.readyState?document.addEventListener("DOMContentLoaded",i):i()}(),function(){var e=function(){var e=[],t=[],n=null,i="bottom-right",o={success:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>',error:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="15" y1="9" x2="9" y2="15"></line><line x1="9" y1="9" x2="15" y2="15"></line></svg>',warning:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>',info:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>',neutral:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path><polyline points="17 21 17 13 7 13 7 21"></polyline><polyline points="7 3 7 8 15 8"></polyline></svg>',loading:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10" stroke-dasharray="20" stroke-dashoffset="15"></circle></svg>'};function s(e){n||((n=document.createElement("div")).className="toast-stack toast-stack-"+i,n.id="toast-stack",document.body.appendChild(n));var s=document.createElement("div");s.className="toast toast-"+e.type+" toast-enter",s.setAttribute("role","alert"),s.setAttribute("aria-live","assertive");var r=e.action?'<button class="toast-action" data-action="1">'+e.action.label+"</button>":"";s.innerHTML='<span class="toast-icon">'+(o[e.type]||o.neutral)+'</span><div class="toast-body"><span class="toast-message">'+e.message+"</span>"+r+'</div><button class="toast-close" aria-label="Close"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg></button>'+("loading"!==e.type?'<div class="toast-progress running" style="animation-duration:'+e.duration+'ms"></div>':'<div class="toast-progress"></div>'),s.querySelector(".toast-close").addEventListener("click",function(){a(s)});var l=s.querySelector(".toast-action");l&&e.action&&e.action.onClick&&l.addEventListener("click",function(){a(s),e.action.onClick()});var c=s.querySelector(".toast-progress.running");c&&(s.addEventListener("mouseenter",function(){c.style.animationPlayState="paused"}),s.addEventListener("mouseleave",function(){c.style.animationPlayState="running"})),n.appendChild(s),t.push(s),"loading"!==e.type&&(s._dismissTimer=setTimeout(function(){a(s)},e.duration+200))}function a(n){clearTimeout(n._dismissTimer),n.classList.remove("toast-enter"),n.classList.add("toast-exit"),n.addEventListener("animationend",function i(){n.removeEventListener("animationend",i),n.parentNode&&n.parentNode.removeChild(n);var o=t.indexOf(n);-1!==o&&t.splice(o,1),function(){for(;e.length>0&&t.length<5;)s(e.shift())}()})}return{show:function(n){var i={type:(n=n||{}).type||"neutral",message:n.message||"",duration:n.duration||4e3,action:n.action||null};t.length<5?s(i):e.push(i)},clearAll:function(){t.slice().forEach(function(e){a(e)}),e=[]},setPosition:function(e){i=e,n&&(n.className="toast-stack",n.classList.add("toast-stack-"+i))}}}();window.ToastManager=e}(),function(){var e={info:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>',star:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg>',check:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>',alert:'<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>'},t=function(){var t=[];function n(e){var t=document.createElement("div");return t.textContent=e,t.innerHTML}function i(i){o(i);var s=i.getAttribute("data-tooltip-position")||"top",a=i.getAttribute("data-tooltip-variant")||"",r=i.hasAttribute("data-tooltip-interactive"),l=document.createElement("div");l.className="tooltip tooltip-"+s,"light"===a&&l.classList.add("tooltip-light"),r&&l.classList.add("tooltip-interactive"),l.setAttribute("role","tooltip"),l.innerHTML=function(t){var i=t.getAttribute("data-tooltip"),o=t.getAttribute("data-tooltip-title"),s=t.getAttribute("data-tooltip-body"),a=t.getAttribute("data-tooltip-icon"),r=t.hasAttribute("data-tooltip-interactive"),l='<span class="tooltip-arrow"></span><div>';return o||s?(l+='<span class="tooltip-rich">',o&&(l+='<span class="tooltip-title">'+n(o)+"</span>"),s&&(l+='<span class="tooltip-body">'+n(s)+"</span>"),l+="</span>"):a?l+='<span class="tooltip-with-icon"><span class="tooltip-icon-img">'+(e[a]||e.info)+"</span><span>"+n(i)+"</span></span>":i&&(l+=n(i)),r&&(l+='<div class="tooltip-actions"><button class="tooltip-action-btn" data-tooltip-action>Learn More</button><button class="tooltip-action-btn" data-tooltip-dismiss>Dismiss</button></div>'),l+"</div>"}(i),document.body.appendChild(l),function(e,t,n){var i,o,s=e.getBoundingClientRect(),a=t.getBoundingClientRect(),r=10,l=n.replace(/-(start|end)$/,""),c=-1!==n.indexOf("-start")?"start":-1!==n.indexOf("-end")?"end":"center";switch(l){case"top":i=s.top-r-a.height,o=s.left+s.width/2-a.width/2;break;case"bottom":i=s.bottom+r,o=s.left+s.width/2-a.width/2;break;case"left":i=s.top+s.height/2-a.height/2,o=s.left-r-a.width;break;case"right":i=s.top+s.height/2-a.height/2,o=s.right+r}"start"===c?"top"===l||"bottom"===l?o=s.left:i=s.top:"end"===c&&("top"===l||"bottom"===l?o=s.right-a.width:i=s.bottom-a.height),i<4&&"top"===l&&(l="bottom",i=s.bottom+r),i+a.height>window.innerHeight-4&&"bottom"===l&&(l="top",i=s.top-r-a.height),o<4&&"left"===l&&(l="right",o=s.right+r),o+a.width>window.innerWidth-4&&"right"===l&&(l="left",o=s.left-r-a.width),o=Math.max(4,Math.min(o,window.innerWidth-a.width-4)),i=Math.max(4,Math.min(i,window.innerHeight-a.height-4)),t.style.left=o+"px",t.style.top=i+"px";var d=t.querySelector(".tooltip-arrow");if(d)if("top"===l){d.style.bottom="calc(var(--tooltip-arrow-size) * -1 + 1px)",d.style.top="";var u=s.left+s.width/2-o;d.style.left=Math.max(8,Math.min(u-3,a.width-16))+"px",d.style.right=""}else if("bottom"===l){d.style.top="calc(var(--tooltip-arrow-size) * -1 + 1px)",d.style.bottom="";var p=s.left+s.width/2-o;d.style.left=Math.max(8,Math.min(p-3,a.width-16))+"px",d.style.right=""}else if("left"===l){d.style.right="calc(var(--tooltip-arrow-size) * -1 + 1px)",d.style.left="";var f=s.top+s.height/2-i;d.style.top=Math.max(8,Math.min(f-3,a.height-16))+"px",d.style.bottom=""}else if("right"===l){d.style.left="calc(var(--tooltip-arrow-size) * -1 + 1px)",d.style.right="";var v=s.top+s.height/2-i;d.style.top=Math.max(8,Math.min(v-3,a.height-16))+"px",d.style.bottom=""}}(i,l,s),l._showTimer=setTimeout(function(){l.classList.add("is-visible")},100),t.push({trigger:i,tooltip:l}),r&&(l.addEventListener("mouseenter",function(){clearTimeout(l._hideTimer)}),l.addEventListener("mouseleave",function(){l._hideTimer=setTimeout(function(){o(i)},100)}),l.addEventListener("click",function(e){e.target.hasAttribute("data-tooltip-dismiss")&&o(i),e.target.hasAttribute("data-tooltip-action")&&(o(i),window.ToastManager&&ToastManager.show({type:"info",message:"Action clicked!"}))}))}function o(e){var n=t.find(function(t){return t.trigger===e});n&&(clearTimeout(n.tooltip._showTimer),n.tooltip.classList.remove("is-visible"),n.tooltip._hideTimer=setTimeout(function(){n.tooltip.parentNode&&n.tooltip.parentNode.removeChild(n.tooltip),t=t.filter(function(e){return e!==n})},100))}return{init:function(){var e;document.querySelectorAll("[data-tooltip]").forEach(function(e){var n=e.getAttribute("data-tooltip-trigger")||"hover";"hover"!==n&&"hover-focus"!==n||(e.addEventListener("mouseenter",function(){i(e)}),e.addEventListener("mouseleave",function(){o(e)})),"focus"!==n&&"hover-focus"!==n||(e.addEventListener("focus",function(){i(e)}),e.addEventListener("blur",function(){o(e)})),"click"===n&&e.addEventListener("click",function(n){n.stopPropagation(),t.find(function(t){return t.trigger===e})?o(e):i(e)})}),window.addEventListener("scroll",function(){clearTimeout(e),e=setTimeout(function(){t.slice().forEach(function(e){o(e.trigger)})},50)},{passive:!0})},show:i,hide:o}}(),n=function(){var e=[];function t(t,o,s){var a=document.getElementById(o);a&&(i(),a.classList.add("is-visible"),a.classList.remove("is-hidden"),e.push(a),function(e,t,n){document.body.appendChild(t);var i,o,s=e.getBoundingClientRect(),a=t.getBoundingClientRect(),r=n||"bottom",l=-1!==r.indexOf("-end")?"end":-1!==r.indexOf("-start")?"start":"center",c=r.replace(/-(start|end)$/,"");"bottom"===c?(i=s.bottom+8,o="end"===l?s.right-a.width:"start"===l?s.left:s.left+s.width/2-a.width/2):"top"===c&&(i=s.top-8-a.height,o="end"===l?s.right-a.width:"start"===l?s.left:s.left+s.width/2-a.width/2),o=Math.max(8,Math.min(o,window.innerWidth-a.width-8)),i=Math.max(8,Math.min(i,window.innerHeight-a.height-8)),t.style.left=o+"px",t.style.top=i+"px"}(t,a,s),a._closeHandler=function(e){a.contains(e.target)||e.target===t||t.contains(e.target)||n(o)},setTimeout(function(){document.addEventListener("click",a._closeHandler)},0),a.querySelectorAll("[data-popover-close]").forEach(function(e){e.addEventListener("click",function(){n(o)})}))}function n(t){var n=document.getElementById(t);n&&(n.classList.remove("is-visible"),n.classList.add("is-hidden"),n._closeHandler&&document.removeEventListener("click",n._closeHandler),e=e.filter(function(e){return e!==n}),setTimeout(function(){n.classList.remove("is-hidden")},200))}function i(){e.slice().forEach(function(e){n(e.id)})}return{init:function(){document.querySelectorAll("[data-popover]").forEach(function(e){var i=e.getAttribute("data-popover"),o=e.getAttribute("data-popover-position")||"bottom";e.addEventListener("click",function(s){s.stopPropagation();var a=document.getElementById(i);a&&a.classList.contains("is-visible")?n(i):t(e,i,o)})})},close:n,closeAll:i}}();window.TooltipManager=t,window.PopoverManager=n,"loading"===document.readyState?document.addEventListener("DOMContentLoaded",function(){t.init(),n.init()}):(t.init(),n.init())}();
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "minora",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "Elegant minimalist UI kit — clean components with warm gold accent, zero dependencies, CDN-ready",
|
|
5
5
|
"main": "dist/minora.css",
|
|
6
6
|
"style": "dist/minora.css",
|
|
@@ -30,10 +30,10 @@
|
|
|
30
30
|
],
|
|
31
31
|
"repository": {
|
|
32
32
|
"type": "git",
|
|
33
|
-
"url": "git+https://github.com/
|
|
33
|
+
"url": "git+https://github.com/ilzamafif/minora.git"
|
|
34
34
|
},
|
|
35
35
|
"bugs": {
|
|
36
|
-
"url": "https://github.com/
|
|
36
|
+
"url": "https://github.com/ilzamafif/minora/issues"
|
|
37
37
|
},
|
|
38
38
|
"homepage": "https://minora-ui.com",
|
|
39
39
|
"author": "",
|