shoelace-rails 0.4.1 → 0.6.0

data/src/turbolinks/utils/form.ts

@@ -1,58 +0,0 @@
-// This code was heavily inspired by the rails-ujs project.
-// Copyright (c) 2007-2021 Rails Core team.
-import { matches } from "./dom"
-
-const toArray = (e) => Array.prototype.slice.call(e)
-
-export const serializeElement = (element, additionalParam) => {
-  let inputs = [element]
-  if (matches(element, "form")) {
-    inputs = toArray(element.elements)
-  }
-  const params = []
-
-  inputs.forEach(function (input) {
-    if (!input.name || input.disabled) {
-      return
-    }
-
-    if (matches(input, "fieldset[disabled] *")) {
-      return
-    }
-
-    if (matches(input, "select")) {
-      return toArray(input.options).forEach(function (option) {
-        if (option.selected) {
-          return params.push({ name: input.name, value: option.value })
-        }
-      })
-    } else if (input.checked || ["radio", "checkbox", "submit"].indexOf(input.type) === -1) {
-      return params.push({ name: input.name, value: input.value })
-    }
-  })
-
-  if (additionalParam) {
-    params.push(additionalParam)
-  }
-
-  return params
-    .map(function (param) {
-      if (param.name != null) {
-        return `${encodeURIComponent(param.name)}=${encodeURIComponent(param.value)}`
-      } else {
-        return param
-      }
-    })
-    .join("&")
-}
-
-// Helper function that returns form elements that match the specified CSS selector
-// If form is actually a "form" element this will return associated elements outside the from that have
-// the html form attribute set
-export const formElements = (form, selector) => {
-  if (matches(form, "form")) {
-    return toArray(form.elements).filter((el) => matches(el, selector))
-  } else {
-    return toArray(form.querySelectorAll(selector))
-  }
-}

data/test/dummy_app/Gemfile

@@ -1,19 +0,0 @@
-source 'https://rubygems.org'
-
-gem 'rails', '~> 7.0.0'
-gem 'webrick'
-gem 'bootsnap', '>= 1.4.4', require: false
-gem 'rexml'
-gem 'shoelace-rails', path: '../../../shoelace-rails'
-gem 'webpacker', '6.0.0.rc.5'
-
-group :development, :test do
-  gem 'pry-byebug'
-end
-
-group :test do
-  gem 'capybara', '>= 3.26'
-  gem 'capybara-shadowdom'
-  gem 'selenium-webdriver', '>= 4.0.0.rc3'
-  gem 'webdrivers'
-end

data/test/dummy_app/Rakefile

@@ -1,6 +0,0 @@
-# Add your own tasks in files placed in lib/tasks ending in .rake,
-# for example lib/tasks/capistrano.rake, and they will automatically be available to Rake.
-
-require_relative "config/application"
-
-Rails.application.load_tasks

data/test/dummy_app/app/controllers/hotwire_forms_controller.rb

@@ -1,46 +0,0 @@
-class HotwireFormsController < ActionController::Base
-  layout "application"
-
-  def show
-    @user = User.new(session[:user])
-  end
-
-  # GET /users/new
-  def new
-    @user = User.new(params[:user]&.permit!)
-
-    render 'form'
-  end
-
-  # GET /users/1/edit
-  def edit
-    @user = User.new(name: "Yuki Nishijima")
-
-    render 'form'
-  end
-
-  # POST /users
-  def create
-    @user = User.new(user_params)
-
-    if @user.valid?
-      session[:user] = user_params.to_h
-      redirect_to hotwire_form_path(1)
-    else
-      render 'form', status: 422
-    end
-  end
-
-  # PATCH/PUT /users/1
-  def update
-    @user = User.new(user_params)
-
-    render(@user.valid? ? 'show' : 'form')
-  end
-
-  private
-
-  def user_params
-    params.require(:user).permit!
-  end
-end

data/test/dummy_app/app/controllers/turbolinks_forms_controller.rb

