playbook_ui 12.17.1 → 12.18.0.pre.alpha.PLAY785typeaheadts607

Sign up to get free protection for your applications and to get access to all the features.
Files changed (66) hide show
  1. checksums.yaml +4 -4
  2. data/app/pb_kits/playbook/index.js +1 -1
  3. data/app/pb_kits/playbook/pb_avatar_action_button/avatar_action_button.html.erb +1 -2
  4. data/app/pb_kits/playbook/pb_collapsible/_collapsible.tsx +2 -2
  5. data/app/pb_kits/playbook/pb_docs/kit_api.html.erb +48 -36
  6. data/app/pb_kits/playbook/pb_docs/kit_api.rb +97 -9
  7. data/app/pb_kits/playbook/pb_docs/kit_example.html.erb +1 -1
  8. data/app/pb_kits/playbook/pb_docs/kit_example.rb +9 -5
  9. data/app/pb_kits/playbook/pb_lightbox/_lightbox.tsx +8 -0
  10. data/app/pb_kits/playbook/pb_lightbox/docs/_lightbox_current_photo.jsx +121 -0
  11. data/app/pb_kits/playbook/pb_lightbox/docs/_lightbox_current_photo.md +1 -0
  12. data/app/pb_kits/playbook/pb_lightbox/docs/example.yml +1 -0
  13. data/app/pb_kits/playbook/pb_lightbox/docs/index.js +1 -0
  14. data/app/pb_kits/playbook/pb_nav/_item.tsx +6 -6
  15. data/app/pb_kits/playbook/pb_nav/_nav.tsx +4 -4
  16. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorButton.tsx +49 -0
  17. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorTypes.ts +9 -0
  18. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/Toolbar.tsx +62 -0
  19. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarDropdown.tsx +139 -0
  20. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarHistory.tsx +45 -0
  21. data/app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarNodes.tsx +59 -0
  22. data/app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.scss +1 -1
  23. data/app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.tsx +28 -12
  24. data/app/pb_kits/playbook/pb_rich_text_editor/_tiptap_styles.scss +231 -0
  25. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_description.md +1 -0
  26. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_default.jsx +36 -0
  27. data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_default.md +4 -0
  28. data/app/pb_kits/playbook/pb_rich_text_editor/docs/example.yml +1 -0
  29. data/app/pb_kits/playbook/pb_rich_text_editor/docs/index.js +1 -0
  30. data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.tsx +185 -0
  31. data/app/pb_kits/playbook/pb_time_range_inline/time_range_inline.test.js +85 -0
  32. data/app/pb_kits/playbook/pb_title/_title.tsx +1 -1
  33. data/app/pb_kits/playbook/pb_title_detail/_title_detail.tsx +45 -0
  34. data/app/pb_kits/playbook/pb_title_detail/title_detail.test.js +71 -0
  35. data/app/pb_kits/playbook/pb_toggle/{_toggle.jsx → _toggle.tsx} +20 -22
  36. data/app/pb_kits/playbook/pb_toggle/toggle.test.js +67 -0
  37. data/app/pb_kits/playbook/pb_tooltip/_tooltip.scss +11 -6
  38. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb +4 -4
  39. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_with_icon_circle.html.erb +1 -2
  40. data/app/pb_kits/playbook/pb_tooltip/docs/example.yml +0 -1
  41. data/app/pb_kits/playbook/pb_typeahead/{_typeahead.jsx → _typeahead.tsx} +22 -12
  42. data/app/pb_kits/playbook/pb_typeahead/components/{ClearIndicator.jsx → ClearIndicator.tsx} +2 -4
  43. data/app/pb_kits/playbook/pb_typeahead/components/{Control.jsx → Control.tsx} +5 -7
  44. data/app/pb_kits/playbook/pb_typeahead/components/{IndicatorsContainer.jsx → IndicatorsContainer.tsx} +2 -4
  45. data/app/pb_kits/playbook/pb_typeahead/components/{MenuList.jsx → MenuList.tsx} +0 -2
  46. data/app/pb_kits/playbook/pb_typeahead/components/MultiValue.tsx +66 -0
  47. data/app/pb_kits/playbook/pb_typeahead/components/Option.tsx +37 -0
  48. data/app/pb_kits/playbook/pb_typeahead/components/{Placeholder.jsx → Placeholder.tsx} +7 -9
  49. data/app/pb_kits/playbook/pb_typeahead/components/{ValueContainer.jsx → ValueContainer.tsx} +3 -5
  50. data/app/pb_kits/playbook/pb_typeahead/{index.js → index.ts} +37 -29
  51. data/app/pb_kits/playbook/pb_typeahead/types.d.ts +2 -0
  52. data/app/pb_kits/playbook/pb_user/_user.tsx +2 -2
  53. data/lib/playbook/markdown/helper.rb +50 -71
  54. data/lib/playbook/markdown.rb +0 -1
  55. data/lib/playbook/number_spacing.rb +10 -10
  56. data/lib/playbook/position.rb +10 -10
  57. data/lib/playbook/spacing.rb +10 -10
  58. data/lib/playbook/version.rb +2 -2
  59. data/lib/playbook/z_index.rb +10 -10
  60. metadata +38 -24
  61. data/app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.jsx +0 -172
  62. data/app/pb_kits/playbook/pb_title_detail/_title_detail.jsx +0 -44
  63. data/app/pb_kits/playbook/pb_tooltip/docs/_tooltip_white.html.erb +0 -9
  64. data/app/pb_kits/playbook/pb_typeahead/components/MultiValue.jsx +0 -62
  65. data/app/pb_kits/playbook/pb_typeahead/components/Option.jsx +0 -39
  66. data/lib/playbook/markdown/template_handler.rb +0 -47
