css-zero 1.1.15 → 2.0.1

data/lib/generators/css_zero/add/templates/app/javascript/controllers/resizable_controller.js

@@ -0,0 +1,31 @@
+import { Controller } from "@hotwired/stimulus"
+import Split from "https://esm.sh/split.js@1.6.5?standalone"
+
+export default class extends Controller {
+  static targets = [ "element" ]
+  static values  = { direction: { type: String, default: "horizontal" } }
+
+  connect() {
+    this.split = Split(this.elementTargets, this.#options)
+  }
+
+  disconnect() {
+    this.split.destroy()
+  }
+
+  get #options() {
+    return { sizes: this.#sizes, minSize: this.#minSize, maxSize: this.#maxSize, direction: this.directionValue }
+  }
+
+  get #sizes() {
+    return this.elementTargets.map(it => parseInt(it.dataset.size) || 0)
+  }
+
+  get #minSize() {
+    return this.elementTargets.map(it => parseInt(it.dataset.minSize) || 100)
+  }
+
+  get #maxSize() {
+    return this.elementTargets.map(it => parseInt(it.dataset.maxSize) || Infinity)
+  }
+}

data/lib/generators/css_zero/add/templates/app/javascript/controllers/sortable_controller.js

@@ -1,5 +1,5 @@
 import { Controller } from "@hotwired/stimulus"
-import { put } from "https://esm.sh/@rails/request.js@0.0.11?standalone"
+import { put } from "https://esm.sh/@rails/request.js@0.0.12?standalone"
 import Sortable from "https://esm.sh/sortablejs@1.15.6?standalone"
 
 export default class extends Controller {

data/lib/generators/css_zero/add/templates/app/javascript/controllers/timezone_cookie_controller.js

@@ -0,0 +1,11 @@
+import { Controller } from "@hotwired/stimulus"
+
+export default class extends Controller {
+  connect() {
+    document.cookie = `timezone=${encodeURIComponent(this.#timezone)}; path=/`
+  }
+
+  get #timezone() {
+    return Intl.DateTimeFormat().resolvedOptions().timeZone
+  }
+}

data/lib/generators/css_zero/add/templates/app/javascript/controllers/turbo_confirm_controller.js

@@ -15,7 +15,7 @@ export default class extends Controller {
   }
 
   submit({ target }) {
-    this.#confirmCallback?.(target.returnValue === "confirm")
+    this.#confirmCallback(target.returnValue === "confirm")
   }
 
   #confirm(message, target) {

data/lib/generators/css_zero/add/templates/app/javascript/controllers/{otp_input_controller.js → web_otp_controller.js}

@@ -1,6 +1,8 @@
 import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
+  static targets = [ "input" ]
+
   initialize() {
     this.abortController = new AbortController()
   }
@@ -14,9 +16,9 @@ export default class extends Controller {
   }
 
   #requestOTP() {
-    navigator.credentials.get(this.#options).then(it => {
-      this.element.value = it.code
-      this.elementForm?.requestSubmit()
+    navigator.credentials.get(this.#options).then(credential => {
+      this.inputTarget.value = credential.code
+      this.element.requestSubmit()
     }).catch(error => {})
   }
 
@@ -27,8 +29,4 @@ export default class extends Controller {
   get #supportsOTP() {
     return "OTPCredential" in window
   }
-
-  get elementForm() {
-    return this.element.closest("form")
-  }
 }

data/lib/generators/css_zero/install/templates/app/assets/stylesheets/base.css

