playbook_ui_docs 14.11.1.pre.alpha.hfhbrakemanplaybook5370 → 14.11.1.pre.alpha.play17725374

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8cec5b327027d185abd08e5306f4d55cd69463894c965c49b410fc4f5e87c264
-  data.tar.gz: 2aa04f18b9ed1b6befdd50d8568d574cff1c86b88e9dc84035b5043a1e1680a2
+  metadata.gz: d54656b59e159e3b15dcdeeb5fc86ec86948bef8e9df295684d058191b86c146
+  data.tar.gz: c82d10ac4ac98100b79c5d5e5ee8d0c6a2a54f13f0034c558443ee20bfd6145c
 SHA512:
-  metadata.gz: 7bdfd5454a5ab5591e8a656b63b40192b03d9389dd4388279b317dbedd3bd933730736996d3aef33f0c36bbff7234d23265a9e63065f841fcb8318afccb2d7fa
-  data.tar.gz: 0e09ff8694c3c0166393a0e73893b37da44fe33ef54a8c0028e3150de55d7b107277b78d89a5d8a2b17d0f9a3e8cc7a545353533398bdf7a8d3b884279606d84
+  metadata.gz: 51ccf245b8c1a3a620ff7107a219b84256899baf8f4bd76d752cc3b64db9919878f0feb4720e33cb1c5a63a219ef9f990dca8522edc81927bec5f25cf7d28947
+  data.tar.gz: c314c09559fd6e572bb7f5405396fe198d5ccf395d7a97bb42e4244779d7f5f84d416a73a8073130e454ab1c4bb236f34bc9373b3c900afe35873a383efc833a

data/app/pb_kits/playbook/pb_text_input/docs/_text_input_mask.html.erb

@@ -0,0 +1,50 @@
+
+
+
+<%= pb_rails("title", props: { text: "Input Masks", size: 4, margin_bottom: "md" }) %>
+
+<div class="pb--doc-demo-elements">
+  <%= pb_rails("text_input", props: {
+    label: "Currency",
+    mask: "currency",
+    margin_bottom: "md",
+    name: "currency_name"
+  }) %>
+
+  <%= pb_rails("text_input", props: {
+    label: "ZIP Code",
+    mask: "zip_code",
+    margin_bottom: "md",
+  }) %>
+
+  <%= pb_rails("text_input", props: {
+    label: "Postal Code",
+    mask: "postal_code",
+    placeholder: "12345-6789",
+    margin_bottom: "md",
+  }) %>
+
+  <%= pb_rails("text_input", props: {
+    label: "Social Security Number",
+    mask: "ssn",
+    margin_bottom: "md",
+  }) %>
+
+  <%= pb_rails("title" , props: {
+    text: "Hidden Input Under The Hood",
+    padding_bottom: "sm"
+  })%>
+
+  <%= pb_rails("text_input", props: {
+    label: "Currency",
+    mask: "currency",
+    margin_bottom: "md",
+    name: "currency_name",
+    id: "example-currency"
+  }) %>
+
+<style>
+#example-currency-sanitized {display: flex !important;}
+</style>
+
+</div>

data/app/pb_kits/playbook/pb_text_input/docs/_text_input_mask_rails.md

@@ -0,0 +1,3 @@
+This mask feature lets you style your inputs while maintaining the value that the user typed in.
+
+There's a hidden input file that stores the raw value, and has the `name` feild. It will also copy the id field with a "#{your-id-sanitized}"

data/app/pb_kits/playbook/pb_text_input/docs/example.yml

@@ -8,6 +8,7 @@ examples:
   - text_input_inline: Inline
   - text_input_no_label: No Label
   - text_input_options: Input Options
+  - text_input_mask: Mask
   react:
   - text_input_default: Default
   - text_input_error: With Error
@@ -23,4 +24,4 @@ examples:
     - text_input_error_swift: With Error
     - text_input_disabled_swift: Disabled
     - text_input_add_on_swift: Add On
-    - text_input_props_swift: ""
+    - text_input_props_swift: ""

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 14.11.1.pre.alpha.hfhbrakemanplaybook5370
+  version: 14.11.1.pre.alpha.play17725374
 platform: ruby
 authors:
 - Power UX
@@ -1830,7 +1830,9 @@ files:
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_error_swift.md
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_inline.html.erb
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_inline.jsx
+- app/pb_kits/playbook/pb_text_input/docs/_text_input_mask.html.erb
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_mask.jsx
+- app/pb_kits/playbook/pb_text_input/docs/_text_input_mask_rails.md
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_no_label.html.erb
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_no_label.jsx
 - app/pb_kits/playbook/pb_text_input/docs/_text_input_options.html.erb