@@ -6,6 +6,16 @@ module Playbook
6
6
  base.prop :number_spacing
7
7
  end
8
8
 
9
+ def number_spacing_values
10
+ %w[tabular]
11
+ end
12
+
13
+ def number_spacing_options
14
+ {
15
+ number_spacing: "ns",
16
+ }
17
+ end
18
+
9
19
  private
10
20
 
11
21
  def number_spacing_props
@@ -17,15 +27,5 @@ module Playbook
17
27
  "ns_#{index_value}" if number_spacing_values.include? index_value
18
28
  end.compact.join(" ")
19
29
  end
20
-
21
- def number_spacing_options
22
- {
23
- number_spacing: "ns",
24
- }
25
- end
26
-
27
- def number_spacing_values
28
- %w[tabular]
29
- end
30
30
  end
31
31
  end
@@ -6,6 +6,16 @@ module Playbook
6
6
  base.prop :position
7
7
  end
8
8
 
9
+ def position_values
10
+ %w[relative absolute fixed sticky]
11
+ end
12
+
13
+ def position_options
14
+ {
15
+ position: "position",
16
+ }
17
+ end
18
+
9
19
  private
10
20
 
11
21
  def position_props
@@ -19,15 +29,5 @@ module Playbook
19
29
  "position_#{value}"
20
30
  end.compact.join(" ")
21
31
  end
22
-
23
- def position_options
24
- {
25
- position: "position",
26
- }
27
- end
28
-
29
- def position_values
30
- %w[relative absolute fixed sticky]
31
- end
32
32
  end
33
33
  end
@@ -20,6 +20,16 @@ module Playbook
20
20
  base.prop :padding_y
21
21
  end
22
22
 
23
+ def max_width_options
24
+ {
25
+ max_width: "mw",
26
+ }
27
+ end
28
+
29
+ def max_width_values
30
+ %w[xs sm md lg xl 0 none]
31
+ end
32
+
23
33
  def spacing_options