@@ -1,55 +1,20 @@
 :root {
-  /* Abstractions */
-  --color-bg: white;
-  --color-text: black;
-  --color-text-reversed: white;
-  --color-text-subtle: var(--zinc-500);
-  --color-link: var(--blue-700);
-  --color-border-light: var(--zinc-100);
-  --color-border: var(--zinc-200);
-  --color-border-dark: var(--zinc-400);
-  --color-selected: var(--blue-100);
-  --color-selected-dark: var(--blue-300);
-  --color-highlight: var(--yellow-200);
-
-  /* Accent colors */
-  --color-primary: var(--zinc-900);
-  --color-secondary: var(--zinc-100);
-  --color-negative: var(--red-600);
-  --color-positive: var(--green-600);
-
-  /* SVG color values */
-  --color-filter-text: invert(0);
-  --color-filter-text-reversed: invert(1);
-  --color-filter-negative: invert(22%) sepia(85%) saturate(1790%) hue-rotate(339deg) brightness(105%) contrast(108%);
-  --color-filter-positive: invert(44%) sepia(89%) saturate(409%) hue-rotate(89deg) brightness(94%) contrast(97%);
-
-  @media (prefers-color-scheme: dark) {
-    /* Abstractions */
-    --color-bg: var(--zinc-950);
-    --color-text: white;
-    --color-text-reversed: black;
-    --color-text-subtle: var(--zinc-400);
-    --color-link: var(--blue-400);
-    --color-border-light: var(--zinc-900);
-    --color-border: var(--zinc-800);
-    --color-border-dark: var(--zinc-600);
-    --color-selected: var(--blue-950);
-    --color-selected-dark: var(--blue-800);
-    --color-highlight: var(--yellow-900);
-
-    /* Accent colors */
-    --color-primary: var(--zinc-50);
-    --color-secondary: var(--zinc-800);
-    --color-negative: var(--red-900);
-    --color-positive: var(--green-900);
-
-    /* SVG color values */
-    --color-filter-text: invert(1);
-    --color-filter-text-reversed: invert(0);
-    --color-filter-negative: invert(15%) sepia(65%) saturate(2067%) hue-rotate(339deg) brightness(102%) contrast(97%);
-    --color-filter-positive: invert(23%) sepia(62%) saturate(554%) hue-rotate(91deg) brightness(93%) contrast(91%);
-  }
+  --color-bg: light-dark(white, var(--zinc-950));
+  --color-text: light-dark(var(--zinc-950), white);
+  --color-text-reversed: light-dark(white, var(--zinc-950));
+  --color-text-subtle: light-dark(var(--zinc-500), var(--zinc-400));
+  --color-link: light-dark(var(--blue-700), var(--blue-400));
+  --color-border-light: light-dark(var(--zinc-100), var(--zinc-800));
+  --color-border: light-dark(var(--zinc-200), var(--zinc-700));
+  --color-border-dark: light-dark(var(--zinc-400), var(--zinc-600));
+  --color-selected: light-dark(var(--sky-100), var(--sky-950));
+  --color-selected-dark: light-dark(var(--blue-300), var(--blue-800));
+  --color-highlight: light-dark(var(--yellow-200), var(--yellow-900));
+
+  --color-primary: light-dark(var(--zinc-900), var(--zinc-50));
+  --color-secondary: light-dark(var(--zinc-100), var(--zinc-800));
+  --color-negative: light-dark(var(--red-600), var(--red-800));
+  --color-positive: light-dark(var(--green-600), var(--green-800));
 }
 
 * {

data/lib/generators/css_zero/install/templates/app/views/layouts/application.html.erb

@@ -38,7 +38,7 @@
 
     <main id="main">
       <%% if notice.present? %>
-        <div popover class="flash" style="--flash-position: 5rem;" data-controller="element-removal" data-action="animationend->element-removal#remove" role="alert"><%%= notice %></div>
+        <%%= tag.div notice, popover: "manual", class: "flash", style: "--flash-position: 5rem", data: { controller: "element-removal", action: "animationend->element-removal#remove", role: "alert" } %>
       <%% end %>
       <div class="container">
         <%%= yield %>

metadata

@@ -1,13 +1,13 @@
 --- !ruby/object:Gem::Specification
 name: css-zero
 version: !ruby/object:Gem::Version
-  version: 1.1.15
+  version: 2.0.1
 platform: ruby
 authors:
 - Lázaro Nixon
 bindir: bin
 cert_chain: []
-date: 2025-03-20 00:00:00.000000000 Z
+date: 2025-08-05 00:00:00.000000000 Z
 dependencies: []
 email: lazaronixon@hotmail.com
 executables: []
@@ -34,25 +34,27 @@ files:
 - lib/generators/css_zero/add/USAGE
 - lib/generators/css_zero/add/add_generator.rb
 - lib/generators/css_zero/add/resources.yml
-- lib/generators/css_zero/add/templates/app/assets/images/arrow-left.svg
-- lib/generators/css_zero/add/templates/app/assets/images/arrow-right.svg
+- lib/generators/css_zero/add/templates/app/assets/images/avatar.svg
 - lib/generators/css_zero/add/templates/app/assets/images/camera.svg
+- lib/generators/css_zero/add/templates/app/assets/images/chevron-down-zinc-500.svg
 - lib/generators/css_zero/add/templates/app/assets/images/chevron-down.svg
 - lib/generators/css_zero/add/templates/app/assets/images/chevron-left.svg
 - lib/generators/css_zero/add/templates/app/assets/images/chevron-right.svg
-- lib/generators/css_zero/add/templates/app/assets/images/circle-alert.svg
+- lib/generators/css_zero/add/templates/app/assets/images/chevrons-up-down.svg
 - lib/generators/css_zero/add/templates/app/assets/images/copy.svg
-- lib/generators/css_zero/add/templates/app/assets/images/default-picture.webp
 - lib/generators/css_zero/add/templates/app/assets/images/download.svg
 - lib/generators/css_zero/add/templates/app/assets/images/ellipsis.svg
+- lib/generators/css_zero/add/templates/app/assets/images/eye-off.svg
 - lib/generators/css_zero/add/templates/app/assets/images/eye.svg
-- lib/generators/css_zero/add/templates/app/assets/images/loader-circle.svg
+- lib/generators/css_zero/add/templates/app/assets/images/grip-horizontal-zink-500.svg
+- lib/generators/css_zero/add/templates/app/assets/images/grip-vertical-zink-500.svg
+- lib/generators/css_zero/add/templates/app/assets/images/loading.svg
 - lib/generators/css_zero/add/templates/app/assets/images/menu.svg
 - lib/generators/css_zero/add/templates/app/assets/images/minus.svg
-- lib/generators/css_zero/add/templates/app/assets/images/off.svg
+- lib/generators/css_zero/add/templates/app/assets/images/moon.svg
 - lib/generators/css_zero/add/templates/app/assets/images/search.svg
-- lib/generators/css_zero/add/templates/app/assets/images/select-arrow.svg
 - lib/generators/css_zero/add/templates/app/assets/images/share.svg
+- lib/generators/css_zero/add/templates/app/assets/images/sun.svg
 - lib/generators/css_zero/add/templates/app/assets/images/x.svg
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/accordion.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/alert.css
@@ -63,6 +65,7 @@ files:
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/button.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/card.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/carousel.css
+- lib/generators/css_zero/add/templates/app/assets/stylesheets/color_scheme.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/combobox.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/command.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/datepicker.css
@@ -70,14 +73,18 @@ files:
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/dropzone.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/flash.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/group.css
+- lib/generators/css_zero/add/templates/app/assets/stylesheets/icons.css
+- lib/generators/css_zero/add/templates/app/assets/stylesheets/input-clearable.css
+- lib/generators/css_zero/add/templates/app/assets/stylesheets/input-copyable.css
+- lib/generators/css_zero/add/templates/app/assets/stylesheets/input-revealable.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css
-- lib/generators/css_zero/add/templates/app/assets/stylesheets/input_concerns.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/layouts.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/lightbox.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/menu.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/popover.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/progress.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/prose.css
+- lib/generators/css_zero/add/templates/app/assets/stylesheets/range.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/resizable.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/sheet.css
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/sidebar_menu.css
@@ -89,34 +96,38 @@ files:
 - lib/generators/css_zero/add/templates/app/assets/stylesheets/trix.css
 - lib/generators/css_zero/add/templates/app/javascript/controllers/autosave_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/autoselect_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/back_navigation_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/carousel_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/chart_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/check_all_controller.js
-- lib/generators/css_zero/add/templates/app/javascript/controllers/clearable_input_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/collapsible_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/color_scheme_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/combobox_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/command_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/context_menu_controller.js
-- lib/generators/css_zero/add/templates/app/javascript/controllers/copyable_input_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/datepicker_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/dialog_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/dropzone_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/dual_range_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/element_removal_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/form_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/fullscreen_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/hotkey_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/input_clearable_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/input_copyable_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/input_revealable_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/inputmask_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/lightbox_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/local_time_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/menu_controller.js
-- lib/generators/css_zero/add/templates/app/javascript/controllers/navigation_controller.js
-- lib/generators/css_zero/add/templates/app/javascript/controllers/otp_input_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/popover_controller.js
-- lib/generators/css_zero/add/templates/app/javascript/controllers/revealable_input_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/resizable_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/sortable_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/tabs_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/timezone_cookie_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/turbo_confirm_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/upload_preview_controller.js
+- lib/generators/css_zero/add/templates/app/javascript/controllers/web_otp_controller.js
 - lib/generators/css_zero/add/templates/app/javascript/controllers/web_share_controller.js
 - lib/generators/css_zero/authentication/authentication_generator.rb
 - lib/generators/css_zero/authentication/templates/app/views/passwords/edit.html.erb.tt

data/lib/generators/css_zero/add/templates/app/assets/images/arrow-left.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>

data/lib/generators/css_zero/add/templates/app/assets/images/arrow-right.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M5 12h14"/><path d="m12 5 7 7-7 7"/></svg>

data/lib/generators/css_zero/add/templates/app/assets/images/circle-alert.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" x2="12" y1="8" y2="12"/><line x1="12" x2="12.01" y1="16" y2="16"/></svg>

data/lib/generators/css_zero/add/templates/app/assets/images/loader-circle.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-6.219-8.56"/></svg>

data/lib/generators/css_zero/add/templates/app/assets/images/off.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2"><path d="m2 2 20 20"/></svg>

data/lib/generators/css_zero/add/templates/app/assets/images/select-arrow.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#71717a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>

data/lib/generators/css_zero/add/templates/app/assets/stylesheets/input_concerns.css

@@ -1,19 +0,0 @@
-.btn--copied img {
-  animation: var(--animate-fade-out), var(--animate-slide-out-up);
-  animation-duration: var(--time-500);
-}
-
-.btn--revealed img {
-  background-image: url("off.svg");
-  background-size: cover;
-}
-
-.input--clearable {
-  input::-webkit-search-cancel-button {
-    display: none;
-  }
-
-  &:has(:placeholder-shown) > button {
-    display: none;
-  }
-}

data/lib/generators/css_zero/add/templates/app/javascript/controllers/navigation_controller.js

@@ -1,16 +0,0 @@
-import { Controller } from "@hotwired/stimulus"
-import { Turbo } from "@hotwired/turbo-rails"
-
-export default class extends Controller {
-  back() {
-    history.back()
-  }
-
-  forward() {
-    history.forward()
-  }
-
-  reload() {
-    Turbo.visit(location.href, { action: "replace", shouldCacheSnapshot: false })
-  }
-}