daisy_components 0.1.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 94632f364daea5f4df1e9d643d2c3d52497094864a56e94a0633fa34cba2eef9
+  data.tar.gz: e0236bc53bb5b9ce09b06f9b3be694b7c7c12b153a6896c30b51a607a0bac2a0
+SHA512:
+  metadata.gz: ae5549f8d75c398aa130afda738e6256bbdfa52d5400f6dd07ed77abcc623b430c8a459e1882eeb3d4636fe4cd5d9d37a8b1a27d76ac86534c6c887c953fe564
+  data.tar.gz: 2ebbc7564a8f45f4c3a35ae60e33980b0cfc93b5a177221f2bb9baab8801c140931e72d0ef09a4df3c3e4d347a7129f5216c7749b1370cdf5489107203c97baa

data/.cursor/rules/how-to-write-tests.mdc

@@ -0,0 +1,67 @@
+---
+description: 
+globs: 
+alwaysApply: false
+---
+# Component Testing Structure
+
+## Overview
+Each component should have automated tests that verify both the component behavior and its preview examples. The `PreviewTestConcern` provides automated testing of all preview examples against their corresponding fixtures.
+
+## Basic Test Structure
+```ruby
+module DaisyComponents
+  module DataDisplay
+    class CardComponentTest < DaisyComponents::ComponentTestCase
+      include DaisyComponents::PreviewTestConcern
+
+      # Test all preview examples automatically
+      test_all_preview_examples(
+        preview_class: CardComponentPreview,
+        component_name: 'card',
+        exclude: ['playground'] # Optional: exclude specific examples
+      )
+
+
+      # Additional component-specific tests...
+      def test_complex_method
+      #...
+      end
+    end
+  end
+end
+```
+
+## What Gets Tested
+1. All preview methods (except playground) are automatically tested
+2. Each preview's rendered output is compared against its fixture
+3. HTML is normalized before comparison (classes, attributes, whitespace)
+4. Failures indicate either:
+   - Missing fixture file
+   - Mismatch between preview output and fixture
+
+## Test Organization
+- Test files: `test/components/daisy_ui/<module>/<component_name>_test.rb`
+- Fixtures: `test/fixtures/components/<component_name>/<example_name>.html`
+- NO: test files inside test/components/previews
+
+## Best Practices
+1. Always include `PreviewTestConcern`
+2. Use `test_all_preview_examples` for comprehensive coverage
+3. Add component-specific tests for behavior not covered by previews
+4. Keep fixtures up to date with component changes
+5. Don't duplicate preview tests unnecessarily
+6. Give precedence to preview tests for visual examples
+7. Focus component tests on behavior and edge cases
+
+## Coverage Checking
+```bash
+# Run tests with coverage
+COVERAGE=true bin/rails test
+
+# Parse coverage report
+./bin/parse_coverage.rb
+```
+```
+
+This rule provides a clear structure for how component testing should be set up and what gets tested automatically through the `PreviewTestConcern`.

data/.cursor/rules/preview-file-stucture.mdc

@@ -0,0 +1,95 @@
+---
+description: 
+globs: 
+alwaysApply: true
+---
+# Preview File Structurex
+## Overview
+Each preview file corresponds to a DaisyUI component and includes examples that match DaisyUI's documentation. The examples are tested against HTML fixtures that are scraped from the actual rendered output.
+
+## File Organization
+- Preview files: `test/components/previews/daisy_ui/`
+- Fixture files: `test/fixtures/components/<component_name>/`
+- Each preview method has a corresponding fixture file
+
+## Preview Class Structure
+
+### Header
+```ruby
+# @label ComponentName
+module DaisyComponents
+  module Actions
+    class ComponentNamePreview < ViewComponent::Preview
+      include DaisyComponents::IconsHelper # if icons needed
+```
+
+### Playground Section
+1. Must start with `# @!group Playground`
+2. Interactive playground with all possible parameters
+3. Must end with `# @!endgroup`
+## DaisyUI Example Methods
+- Each method corresponds to a DaisyUI example from DaisyUI's documentation
+- Two main patterns for rendering:
+
+1. Direct Component Rendering (Preferred for single component examples):
+```ruby
+# Card with custom color
+# ---------------
+# Card with primary background color
+def card_with_custom_color
+  render CardComponent.new(
+    title: 'Card title!',
+    description: 'Some description',
+    button: { text: 'Buy Now', justify: :end },
+    color: :primary
+  )
+end
+```
+
+2. Template Rendering (For multiple components or complex layouts):
+```ruby
+# Button Sizes
+# ---------------
+# Different button size variations
+def button_sizes
+  render_with_template
+end
+```
+
+## Fixtures
+- Location: `test/fixtures/components/<component_name>/`
+- Naming: Must match preview method name (e.g. `active_buttons.html`)
+- Content: Contains the expected HTML output
+- Used by `PreviewTestConcern` to verify preview rendering
+- Example:
+  ```html
+  <button class="btn btn-active" type="button">Default</button>
+  ```
+
+## Testing
+- Uses `PreviewTestConcern` to automatically test all examples
+- Compares rendered preview output with fixture files
+- Normalizes HTML for consistent comparison
+- Example:
+  ```ruby
+  test_all_preview_examples(
+    preview_class: ButtonComponentPreview,
+    component_name: 'button',
+    exclude: ['playground']
+  )
+  ```
+### Template Organization
+- Template files should be in: `test/components/previews/daisy_ui/<module>/<component_name>_preview/`
+- Template names should match method names (e.g. `button_sizes.html.erb`)
+- Example path: `test/components/previews/daisy_ui/actions/button_component_preview/button_sizes.html.erb`
+
+
+## Best Practices
+1. Use direct component rendering when possible (clearer and more maintainable)
+2. Use template rendering for:
+   - Multiple component variations (like sizes, colors)
+   - Complex layouts
+   - Examples requiring custom HTML structure
+4. Pass helpers via locals if needed: `render_with_template(locals: { helper: self }
+
+

data/.cursorrules

@@ -0,0 +1,64 @@
+The goal of this project is to create a component library. 
+The design system is providered by DaisyUI.
+The Component Library is a Rails Engine.
+It's build with TailwindCSS and DaisyUI, ViewComponent and Rails.
+
+
+We are using tailwindcss for this reason we can't use composed classes with strings interpolation. 
+
+
+
+We take inspiration from the following projects:
+https://github.com/primer/design
+https://github.com/primer/view_components
+
+This project use Lookbook for documentation 
+https://github.com/lookbook-hq/lookbook
+The preview are in the test/components/previews folder
+The docs are in the test/components/docs folder
+
+use Gemfile to manage dependencies no gemspec
+
+Use Minitest and Fixtures for testing
+Use Capybara for testing
+
+Create SVG for icons, and use the IconHelper to render them
+The IconHelper should not be used in the component, but in the test and the preview, Icon are passed, to the component
+
+DONT delete documentation comments in the code, update them instead
+
+Ruby Style Guide
+Style/ClassAndModuleChildren
+
+good:
+```ruby
+module DaisyUI
+  module Actions
+    class SwapComponentTest < DaisyUI::ComponentTestCase
+    end
+  end
+end
+```
+
+bad:
+```ruby
+class DaisyComponents::SwapComponentTest < DaisyComponents::ComponentTestCase
+end
+```
+
+Every component preview should have a playground method with all the parameters as options and the description as Lookbook description.
+For every component create:
+ - Ruy class with the inizializer documented with YARD doc
+ - html template
+ - lookbook preview with a playground method and the description as Lookbook description with group and label 
+ - TEST: in the test we test the component behavior and the preview (just the fact that they render). Don't duplicate tests to much, but give precedence to the preview but be sure to test the behavior)
+ - documentation
+
+For images, use picsum.photos/ to generate placeholder images.
+
+When you want to check the coverage, run:
+COVERAGE=true bin/rails test
+Read the coverage report by using ./bin/parse_coverage.rb
+
+Every component preview should be organized into groups that separate HTML and Ruby source rendering.
+

data/.github/dependabot.yml

@@ -0,0 +1,12 @@
+version: 2
+updates:
+- package-ecosystem: bundler
+  directory: "/"
+  schedule:
+    interval: daily
+  open-pull-requests-limit: 10
+- package-ecosystem: github-actions
+  directory: "/"
+  schedule:
+    interval: daily
+  open-pull-requests-limit: 10

data/.github/workflows/ci.yml

@@ -0,0 +1,65 @@
+name: CI
+
+on:
+  pull_request:
+  push:
+    branches: [ main ]
+
+jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Ruby
+        uses: ruby/setup-ruby@v1
+        with:
+          ruby-version: ruby-3.4.1
+          bundler-cache: true
+
+      - name: Lint code for consistent style
+        run: bin/rubocop
+
+  test:
+    runs-on: ubuntu-latest
+
+    # services:
+    #  redis:
+    #    image: redis
+    #    ports:
+    #      - 6379:6379
+    #    options: --health-cmd "redis-cli ping" --health-interval 10s --health-timeout 5s --health-retries 5
+    steps:
+      - name: Install packages
+        run: sudo apt-get update && sudo apt-get install --no-install-recommends -y build-essential git pkg-config google-chrome-stable
+
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Set up Ruby
+        uses: ruby/setup-ruby@v1
+        with:
+          ruby-version: ruby-3.4.1
+          bundler-cache: true
+
+      - name: Run tests
+        env:
+          RAILS_ENV: test
+          COVERAGE: true
+          # REDIS_URL: redis://localhost:6379/0
+        run: bin/rails test
+
+      - name: Upload coverage reports to Codecov
+        uses: codecov/codecov-action@v5
+        with:
+          token: ${{ secrets.CODECOV_TOKEN }}
+
+      - name: Keep screenshots from failed system tests
+        uses: actions/upload-artifact@v4
+        if: failure()
+        with:
+          name: screenshots
+          path: ${{ github.workspace }}/tmp/screenshots
+          if-no-files-found: ignore
+

data/.gitignore

@@ -0,0 +1,13 @@
+/.bundle/
+/doc/
+/log/*.log
+/pkg/
+/tmp/
+/test/dummy/log/*.log
+/test/dummy/storage/
+/test/dummy/tmp/
+
+.DS_Store
+.env*
+coverage/
+.idea/

data/.vscode/launch.json

@@ -0,0 +1,55 @@
+{
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "ruby_lsp",
+            "name": "Debug Rails",
+            "request": "launch",
+            "program": "${workspaceRoot}/bin/rails",
+            "args": ["server"],
+            "useBundler": true,
+            "env": {
+                "RAILS_ENV": "development"
+            }
+        },
+        {
+            "type": "ruby_lsp",
+            "name": "Debug Test File",
+            "request": "launch",
+            "program": "ruby -Itest ${relativeFile}",
+            "useBundler": true,
+            "env": {
+                "RAILS_ENV": "test"
+            }
+        },
+        {
+            "type": "ruby_lsp",
+            "name": "Run Test with Coverage",
+            "request": "launch",
+            "program": "ruby -Itest ${relativeFile}",
+            "useBundler": true,
+            "env": {
+                "RAILS_ENV": "test",
+                "COVERAGE": "true"
+            }
+        },
+        {
+            "type": "ruby_lsp",
+            "name": "Run All Tests with Coverage",
+            "request": "launch",
+            "program": "${workspaceRoot}/bin/rails",
+            "args": ["test"],
+            "useBundler": true,
+            "env": {
+                "RAILS_ENV": "test",
+                "COVERAGE": "true"
+            }
+        },
+        {
+            "type": "ruby_lsp",
+            "request": "attach",
+            "name": "Attach to Process",
+            "port": 1234
+        }
+    ]
+}

data/.vscode/settings.json

@@ -0,0 +1,44 @@
+{
+    // "ruby.useLanguageServer": true,
+    // "ruby.lint": {
+    //     "rubocop": true
+    // },
+    // "ruby.format": "rubocop",
+    // "ruby.intellisense": "rubyLocate",
+    "[ruby]": {
+        "editor.formatOnSave": true,
+        "editor.defaultFormatter": "Shopify.ruby-lsp",
+        "editor.semanticHighlighting.enabled": true,
+    },
+    "[erb]": {
+        "editor.formatOnSave": true,
+        "editor.defaultFormatter": "Shopify.ruby-lsp",
+        "editor.semanticHighlighting.enabled": true
+    },
+    "rubyLsp.enabledFeatures": {
+        "codeActions": true,
+        "diagnostics": true,
+        "documentHighlights": true,
+        "documentLink": true,
+        "documentSymbols": true,
+        "foldingRanges": true,
+        "formatting": true,
+        "hover": true,
+        "inlayHint": true,
+        "onTypeFormatting": true,
+        "selectionRanges": true,
+        "semanticHighlighting": true,
+        "completion": true,
+        "codeLens": true,
+        "definition": true,
+        "workspaceSymbol": true
+    },
+    "rubyLsp.formatter": "auto",
+    "rubyLsp.rubyVersionManager": {
+        "identifier": "mise"
+    },
+    "files.associations": {
+        "*.erb": "erb",
+        "*.html.erb": "erb"
+    }
+}

data/CHANGELOG.md

@@ -0,0 +1,39 @@
+# Changelog
+
+All notable changes to this project will be documented in this file.
+
+The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
+and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
+
+## [0.1.0] - 2024-12-19
+
+### Added
+- Initial release of DaisyUI Components for Rails
+- Rails Engine with ViewComponent integration
+- TailwindCSS and DaisyUI support
+- Base component architecture
+- Components:
+    - Actions
+        - Button
+        - Dropdown
+        - Swap
+    - Data Display
+        - Accordion
+        - Avatar
+        - Avatar Group
+        - Badge
+        - Card
+        - Chat
+- Lookbook integration for component documentation
+- Comprehensive test suite with Minitest and Capybara
+- Icon helper system (to be improved)
+
+### Features
+- ViewComponent-based architecture
+- DaisyUI design system integration
+- Lookbook documentation
+- Comprehensive testing framework
+- Rails 8.0+ compatibility
+- Ruby 3.4+ support
+
+[0.1.0]: https://github.com/Nittarab/daisy_components/releases/tag/v0.1.0 

data/Gemfile

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+source 'https://rubygems.org'
+
+gemspec
+
+gem 'puma'
+gem 'redcarpet', '3.6.1'
+gem 'view_component', '3.21.0'
+
+group :development do
+  gem 'lookbook', '2.3.4'
+  gem 'rubocop', '1.71.0'
+  gem 'rubocop-capybara', '2.21.0'
+  gem 'rubocop-performance', '1.23.1'
+  gem 'rubocop-rails', '2.29.1'
+  gem 'ruby-lsp'
+  gem 'ruby-lsp-rails'
+end
+
+group :test do
+  gem 'capybara'
+  gem 'debug'
+  gem 'simplecov', require: false
+  gem 'simplecov-cobertura', require: false
+end
+
+# Start debugger with binding.b [https://github.com/ruby/debug]
+# gem "debug", ">= 1.0.0"
+
+gem 'nokogiri', '~> 1.18', group: :development
+gem 'terminal-table', '~> 3.0.2', group: :development