polaris_view_components 0.1.0 → 0.1.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +23 -1
- data/app/components/polaris/shopify_navigation_component.rb +33 -13
- data/lib/polaris/view_components/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 1a11eec04f3214877a985fa4b015bbb30aaa11b5ba6bd88728eee58cb457b72c
|
|
4
|
+
data.tar.gz: 4fcc63ed09e2a5de504f9006e2564097ccd7c7cf0e2bfc4424762dd24fa1aaf9
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: dcf50eb971d01da05634bcc8c9e0c159b131100c42db1ab65e2d22077bcd53d4414772ae992c69e5185553eb32916fe876e9357ccd5fd286af7a0a84b7b60f95
|
|
7
|
+
data.tar.gz: eacaf9cf0bf374e2e8d0b625b2ddd9df1aa9e116ddaae67623510df7b8d96f60969b426e51dc2d9544bf6a79005b38c635e716852807bcc3316ac66196460c9e
|
data/README.md
CHANGED
|
@@ -23,7 +23,7 @@ Render Polaris ViewComponents:
|
|
|
23
23
|
In `Gemfile`, add:
|
|
24
24
|
|
|
25
25
|
```ruby
|
|
26
|
-
gem 'polaris_view_components'
|
|
26
|
+
gem 'polaris_view_components'
|
|
27
27
|
```
|
|
28
28
|
|
|
29
29
|
Setup Polaris styles in your layouts `<head>` tag:
|
|
@@ -33,6 +33,18 @@ Setup Polaris styles in your layouts `<head>` tag:
|
|
|
33
33
|
<%= stylesheet_link_tag 'polaris_view_components' %>
|
|
34
34
|
```
|
|
35
35
|
|
|
36
|
+
Install NPM package:
|
|
37
|
+
```bash
|
|
38
|
+
yarn add polaris-view-components
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
Add to `app/javascript/controllers/index.js`:
|
|
42
|
+
```javascript
|
|
43
|
+
// Polaris ViewComponents
|
|
44
|
+
import { registerPolarisControllers } from "polaris-view-components"
|
|
45
|
+
registerPolarisControllers(application)
|
|
46
|
+
```
|
|
47
|
+
|
|
36
48
|
## Dependencies
|
|
37
49
|
|
|
38
50
|
In addition to the dependencies declared in the `gemspec`, Polaris ViewComponents assumes the presence of Polaris CSS.
|
|
@@ -46,6 +58,16 @@ To get started:
|
|
|
46
58
|
|
|
47
59
|
It will open demo app with component previews on `localhost:4000`. You can change components and they will be updated on page reload. Component previews located in `demo/test/components/previews`.
|
|
48
60
|
|
|
61
|
+
To release gem run:
|
|
62
|
+
```bash
|
|
63
|
+
script/release
|
|
64
|
+
```
|
|
65
|
+
|
|
66
|
+
To release npm package run:
|
|
67
|
+
```bash
|
|
68
|
+
yarn release
|
|
69
|
+
```
|
|
70
|
+
|
|
49
71
|
## License
|
|
50
72
|
|
|
51
73
|
The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
|
@@ -2,9 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
module Polaris
|
|
4
4
|
class ShopifyNavigationComponent < Polaris::NewComponent
|
|
5
|
-
renders_many :links,
|
|
5
|
+
renders_many :links, -> (**system_arguments) do
|
|
6
|
+
ShopifyNavigationLinkComponent.new(auto_detect_active: @auto_detect_active, **system_arguments)
|
|
7
|
+
end
|
|
8
|
+
|
|
9
|
+
def initialize(auto_detect_active: false, **system_arguments)
|
|
10
|
+
@auto_detect_active = auto_detect_active
|
|
6
11
|
|
|
7
|
-
def initialize(**system_arguments)
|
|
8
12
|
@system_arguments = system_arguments
|
|
9
13
|
@system_arguments[:tag] = "div"
|
|
10
14
|
@system_arguments[:classes] = class_names(
|
|
@@ -18,26 +22,42 @@ module Polaris
|
|
|
18
22
|
end
|
|
19
23
|
|
|
20
24
|
class ShopifyNavigationLinkComponent < Polaris::NewComponent
|
|
21
|
-
def initialize(url:, active: false, **system_arguments)
|
|
25
|
+
def initialize(url:, auto_detect_active:, active: false, **system_arguments)
|
|
26
|
+
@url = url
|
|
27
|
+
@auto_detect_active = auto_detect_active
|
|
28
|
+
@active = active
|
|
22
29
|
@system_arguments = system_arguments
|
|
23
|
-
@system_arguments[:tag] = "a"
|
|
24
|
-
@system_arguments[:href] = url
|
|
25
|
-
@system_arguments[:role] = "tab"
|
|
26
|
-
@system_arguments["data-polaris-unstyled"] = true
|
|
27
|
-
@system_arguments["aria-selected"] = active
|
|
28
|
-
@system_arguments[:classes] = class_names(
|
|
29
|
-
@system_arguments[:classes],
|
|
30
|
-
"shp-Navigation_Link",
|
|
31
|
-
)
|
|
32
30
|
end
|
|
33
31
|
|
|
34
32
|
def call
|
|
35
33
|
tag.li(class: "shp-Navigation_Item", role: "presentation") do
|
|
36
|
-
render(Polaris::BaseComponent.new(
|
|
34
|
+
render(Polaris::BaseComponent.new(**system_arguments)) do
|
|
37
35
|
tag.span(class: "shp-Navigation_LinkText") { content }
|
|
38
36
|
end
|
|
39
37
|
end
|
|
40
38
|
end
|
|
39
|
+
|
|
40
|
+
def system_arguments
|
|
41
|
+
{
|
|
42
|
+
tag: "a",
|
|
43
|
+
href: @url,
|
|
44
|
+
role: "tab",
|
|
45
|
+
data: { polaris_unstyled: true },
|
|
46
|
+
aria: {},
|
|
47
|
+
}.deep_merge(@system_arguments).tap do |args|
|
|
48
|
+
args[:aria][:selected] = @active || detect_active(@url)
|
|
49
|
+
args[:classes] = class_names(
|
|
50
|
+
args[:classes],
|
|
51
|
+
"shp-Navigation_Link",
|
|
52
|
+
)
|
|
53
|
+
end
|
|
54
|
+
end
|
|
55
|
+
|
|
56
|
+
def detect_active(url)
|
|
57
|
+
return unless @auto_detect_active
|
|
58
|
+
|
|
59
|
+
request.path.include?(url.split('?').first)
|
|
60
|
+
end
|
|
41
61
|
end
|
|
42
62
|
end
|
|
43
63
|
end
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: polaris_view_components
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.1.
|
|
4
|
+
version: 0.1.1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Dan Gamble
|
|
@@ -9,7 +9,7 @@ authors:
|
|
|
9
9
|
autorequire:
|
|
10
10
|
bindir: bin
|
|
11
11
|
cert_chain: []
|
|
12
|
-
date: 2021-08-
|
|
12
|
+
date: 2021-08-09 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: rails
|