storybook_engine 0.9.0 → 1.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 84dee36f6df365f45e7e144b1f04d3fbadbb1d99a40631a11f75fab3d4dd5aea
-  data.tar.gz: 3ce97e2935322149fafc353052bd5cad481c5fe18d8d4b3c148a2d668c5433db
+  metadata.gz: 756c2974850c8f1b388f2e86f65a113824edbc9a353eaa30a2359b3bbaae1da9
+  data.tar.gz: 9eb3c0fd4cf6139316fd1baef8a6c30db0937606357ee6ba3ff25d3b02bd0290
 SHA512:
-  metadata.gz: 9cc2b4fa52fa77e7decb464ea5cc03fb576508cb81ed5ae7894e049d88b1ca4e7e90b92b9df922b37dde77511159f1fb891da63df00fe04a11d319a43f977e9c
-  data.tar.gz: 6e1031ec84116668cdafdfcaf6d1975adff6347f04e298d0f24a1ea35dada228c2ac65e1434e54a770df47101c367cf8bc25a5851a1739595c0c7b8471645bc3
+  metadata.gz: 7f4184a07f39e35f78b7f179a4d156fe40b4856f47cb48adb8c4304f8f41c34ac3e2eec2285c9ed2cac84672f3f18b0dc854010c20941a95d5484a3cc0c6bd7b
+  data.tar.gz: 51be910cbac81d7eb9039887f63265574c4563d73010cdf4ce83f12422d02c0539507883c4e1687b9e98121b66ba4fe049d1aa2646f61f8f89912966fcb1919a

data/README.md

@@ -1,9 +1,11 @@
 # StorybookEngine
-Short description and motivation.
+Storybook with view components rails engine
 
 ## Usage
-How to use my plugin.
-
+##### Button
+```ruby
+= render(ButtonComponent.new(options: {type: "submit"},classes: "w-100")) { "Save" }
+```
 ## Installation
 Add this line to your application's Gemfile:
 
