playbook_ui 11.19.0.pre.alpha.map1 → 11.19.0.pre.alpha.pagpassthrough1
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.
- checksums.yaml +4 -4
- data/app/pb_kits/playbook/_playbook.scss +2 -2
- data/app/pb_kits/playbook/data/menu.yml +1 -1
- data/app/pb_kits/playbook/index.js +2 -3
- data/app/pb_kits/playbook/pb_paginate/_paginate.scss +3 -0
- data/app/pb_kits/playbook/pb_paginate/docs/_paginate_default.html.erb +19 -0
- data/app/pb_kits/playbook/pb_paginate/docs/example.yml +6 -0
- data/app/pb_kits/playbook/pb_paginate/paginate.html.erb +5 -0
- data/app/pb_kits/playbook/pb_paginate/paginate.rb +14 -0
- data/app/pb_kits/playbook/playbook-doc.js +0 -2
- data/app/pb_kits/playbook/utilities/_pagination.scss +69 -0
- data/lib/playbook/pagination_renderer.rb +41 -0
- data/lib/playbook/version.rb +1 -1
- data/lib/playbook.rb +2 -0
- metadata +23 -8
- data/app/pb_kits/playbook/pb_map/_map.scss +0 -6
- data/app/pb_kits/playbook/pb_map/_map.tsx +0 -39
- data/app/pb_kits/playbook/pb_map/docs/_map_default.jsx +0 -49
- data/app/pb_kits/playbook/pb_map/docs/example.yml +0 -6
- data/app/pb_kits/playbook/pb_map/docs/index.js +0 -1
- data/app/pb_kits/playbook/pb_map/map.test.jsx +0 -17
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: ff556241a73204fa1fcb1b7f9e8c5d3d41dde1cbab356e52f52c42ccab521c0d
|
|
4
|
+
data.tar.gz: be66d4782e1117833f5e34036a010f71486d91318ad6241e82487964d9583602
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 9763ce291cf8f35999f873b742e258a28c07f6c1cc42fc59399ff8f2d32cf80a27cb3a583188726c0449757d19edcde02460b4e0744f8fd1599343c1aa995ced
|
|
7
|
+
data.tar.gz: 6a93d271d454a850b50bc5a940242c97ba55962a9dc6cca4faf375eaf223e07385137f2c2409554d10be4291a7f052553a3bde48c9027e12b58869606f6ee71a
|
|
@@ -10,8 +10,8 @@ export { default as Background } from './pb_background/_background'
|
|
|
10
10
|
export { default as Badge } from './pb_badge/_badge'
|
|
11
11
|
export { default as BarGraph } from './pb_bar_graph/_bar_graph'
|
|
12
12
|
export { default as Body } from './pb_body/_body'
|
|
13
|
-
export { default as BreadCrumbItem } from './pb_bread_crumbs/_bread_crumb_item'
|
|
14
13
|
export { default as BreadCrumbs } from './pb_bread_crumbs/_bread_crumbs'
|
|
14
|
+
export { default as BreadCrumbItem } from './pb_bread_crumbs/_bread_crumb_item'
|
|
15
15
|
export { default as Button } from './pb_button/_button'
|
|
16
16
|
export { default as ButtonToolbar } from './pb_button_toolbar/_button_toolbar'
|
|
17
17
|
export { default as Caption } from './pb_caption/_caption'
|
|
@@ -53,12 +53,11 @@ export { default as LabelPill } from './pb_label_pill/_label_pill'
|
|
|
53
53
|
export { default as LabelValue } from './pb_label_value/_label_value'
|
|
54
54
|
export { default as Layout } from './pb_layout/_layout'
|
|
55
55
|
export { default as Legend } from './pb_legend/_legend'
|
|
56
|
-
export { default as Lightbox } from './pb_lightbox/_lightbox'
|
|
57
56
|
export { default as LineGraph } from './pb_line_graph/_line_graph'
|
|
58
57
|
export { default as List } from './pb_list/_list'
|
|
58
|
+
export { default as Lightbox } from './pb_lightbox/_lightbox'
|
|
59
59
|
export { default as ListItem } from './pb_list/_list_item'
|
|
60
60
|
export { default as LoadingInline } from './pb_loading_inline/_loading_inline'
|
|
61
|
-
export { default as Map} from './pb_map/_map'
|
|
62
61
|
export { default as Message } from './pb_message/_message'
|
|
63
62
|
export { default as MultipleUsers } from './pb_multiple_users/_multiple_users'
|
|
64
63
|
export { default as MultipleUsersStacked } from './pb_multiple_users_stacked/_multiple_users_stacked'
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
<%= pb_rails("title", props: { size: 4, text: "Default will_paginate"}) %>
|
|
2
|
+
<%= will_paginate @users %>
|
|
3
|
+
<%= pb_rails("body") do %>
|
|
4
|
+
You need to add: <code> require 'will_paginate'</code> in your app to use.
|
|
5
|
+
<% end %>
|
|
6
|
+
<br><br>
|
|
7
|
+
|
|
8
|
+
<%= pb_rails("title", props: { size: 4, text: "Playbook Renderer"}) %>
|
|
9
|
+
<%= will_paginate @users, renderer: Playbook::Pagination::Rails %>
|
|
10
|
+
<%= pb_rails("body") do %>
|
|
11
|
+
You need to also add: <code>require "playbook/pagination_renderer"</code> in your app to use.
|
|
12
|
+
<% end %>
|
|
13
|
+
<br><br>
|
|
14
|
+
|
|
15
|
+
<%= pb_rails("title", props: { size: 4, text: "Playbook Kit (Passthrough)"}) %>
|
|
16
|
+
<%= pb_rails("paginate", props: { stragety: "will_paginate", model: @users }) %>
|
|
17
|
+
<%= pb_rails("body") do %>
|
|
18
|
+
Same...You need to also add: <code>require "playbook/pagination_renderer"</code> in your app to use.
|
|
19
|
+
<% end %>
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
# frozen_string_literal: true
|
|
2
|
+
|
|
3
|
+
module Playbook
|
|
4
|
+
module PbPaginate
|
|
5
|
+
class Paginate < ::Playbook::KitBase
|
|
6
|
+
prop :stragety # Need to add protection
|
|
7
|
+
prop :model # Need to add protection
|
|
8
|
+
|
|
9
|
+
def classname
|
|
10
|
+
generate_classname("pb_paginate")
|
|
11
|
+
end
|
|
12
|
+
end
|
|
13
|
+
end
|
|
14
|
+
end
|
|
@@ -55,7 +55,6 @@ import * as Lightbox from 'pb_lightbox/docs'
|
|
|
55
55
|
import * as LineGraphDocs from 'pb_line_graph/docs'
|
|
56
56
|
import * as List from 'pb_list/docs'
|
|
57
57
|
import * as LoadingInline from 'pb_loading_inline/docs'
|
|
58
|
-
import * as Map from 'pb_map/docs'
|
|
59
58
|
import * as Message from 'pb_message/docs'
|
|
60
59
|
import * as MultipleUsers from 'pb_multiple_users/docs'
|
|
61
60
|
import * as MultipleUsersStacked from 'pb_multiple_users_stacked/docs'
|
|
@@ -153,7 +152,6 @@ WebpackerReact.setup({
|
|
|
153
152
|
...LineGraphDocs,
|
|
154
153
|
...List,
|
|
155
154
|
...LoadingInline,
|
|
156
|
-
...Map,
|
|
157
155
|
...Message,
|
|
158
156
|
...MultipleUsers,
|
|
159
157
|
...MultipleUsersStacked,
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
@import "../tokens/colors";
|
|
2
|
+
@import "../tokens/typography";
|
|
3
|
+
@import "../tokens/border_radius";
|
|
4
|
+
@import "../tokens/shadows";
|
|
5
|
+
|
|
6
|
+
.pb_pagination {
|
|
7
|
+
display: inline-block;
|
|
8
|
+
border-radius: $border_rad_light;
|
|
9
|
+
border: 1px solid $border_light;
|
|
10
|
+
background-color: $white;
|
|
11
|
+
padding: 3px 0px 3.6px 0px;
|
|
12
|
+
margin: 10px 0;
|
|
13
|
+
li {
|
|
14
|
+
display: inline;
|
|
15
|
+
> a, li > span {
|
|
16
|
+
padding: 7px 13px;
|
|
17
|
+
text-decoration: none;
|
|
18
|
+
margin-left: -1px;
|
|
19
|
+
border: 0 !important;
|
|
20
|
+
}}
|
|
21
|
+
li:first-child > a, li:first-child > span {
|
|
22
|
+
padding: 7px 13px;
|
|
23
|
+
margin-left: .5px;
|
|
24
|
+
border-right: 1px solid $border_light !important;
|
|
25
|
+
z-index: 2;
|
|
26
|
+
}
|
|
27
|
+
li:last-child > a, li:last-child > span {
|
|
28
|
+
padding: 7px 13px;
|
|
29
|
+
margin-right: .5px;
|
|
30
|
+
border-left: 1px solid $border_light !important;
|
|
31
|
+
z-index: 2;
|
|
32
|
+
}
|
|
33
|
+
a {
|
|
34
|
+
color: $text_lt_default !important;
|
|
35
|
+
font-size: $text_small;
|
|
36
|
+
font-weight: $regular;
|
|
37
|
+
border: none;
|
|
38
|
+
|
|
39
|
+
&:hover {
|
|
40
|
+
background-color: $active_light;
|
|
41
|
+
color: $primary !important;
|
|
42
|
+
border-radius: $border_rad_light;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
&:focus {
|
|
46
|
+
outline: 1px solid $primary !important;
|
|
47
|
+
border-radius: $border_rad_light;
|
|
48
|
+
outline-offset: -1px;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
.active > span {
|
|
52
|
+
background-color: $primary !important;
|
|
53
|
+
border-radius: $border_rad_light;
|
|
54
|
+
color: #fff;
|
|
55
|
+
padding: 7px 13px;
|
|
56
|
+
border: 0 !important;
|
|
57
|
+
text-decoration: none;
|
|
58
|
+
font-weight: $bold;
|
|
59
|
+
font-size: $text_small;
|
|
60
|
+
|
|
61
|
+
&:hover {
|
|
62
|
+
box-shadow: $shadow_deeper;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
.disabled > span {
|
|
66
|
+
padding: 7px 10px;
|
|
67
|
+
font-size: $text_small;
|
|
68
|
+
}
|
|
69
|
+
}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
# frozen_string_literal: true
|
|
2
|
+
|
|
3
|
+
require "will_paginate/view_helpers/action_view"
|
|
4
|
+
|
|
5
|
+
module Playbook
|
|
6
|
+
module Pagination
|
|
7
|
+
class Rails < WillPaginate::ActionView::LinkRenderer
|
|
8
|
+
def container_attributes
|
|
9
|
+
{ class: "pb_pagination" }
|
|
10
|
+
end
|
|
11
|
+
|
|
12
|
+
def page_number(page)
|
|
13
|
+
if page == current_page
|
|
14
|
+
tag("li", tag("span", page), class: "active")
|
|
15
|
+
else
|
|
16
|
+
tag("li", link(page, page, rel: rel_value(page)))
|
|
17
|
+
end
|
|
18
|
+
end
|
|
19
|
+
|
|
20
|
+
def previous_or_next_page(page, text, classname)
|
|
21
|
+
if page
|
|
22
|
+
tag("li", link(text, page), class: classname)
|
|
23
|
+
else
|
|
24
|
+
tag("li", tag("span", text), class: "%s disabled")
|
|
25
|
+
end
|
|
26
|
+
end
|
|
27
|
+
|
|
28
|
+
def gap; end
|
|
29
|
+
|
|
30
|
+
def previous_page
|
|
31
|
+
num = @collection.current_page > 1 && @collection.current_page - 1
|
|
32
|
+
previous_or_next_page(num, "<i class='far fa-chevron-left fa-xs'></i>", "prev")
|
|
33
|
+
end
|
|
34
|
+
|
|
35
|
+
def next_page
|
|
36
|
+
num = @collection.current_page < @collection.total_pages && @collection.current_page + 1
|
|
37
|
+
previous_or_next_page(num, "<i class='far fa-chevron-right fa-xs'></i>", "next")
|
|
38
|
+
end
|
|
39
|
+
end
|
|
40
|
+
end
|
|
41
|
+
end
|
data/lib/playbook/version.rb
CHANGED
data/lib/playbook.rb
CHANGED
|
@@ -12,6 +12,8 @@ require "playbook/pb_doc_helper"
|
|
|
12
12
|
require "playbook/kit_base"
|
|
13
13
|
require "playbook/kit_resolver"
|
|
14
14
|
require "playbook/markdown"
|
|
15
|
+
# require "playbook/pagination_renderer"
|
|
16
|
+
# REMOVED TO MAKE THIS AN OPTIONAL INCLUDE FOR CLIENTS
|
|
15
17
|
|
|
16
18
|
module Playbook
|
|
17
19
|
ROOT_PATH = Pathname.new(File.join(__dir__, ".."))
|
metadata
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: playbook_ui
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 11.19.0.pre.alpha.
|
|
4
|
+
version: 11.19.0.pre.alpha.pagpassthrough1
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Power UX
|
|
@@ -9,7 +9,7 @@ authors:
|
|
|
9
9
|
autorequire:
|
|
10
10
|
bindir: bin
|
|
11
11
|
cert_chain: []
|
|
12
|
-
date: 2023-01-
|
|
12
|
+
date: 2023-01-16 00:00:00.000000000 Z
|
|
13
13
|
dependencies:
|
|
14
14
|
- !ruby/object:Gem::Dependency
|
|
15
15
|
name: actionpack
|
|
@@ -269,6 +269,20 @@ dependencies:
|
|
|
269
269
|
- - '='
|
|
270
270
|
- !ruby/object:Gem::Version
|
|
271
271
|
version: 1.2018.9
|
|
272
|
+
- !ruby/object:Gem::Dependency
|
|
273
|
+
name: will_paginate
|
|
274
|
+
requirement: !ruby/object:Gem::Requirement
|
|
275
|
+
requirements:
|
|
276
|
+
- - '='
|
|
277
|
+
- !ruby/object:Gem::Version
|
|
278
|
+
version: 3.3.1
|
|
279
|
+
type: :development
|
|
280
|
+
prerelease: false
|
|
281
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
282
|
+
requirements:
|
|
283
|
+
- - '='
|
|
284
|
+
- !ruby/object:Gem::Version
|
|
285
|
+
version: 3.3.1
|
|
272
286
|
description: Playbook Design System. Built for Nitro, but powering all.
|
|
273
287
|
email:
|
|
274
288
|
- nitroux@powerhrg.com
|
|
@@ -1371,12 +1385,6 @@ files:
|
|
|
1371
1385
|
- app/pb_kits/playbook/pb_loading_inline/loading_inline.html.erb
|
|
1372
1386
|
- app/pb_kits/playbook/pb_loading_inline/loading_inline.rb
|
|
1373
1387
|
- app/pb_kits/playbook/pb_logistic/_logistic.jsx
|
|
1374
|
-
- app/pb_kits/playbook/pb_map/_map.scss
|
|
1375
|
-
- app/pb_kits/playbook/pb_map/_map.tsx
|
|
1376
|
-
- app/pb_kits/playbook/pb_map/docs/_map_default.jsx
|
|
1377
|
-
- app/pb_kits/playbook/pb_map/docs/example.yml
|
|
1378
|
-
- app/pb_kits/playbook/pb_map/docs/index.js
|
|
1379
|
-
- app/pb_kits/playbook/pb_map/map.test.jsx
|
|
1380
1388
|
- app/pb_kits/playbook/pb_message/_message.jsx
|
|
1381
1389
|
- app/pb_kits/playbook/pb_message/_message.scss
|
|
1382
1390
|
- app/pb_kits/playbook/pb_message/_message_mixins.scss
|
|
@@ -1469,6 +1477,11 @@ files:
|
|
|
1469
1477
|
- app/pb_kits/playbook/pb_online_status/docs/index.js
|
|
1470
1478
|
- app/pb_kits/playbook/pb_online_status/online_status.html.erb
|
|
1471
1479
|
- app/pb_kits/playbook/pb_online_status/online_status.rb
|
|
1480
|
+
- app/pb_kits/playbook/pb_paginate/_paginate.scss
|
|
1481
|
+
- app/pb_kits/playbook/pb_paginate/docs/_paginate_default.html.erb
|
|
1482
|
+
- app/pb_kits/playbook/pb_paginate/docs/example.yml
|
|
1483
|
+
- app/pb_kits/playbook/pb_paginate/paginate.html.erb
|
|
1484
|
+
- app/pb_kits/playbook/pb_paginate/paginate.rb
|
|
1472
1485
|
- app/pb_kits/playbook/pb_passphrase/_passphrase.jsx
|
|
1473
1486
|
- app/pb_kits/playbook/pb_passphrase/_passphrase.scss
|
|
1474
1487
|
- app/pb_kits/playbook/pb_passphrase/docs/_passphrase_breached.html.erb
|
|
@@ -2267,6 +2280,7 @@ files:
|
|
|
2267
2280
|
- app/pb_kits/playbook/utilities/_max_width.scss
|
|
2268
2281
|
- app/pb_kits/playbook/utilities/_mixins.scss
|
|
2269
2282
|
- app/pb_kits/playbook/utilities/_number_spacing.scss
|
|
2283
|
+
- app/pb_kits/playbook/utilities/_pagination.scss
|
|
2270
2284
|
- app/pb_kits/playbook/utilities/_positioning.scss
|
|
2271
2285
|
- app/pb_kits/playbook/utilities/_shadow.scss
|
|
2272
2286
|
- app/pb_kits/playbook/utilities/_spacing.scss
|
|
@@ -2332,6 +2346,7 @@ files:
|
|
|
2332
2346
|
- lib/playbook/markdown/template_handler.rb
|
|
2333
2347
|
- lib/playbook/number_spacing.rb
|
|
2334
2348
|
- lib/playbook/order.rb
|
|
2349
|
+
- lib/playbook/pagination_renderer.rb
|
|
2335
2350
|
- lib/playbook/pb_doc_helper.rb
|
|
2336
2351
|
- lib/playbook/pb_forms_helper.rb
|
|
2337
2352
|
- lib/playbook/pb_kit_helper.rb
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import React from 'react'
|
|
2
|
-
import classnames from 'classnames'
|
|
3
|
-
import { buildAriaProps, buildCss, buildDataProps } from '../utilities/props'
|
|
4
|
-
import { globalProps } from '../utilities/globalProps'
|
|
5
|
-
|
|
6
|
-
type MapProps = {
|
|
7
|
-
aria?: { [key: string]: string },
|
|
8
|
-
children?: React.ReactChild[] | React.ReactNode,
|
|
9
|
-
className?: string,
|
|
10
|
-
data?: { [key: string]: string },
|
|
11
|
-
id?: string,
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
const Map = (props: MapProps) => {
|
|
15
|
-
const {
|
|
16
|
-
aria = {},
|
|
17
|
-
children,
|
|
18
|
-
className,
|
|
19
|
-
data = {},
|
|
20
|
-
id,
|
|
21
|
-
} = props
|
|
22
|
-
|
|
23
|
-
const ariaProps = buildAriaProps(aria)
|
|
24
|
-
const dataProps = buildDataProps(data)
|
|
25
|
-
const classes = classnames(buildCss('pb_map'), globalProps(props), className)
|
|
26
|
-
|
|
27
|
-
return (
|
|
28
|
-
<div
|
|
29
|
-
{...ariaProps}
|
|
30
|
-
{...dataProps}
|
|
31
|
-
className={classes}
|
|
32
|
-
id={id}
|
|
33
|
-
>
|
|
34
|
-
{children}
|
|
35
|
-
</div>
|
|
36
|
-
)
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
export default Map
|
|
@@ -1,49 +0,0 @@
|
|
|
1
|
-
import React, { useRef, useEffect } from 'react'
|
|
2
|
-
import Map from '../_map'
|
|
3
|
-
|
|
4
|
-
import maplibregl from 'maplibre-gl'
|
|
5
|
-
|
|
6
|
-
const MapDefault = () => {
|
|
7
|
-
|
|
8
|
-
const mapContainerRef = useRef(null)
|
|
9
|
-
|
|
10
|
-
useEffect(() => {
|
|
11
|
-
if (!maplibregl.supported()) {
|
|
12
|
-
alert('Your browser does not support MapLibre GL');
|
|
13
|
-
} else {
|
|
14
|
-
const map = new maplibregl.Map({
|
|
15
|
-
container: mapContainerRef.current,
|
|
16
|
-
style: 'https://api.maptiler.com/maps/positron/style.json?key=g8IQm57iZcbJ6Ky1HmG4',
|
|
17
|
-
center: [-75.379143, 39.831200],
|
|
18
|
-
zoom: 13,
|
|
19
|
-
})
|
|
20
|
-
//set marker/pin
|
|
21
|
-
/* eslint-disable-next-line */
|
|
22
|
-
const marker = new maplibregl.Marker({
|
|
23
|
-
color: "#0056CF",
|
|
24
|
-
}).setLngLat([-75.379143, 39.831200])
|
|
25
|
-
.setPopup(new maplibregl.Popup({className: 'map_popup'}).setHTML(`<h4 class="pb_title_kit_size_4">Hello World!</h4>`)) // add popup
|
|
26
|
-
.addTo(map);
|
|
27
|
-
|
|
28
|
-
//add controls
|
|
29
|
-
map.addControl(new maplibregl.NavigationControl())
|
|
30
|
-
|
|
31
|
-
}
|
|
32
|
-
}, [])
|
|
33
|
-
return (
|
|
34
|
-
<Map>
|
|
35
|
-
<div
|
|
36
|
-
ref={mapContainerRef}
|
|
37
|
-
style={{
|
|
38
|
-
position: 'absolute',
|
|
39
|
-
left: 0,
|
|
40
|
-
right: 0,
|
|
41
|
-
top: 0,
|
|
42
|
-
bottom: 0,
|
|
43
|
-
}}
|
|
44
|
-
/>
|
|
45
|
-
</Map>
|
|
46
|
-
)
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
export default MapDefault
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default as MapDefault } from './_map_default.jsx'
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { renderKit } from '../utilities/test-utils'
|
|
2
|
-
|
|
3
|
-
import { Map } from '../'
|
|
4
|
-
|
|
5
|
-
/* See these resources for more testing info:
|
|
6
|
-
- https://github.com/testing-library/jest-dom#usage for useage and examples
|
|
7
|
-
- https://jestjs.io/docs/en/using-matchers
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
|
-
test('generated scaffold test - update me', () => {
|
|
11
|
-
const props = {
|
|
12
|
-
data: { testid: 'default' }
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
const kit = renderKit(Map , props)
|
|
16
|
-
expect(kit).toBeInTheDocument()
|
|
17
|
-
})
|