24
34
  {
25
35
  margin: "m",
@@ -62,15 +72,5 @@ module Playbook
62
72
  "max_width_#{width_value}" if max_width_values.include? width_value
63
73
  end.compact.join(" ")
64
74
  end
65
-
66
- def max_width_options
67
- {
68
- max_width: "mw",
69
- }
70
- end
71
-
72
- def max_width_values
73
- %w[xs sm md lg xl 0 none]
74
- end
75
75
  end
76
76
  end
@@ -1,6 +1,6 @@
1
1
  # frozen_string_literal: true
2
2
 
3
3
  module Playbook
4
- PREVIOUS_VERSION = "12.17.0"
5
- VERSION = "12.17.1"
4
+ PREVIOUS_VERSION = "12.18.0"
5
+ VERSION = "12.18.0.pre.alpha.PLAY785typeaheadts607"
6
6
  end
@@ -6,6 +6,16 @@ module Playbook
6
6
  base.prop :z_index
7
7
  end
8
8
 
9
+ def z_index_values
10
+ %w[1 2 3 4 5 6 7 8 9 10]
11
+ end
12
+
13
+ def z_index_options
14
+ {
15
+ z_index: "z-index",
16
+ }
17
+ end
18
+
9
19
  private
10
20
 
11
21
  def z_index_props
@@ -17,15 +27,5 @@ module Playbook
17
27
  "z_index_#{index_value}" if z_index_values.include? index_value
18
28
  end.compact.join(" ")
19
29
  end
20
-
21
- def z_index_options
22
- {
23
- z_index: "z-index",
24
- }
25
- end
26
-
27
- def z_index_values
28
- %w[1 2 3 4 5 6 7 8 9 10]
29
- end
30
30
  end
31
31
  end
metadata CHANGED
@@ -1,15 +1,15 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: playbook_ui
3
3
  version: !ruby/object:Gem::Version
4
- version: 12.17.1
4
+ version: 12.18.0.pre.alpha.PLAY785typeaheadts607
5
5
  platform: ruby
6
6
  authors:
7
7
  - Power UX
8
8
  - Power Devs
9
- autorequire:
9
+ autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2023-05-01 00:00:00.000000000 Z
12
+ date: 2023-05-04 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionpack
@@ -73,14 +73,14 @@ dependencies:
73
73
  requirements:
74
74
  - - "~>"
75
75
  - !ruby/object:Gem::Version
76
- version: '3.5'
76
+ version: '3.6'
77
77
  type: :runtime
78
78
  prerelease: false
79
79
  version_requirements: !ruby/object:Gem::Requirement
80
80
  requirements:
81
81
  - - "~>"
82
82
  - !ruby/object:Gem::Version
83
- version: '3.5'
83
+ version: '3.6'
84
84
  - !ruby/object:Gem::Dependency
85
85
  name: rouge
86
86
  requirement: !ruby/object:Gem::Requirement
@@ -1332,6 +1332,8 @@ files:
1332
1332
  - app/pb_kits/playbook/pb_lightbox/docs/_description.md
1333
1333
  - app/pb_kits/playbook/pb_lightbox/docs/_lightbox_compound_component.jsx
1334
1334
  - app/pb_kits/playbook/pb_lightbox/docs/_lightbox_compound_component.md
1335
+ - app/pb_kits/playbook/pb_lightbox/docs/_lightbox_current_photo.jsx
1336
+ - app/pb_kits/playbook/pb_lightbox/docs/_lightbox_current_photo.md
1335
1337
  - app/pb_kits/playbook/pb_lightbox/docs/_lightbox_custom_header.jsx
1336
1338
  - app/pb_kits/playbook/pb_lightbox/docs/_lightbox_custom_header.md
1337
1339
  - app/pb_kits/playbook/pb_lightbox/docs/_lightbox_default.jsx
@@ -1717,9 +1719,19 @@ files:
1717
1719
  - app/pb_kits/playbook/pb_radio/radio.html.erb
1718
1720
  - app/pb_kits/playbook/pb_radio/radio.rb
1719
1721
  - app/pb_kits/playbook/pb_radio/radio.test.js
1722
+ - app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorButton.tsx
1723
+ - app/pb_kits/playbook/pb_rich_text_editor/TipTap/EditorTypes.ts
1724
+ - app/pb_kits/playbook/pb_rich_text_editor/TipTap/Toolbar.tsx
1725
+ - app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarDropdown.tsx
1726
+ - app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarHistory.tsx
1727
+ - app/pb_kits/playbook/pb_rich_text_editor/TipTap/ToolbarNodes.tsx
1720
1728
  - app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.scss
1721
1729
  - app/pb_kits/playbook/pb_rich_text_editor/_rich_text_editor.tsx
1730
+ - app/pb_kits/playbook/pb_rich_text_editor/_tiptap_styles.scss
1722
1731
  - app/pb_kits/playbook/pb_rich_text_editor/_trix_styles.scss
1732
+ - app/pb_kits/playbook/pb_rich_text_editor/docs/_description.md
1733
+ - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_default.jsx
1734
+ - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_default.md
1723
1735
  - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_attributes.html.erb
1724
1736
  - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_attributes.jsx
1725
1737
  - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_default.html.erb
@@ -2072,14 +2084,15 @@ files:
2072
2084
  - app/pb_kits/playbook/pb_time/docs/index.js
2073
2085
  - app/pb_kits/playbook/pb_time/time.html.erb
2074
2086
  - app/pb_kits/playbook/pb_time/time.rb
2075
- - app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.jsx
2076
2087
  - app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.scss
2088
+ - app/pb_kits/playbook/pb_time_range_inline/_time_range_inline.tsx
2077
2089
  - app/pb_kits/playbook/pb_time_range_inline/docs/_time_range_inline_default.html.erb
2078
2090
  - app/pb_kits/playbook/pb_time_range_inline/docs/_time_range_inline_default.jsx
2079
2091
  - app/pb_kits/playbook/pb_time_range_inline/docs/example.yml
2080
2092
  - app/pb_kits/playbook/pb_time_range_inline/docs/index.js
2081
2093
  - app/pb_kits/playbook/pb_time_range_inline/time_range_inline.html.erb
2082
2094
  - app/pb_kits/playbook/pb_time_range_inline/time_range_inline.rb
2095
+ - app/pb_kits/playbook/pb_time_range_inline/time_range_inline.test.js
2083
2096
  - app/pb_kits/playbook/pb_time_stacked/_time_stacked.scss
2084
2097
  - app/pb_kits/playbook/pb_time_stacked/_time_stacked.tsx
2085
2098
  - app/pb_kits/playbook/pb_time_stacked/docs/_time_stacked_default.html.erb
@@ -2160,8 +2173,8 @@ files:
2160
2173
  - app/pb_kits/playbook/pb_title_count/title_count.html.erb
2161
2174
  - app/pb_kits/playbook/pb_title_count/title_count.rb
2162
2175
  - app/pb_kits/playbook/pb_title_count/title_count.test.js
2163
- - app/pb_kits/playbook/pb_title_detail/_title_detail.jsx
2164
2176
  - app/pb_kits/playbook/pb_title_detail/_title_detail.scss
2177
+ - app/pb_kits/playbook/pb_title_detail/_title_detail.tsx
2165
2178
  - app/pb_kits/playbook/pb_title_detail/docs/_description.md
2166
2179
  - app/pb_kits/playbook/pb_title_detail/docs/_footer.md
2167
2180
  - app/pb_kits/playbook/pb_title_detail/docs/_title_detail_default.html.erb
@@ -2171,8 +2184,9 @@ files:
2171
2184
  - app/pb_kits/playbook/pb_title_detail/docs/index.js
2172
2185
  - app/pb_kits/playbook/pb_title_detail/title_detail.html.erb
2173
2186
  - app/pb_kits/playbook/pb_title_detail/title_detail.rb
2174
- - app/pb_kits/playbook/pb_toggle/_toggle.jsx
2187
+ - app/pb_kits/playbook/pb_title_detail/title_detail.test.js
2175
2188
  - app/pb_kits/playbook/pb_toggle/_toggle.scss
2189
+ - app/pb_kits/playbook/pb_toggle/_toggle.tsx
2176
2190
  - app/pb_kits/playbook/pb_toggle/docs/_description.md
2177
2191
  - app/pb_kits/playbook/pb_toggle/docs/_footer.md
2178
2192
  - app/pb_kits/playbook/pb_toggle/docs/_toggle_custom.html.erb
@@ -2188,6 +2202,7 @@ files:
2188
2202
  - app/pb_kits/playbook/pb_toggle/docs/index.js
2189
2203
  - app/pb_kits/playbook/pb_toggle/toggle.html.erb
2190
2204
  - app/pb_kits/playbook/pb_toggle/toggle.rb
2205
+ - app/pb_kits/playbook/pb_toggle/toggle.test.js
2191
2206
  - app/pb_kits/playbook/pb_tooltip/_tooltip.scss
2192
2207
  - app/pb_kits/playbook/pb_tooltip/_tooltip.tsx
2193
2208
  - app/pb_kits/playbook/pb_tooltip/docs/_tooltip_default.html.erb
@@ -2204,7 +2219,6 @@ files:
2204
2219
  - app/pb_kits/playbook/pb_tooltip/docs/_tooltip_margin.md
2205
2220
  - app/pb_kits/playbook/pb_tooltip/docs/_tooltip_selectors.html.erb
2206
2221
  - app/pb_kits/playbook/pb_tooltip/docs/_tooltip_selectors.md
2207
- - app/pb_kits/playbook/pb_tooltip/docs/_tooltip_white.html.erb
2208
2222
  - app/pb_kits/playbook/pb_tooltip/docs/_tooltip_with_icon_circle.html.erb
2209
2223
  - app/pb_kits/playbook/pb_tooltip/docs/example.yml
2210
2224
  - app/pb_kits/playbook/pb_tooltip/docs/index.js
@@ -2234,17 +2248,17 @@ files:
2234
2248
  - app/pb_kits/playbook/pb_treemap_chart/docs/index.js
2235
2249
  - app/pb_kits/playbook/pb_treemap_chart/treemap_chart.html.erb
2236
2250
  - app/pb_kits/playbook/pb_treemap_chart/treemap_chart.rb
2237
- - app/pb_kits/playbook/pb_typeahead/_typeahead.jsx
2238
2251
  - app/pb_kits/playbook/pb_typeahead/_typeahead.scss
2239
2252
  - app/pb_kits/playbook/pb_typeahead/_typeahead.test.jsx
2240
- - app/pb_kits/playbook/pb_typeahead/components/ClearIndicator.jsx
2241
- - app/pb_kits/playbook/pb_typeahead/components/Control.jsx
2242
- - app/pb_kits/playbook/pb_typeahead/components/IndicatorsContainer.jsx
2243
- - app/pb_kits/playbook/pb_typeahead/components/MenuList.jsx
2244
- - app/pb_kits/playbook/pb_typeahead/components/MultiValue.jsx
2245
- - app/pb_kits/playbook/pb_typeahead/components/Option.jsx
2246
- - app/pb_kits/playbook/pb_typeahead/components/Placeholder.jsx
2247
- - app/pb_kits/playbook/pb_typeahead/components/ValueContainer.jsx
2253
+ - app/pb_kits/playbook/pb_typeahead/_typeahead.tsx
2254
+ - app/pb_kits/playbook/pb_typeahead/components/ClearIndicator.tsx
2255
+ - app/pb_kits/playbook/pb_typeahead/components/Control.tsx
2256
+ - app/pb_kits/playbook/pb_typeahead/components/IndicatorsContainer.tsx
2257
+ - app/pb_kits/playbook/pb_typeahead/components/MenuList.tsx
2258
+ - app/pb_kits/playbook/pb_typeahead/components/MultiValue.tsx
2259
+ - app/pb_kits/playbook/pb_typeahead/components/Option.tsx
2260
+ - app/pb_kits/playbook/pb_typeahead/components/Placeholder.tsx
2261
+ - app/pb_kits/playbook/pb_typeahead/components/ValueContainer.tsx
2248
2262
  - app/pb_kits/playbook/pb_typeahead/docs/_description.md
2249
2263
  - app/pb_kits/playbook/pb_typeahead/docs/_footer.md
2250
2264
  - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_async_createable.jsx
@@ -2275,9 +2289,10 @@ files:
2275
2289
  - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_without_pills.md
2276
2290
  - app/pb_kits/playbook/pb_typeahead/docs/example.yml
2277
2291
  - app/pb_kits/playbook/pb_typeahead/docs/index.js
2278
- - app/pb_kits/playbook/pb_typeahead/index.js
2292
+ - app/pb_kits/playbook/pb_typeahead/index.ts
2279
2293
  - app/pb_kits/playbook/pb_typeahead/typeahead.html.erb
2280
2294
  - app/pb_kits/playbook/pb_typeahead/typeahead.rb
2295
+ - app/pb_kits/playbook/pb_typeahead/types.d.ts
2281
2296
  - app/pb_kits/playbook/pb_user/_user.scss
2282
2297
  - app/pb_kits/playbook/pb_user/_user.tsx
2283
2298
  - app/pb_kits/playbook/pb_user/docs/_description.md
@@ -2440,7 +2455,6 @@ files:
2440
2455
  - lib/playbook/line_height.rb
2441
2456
  - lib/playbook/markdown.rb
2442
2457
  - lib/playbook/markdown/helper.rb
2443
- - lib/playbook/markdown/template_handler.rb
2444
2458
  - lib/playbook/number_spacing.rb
2445
2459
  - lib/playbook/order.rb
2446
2460
  - lib/playbook/pagination_renderer.rb
@@ -2472,7 +2486,7 @@ homepage: http://playbook.powerapp.cloud
2472
2486
  licenses:
2473
2487
  - ISC
2474
2488
  metadata: {}
2475
- post_install_message:
2489
+ post_install_message:
2476
2490
  rdoc_options: []
2477
2491
  require_paths:
2478
2492
  - lib
@@ -2483,12 +2497,12 @@ required_ruby_version: !ruby/object:Gem::Requirement
2483
2497
  version: '0'
2484
2498
  required_rubygems_version: !ruby/object:Gem::Requirement
2485
2499
  requirements:
2486
- - - ">="
2500
+ - - ">"
2487
2501
  - !ruby/object:Gem::Version
2488
- version: '0'
2502
+ version: 1.3.1
2489
2503
  requirements: []
2490
2504
  rubygems_version: 3.3.7
2491
- signing_key:
2505
+ signing_key:
2492
2506
  specification_version: 4
2493
2507
  summary: Playbook Design System
2494
2508
  test_files: []
@@ -1,172 +0,0 @@
1
- /* @flow */
2
-
3
- import React from 'react'
4
- import classnames from 'classnames'
5
-
6
- import DateTime from '../pb_kit/dateTime'
7
- import { globalProps } from '../utilities/globalProps'
8
-
9
- import Body from '../pb_body/_body'
10
- import Caption from '../pb_caption/_caption'
11
- import Icon from '../pb_icon/_icon'
12
-
13
- type TimeRangeInlineProps = {
14
- className?: string,
15
- id?: string,
16
- data?: string,
17
- alignment?: "left" | "center" | "vertical",
18
- size?: "sm" | "xs",
19
- dark?: boolean,
20
- icon?: boolean,
21
- timezone?: boolean,
22
- startTime: string,
23
- endTime: string,
24
- }
25
-
26
- const timezoneString = (dateValue) => {
27
- const date = new DateTime({ value: dateValue })
28
- return `${date.convertToTimezone()}`
29
- }
30
-
31
- const dateTimestamp = (dateValue) => {
32
- const date = new DateTime({ value: dateValue })
33
- return `${date.toHour()}:${date.toMinute()}${date.toMeridian()}`
34
- }
35
-
36
- const dateTimeIso = (dateValue) => {
37
- const date = new DateTime({ value: dateValue })
38
- return date.toIso()
39
- }
40
-
41
- const TimeRangeInline = (props: TimeRangeInlineProps) => {
42
- const {
43
- className,
44
- alignment = 'left',
45
- size = 'sm',
46
- dark = false,
47
- icon = false,
48
- timezone = false,
49
- startTime,
50
- endTime,
51
- } = props
52
- const separator = (
53
- <Body color="light">
54
- <Icon
55
- className="pb_time_range_inline_arrow"
56
- dark={dark}
57
- fixedWidth
58
- icon="long-arrow-right"
59
- />
60
- </Body>
61
- )
62
-
63
- const iconContent = () => {
64
- return (
65
- <If condition={icon}>
66
- <Body
67
- color="light"
68
- tag="span"
69
- >
70
- <Icon
71
- className="pb_time_range_inline_icon"
72
- dark={dark}
73
- fixedWidth
74
- icon="clock"
75
- size={size}
76
- tag="span"
77
- />
78
- </Body>
79
- </If>
80
- )
81
- }
82
-
83
- return (
84
- <div
85
- className={classnames('pb_time_range_inline_kit_' + alignment, globalProps(props), className)}
86
- >
87
- <div className="pb_time_range_inline_wrapper">
88
- <If condition={size == 'xs'}>
89
- <Caption
90
- dark={dark}
91
- tag="span"
92
- >
93
- {iconContent()}
94
- <time dateTime={dateTimeIso(startTime)}>
95
- {` ${dateTimestamp(
96
- startTime
97
- )} `}
98
- </time>
99
- </Caption>
100
- <Caption
101
- className="pb_time_range_inline_arrow"
102
- dark={dark}
103
- tag="span"
104
- >
105
- {separator}
106
- </Caption>
107
- <Caption
108
- dark={dark}
109
- tag="span"
110
- >
111
- <time dateTime={dateTimeIso(endTime)}>
112
- {` ${dateTimestamp(
113
- endTime
114
- )} `}
115
- </time>
116
- </Caption>
117
- <If condition={timezone}>
118
- <Caption
119
- className="pb_time_range_inline_timezone"
120
- dark={dark}
121
- tag="span"
122
- >
123
- {timezoneString(endTime)}
124
- </Caption>
125
- </If>
126
- </If>
127
- <If condition={size == 'sm'}>
128
- <Body
129
- dark={dark}
130
- tag="span"
131
- >
132
- {iconContent()}
133
- <time dateTime={dateTimeIso(startTime)}>
134
- {` ${dateTimestamp(
135
- startTime
136
- )} `}
137
- </time>
138
- </Body>
139
- <Body
140
- className="pb_time_range_inline_arrow"
141
- dark={dark}
142
- tag="span"
143
- >
144
- {separator}
145
- </Body>
146
- <Body
147
- dark={dark}
148
- tag="span"
149
- >
150
- <time dateTime={dateTimeIso(endTime)}>
151
- {` ${dateTimestamp(
152
- endTime
153
- )} `}
154
- </time>
155
- </Body>
156
- <If condition={timezone}>
157
- <Body
158
- className="pb_time_range_inline_timezone"
159
- color="light"
160
- dark={dark}
161
- tag="span"
162
- >
163
- {timezoneString(endTime)}
164
- </Body>
165
- </If>
166
- </If>
167
- </div>
168
- </div>
169
- )
170
- }
171
-
172
- export default TimeRangeInline
@@ -1,44 +0,0 @@
1
- /* @flow */
2
-
3
- import React from 'react'
4
- import classnames from 'classnames'
5
-
6
- import { globalProps } from '../utilities/globalProps'
7
- import { buildCss, buildDataProps } from '../utilities/props'
8
-
9
- import Body from '../pb_body/_body'
10
- import Title from '../pb_title/_title'
11
-
12
- type TitleDetailProps = {
13
- align?: "left" | "center" | "right",
14
- className?: string,
15
- data?: object,
16
- detail: string,
17
- id?: string,
18
- title: string,
19
- }
20
-
21
- const TitleDetail = (props: TitleDetailProps) => {
22
- const { align = 'left', className, data = {}, detail, id, title } = props
23
- const dataProps = buildDataProps(data)
24
- const pbCss = buildCss('pb_title_detail_kit', align)
25
-
26
- return (
27
- <div
28
- {...dataProps}
29
- className={classnames(pbCss, globalProps(props), className)}
30
- id={id}
31
- >
32
- <Title
33
- size={4}
34
- text={title}
35
- />
36
- <Body
37
- color="light"
38
- text={detail}
39
- />
40
- </div>
41
- )
42
- }
43
-
44
- export default TitleDetail
@@ -1,9 +0,0 @@
1
- <span id='regular-tooltip-5'>I am a white tooltip.</span>
2
-
3
- <%= pb_rails("tooltip", props: {
4
- trigger_element_id: "regular-tooltip-5",
5
- tooltip_id: "tooltip-5",
6
- position: 'top'
7
- }) do %>
8
- Whoa. I'm a white tooltip.
9
- <% end %>
@@ -1,62 +0,0 @@
1
- /* @flow */
2
-
3
- import React from 'react'
4
- import { components } from 'react-select'
5
-
6
- import Badge from '../../pb_badge/_badge'
7
- import FormPill from '../../pb_form_pill/_form_pill'
8
-
9
- type Props = {
10
- data: object,
11
- multiValueTemplate: any,
12
- removeProps: any,
13
- selectProps: any,
14
- }
15
-
16
- const MultiValue = (props: Props) => {
17
- const { removeProps } = props
18
- const { imageUrl, label } = props.data
19
- const { multiKit } = props.selectProps
20
-
21
- const formPillProps = {
22
- marginRight: 'xs',
23
- name: label,
24
- }
25
-
26
- if (typeof imageUrl === 'string') formPillProps.avatarUrl = imageUrl
27
-
28
- return (
29
- <components.MultiValueContainer
30
- className="text_input_multivalue_container"
31
- {...props}
32
- >
33
- <If condition={multiKit === 'badge'}>
34
- <Badge
35
- closeProps={removeProps}
36
- removeIcon
37
- text={label}
38
- variant="primary"
39
- />
40
- <Else />
41
- <If condition={imageUrl}>
42
- <FormPill
43
- avatarUrl={imageUrl}
44
- closeProps={removeProps}
45
- marginRight="xs"
46
- name={label}
47
- size={multiKit === 'smallPill' ? 'small' : ''}
48
- />
49
- <Else />
50
- <FormPill
51
- closeProps={removeProps}
52
- marginRight="xs"
53
- size={multiKit === 'smallPill' ? 'small' : ''}
54
- text={label}
55
- />
56
- </If>
57
- </If>
58
- </components.MultiValueContainer>
59
- )
60
- }
61
-
62
- export default MultiValue
@@ -1,39 +0,0 @@
1
- /* @flow */
2
-
3
- import React from 'react'
4
- import { components } from 'react-select'
5
-
6
- import User from '../../pb_user/_user'
7
-
8
- const Option = (props: any) => {
9
- const {
10
- imageUrl,
11
- } = props.data
12
- const { valueComponent } = props.selectProps
13
-
14
- return (
15
- <components.Option {...props}>
16
- <div>
17
- <Choose>
18
- <When condition={!valueComponent && imageUrl}>
19
- <User
20
- align="left"
21
- avatarUrl={imageUrl}
22
- dark={props.selectProps.dark}
23
- name={props.label}
24
- orientation="horizontal"
25
- />
26
- </When>
27
- <When condition={valueComponent}>
28
- { valueComponent(props.data) }
29
- </When>
30
- <Otherwise>
31
- {props.label}
32
- </Otherwise>
33
- </Choose>
34
- </div>
35
- </components.Option>
36
- )
37
- }
38
-
39
- export default Option