@@ -1,37 +0,0 @@
-class TurbolinksFormsController < ActionController::Base
-  layout "application"
-
-  # GET /users/new
-  def new
-    @user = User.new
-
-    render 'form'
-  end
-
-  # GET /users/1/edit
-  def edit
-    @user = User.new(name: "Yuki Nishijima")
-
-    render 'form'
-  end
-
-  # POST /users
-  def create
-    @user = User.new(user_params)
-
-    render(@user.valid? ? 'show' : 'form')
-  end
-
-  # PATCH/PUT /users/1
-  def update
-    @user = User.new(user_params)
-
-    render(@user.valid? ? 'show' : 'form')
-  end
-
-  private
-
-  def user_params
-    params.require(:user).permit!
-  end
-end

data/test/dummy_app/app/models/user.rb

@@ -1,16 +0,0 @@
-class User
-  include ActiveModel::Model
-  include ActiveModel::Attributes
-
-  attribute :name
-  attribute :description
-  attribute :color
-  attribute :score
-  attribute :current_city
-  attribute :previous_city
-  attribute :past_cities
-  attribute :remember_me
-  attribute :subscribe_to_emails
-
-  validates :name, presence: true
-end

data/test/dummy_app/app/packs/entrypoints/hotwire.js

@@ -1 +0,0 @@
-import "@hotwired/turbo-rails"

data/test/dummy_app/app/packs/entrypoints/turbolinks.js

@@ -1,5 +0,0 @@
-import Turbolinks from "turbolinks"
-import Rails from '@rails/ujs'
-
-Turbolinks.start()
-Rails.start()

data/test/dummy_app/app/views/hotwire_forms/form.html.erb

@@ -1,45 +0,0 @@
-<% locations = { tokyo: "Tokyo", new_york: "New York", london: "London" } %>
-<%= sl_form_for(@user, url: hotwire_forms_path) do |form| %>
-  <div>
-    <%= form.text_field :name do %>
-      <span slot="help-text" style="color: rgb(var(--sl-color-danger-600));">
-        <%= @user.errors.full_messages_for(:name).first %>
-      </span>
-    <% end %>
-  </div>
-
-  <div>
-    <%= form.color_field :color %>
-  </div>
-
-  <div>
-    <%= form.range_field :score, min: 0, max: 100, step: 1 %>
-  </div>
-
-  <div>
-    <%= form.collection_radio_buttons :current_city, locations, :first, :last %>
-  </div>
-
-  <div>
-    <%= form.collection_select :previous_city, locations, :first, :last, {}, { placeholder: "Select one" } %>
-  </div>
-
-  <div>
-    <%= form.collection_select :past_cities, locations, :first, :last, {}, { placeholder: "Select two or more", multiple: true, clearable: true } %>
-  </div>
-
-  <div>
-    <%= form.check_box :remember_me %>
-  </div>
-
-  <div>
-    <%= form.switch_field :subscribe_to_emails, value: "1" %>
-  </div>
-
-  <div>
-    <%= form.text_area :description %>
-  </div>
-
-  <%= form.submit %>
-  <%= form.submit "Submit without Turbo", data: { turbo: false } %>
-<% end %>

data/test/dummy_app/app/views/hotwire_forms/show.html.erb

@@ -1,5 +0,0 @@
-<% @user.attributes.each do |attribute_name, value| %>
-  <div>
-    <%= attribute_name.titleize %>: <%= value %>
-  </div>
-<% end %>

data/test/dummy_app/app/views/layouts/application.html.erb

@@ -1,39 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <title>Shoelace Test</title>
-    <meta name="viewport" content="width=device-width,initial-scale=1">
-    <%= csrf_meta_tags %>
-    <%= csp_meta_tag %>
-
-    <style>
-      body {
-        font-family: var(--sl-font-sans);
-        font-size: var(--sl-font-size-medium);
-        font-weight: var(--sl-font-weight-normal);
-        letter-spacing: var(--sl-letter-spacing-normal);
-        color: var(--sl-color-gray-800);
-        line-height: var(--sl-line-height-normal);
-      }
-
-      sl-form div, sl-turbo-form div {
-        margin-bottom: 2em;
-      }
-    </style>
-
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.0.0-beta.88/dist/themes/light.css">
-    <script type="module" src="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.0.0-beta.88/dist/shoelace.js"></script>
-
-    <% if request.path.include?("hotwire") %>
-      <%= javascript_pack_tag 'hotwire' %>
-    <% else %>
-      <%= javascript_pack_tag 'turbolinks' %>
-    <% end %>
-  </head>
-
-  <body>
-    <div style="width: 950px; margin: auto">
-      <%= yield %>
-    </div>
-  </body>
-</html>

