css-zero 0.0.51 → 0.0.52
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.
- checksums.yaml +4 -4
- data/app/assets/stylesheets/_reset.css +1 -1
- data/lib/css_zero/version.rb +1 -1
- data/lib/generators/css_zero/add/USAGE +1 -1
- data/lib/generators/css_zero/add/resources.yml +4 -0
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/badge.css +2 -2
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/ztrix.css +1 -1
- data/lib/generators/css_zero/add/templates/app/javascript/controllers/autosave_controller.js +64 -0
- data/lib/generators/css_zero/add/templates/app/javascript/controllers/combobox_controller.js +4 -4
- data/lib/generators/css_zero/add/templates/app/javascript/controllers/inputmask_controller.js +46 -0
- data/lib/generators/css_zero/install/templates/app/assets/stylesheets/base.css +2 -2
- metadata +4 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: c157fd23d2088eadf6b3ddd2301b2c6bb5e819e0fcebb3e2fd92bde924469a64
|
|
4
|
+
data.tar.gz: a68db27229c7b3c9118a008dc2f4417ff84b2dd99a54a637ed156a01c5aabd46
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 6d06cd1f0e6c178496ecca303119b7d880f1d384c3ebd7549bedf3ae18c19bc90a8702016fd8bd9c0d913ffc48b68081d10b5e2e17e21eb2844644b80c331c36
|
|
7
|
+
data.tar.gz: 5bcd076df9a20544d488289894c858f426d88b0805a79fe47c326c48bf679de340542924510df37c6b06707ee537e0d396033a3db6bb082dd9ce7cf9142af90f
|
data/lib/css_zero/version.rb
CHANGED
|
@@ -2,7 +2,7 @@ Description:
|
|
|
2
2
|
This will add components into your project.
|
|
3
3
|
|
|
4
4
|
Components:
|
|
5
|
-
accordion alert avatar badge breadcrumb button card carousel combobox check_all command collapsible dialog dropdown flash form fullscreen hotkey input input_concerns layouts lightbox local_time pagination progress prose sheet skeleton switch table tabs trix upload_preview toggle web_share
|
|
5
|
+
accordion alert autosave avatar badge breadcrumb button card carousel combobox check_all command collapsible dialog dropdown flash form fullscreen hotkey input input_concerns inputmask layouts lightbox local_time pagination progress prose sheet skeleton switch table tabs trix upload_preview toggle web_share
|
|
6
6
|
|
|
7
7
|
Example:
|
|
8
8
|
bin/rails generate css_zero:add [components...]
|
|
@@ -3,6 +3,8 @@ accordion:
|
|
|
3
3
|
- app/assets/images/chevron-down.svg
|
|
4
4
|
alert:
|
|
5
5
|
- app/assets/stylesheets/alert.css
|
|
6
|
+
autosave:
|
|
7
|
+
- app/javascript/controllers/autosave_controller.js
|
|
6
8
|
avatar:
|
|
7
9
|
- app/assets/stylesheets/avatar.css
|
|
8
10
|
badge:
|
|
@@ -65,6 +67,8 @@ input_concerns:
|
|
|
65
67
|
- app/javascript/controllers/revealable_input_controller.js
|
|
66
68
|
- app/assets/images/eye.svg
|
|
67
69
|
- app/assets/images/eye-off.svg
|
|
70
|
+
inputmask:
|
|
71
|
+
- app/javascript/controllers/inputmask_controller.js
|
|
68
72
|
layouts:
|
|
69
73
|
- app/assets/stylesheets/layouts.css
|
|
70
74
|
- app/assets/images/menu.svg
|
|
@@ -24,11 +24,11 @@
|
|
|
24
24
|
.badge--positive {
|
|
25
25
|
--badge-background: var(--color-positive);
|
|
26
26
|
--badge-border-color: transparent;
|
|
27
|
-
--badge-color:
|
|
27
|
+
--badge-color: var(--color-text-reversed);
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
.badge--negative {
|
|
31
31
|
--badge-background: var(--color-negative);
|
|
32
32
|
--badge-border-color: transparent;
|
|
33
|
-
--badge-color:
|
|
33
|
+
--badge-color: var(--color-text-reversed);
|
|
34
34
|
}
|
|
@@ -66,7 +66,7 @@ trix-editor {
|
|
|
66
66
|
padding-block: var(--size-6) var(--size-2);
|
|
67
67
|
|
|
68
68
|
&:empty:not(:focus)::before {
|
|
69
|
-
color: color-mix(in
|
|
69
|
+
color: color-mix(in oklch, currentColor 50%, transparent);
|
|
70
70
|
}
|
|
71
71
|
|
|
72
72
|
[data-trix-mutable].attachment img,
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { Controller } from "@hotwired/stimulus"
|
|
2
|
+
import { FetchRequest } from "@rails/request.js"
|
|
3
|
+
|
|
4
|
+
const AUTOSAVE_INTERVAL = 3000
|
|
5
|
+
|
|
6
|
+
export default class extends Controller {
|
|
7
|
+
static targets = [ "submitter" ]
|
|
8
|
+
|
|
9
|
+
#timer
|
|
10
|
+
|
|
11
|
+
disconnect() {
|
|
12
|
+
this.#submit()
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
change() {
|
|
16
|
+
!this.#dirty && this.#scheduleSave()
|
|
17
|
+
!this.#dirty && this.#updateAppearance()
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
async #submit() {
|
|
21
|
+
this.#dirty && await this.#save()
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
async #save() {
|
|
25
|
+
this.#updateAppearance(true)
|
|
26
|
+
this.#resetTimer()
|
|
27
|
+
await submitForm(this.element)
|
|
28
|
+
this.#updateAppearance()
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
#updateAppearance(saving = false) {
|
|
32
|
+
if (saving) {
|
|
33
|
+
this.element.setAttribute("aria-busy", true)
|
|
34
|
+
this.submitterTarget.setAttribute("aria-disabled", true)
|
|
35
|
+
this.submitterTarget.disabled = true
|
|
36
|
+
} else {
|
|
37
|
+
this.element.removeAttribute("aria-busy")
|
|
38
|
+
this.submitterTarget.removeAttribute("aria-disabled")
|
|
39
|
+
this.submitterTarget.disabled = false
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
#scheduleSave() {
|
|
44
|
+
this.#timer = setTimeout(() => this.#save(), AUTOSAVE_INTERVAL)
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
#resetTimer() {
|
|
48
|
+
clearTimeout(this.#timer); this.#timer = null
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
get #dirty() {
|
|
52
|
+
return !!this.#timer
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
// Helpers
|
|
57
|
+
|
|
58
|
+
async function submitForm(form) {
|
|
59
|
+
const request = new FetchRequest(form.method, form.action, {
|
|
60
|
+
body: new FormData(form)
|
|
61
|
+
})
|
|
62
|
+
|
|
63
|
+
return await request.perform()
|
|
64
|
+
}
|
data/lib/generators/css_zero/add/templates/app/javascript/controllers/combobox_controller.js
CHANGED
|
@@ -3,7 +3,7 @@ import { get } from "@rails/request.js"
|
|
|
3
3
|
import TomSelect from "tom-select"
|
|
4
4
|
|
|
5
5
|
export default class extends Controller {
|
|
6
|
-
static values = { url: String,
|
|
6
|
+
static values = { url: String, optionCreate: { type: String, default: "Add" }, noResults: { type: String, default: "No results found" } }
|
|
7
7
|
|
|
8
8
|
initialize() {
|
|
9
9
|
this.load = this.load.bind(this)
|
|
@@ -28,17 +28,17 @@ export default class extends Controller {
|
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
get #inputSettings() {
|
|
31
|
-
return { render: this.#render, load:
|
|
31
|
+
return { render: this.#render, load: this.hasUrlValue && this.load, persist: false, createOnBlur: true, create: true }
|
|
32
32
|
}
|
|
33
33
|
|
|
34
34
|
get #selectSettings() {
|
|
35
|
-
return { render: this.#render, load:
|
|
35
|
+
return { render: this.#render, load: this.hasUrlValue && this.load }
|
|
36
36
|
}
|
|
37
37
|
|
|
38
38
|
get #render() {
|
|
39
39
|
return {
|
|
40
40
|
option_create: (data, escape) => {
|
|
41
|
-
return `<div class="create">${this.
|
|
41
|
+
return `<div class="create">${this.optionCreateValue} <b>${escape(data.input)}</b>...</div>`
|
|
42
42
|
},
|
|
43
43
|
no_results: () => {
|
|
44
44
|
return `<div class="no-results">${this.noResultsValue}</div>`
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { Controller } from "@hotwired/stimulus"
|
|
2
|
+
import Inputmask from "inputmask"
|
|
3
|
+
|
|
4
|
+
export default class extends Controller {
|
|
5
|
+
static values = {
|
|
6
|
+
mask: String,
|
|
7
|
+
alias: String,
|
|
8
|
+
groupSeparator: { type: String, default: "" },
|
|
9
|
+
radixPoint: { type: String, default: "." },
|
|
10
|
+
digits: { type: String, default: "*" },
|
|
11
|
+
digitsOptional: { type: Boolean, default: true },
|
|
12
|
+
inputFormat: { type: String, default: "mm/dd/yyyy HH:MM" },
|
|
13
|
+
outputFormat: { type: String, default: "yyyy-mm-dd HH:MM" }
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
connect() {
|
|
17
|
+
if (this.hasMaskValue) {
|
|
18
|
+
Inputmask.default({ mask: this.maskValue }).mask(this.element)
|
|
19
|
+
} else if (this.aliasValue == "numeric") {
|
|
20
|
+
Inputmask.default(this.#numericOptions).mask(this.element)
|
|
21
|
+
} else if (this.aliasValue == "datetime") {
|
|
22
|
+
Inputmask.default(this.#datetimeOptions).mask(this.element)
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
get #numericOptions() {
|
|
27
|
+
return {
|
|
28
|
+
alias: "numeric",
|
|
29
|
+
unmaskAsNumber: true,
|
|
30
|
+
removeMaskOnSubmit: true,
|
|
31
|
+
groupSeparator: this.groupSeparatorValue,
|
|
32
|
+
radixPoint: this.radixPointValue,
|
|
33
|
+
digits: this.digitsValue,
|
|
34
|
+
digitsOptional: this.digitsOptionalValue
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
get #datetimeOptions() {
|
|
39
|
+
return {
|
|
40
|
+
alias: "datetime",
|
|
41
|
+
removeMaskOnSubmit: true,
|
|
42
|
+
inputFormat: this.inputFormatValue,
|
|
43
|
+
outputFormat: this.outputFormatValue
|
|
44
|
+
}
|
|
45
|
+
}
|
|
46
|
+
}
|
|
@@ -47,8 +47,8 @@
|
|
|
47
47
|
--color-filter-text: invert(100%);
|
|
48
48
|
--color-filter-text-reversed: invert(2%) sepia(3%) saturate(3904%) hue-rotate(201deg) brightness(98%) contrast(97%);
|
|
49
49
|
--color-filter-text-subtle: invert(76%) sepia(8%) saturate(230%) hue-rotate(201deg) brightness(84%) contrast(87%);
|
|
50
|
-
--color-filter-negative: invert(
|
|
51
|
-
--color-filter-positive: invert(
|
|
50
|
+
--color-filter-negative: invert(54%) sepia(16%) saturate(2119%) hue-rotate(313deg) brightness(111%) contrast(94%);
|
|
51
|
+
--color-filter-positive: invert(81%) sepia(23%) saturate(1237%) hue-rotate(80deg) brightness(95%) contrast(83%);
|
|
52
52
|
}
|
|
53
53
|
}
|
|
54
54
|
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: css-zero
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.52
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Lázaro Nixon
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2024-10-
|
|
11
|
+
date: 2024-10-27 00:00:00.000000000 Z
|
|
12
12
|
dependencies: []
|
|
13
13
|
description:
|
|
14
14
|
email: lazaronixon@hotmail.com
|
|
@@ -83,6 +83,7 @@ files:
|
|
|
83
83
|
- lib/generators/css_zero/add/templates/app/assets/stylesheets/tom-select.css
|
|
84
84
|
- lib/generators/css_zero/add/templates/app/assets/stylesheets/zcombobox.css
|
|
85
85
|
- lib/generators/css_zero/add/templates/app/assets/stylesheets/ztrix.css
|
|
86
|
+
- lib/generators/css_zero/add/templates/app/javascript/controllers/autosave_controller.js
|
|
86
87
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/autoselect_controller.js
|
|
87
88
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/carousel_controller.js
|
|
88
89
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/check_all_controller.js
|
|
@@ -96,6 +97,7 @@ files:
|
|
|
96
97
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/form_controller.js
|
|
97
98
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/fullscreen_controller.js
|
|
98
99
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/hotkey_controller.js
|
|
100
|
+
- lib/generators/css_zero/add/templates/app/javascript/controllers/inputmask_controller.js
|
|
99
101
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/lightbox_controller.js
|
|
100
102
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/list_controller.js
|
|
101
103
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/local_time_controller.js
|