@@ -21,8 +23,10 @@ Or install it yourself as:
 $ gem install storybook_engine
 ```
 
-## Contributing
-Contribution directions go here.
+After add gem please add this line into your applications.scss:
+```bash
+@import "storybook_engine/application";
+```
 
 ## License
 The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).

data/app/assets/stylesheets/storybook_engine/application.scss

@@ -13,3 +13,9 @@
  *= require_tree .
  *= require_self
  */
+
+@import "helpers/mixins";
+@import "helpers/colors";
+@import "helpers/common-used";
+
+@import "components/buttons";

data/app/assets/stylesheets/storybook_engine/components/_buttons.scss

@@ -0,0 +1,59 @@
+@import "../helpers/colors";
+
+.zenhr-button {
+  padding: 0.9rem;
+  height: 3.5rem;
+  min-width: 9rem;
+
+  &:disabled {
+    cursor: not-allowed;
+    pointer-events: none;
+  }
+}
+
+.zenhr-primary-button {
+  color: $white;
+  --bg-opacity: 1;
+  background-color: $primary-blue;
+  border-color: $primary-blue;
+
+  &:hover, :focus {
+    color: $primary-blue;
+    background-color: $white;
+    border-color: $primary-blue;
+    box-shadow: 0 0 0.25rem 0 $primary-blue;
+  }
+
+  &:disabled {
+    opacity: 0.65;
+  }
+}
+
+.zenhr-danger-button {
+  color: $white;
+  --bg-opacity: 1;
+  background-color: #f56565;
+
+  &:hover, :focus {
+    background-color: #e53e3e;
+  }
+
+  &:disabled {
+    background-color: #feb2b2;
+  }
+}
+
+.zenhr-outline-button {
+  color: #805ad5;
+  border-color: #805ad5;
+  --bg-opacity: 1;
+  background-color: $white;
+
+  &:hover, :focus {
+    background-color: #edf2f7;
+  }
+
+  &:disabled {
+    background-color: #f7fafc;
+  }
+}

data/app/assets/stylesheets/storybook_engine/helpers/_colors.scss

@@ -0,0 +1,5 @@
+$charcoal: #484848;
+$red: #e30b1c;
+$black: #000;
+$white: #fff;
+$primary-blue: #007bff;

data/app/assets/stylesheets/storybook_engine/helpers/_common-used.scss

@@ -0,0 +1,31 @@
+@import "colors";
+@import "mixins";
+
+.delete-action {
+  cursor: pointer;
+
+  &:hover {
+    color: $red;
+  }
+}
+
+.table {
+  @include desktop {
+    display: table;
+  }
+}
+
+.error-message {
+  color: $red;
+  font-size: 0.75rem;
+}
+
+.cursor-pointer {
+  cursor: pointer;
+}
+
+.zenhr-link {
+  &:hover {
+    text-decoration: none;
+  }
+}

data/app/assets/stylesheets/storybook_engine/helpers/_mixins.scss

@@ -0,0 +1,13 @@
+// Custom small screen
+@mixin mobile {
+  @media (max-width: 768px) {
+    @content;
+  }
+}
+
+// Custom large screen
+@mixin desktop {
+  @media (min-width: 769px) {
+    @content;
+  }
+}

data/app/components/{storybook_engine/buttonComponent → ButtonComponent}/button_component.html.haml

@@ -1,2 +1,2 @@
 %button{{class: classes}.merge(@options)}
-= content
+  = content

data/app/components/InputComponent/input_component.html.haml

@@ -0,0 +1,5 @@
+.form-group
+  - if !@options[:label].nil?
+    %label{class: @options[:label_classes]}
+      = @options[:label]
+  %input{class: classes,"name" => @options[:field_name],"value"=> @options[:default_value],"placeholder"=>@options[:placeholder]}

data/app/components/InputComponent/input_component.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+class InputComponent < ViewComponent::Base
+  BASE_CLASSES = "form-control"
+
+  def initialize(options:,classes: '')
+    @options = options
+    @classes = classes
+  end
+
+  def classes
+    "#{@classes} #{BASE_CLASSES}"
+  end
+
+end

data/app/components/LabelComponent/label_component.html.haml

@@ -0,0 +1,2 @@
+%label{{class: @classes }.merge(@options)}
+  = content

data/app/components/LabelComponent/label_component.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+class LabelComponent < ViewComponent::Base
+  def initialize(options:, classes: '')
+    @options = options
+    @classes = classes
+  end
+
+end

data/app/components/LinkComponent/link_component.html.haml

@@ -0,0 +1,2 @@
+%a{{class: classes}.merge(@options)}
+  = content

data/app/components/LinkComponent/link_component.rb

@@ -0,0 +1,15 @@
+# frozen_string_literal: true
+
+class LinkComponent < ViewComponent::Base
+  BASE_CLASSES = "zenhr-link"
+
+  def initialize(options:, classes: '')
+    @options = options
+    @classes = classes
+  end
+
+  def classes
+    "#{BASE_CLASSES} #{@classes}"
+  end
+
+end

data/lib/storybook_engine/version.rb

@@ -1,3 +1,3 @@
 module StorybookEngine
-  VERSION = '0.9.0'
+  VERSION = '1.3.0'
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: storybook_engine
 version: !ruby/object:Gem::Version
-  version: 0.9.0
+  version: 1.3.0
 platform: ruby
 authors:
 - Amr Abu Aza
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2021-08-25 00:00:00.000000000 Z
+date: 2021-08-26 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: rails
@@ -42,8 +42,18 @@ files:
 - Rakefile
 - app/assets/config/storybook_engine_manifest.js
 - app/assets/stylesheets/storybook_engine/application.scss
-- app/components/storybook_engine/buttonComponent/button_component.html.haml
-- app/components/storybook_engine/buttonComponent/button_component.rb
+- app/assets/stylesheets/storybook_engine/components/_buttons.scss
+- app/assets/stylesheets/storybook_engine/helpers/_colors.scss
+- app/assets/stylesheets/storybook_engine/helpers/_common-used.scss
+- app/assets/stylesheets/storybook_engine/helpers/_mixins.scss
+- app/components/ButtonComponent/button_component.html.haml
+- app/components/ButtonComponent/button_component.rb
+- app/components/InputComponent/input_component.html.haml
+- app/components/InputComponent/input_component.rb
+- app/components/LabelComponent/label_component.html.haml
+- app/components/LabelComponent/label_component.rb
+- app/components/LinkComponent/link_component.html.haml
+- app/components/LinkComponent/link_component.rb
 - app/controllers/storybook_engine/application_controller.rb
 - app/helpers/storybook_engine/application_helper.rb
 - app/jobs/storybook_engine/application_job.rb