odt-ui-rails 2.2.2 → 2.2.4

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.
@@ -9,53 +9,41 @@ module Odt
9
9
 
10
10
  desc "Configures ODT UI standalone stylesheets, Tailwind theme, and RBS type signatures for Rails application"
11
11
 
12
- def inject_stylesheets
13
- css_candidates = [
12
+ def setup_stylesheets
13
+ # 1. Setup Tailwind CSS v4 Theme if Tailwind is present
14
+ tailwind_candidates = [
14
15
  "app/assets/tailwind/application.css",
15
- "app/assets/stylesheets/application.tailwind.css",
16
- "app/assets/stylesheets/application.css",
17
- "app/assets/stylesheets/application.scss"
16
+ "app/assets/stylesheets/application.tailwind.css"
18
17
  ]
19
18
 
20
- target_css = css_candidates.find { |file| File.exist?(file) }
19
+ target_tailwind = tailwind_candidates.find { |file| File.exist?(file) }
21
20
 
22
- if target_css
23
- existing_content = File.read(target_css)
21
+ if target_tailwind
22
+ dest_dir = File.dirname(target_tailwind)
23
+ copy_file "odt_theme.css", "#{dest_dir}/odt_theme.css"
24
24
 
25
- if existing_content.include?("odt_ui")
26
- say "ODT UI stylesheet imports already present in #{target_css}", :yellow
27
- return
25
+ existing_content = File.read(target_tailwind)
26
+ unless existing_content.include?("odt_theme")
27
+ append_to_file target_tailwind, "\n@import \"./odt_theme.css\";\n"
28
+ say "Added ODT Tailwind @theme import to #{target_tailwind}", :green
28
29
  end
30
+ end
29
31
 
30
- is_tailwind = target_css.include?("tailwind") || existing_content.include?("@import \"tailwindcss\"") || existing_content.include?("@import 'tailwindcss'")
31
-
32
- imports = if is_tailwind
33
- <<~CSS
34
-
35
- /* ==========================================================================
36
- * ODT Lightweight UI - Design Tokens, Standalone Styles & Tailwind Theme
37
- * ========================================================================== */
38
- @import "odt_ui/tokens.css";
39
- @import "odt_ui/styles.css";
40
- @import "odt_ui/theme.css";
41
- CSS
42
- else
43
- <<~CSS
44
-
45
- /* ==========================================================================
46
- * ODT Lightweight UI - Design Tokens & Standalone Component Styles
47
- * ========================================================================== */
48
- @import "odt_ui/tokens.css";
49
- @import "odt_ui/styles.css";
50
- CSS
32
+ # 2. Inject stylesheet_link_tag into application.html.erb layout
33
+ layout_file = "app/views/layouts/application.html.erb"
34
+ if File.exist?(layout_file)
35
+ layout_content = File.read(layout_file)
36
+ unless layout_content.include?("odt_ui")
37
+ # Inject right after stylesheet_link_tag :app or in <head>
38
+ if layout_content.include?("<%= stylesheet_link_tag :app")
39
+ insert_into_file layout_file, "\n <%= stylesheet_link_tag \"odt_ui\", \"data-turbo-track\": \"reload\" %>", after: /<%= stylesheet_link_tag :app[^\n]*%>/
40
+ elsif layout_content.include?("<%= stylesheet_link_tag \"application\"")
41
+ insert_into_file layout_file, "\n <%= stylesheet_link_tag \"odt_ui\", \"data-turbo-track\": \"reload\" %>", after: /<%= stylesheet_link_tag "application"[^\n]*%>/
42
+ elsif layout_content.include?("</head>")
43
+ insert_into_file layout_file, " <%= stylesheet_link_tag \"odt_ui\", \"data-turbo-track\": \"reload\" %>\n", before: "</head>"
44
+ end
45
+ say "Injected odt_ui stylesheet link tag into #{layout_file}", :green
51
46
  end
52
-
53
- append_to_file target_css, imports
54
- say "Added ODT UI CSS imports to #{target_css}", :green
55
- else
56
- say "No standard application stylesheet found.", :yellow
57
- say "Please add the following to your application stylesheet or layout:", :yellow
58
- say %( @import "odt_ui/tokens.css";\n @import "odt_ui/styles.css";\n), :cyan
59
47
  end
60
48
  end
61
49
 
@@ -0,0 +1,119 @@
1
+ /*
2
+ * odt_theme.css
3
+ * Tailwind CSS v4 @theme configuration for ODT Design Tokens.
4
+ */
5
+
6
+ @theme {
7
+ /* Primary Colors */
8
+ --color-primary-0: hsl(240 78.3% 100%);
9
+ --color-primary-50: hsl(240 78.3% 95%);
10
+ --color-primary-100: hsl(240 78.3% 90%);
11
+ --color-primary-200: hsl(240 78.3% 85%);
12
+ --color-primary-300: hsl(240 78.3% 80%);
13
+ --color-primary-400: hsl(240 78.3% 75%);
14
+ --color-primary-500: hsl(240 78.3% 65%);
15
+ --color-primary-600: hsl(240 78.3% 60%);
16
+ --color-primary-700: hsl(240 78.3% 55%);
17
+ --color-primary-800: hsl(240 78.3% 45%);
18
+ --color-primary-900: hsl(240 78.3% 34.3%);
19
+
20
+ /* Secondary Colors */
21
+ --color-secondary-0: hsl(47 100% 100%);
22
+ --color-secondary-50: hsl(47 100% 95%);
23
+ --color-secondary-100: hsl(47 100% 85%);
24
+ --color-secondary-200: hsl(47 100% 80%);
25
+ --color-secondary-300: hsl(47 100% 75%);
26
+ --color-secondary-400: hsl(47 100% 70%);
27
+ --color-secondary-500: hsl(47 100% 65%);
28
+ --color-secondary-600: hsl(47 100% 60%);
29
+ --color-secondary-700: hsl(47 100% 55%);
30
+ --color-secondary-800: hsl(47 100% 50%);
31
+ --color-secondary-900: hsl(47 100% 45%);
32
+
33
+ /* Neutral Palette */
34
+ --color-neutral-0: hsl(0 0% 100%);
35
+ --color-neutral-50: hsl(240 10% 98%);
36
+ --color-neutral-100: hsl(240 10% 96%);
37
+ --color-neutral-200: hsl(240 9% 90%);
38
+ --color-neutral-300: hsl(240 8% 82%);
39
+ --color-neutral-400: hsl(240 8% 64%);
40
+ --color-neutral-500: hsl(240 7% 46%);
41
+ --color-neutral-600: hsl(240 7% 32%);
42
+ --color-neutral-700: hsl(240 8% 25%);
43
+ --color-neutral-800: hsl(240 10% 15%);
44
+ --color-neutral-900: hsl(240 12% 9%);
45
+ --color-neutral-950: hsl(240 14% 4%);
46
+
47
+ /* Semantic Colors */
48
+ --color-success: hsl(142 71% 45%);
49
+ --color-success-subtle: hsl(142 71% 96%);
50
+ --color-warning: hsl(38 92% 50%);
51
+ --color-warning-subtle: hsl(38 92% 96%);
52
+ --color-danger: hsl(0 84% 60%);
53
+ --color-danger-subtle: hsl(0 84% 97%);
54
+ --color-info: hsl(217 91% 60%);
55
+ --color-info-subtle: hsl(217 91% 97%);
56
+
57
+ /* Surfaces & Backgrounds */
58
+ --color-surface-base: hsl(0 0% 100%);
59
+ --color-surface: hsl(0 0% 100%);
60
+ --color-surface-muted: hsl(240 10% 98%);
61
+ --color-surface-subtle: hsl(240 10% 96%);
62
+ --color-surface-elevated: hsl(240 10% 98%);
63
+ --color-surface-primary: hsl(240 78.3% 65%);
64
+ --color-surface-secondary: hsl(47 100% 65%);
65
+ --color-surface-success: hsl(142 71% 96%);
66
+ --color-surface-warning: hsl(38 92% 96%);
67
+ --color-surface-danger: hsl(0 84% 97%);
68
+ --color-surface-info: hsl(217 91% 97%);
69
+
70
+ /* Foregrounds */
71
+ --color-fg-strong: hsl(240 10% 15%);
72
+ --color-fg: hsl(240 8% 25%);
73
+ --color-fg-muted: hsl(240 7% 46%);
74
+ --color-fg-subtle: hsl(240 8% 64%);
75
+ --color-fg-disabled: hsl(240 8% 82%);
76
+
77
+ --color-fg-inverse-strong: hsl(0 0% 100%);
78
+ --color-fg-inverse: hsl(240 10% 98%);
79
+ --color-fg-inverse-muted: hsl(240 10% 96%);
80
+ --color-fg-inverse-subtle: hsl(240 8% 82%);
81
+ --color-fg-inverse-disabled: hsl(240 8% 64%);
82
+
83
+ --color-fg-primary: hsl(240 78.3% 34.3%);
84
+ --color-fg-secondary: hsl(47 100% 45%);
85
+
86
+ --color-fg-success: hsl(142 71% 45%);
87
+ --color-fg-warning: hsl(38 92% 50%);
88
+ --color-fg-danger: hsl(0 84% 60%);
89
+ --color-fg-info: hsl(217 91% 60%);
90
+
91
+ --color-ring: hsl(240 78.3% 65%);
92
+
93
+ /* Lines & Borders */
94
+ --color-line: hsl(240 9% 90%);
95
+ --color-line-muted: hsl(240 10% 96%);
96
+ --color-line-strong: hsl(240 8% 82%);
97
+ --color-line-primary: hsl(240 78.3% 65%);
98
+ --color-line-success: hsl(142 71% 45%);
99
+ --color-line-warning: hsl(38 92% 50%);
100
+ --color-line-danger: hsl(0 84% 60%);
101
+
102
+ /* Radius */
103
+ --radius-xs: 0.125rem;
104
+ --radius-sm: 0.25rem;
105
+ --radius-md: 0.375rem;
106
+ --radius-lg: 0.5rem;
107
+ --radius-xl: 0.75rem;
108
+ --radius-2xl: 1rem;
109
+ --radius-3xl: 1.5rem;
110
+ --radius-4xl: 2rem;
111
+ --radius-full: 9999px;
112
+
113
+ /* Shadows */
114
+ --color-shadow: hsl(240 78.3% 70%);
115
+ --shadow-card: 0 8px 26px hsl(240 78.3% 70% / 0.10);
116
+ --shadow-dropdown: 0 8px 24px hsl(240 78.3% 70% / 0.12);
117
+ --shadow-modal: 0 16px 40px hsl(240 78.3% 70% / 0.16);
118
+ --shadow-popover: 0 24px 64px hsl(240 78.3% 70% / 0.20);
119
+ }
data/lib/odt_ui/engine.rb CHANGED
@@ -5,8 +5,9 @@ module OdtUi
5
5
  isolate_namespace OdtUi
6
6
 
7
7
  initializer "odt_ui.assets" do |app|
8
- if app.config.respond_to?(:assets)
8
+ if app.config.respond_to?(:assets) && app.config.assets.respond_to?(:paths)
9
9
  app.config.assets.paths << root.join("app/assets/stylesheets").to_s
10
+ app.config.assets.paths << root.join("app/javascript").to_s if root.join("app/javascript").exist?
10
11
  end
11
12
  end
12
13
 
@@ -1,5 +1,5 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module OdtUi
4
- VERSION = "2.2.2"
4
+ VERSION = "2.2.4"
5
5
  end
data/lib/odt_ui.rb ADDED
@@ -0,0 +1,3 @@
1
+ # frozen_string_literal: true
2
+
3
+ require_relative "odt-ui-rails"
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: odt-ui-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 2.2.2
4
+ version: 2.2.4
5
5
  platform: ruby
6
6
  authors:
7
7
  - Pixel
@@ -53,9 +53,11 @@ files:
53
53
  - app/javascript/controllers/odt_toast_controller.js
54
54
  - lib/generators/odt/install_generator.rb
55
55
  - lib/generators/odt/templates/odt_modal_controller.js
56
+ - lib/generators/odt/templates/odt_theme.css
56
57
  - lib/generators/odt/templates/odt_toast_controller.js
57
58
  - lib/generators/odt/templates/odt_ui.rbs
58
59
  - lib/odt-ui-rails.rb
60
+ - lib/odt_ui.rb
59
61
  - lib/odt_ui/engine.rb
60
62
  - lib/odt_ui/helper.rb
61
63
  - lib/odt_ui/version.rb