playbook_ui_docs 14.11.1.pre.alpha.hfhbrakemanplaybook5370 → 14.11.1.pre.alpha.play17725372

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8cec5b327027d185abd08e5306f4d55cd69463894c965c49b410fc4f5e87c264
-  data.tar.gz: 2aa04f18b9ed1b6befdd50d8568d574cff1c86b88e9dc84035b5043a1e1680a2
+  metadata.gz: 71665013535983bbbb262a5e9fd63b1418f67026361e2660fbe3c5f4c2ccea1a
+  data.tar.gz: a343b17a0932ac52611e4861419b243c188e410d07a8502a8acab75e029ff42f
 SHA512:
-  metadata.gz: 7bdfd5454a5ab5591e8a656b63b40192b03d9389dd4388279b317dbedd3bd933730736996d3aef33f0c36bbff7234d23265a9e63065f841fcb8318afccb2d7fa
-  data.tar.gz: 0e09ff8694c3c0166393a0e73893b37da44fe33ef54a8c0028e3150de55d7b107277b78d89a5d8a2b17d0f9a3e8cc7a545353533398bdf7a8d3b884279606d84
+  metadata.gz: 7a91954d5fef65f3f118f85a45ab2c038560f6a5016a740ce0e6114d3040fa71a3148829dd0874ef4ada370d5018370cd48dbadcd506832a64e0ef384c90f2ba
+  data.tar.gz: d0c777e8b3e108bef802adfa5f68cf78017af5505ad3e39278399fc8721effc54d74c5a2263640477e39a3b8809ab6c6193897fc6e94571f656aa6a420d8d2a8

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.play17725372
 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