data/test/dummy_app/app/views/turbolinks_forms/form.html.erb

@@ -1,44 +0,0 @@
-<% locations = { tokyo: "Tokyo", new_york: "New York", london: "London" } %>
-<%= sl_form_for(@user, url: turbolinks_forms_path) do |form| %>
-  <div>
-    <%= form.text_field :name do %>
-      <span slot="help-text" style="color: rgb(var(--sl-color-danger-600));">
-        <%= @user.errors.full_messages_for(:name).first %>
-      </span>
-    <% end %>
-  </div>
-
-  <div>
-    <%= form.color_field :color %>
-  </div>
-
-  <div>
-    <%= form.range_field :score, min: 0, max: 100, step: 1 %>
-  </div>
-
-  <div>
-    <%= form.collection_radio_buttons :current_city, locations, :first, :last %>
-  </div>
-
-  <div>
-    <%= form.collection_select :previous_city, locations, :first, :last, {}, { placeholder: "Select one" } %>
-  </div>
-
-  <div>
-    <%= form.collection_select :past_cities, locations, :first, :last, {}, { placeholder: "Select two or more", multiple: true, clearable: true } %>
-  </div>
-
-  <div>
-    <%= form.check_box :remember_me %>
-  </div>
-
-  <div>
-    <%= form.switch_field :subscribe_to_emails, value: "1" %>
-  </div>
-
-  <div>
-    <%= form.text_area :description %>
-  </div>
-
-  <%= form.submit %>
-<% end %>

data/test/dummy_app/app/views/turbolinks_forms/show.html.erb

@@ -1,5 +0,0 @@
-<% @user.attributes.each do |attribute_name, value| %>
-  <div>
-    <%= attribute_name.titleize %>: <%= value %>
-  </div>
-<% end %>

data/test/dummy_app/bin/rails

@@ -1,5 +0,0 @@
-#!/usr/bin/env ruby
-
-APP_PATH = File.expand_path('../config/application', __dir__)
-require_relative "../config/boot"
-require "rails/commands"

data/test/dummy_app/bin/webpack

@@ -1,18 +0,0 @@
-#!/usr/bin/env ruby
-
-ENV["RAILS_ENV"] ||= ENV["RACK_ENV"] || "development"
-ENV["NODE_ENV"]  ||= "development"
-
-require "pathname"
-ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile",
-  Pathname.new(__FILE__).realpath)
-
-require "bundler/setup"
-
-require "webpacker"
-require "webpacker/webpack_runner"
-
-APP_ROOT = File.expand_path("..", __dir__)
-Dir.chdir(APP_ROOT) do
-  Webpacker::WebpackRunner.run(ARGV)
-end

data/test/dummy_app/bin/yarn

@@ -1,18 +0,0 @@
-#!/usr/bin/env ruby
-
-APP_ROOT = File.expand_path("..", __dir__)
-Dir.chdir(APP_ROOT) do
-  yarn = ENV["PATH"].split(File::PATH_SEPARATOR).
-    select { |dir| File.expand_path(dir) != __dir__ }.
-    product(["yarn", "yarnpkg", "yarn.cmd", "yarn.ps1"]).
-    map { |dir, file| File.expand_path(file, dir) }.
-    find { |file| File.executable?(file) }
-
-  if yarn
-    exec yarn, *ARGV
-  else
-    $stderr.puts "Yarn executable was not detected in the system."
-    $stderr.puts "Download Yarn at https://yarnpkg.com/en/docs/install"
-    exit 1
-  end
-end

data/test/dummy_app/config/application.rb

@@ -1,16 +0,0 @@
-require_relative "boot"
-
-require "rails"
-require "active_model/railtie"
-require "action_controller/railtie"
-require "action_view/railtie"
-require "rails/test_unit/railtie"
-
-Bundler.require(*Rails.groups)
-
-module ShoelaceTest
-  class Application < Rails::Application
-    config.load_defaults 6.1
-    Rails.backtrace_cleaner.remove_silencers! if ENV["BACKTRACE"]
-  end
-end

data/test/dummy_app/config/boot.rb

@@ -1,4 +0,0 @@
-ENV['BUNDLE_GEMFILE'] ||= File.expand_path('../Gemfile', __dir__)
-
-require "bundler/setup"
-require "bootsnap/setup"

data/test/dummy_app/config/environment.rb

@@ -1,2 +0,0 @@
-require_relative "application"
-Rails.application.initialize!

data/test/dummy_app/config/environments/development.rb

@@ -1,10 +0,0 @@
-Rails.application.configure do
-  config.cache_classes = false
-  config.eager_load = false
-  config.consider_all_requests_local = true
-  config.action_controller.perform_caching = false
-  config.cache_store = :null_store
-  config.active_support.deprecation = :log
-  config.active_support.disallowed_deprecation = :raise
-  config.active_support.disallowed_deprecation_warnings = []
-end

data/test/dummy_app/config/environments/test.rb

@@ -1,18 +0,0 @@
-require "active_support/core_ext/integer/time"
-
-Rails.application.configure do
-  config.cache_classes = true
-  config.eager_load = false
-  config.public_file_server.enabled = true
-  config.public_file_server.headers = {
-    'Cache-Control' => "public, max-age=#{1.hour.to_i}"
-  }
-  config.consider_all_requests_local       = true
-  config.action_controller.perform_caching = false
-  config.cache_store = :null_store
-  config.action_dispatch.show_exceptions = false
-  config.action_controller.allow_forgery_protection = false
-  config.active_support.deprecation = :stderr
-  config.active_support.disallowed_deprecation = :raise
-  config.active_support.disallowed_deprecation_warnings = []
-end

data/test/dummy_app/config/routes.rb

@@ -1,4 +0,0 @@
-Rails.application.routes.draw do
-  resources :hotwire_forms
-  resources :turbolinks_forms
-end

data/test/dummy_app/config/webpack/development.js

@@ -1,5 +0,0 @@
-process.env.NODE_ENV = process.env.NODE_ENV || 'development'
-
-const { webpackConfig } = require('@rails/webpacker')
-
-module.exports = webpackConfig

data/test/dummy_app/config/webpack/production.js

@@ -1 +0,0 @@
-test.js

data/test/dummy_app/config/webpack/test.js

@@ -1,5 +0,0 @@
-process.env.NODE_ENV = process.env.NODE_ENV || 'development'
-
-const { webpackConfig } = require('@rails/webpacker')
-
-module.exports = webpackConfig

data/test/dummy_app/config/webpacker.yml

@@ -1,33 +0,0 @@
-default: &default
-  source_path: app/packs
-  source_entry_path: entrypoints
-  public_root_path: public
-  public_output_path: packs
-  cache_path: tmp/webpacker
-  webpack_compile_output: true
-  additional_paths: []
-  cache_manifest: false
-
-development:
-  <<: *default
-  compile: true
-  dev_server:
-    https: false
-    host: localhost
-    port: 3035
-    hmr: false
-    client:
-      overlay: true
-    compress: true
-    allowed_hosts: "all"
-    pretty: true
-    headers:
-      'Access-Control-Allow-Origin': '*'
-    static:
-      watch:
-        ignored: '**/node_modules/**'
-
-test:
-  <<: *default
-  compile: false
-  public_output_path: packs-test

data/test/dummy_app/config.ru

@@ -1,6 +0,0 @@
-# This file is used by Rack-based servers to start the application.
-
-require_relative "config/environment"
-
-run Rails.application
-Rails.application.load_server

data/test/dummy_app/package.json

@@ -1,24 +0,0 @@
-{
-  "name": "app",
-  "private": true,
-  "babel": {
-    "presets": [
-      "./node_modules/@rails/webpacker/package/babel/preset.js"
-    ]
-  },
-  "browserslist": [
-    "defaults"
-  ],
-  "dependencies": {
-    "@hotwired/turbo-rails": "^7.0.1",
-    "@rails/ujs": "^7.0.2",
-    "@rails/webpacker": "^6.0.0-rc.5",
-    "@yuki24/shoelace-rails": "file:./../../../shoelace-rails",
-    "turbolinks": "^5.2.0",
-    "webpack": "^5.51.1",
-    "webpack-cli": "^4.8.0"
-  },
-  "devDependencies": {
-    "@webpack-cli/serve": "^1.5.2"
-  }
-}

data/test/dummy_app/test/system/hotwire_form_test.rb

@@ -1,63 +0,0 @@
-require "test_helper"
-
-class HotwireFormTest < ApplicationSystemTestCase
-  setup do
-    visit new_hotwire_form_path
-  end
-
-  test "It can submit a form with a POST method" do
-    shadow_fill_in 'sl-input[label="Name"]', with: "Yuki Nishijima"
-    shadow_fill_in 'sl-range[name="user[score]"]', with: "50"
-
-    find('sl-radio', text: "New York").click # Selecting a radio button does not work...
-
-    sl_select "Tokyo", from: "Select one"
-    sl_multi_select "Tokyo", "New York", from: "Select two or more"
-    sl_check "Remember me"
-    sl_toggle "Subscribe to emails"
-    shadow_fill_in 'sl-textarea[name="user[description]"]', "textarea", with: "I am a human."
-
-    find("sl-button", text: "Create User").click
-
-    assert_current_path hotwire_form_path(1)
-    assert_text "Name: Yuki Nishijima"
-    assert_text "Description: I am a human."
-    assert_text "Score: 50"
-    # assert_text "Current City:"
-    assert_text "Previous City: tokyo"
-    assert_text 'Past Cities: ["tokyo", "new_york"]'
-    assert_text "Remember Me: 1"
-    assert_text "Subscribe To Emails: 1"
-  end
-
-  test "It can submit a form with a POST method without asynchronous submission" do
-    shadow_fill_in 'sl-input[label="Name"]', with: "Yuki Nishijima"
-    shadow_fill_in 'sl-range[name="user[score]"]', with: "50"
-
-    find('sl-radio', text: "New York").click # Selecting a radio button does not work...
-
-    sl_select "Tokyo", from: "Select one"
-    sl_multi_select "Tokyo", "New York", from: "Select two or more"
-    sl_check "Remember me"
-    sl_toggle "Subscribe to emails"
-    shadow_fill_in 'sl-textarea[name="user[description]"]', "textarea", with: "I am a human."
-
-    find("sl-button", text: "Submit without Turbo").click
-
-    assert_current_path hotwire_form_path(1)
-    assert_text "Name: Yuki Nishijima"
-    assert_text "Description: I am a human."
-    assert_text "Score: 50"
-    # assert_text "Current City:"
-    assert_text "Previous City: tokyo"
-    assert_text 'Past Cities: ["tokyo", "new_york"]'
-    assert_text "Remember Me: 1"
-    assert_text "Subscribe To Emails: 1"
-  end
-
-  test "It can handle an error form submission" do
-    find("sl-button", text: "Create User").click
-
-    assert_text "Name can't be blank"
-  end
-end

data/test/dummy_app/test/system/turbolinks_form_test.rb

@@ -1,38 +0,0 @@
-require "test_helper"
-
-class TurbolinksFormTest < ApplicationSystemTestCase
-  setup do
-    visit new_turbolinks_form_path
-  end
-
-  test "It can submit a form with a POST method" do
-    shadow_fill_in 'sl-input[label="Name"]', with: "Yuki Nishijima"
-    shadow_fill_in 'sl-range[name="user[score]"]', with: "50"
-
-    find('sl-radio', text: "New York").click # Selecting a radio button does not work...
-
-    sl_select "Tokyo", from: "Select one"
-    sl_multi_select "Tokyo", "New York", from: "Select two or more"
-    sl_check "Remember me"
-    sl_toggle "Subscribe to emails"
-    shadow_fill_in 'sl-textarea[name="user[description]"]', "textarea", with: "I am a human."
-
-    find("sl-button", text: "Create User").click
-
-    assert_current_path turbolinks_forms_path
-    assert_text "Name: Yuki Nishijima"
-    assert_text "Description: I am a human."
-    assert_text "Score: 50"
-    # assert_text "Current City:"
-    assert_text "Previous City: tokyo"
-    assert_text 'Past Cities: ["tokyo", "new_york"]'
-    assert_text "Remember Me: 1"
-    assert_text "Subscribe To Emails: 1"
-  end
-
-  test "It can handle an error form submission" do
-    find("sl-button", text: "Create User").click
-
-    assert_text "Name can't be blank"
-  end
-end