playbook_ui_docs 16.1.0.pre.alpha.PLAY2684iconbuttonvariant14251 → 16.1.0.pre.alpha.PLAY2698timepickercleanup13920

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: e18f62273ec925c94ff02108912de2c0ecfa5e8b4b76e44b6896cad278150d34
-  data.tar.gz: f5888f9e954ee60ac3046594b4c9e52999522a89a7c6e0b78dbb09b9b748c10a
+  metadata.gz: a13f98cd64f9eb9cf99992c41fa014c47e98140d8512f4bd571f0084b49cd37c
+  data.tar.gz: 017a19372a90f59e849659e9135d55cc38c0d89e32f5b13c2e5627451d5e7489
 SHA512:
-  metadata.gz: 0a3442931f98c002dc51540b8e1f39b3741670417d806f399c582e9a34011b6b43fdd9565b560503b3f52289f41586593eac4d686bcaa94c3f81583a30cabd0a
-  data.tar.gz: d27b7b8a40f4a07701970e69c517f99dbd296bb0cfc996e6a846d9e92a4842c68f3e5918971133afc385291adb1929bdb777bcf3a2b3171739c0f3be7eb316aa
+  metadata.gz: 64d1b96494bf24a1c352df452103f97dcee3168e1ad04b8c7c25b05ef8eb2b460fa0c73f3d2027549e06cca4efd2fc9a234b67b2afadd1e781dde65af8754e2e
+  data.tar.gz: b5a401599af51859a5b43d99a5b47ae79c76eb081f9e57c6e9d06c2c976efb745a3e0d9565451667f21aaf4448cd04d74fcca7bed59b8611c60d2bbf0043fe4d

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_sort.md

@@ -2,4 +2,4 @@ the `enableSorting` prop is a boolean prop set to false by default. If true, the
 
 ### sortIcon
 
-An optional prop, `sortIcon` allows you to customize your icon sets by passing it an array of any comma-separated pair of icon values. The first icon value will replace the kit's default icon when sort direction is desc, and the second value will replace the default icon when sort direction is asc. `sortIcon` also allows you to pass it a single icon as a string, in which case the icon will not toggle with the sort state. Default for this prop is `["arrow-up-wide-short", "arrow-down-short-wide"]`. All strings must be valid FA icons.
+An optional prop, `sortIcon` allows you to customize your icon sets by passing it an array of any comma-separated pair of icon values. The first icon value will replace the kit's default icon when sort direction is desc, and the second value will replace the default icon when sort direction is asc. `sortIcon` also allows you to pass it a single icon as a string, in which case the icon will not toggle with the sort state. Default for this prop is `["arrow-up-short-wide", "arrow-down-short-wide"]`. All strings must be valid FA icons.

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

@@ -78,7 +78,6 @@ examples:
   - advanced_table_column_styling: Column Styling
   - advanced_table_column_styling_column_headers: Column Styling with Multiple Headers
   - advanced_table_column_styling_background: Column Styling Background Color
-  - advanced_table_column_styling_background_custom: Column Styling Background Color (Custom)
   - advanced_table_column_styling_background_multi: Column Styling Background Color with Multiple Headers
   - advanced_table_padding_control: Padding Control using Column Styling
   - advanced_table_column_border_color: Column Group Border Color

data/app/pb_kits/playbook/pb_advanced_table/docs/index.js

@@ -47,5 +47,4 @@ export { default as AdvancedTableSortPerColumnForMultiColumn } from './_advanced
 export { default as AdvancedTablePaddingControl } from './_advanced_table_padding_control.jsx'
 export { default as AdvancedTablePaddingControlPerRow } from './_advanced_table_padding_control_per_row.jsx'
 export { default as AdvancedTableColumnStylingBackground } from './_advanced_table_column_styling_background.jsx'
-export { default as AdvancedTableColumnStylingBackgroundMulti } from './_advanced_table_column_styling_background_multi.jsx'
-export { default as AdvancedTableColumnStylingBackgroundCustom } from './_advanced_table_column_styling_background_custom.jsx'
+export { default as AdvancedTableColumnStylingBackgroundMulti } from './_advanced_table_column_styling_background_multi.jsx'

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

@@ -13,7 +13,6 @@ examples:
   - button_form: Button Form Attribute
   - button_managed_disabled: Button Toggle Disabled State
   - button_managed_disabled_helper: Button Toggle Disabled State Helper
-  - button_icon_variant: Icon Button Variant
   
   react:
   - button_default: Button Variants
@@ -28,7 +27,6 @@ examples:
   - button_size: Button Size
   - button_form: Button Form Attribute
   - button_hover: Button Hover
-  - button_icon_variant: Icon Button Variant
 
   swift:
   - button_default_swift: Button Variants

data/app/pb_kits/playbook/pb_button/docs/index.js

@@ -4,7 +4,6 @@ export { default as ButtonLink } from './_button_link.jsx'
 export { default as ButtonLoading } from './_button_loading.jsx'
 export { default as ButtonBlockContent } from './_button_block_content.jsx'
 export { default as ButtonIconOptions } from './_button_icon_options.jsx'
-export { default as ButtonIconVariant } from './_button_icon_variant.jsx'
 export { default as ButtonAccessibility } from './_button_accessibility.jsx'
 export { default as ButtonOptions } from './_button_options.jsx'
 export { default as ButtonSize } from './_button_size.jsx'

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

@@ -8,7 +8,6 @@ examples:
     - checkbox_indeterminate: Indeterminate Checkbox
     - checkbox_disabled: Disabled Checkbox
     - checkbox_form: Form and Hidden Input
-    # - checkbox_required_indicator: Required Indicator
 
   react:
   - checkbox_default: Default
@@ -18,7 +17,6 @@ examples:
   - checkbox_error: Default w/ Error
   - checkbox_indeterminate: Indeterminate Checkbox
   - checkbox_disabled: Disabled Checkbox
-  # - checkbox_required_indicator: Required Indicator
 
   swift:
     - checkbox_default_swift: Default

data/app/pb_kits/playbook/pb_checkbox/docs/index.js

@@ -5,4 +5,3 @@ export { default as CheckboxError } from './_checkbox_error.jsx'
 export { default as CheckboxChecked } from './_checkbox_checked.jsx'
 export { default as CheckboxIndeterminate } from './_checkbox_indeterminate.jsx'
 export { default as CheckboxDisabled } from './_checkbox_disabled.jsx'
-export { default as CheckboxRequiredIndicator } from './_checkbox_required_indicator.jsx'

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_custom_display_rails.html.erb

@@ -76,7 +76,7 @@
     const option   = e.detail;
     const dropdown = e.target;
 
-    const display = dropdown.querySelector("[data-dropdown-trigger-custom-display]");
+    const display = dropdown.querySelector("#dropdown_trigger_custom_display");
     if (!display) return;
 
     const nameEl = display.querySelector("#dropdown-avatar-name");

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.html.erb

@@ -1,13 +1,10 @@
-<%
+<% 
   options = [
     { label: 'United States', value: 'unitedStates', id: 'us' },
     { label: 'Canada', value: 'canada', id: 'ca' },
     { label: 'Pakistan', value: 'pakistan', id: 'pk' },
   ]
+
 %>
 
-<%= pb_rails("dropdown", props: {
-  id: "select_a_country",
-  label: "Select a Country",
-  options: options
-}) %>
+<%= pb_rails("dropdown", props: {options: options, label: "Select a Country"}) %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.jsx

@@ -25,7 +25,6 @@ const DropdownDefault = (props) => {
   return (
   <div>
     <Dropdown
-        id="select_a_country"
         label="Select a Country"
         options={options}
         {...props}

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_with_label.md

@@ -1,3 +1 @@
-The top-level Dropdown component optionally accepts any string through a `label` prop to produce a label above your trigger element. 
-
-Add an `id` to wire the label to the trigger so that clicking the label will move focus directly to the input, and open the drop-down.
+The top-level Dropdown component optionally accepts any string through a `label` prop to produce a label above your trigger element.

data/app/pb_kits/playbook/pb_form/docs/_form_with_required_indicator.html.erb

@@ -1,16 +1,14 @@
 <%= pb_form_with(scope: :example, url: "", method: :get, validate: true) do |form| %>
-  <%= form.typeahead :example_typeahead_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.text_field :example_text_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.text_field :example_text_field_2, props: { label: "Text Field Custom Label", required: true, required_indicator: true } %>
-  <%= form.phone_number_field :example_phone_number_field, props: { label: true, required: true, required_indicator: true } %>
+  <%= form.text_area :example_text_area, props: { label: true, required: true, required_indicator: true } %>
+  <%= form.text_area :example_text_area_2, props: { label: "Textarea Custom Label", required: true, required_indicator: true } %>
   <%= form.email_field :example_email_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.number_field :example_number_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.search_field :example_search_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.password_field :example_password_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.url_field :example_url_field, props: { label: true, required: true, required_indicator: true } %>
-  <%= form.text_area :example_text_area, props: { label: true, required: true, required_indicator: true } %>
-  <%= form.text_area :example_text_area_2, props: { label: "Textarea Custom Label", required: true, required_indicator: true } %>
-  <%# <%= form.check_box :example_checkbox, props: { label: true, text: "Checkbox Label", required: true, required_indicator: true } %>
+  <%= form.phone_number_field :example_phone_number_field, props: { label: true, required: true, required_indicator: true } %>
   <%= form.time_picker :example_time_picker_required_indicator, props: { label: true, required: true, required_indicator: true } %>
 
   <%= form.actions do |action| %>

data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_label.html.erb

@@ -65,7 +65,7 @@
 }] %>
 
 <%= pb_rails("multi_level_select", props: {
-  id: "select_a_department",
-  label: "Select a Department",
-  tree_data: treeData
+    id: "multi-level-select-label-rails",
+    label: "Select a department",
+    tree_data: treeData
 }) %>

data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_label.jsx

@@ -73,11 +73,14 @@ const MultiLevelSelectDefault = (props) => {
   return (
     <div>
       <MultiLevelSelect
-          id="select_a_department"
+          id='multiselect-label'
           label="Select a Department"
           onSelect={(selectedNodes) =>
-            console.log("Selected Items", selectedNodes)
-          }
+          console.log(
+            "Selected Items",
+            selectedNodes
+          )
+        }
           treeData={treeData}
           {...props}
       />
@@ -85,4 +88,4 @@ const MultiLevelSelectDefault = (props) => {
   )
 };
 
-export default MultiLevelSelectDefault;
+export default MultiLevelSelectDefault;

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

@@ -14,7 +14,6 @@ examples:
   - collapsible_nav: Collapsible Nav
   - collapsible_nav_with_all_options: Collapsible Nav With Options
   - collapsible_nav_no_icon: Collapsible Nav No Icon
-  - collapsible_nav_disabled_item: Collapsible Nav With Disabled Item
   - horizontal_nav: Horizontal Nav
   - subtle_horizontal_nav: Subtle Horizontal Nav
   - bold_horizontal_nav: Bold Horizontal Nav
@@ -43,7 +42,6 @@ examples:
   - collapsible_nav_item_spacing: Collapsible Nav With ItemSpacing
   - collapsible_nav_custom: Collapsible Nav With Custom Toggling
   - collapsible_nav_no_icon: Collapsible Nav No Icon
-  - collapsible_nav_disabled_item: Collapsible Nav With Disabled Item
   - horizontal_nav: Horizontal Nav
   - subtle_horizontal_nav: Subtle Horizontal Nav
   - bold_horizontal_nav: Bold Horizontal Nav
@@ -64,3 +62,9 @@ examples:
   - nav_horizontal_subtle_no_highlight_swift: Horizontal Subtle No Highlight
   - nav_horizontal_bold_swift: Horizontal Bold
   - nav_props_swift: ""
+
+
+
+  
+
+  

data/app/pb_kits/playbook/pb_nav/docs/index.js

@@ -22,5 +22,4 @@ export { default as CollapsibleNavItemSpacing } from "./_collapsible_nav_item_sp
 export { default as CollapsibleNavNoIcon } from "./_collapsible_nav_no_icon.jsx"
 export { default as HorizontalNavExtendedunderline } from './_horizontal_nav_extendedunderline.jsx'
 export { default as HorizontalNavDisabled } from './_horizontal_nav_disabled.jsx'
-export { default as VerticalNavDisabled } from './_vertical_nav_disabled.jsx'
-export { default as CollapsibleNavDisabledItem } from './_collapsible_nav_disabled_item.jsx'
+export { default as VerticalNavDisabled } from './_vertical_nav_disabled.jsx'

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_required_indicator.jsx

@@ -22,7 +22,6 @@ const RichTextEditorAdvancedRequiredIndicator = (props) => {
     <div>
       <RichTextEditor
           advancedEditor={editor}
-          id={"required-advanced"}
           label="Label"
           requiredIndicator
           {...props}

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_required_indicator.jsx

@@ -8,7 +8,6 @@ const RichTextEditorRequiredIndicator = (props) => {
   return (
     <div>
       <RichTextEditor
-          inputOptions = {{ id: "required" }}
           label="Label"
           onChange={handleOnChange}
           requiredIndicator

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

@@ -32,8 +32,6 @@ examples:
   - rich_text_editor_advanced_inline: Advanced (Inline)
   - rich_text_editor_advanced_height: Advanced Height
   - rich_text_editor_advanced_min_height: Advanced Min Height
-  - rich_text_editor_label: Label
-  - rich_text_editor_advanced_label: Advanced (Label)
   - rich_text_editor_required_indicator: Required Indicator
   - rich_text_editor_advanced_required_indicator: Advanced Required Indicator
   - rich_text_editor_preview: Preview

data/app/pb_kits/playbook/pb_rich_text_editor/docs/index.js

@@ -21,5 +21,3 @@ export { default as RichTextEditorAdvancedHeight } from './_rich_text_editor_adv
 export { default as RichTextEditorAdvancedMinHeight } from './_rich_text_editor_advanced_min_height.jsx'
 export { default as RichTextEditorRequiredIndicator } from './_rich_text_editor_required_indicator.jsx'
 export { default as RichTextEditorAdvancedRequiredIndicator } from './_rich_text_editor_advanced_required_indicator.jsx'
-export { default as RichTextEditorLabel } from './_rich_text_editor_label.jsx'
-export { default as RichTextEditorAdvancedLabel } from './_rich_text_editor_advanced_label.jsx'

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_default.html.erb

@@ -1,9 +1,9 @@
-<%= pb_rails("textarea", props: { label: "Label", rows: 4, id: "default-example-1" }) %>
+<%= pb_rails("textarea", props: { label: "Label", rows: 4}) %>
 
 <br/>
 
-<%= pb_rails("textarea", props: { label: "Label", placeholder: "Placeholder text", id: "default-example-2" }) %>
+<%= pb_rails("textarea", props: { label: "Label", placeholder: "Placeholder text" }) %>
 
 <br/>
 
-<%= pb_rails("textarea", props: { label: "Label", name: "comment", value: "Default value text", id: "default-example-3" }) %>
+<%= pb_rails("textarea", props: { label: "Label", name: "comment", value: "Default value text" }) %>

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_default.jsx

@@ -13,7 +13,6 @@ const TextareaDefault = (props) => {
           label="Label"
           rows={4}
           {...props}
-          id="default-example-1"
       />
 
       <br />
@@ -22,7 +21,6 @@ const TextareaDefault = (props) => {
           label="Label"
           placeholder="Placeholder text"
           {...props}
-          id="default-example-2"
       />
 
       <br />
@@ -34,7 +32,6 @@ const TextareaDefault = (props) => {
           placeholder="Placeholder text"
           value={value}
           {...props}
-          id="default-example-3"
       />
 
     </div>

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

@@ -19,7 +19,6 @@ examples:
     - typeahead_dynamic_options_pure_rails: Dynamic Options (Pure Rails)
     - typeahead_disabled: Disabled
     - typeahead_preserve_input: Preserve Search Input
-    - typeahead_required_indicator: Required Indicator
 
   react:
     - typeahead_default: Default
@@ -43,4 +42,3 @@ examples:
     - typeahead_truncated_text: Truncated Text
     - typeahead_disabled: Disabled
     - typeahead_preserve_input: Preserve Search Input
-    - typeahead_required_indicator: Required Indicator

data/app/pb_kits/playbook/pb_typeahead/docs/index.js

@@ -1,22 +1,21 @@
-export {default as TypeaheadDefault} from "./_typeahead_default.jsx"
-export {default as TypeaheadWithHighlight} from "./_typeahead_with_highlight.jsx"
-export {default as TypeaheadWithPills} from "./_typeahead_with_pills.jsx"
-export {default as TypeaheadWithPillsAsync} from "./_typeahead_with_pills_async.jsx"
-export {default as TypeaheadWithPillsAsyncUsers} from "./_typeahead_with_pills_async_users.jsx"
-export {default as TypeaheadWithPillsAsyncCustomOptions} from "./_typeahead_with_pills_async_custom_options.jsx"
-export {default as TypeaheadInline} from "./_typeahead_inline.jsx"
-export {default as TypeaheadMultiKit} from "./_typeahead_multi_kit.jsx"
-export {default as TypeaheadCreateable} from "./_typeahead_createable.jsx"
-export {default as TypeaheadAsyncCreateable} from "./_typeahead_async_createable.jsx"
-export {default as TypeaheadErrorState} from "./_typeahead_error_state.jsx"
-export {default as TypeaheadCustomMenuList} from "./_typeahead_custom_menu_list.jsx"
-export {default as TypeaheadMarginBottom} from "./_typeahead_margin_bottom.jsx"
-export {default as TypeaheadWithPillsColor} from "./_typeahead_with_pills_color.jsx"
-export {default as TypeaheadTruncatedText} from "./_typeahead_truncated_text.jsx"
-export {default as TypeaheadReactHook} from "./_typeahead_react_hook.jsx"
-export {default as TypeaheadDisabled} from "./_typeahead_disabled.jsx"
-export {default as TypeaheadPreserveInput} from "./_typeahead_preserve_input.jsx"
-export {default as TypeaheadDefaultValue} from "./_typeahead_default_value.jsx"
-export {default as TypeaheadCustomOptions} from "./_typeahead_custom_options.jsx"
-export {default as TypeaheadInputDisplay} from "./_typeahead_input_display.jsx"
-export {default as TypeaheadRequiredIndicator} from "./_typeahead_required_indicator.jsx"
+export { default as TypeaheadDefault } from './_typeahead_default.jsx'
+export { default as TypeaheadWithHighlight } from './_typeahead_with_highlight.jsx'
+export { default as TypeaheadWithPills } from './_typeahead_with_pills.jsx'
+export { default as TypeaheadWithPillsAsync } from './_typeahead_with_pills_async.jsx'
+export { default as TypeaheadWithPillsAsyncUsers } from './_typeahead_with_pills_async_users.jsx'
+export { default as TypeaheadWithPillsAsyncCustomOptions } from './_typeahead_with_pills_async_custom_options.jsx'
+export { default as TypeaheadInline } from './_typeahead_inline.jsx'
+export { default as TypeaheadMultiKit } from './_typeahead_multi_kit.jsx'
+export { default as TypeaheadCreateable } from './_typeahead_createable.jsx'
+export { default as TypeaheadAsyncCreateable } from './_typeahead_async_createable.jsx'
+export { default as TypeaheadErrorState } from './_typeahead_error_state.jsx'
+export { default as TypeaheadCustomMenuList } from './_typeahead_custom_menu_list.jsx'
+export { default as TypeaheadMarginBottom } from './_typeahead_margin_bottom.jsx'
+export { default as TypeaheadWithPillsColor } from './_typeahead_with_pills_color.jsx'
+export { default as TypeaheadTruncatedText } from './_typeahead_truncated_text.jsx'
+export { default as TypeaheadReactHook } from './_typeahead_react_hook.jsx'
+export { default as TypeaheadDisabled } from './_typeahead_disabled.jsx'
+export { default as TypeaheadPreserveInput } from './_typeahead_preserve_input.jsx'
+export { default as TypeaheadDefaultValue } from './_typeahead_default_value.jsx'
+export { default as TypeaheadCustomOptions } from './_typeahead_custom_options.jsx'
+export { default as TypeaheadInputDisplay } from './_typeahead_input_display.jsx'

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: playbook_ui_docs
 version: !ruby/object:Gem::Version
-  version: 16.1.0.pre.alpha.PLAY2684iconbuttonvariant14251
+  version: 16.1.0.pre.alpha.PLAY2698timepickercleanup13920
 platform: ruby
 authors:
 - Power UX
@@ -9,7 +9,7 @@ authors:
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-02-09 00:00:00.000000000 Z
+date: 2026-01-28 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: playbook_ui
@@ -64,8 +64,6 @@ files:
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background.md
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_custom.jsx
-- app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_custom.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.jsx
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_multi.md
 - app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_column_headers.jsx
@@ -311,10 +309,6 @@ files:
 - app/pb_kits/playbook/pb_button/docs/_button_icon_options.jsx
 - app/pb_kits/playbook/pb_button/docs/_button_icon_options.md
 - app/pb_kits/playbook/pb_button/docs/_button_icon_options_swift.md
-- app/pb_kits/playbook/pb_button/docs/_button_icon_variant.html.erb
-- app/pb_kits/playbook/pb_button/docs/_button_icon_variant.jsx
-- app/pb_kits/playbook/pb_button/docs/_button_icon_variant_rails.md
-- app/pb_kits/playbook/pb_button/docs/_button_icon_variant_react.md
 - app/pb_kits/playbook/pb_button/docs/_button_link.html.erb
 - app/pb_kits/playbook/pb_button/docs/_button_link.jsx
 - app/pb_kits/playbook/pb_button/docs/_button_link.md
@@ -425,9 +419,6 @@ files:
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_props_swift.md
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.jsx
 - app/pb_kits/playbook/pb_checkbox/docs/_checkbox_react_hook.md
-- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_required_indicator.html.erb
-- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_required_indicator.jsx
-- app/pb_kits/playbook/pb_checkbox/docs/_checkbox_required_indicator.md
 - app/pb_kits/playbook/pb_checkbox/docs/_description.md
 - app/pb_kits/playbook/pb_checkbox/docs/example.yml
 - app/pb_kits/playbook/pb_checkbox/docs/index.js
@@ -585,7 +576,6 @@ files:
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_anti_patterns.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.jsx
-- app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.md
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.html.erb
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.jsx
 - app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default_date.md
@@ -1438,7 +1428,6 @@ files:
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_input_display.md
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_label.html.erb
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_label.jsx
-- app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_label.md
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_hook.jsx
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_react_hook.md
 - app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_reset.html.erb
@@ -1514,8 +1503,6 @@ files:
 - app/pb_kits/playbook/pb_nav/docs/_collapsible_nav.md
 - app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_custom.jsx
 - app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_custom.md
-- app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_disabled_item.html.erb
-- app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_disabled_item.jsx
 - app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_item_spacing.jsx
 - app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_item_spacing.md
 - app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_no_icon.html.erb
@@ -1942,8 +1929,6 @@ files:
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_height.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_inline.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_inline.md
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_label.jsx
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_label.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_min_height.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_min_height.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_preview.jsx
@@ -1962,8 +1947,6 @@ files:
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_focus.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_inline.html.erb
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_inline.jsx
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_label.jsx
-- app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_label.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_more_extensions.jsx
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_more_extensions.md
 - app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_preview.html.erb
@@ -2360,7 +2343,6 @@ files:
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_custom.jsx
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_default.html.erb
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_default.jsx
-- app/pb_kits/playbook/pb_textarea/docs/_textarea_default.md
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_default_swift.md
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_emoji_mask.html.erb
 - app/pb_kits/playbook/pb_textarea/docs/_textarea_emoji_mask.jsx
@@ -2627,9 +2609,6 @@ files:
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input_react.md
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.jsx
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_react_hook.md
-- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_required_indicator.html.erb
-- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_required_indicator.jsx
-- app/pb_kits/playbook/pb_typeahead/docs/_typeahead_required_indicator.md
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.html.erb
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.jsx
 - app/pb_kits/playbook/pb_typeahead/docs/_typeahead_truncated_text.md

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_custom.jsx

@@ -1,71 +0,0 @@
-import React from "react"
-import AdvancedTable from '../_advanced_table'
-import colors from '../../tokens/exports/_colors.module.scss'
-import MOCK_DATA from "./advanced_table_mock_data.json"
-import  Flex  from '../../pb_flex/_flex'
-import  Title  from '../../pb_title/_title'
-import  Body  from '../../pb_body/_body'
-
-
-const AdvancedTableColumnStylingBackgroundCustom = (props) => {
-  const columnDefinitions = [
-{
-      accessor: "year",
-      label: "Year",
-      cellAccessors: ["quarter", "month", "day"],
-      customRenderer: (row, value) => (
-        <Flex flexDirection="column">
-          <Title size={4}
-              text={value} 
-          />
-          <Body text="lorem ipsum" />
-          <Body text="lorem ipsum" />
-        </Flex>
-      ), 
-    },
-    {
-      accessor: "newEnrollments",
-      label: "New Enrollments",
-      columnStyling:{
-        cellBackgroundColor: (row) => row.original.newEnrollments > 15 ? colors.success_subtle : colors.error_subtle,
-        fontColor: (row) => row.original.newEnrollments > 15 ? colors.success : colors.error,
-      },
-    },
-    {
-      accessor: "scheduledMeetings",
-      label: "Scheduled Meetings",
-      columnStyling:{
-        cellBackgroundColor: (row) => row.original.scheduledMeetings >= 15 ? colors.info_subtle : colors.warning_subtle
-      },
-    },
-    {
-      accessor: "attendanceRate",
-      label: "Attendance Rate",
-      columnStyling:{cellBackgroundColor: colors.info, headerBackgroundColor: colors.info, fontColor: colors.white, headerFontColor: colors.white},
-    },
-    {
-      accessor: "completedClasses",
-      label: "Completed Classes",
-    },
-    {
-      accessor: "classCompletionRate",
-      label: "Class Completion Rate",
-    },
-    {
-      accessor: "graduatedStudents",
-      label: "Graduated Students",
-    },
-  ]
-
-  return (
-    <div>
-      <AdvancedTable
-          columnDefinitions={columnDefinitions}
-          tableData={MOCK_DATA}
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default AdvancedTableColumnStylingBackgroundCustom

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_styling_background_custom.md

@@ -1,4 +0,0 @@
-`cellBackgroundColor` and `fontColor` can also accept functions for conditional styling based on row data. The function receives the row object and returns a color value.
-
-See the code snippet below for more details.
-

data/app/pb_kits/playbook/pb_button/docs/_button_icon_variant.html.erb

@@ -1,21 +0,0 @@
-<%= pb_rails("caption", props: { margin_y: "md", text: "Small Size (sm)" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "sm", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "sm", variant: "secondary", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "sm", variant: "link", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "sm", variant: "danger", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "sm", disabled: true, margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "sm", loading: true, margin_right: "lg" }) %>
-<%= pb_rails("caption", props: { margin_y: "md", text: "Medium Size (md)" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "md", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "md", variant: "secondary", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "md", variant: "link", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "md", variant: "danger", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "md", disabled: true, margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "md", loading: true, margin_right: "lg" }) %>
-<%= pb_rails("caption", props: { margin_y: "md", text: "Large Size (lg)" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "lg", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "lg", variant: "secondary", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "lg", variant: "link", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "lg", variant: "danger", margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "lg", disabled: true, margin_right: "lg" }) %>
-<%= pb_rails("button", props: { icon: "plus", size: "lg", loading: true, margin_right: "lg" }) %>

data/app/pb_kits/playbook/pb_button/docs/_button_icon_variant.jsx

@@ -1,180 +0,0 @@
-import React from 'react'
-import Button from "../../pb_button/_button"
-import Caption from "../../pb_caption/_caption"
-
-const ButtonIconVariant = (props) => (
-  <div>
-    <Caption 
-        marginY="md" 
-        text="Small Size (sm)" 
-    />
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="sm"
-        tabIndex={0}
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="sm"
-        tabIndex={0}
-        variant="secondary"
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="sm"
-        tabIndex={0}
-        variant="link"
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="sm"
-        tabIndex={0}
-        variant="danger"
-        {...props}
-    />
-    {' '}
-    <Button
-        disabled
-        icon="plus"
-        marginRight='lg'
-        size="sm"
-        tabIndex={0}
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        loading
-        marginRight='lg'
-        size="sm"
-        tabIndex={0}
-        {...props}
-    />
-    <br/>
-    <Caption 
-        marginY="md" 
-        text="Medium Size (md)" 
-    />
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="md"
-        tabIndex={0}
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="md"
-        tabIndex={0}
-        variant="secondary"
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="md"
-        tabIndex={0}
-        variant="link"
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="md"
-        tabIndex={0}
-        variant="danger"
-        {...props}
-    />
-    {' '}
-    <Button
-        disabled
-        icon="plus"
-        marginRight='lg'
-        size="md"
-        tabIndex={0}
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        loading
-        marginRight='lg'
-        size="md"
-        tabIndex={0}
-        {...props}
-    />
-    <br/>
-    <Caption 
-        marginY="md" 
-        text="Large Size (lg)" 
-    />
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="lg"
-        tabIndex={0}
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="lg"
-        tabIndex={0}
-        variant="secondary"
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="lg"
-        tabIndex={0}
-        variant="link"
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        marginRight='lg'
-        size="lg"
-        tabIndex={0}
-        variant="danger"
-        {...props}
-    />
-    {' '}
-    <Button
-        disabled
-        icon="plus"
-        marginRight='lg'
-        size="lg"
-        tabIndex={0}
-        {...props}
-    />
-    {' '}
-    <Button
-        icon="plus"
-        loading
-        marginRight='lg'
-        size="lg"
-        tabIndex={0}
-        {...props}
-    />
-  </div>
-)
-
-export default ButtonIconVariant

data/app/pb_kits/playbook/pb_button/docs/_button_icon_variant_rails.md

@@ -1 +0,0 @@
-The icon button variant automatically renders when you provide an `icon` prop without a corresponding `text` prop. The button will only display an icon (no text) and will be wrapped with the icon button styling. This works with all button variants including "link", "primary", "secondary", etc. Simply use `<%= pb_rails("button", props: { icon: "plus", variant: "secondary" }) %>` to get an icon button.

data/app/pb_kits/playbook/pb_button/docs/_button_icon_variant_react.md

@@ -1 +0,0 @@
-The icon button variant automatically renders when you provide an `icon` prop without a corresponding `text` prop. The button will only display an icon (no text) and will be wrapped with the icon button styling. This works with all button variants including "link", "primary", "secondary", etc. Simply use `<Button icon="rocket" variant="primary" />` to get an icon button.

data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_required_indicator.html.erb

@@ -1,6 +0,0 @@
-<%= pb_rails("checkbox" , props: {
-  required_indicator: true,
-  text: "Checkbox Label",
-  value: "checkbox-value",
-  name: "checkbox-name"
-}) %>

data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_required_indicator.jsx

@@ -1,17 +0,0 @@
-import React from 'react'
-import Checkbox from '../_checkbox'
-
-const CheckboxRequiredIndicator = () => {
-  return (
-    <div>
-      <Checkbox
-          name="checkbox-name"
-          requiredIndicator
-          text="Checkbox label"
-          value="check-box value"
-      />
-    </div>
-  )
-}
-
-export default CheckboxRequiredIndicator

data/app/pb_kits/playbook/pb_checkbox/docs/_checkbox_required_indicator.md

@@ -1,3 +0,0 @@
-The `requiredIndicator`/`required_indicator` prop displays a red asterisk (*) next to the label, visually indicating that the field is required. This is purely visual and does not enforce validation. 
-
-You can use `requiredIndicator`/`required_indicator` with any validation approach: HTML5 validation via the `required` prop, client-side validation, or backend validation. For this reason, it works independently and doesn't need to be paired with the `required` prop. 

data/app/pb_kits/playbook/pb_date_picker/docs/_date_picker_default.md

@@ -1 +0,0 @@
-`pickerId`/`picker_id` is a **required prop** to instantiate the Date Picker. The presence of `pickerId`/`picker_id` in your Date Picker also associates the label with the input, providing the ability to focus the Date Picker by clicking the label.

data/app/pb_kits/playbook/pb_multi_level_select/docs/_multi_level_select_label.md

@@ -1,3 +0,0 @@
-The MultiLevelSelect component optionally accepts a `label` prop to produce a label above the input. 
-
-Add an `id` to wire the label to the input so that clicking the label will move focus directly to the input, and open the drop-down.

data/app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_disabled_item.html.erb

@@ -1,24 +0,0 @@
- <%= pb_rails("nav", props: { variant: "bold" }) do %>
-    <%= pb_rails("nav/item", props: { text: "Overview", link: "#", collapsible: true, icon_left:"city", disabled: true }) do %>
-        <%= pb_rails("nav", props: { variant: "bold" }) do %>
-            <%= pb_rails("nav/item", props: { text: "City", link: "#" }) %>
-            <%= pb_rails("nav/item", props: { text: "People", link: "#" }) %>
-            <%= pb_rails("nav/item", props: { text: "Business", link: "#" }) %>
-        <% end %>
-    <% end %>
-    <%= pb_rails("nav/item", props: { text: "Albums", link: "#", active: true, collapsible: true, icon_left: "theater-masks" }) do %>
-        <%= pb_rails("nav", props: { variant: "bold" }) do %>
-            <%= pb_rails("nav/item", props: { text: "Entertainment", link: "#" }) %>
-            <%= pb_rails("nav/item", props: { text: "Food", link: "#" }) %>
-            <%= pb_rails("nav/item", props: { text: "Style", link: "#" }) %>
-        <% end %>
-    <% end %>
-    <%= pb_rails("nav/item", props: { text: "Similar Artists", link: "#", collapsible: true, icon_left: "city" }) do %>
-        <%= pb_rails("nav", props: { variant: "bold" }) do %>
-            <%= pb_rails("nav/item", props: { text: "City", link: "#", disabled: true }) %>
-            <%= pb_rails("nav/item", props: { text: "People", link: "#" }) %>
-            <%= pb_rails("nav/item", props: { text: "Business", link: "#" }) %>
-        <% end %>
-    <% end %>
-  <% end %>
-  

data/app/pb_kits/playbook/pb_nav/docs/_collapsible_nav_disabled_item.jsx

@@ -1,87 +0,0 @@
-import React from "react";
-import Nav from '../../pb_nav/_nav'
-import NavItem from '../../pb_nav/_item'
-
-const CollapsibleNavDisabledItem = (props) => {
-  return (
-    <Nav 
-        variant="bold"
-        {...props}
-    >
-      <NavItem
-          collapsed={false}
-          collapsible
-          disabled
-          iconLeft="city" 
-          link="#" 
-          text="Overview" 
-          {...props}
-      >
-        <NavItem
-            link="#" 
-            text="City"
-            {...props}
-        />
-        <NavItem
-            link="#"
-            text="People"
-            {...props}
-        />
-        <NavItem 
-            link="#" 
-            text="Business" 
-            {...props}
-        />
-      </NavItem>
-      <NavItem 
-          collapsible 
-          iconLeft="theater-masks"
-          link="#" 
-          text="Albums" 
-          {...props}
-      >
-        <NavItem 
-            disabled
-            link="#" 
-            text="Entertainment" 
-            {...props}
-        />
-        <NavItem 
-            link="#" 
-            text="Food" 
-            {...props}
-        />
-        <NavItem 
-            link="#" 
-            text="Style" 
-            {...props}
-        />
-      </NavItem>
-      <NavItem 
-          collapsible 
-          iconLeft="city" 
-          link="#" 
-          text="Similar Artists" 
-          {...props}
-      >
-        <NavItem 
-            link="#" 
-            text="City"
-            {...props} 
-        />
-        <NavItem
-            link="#"
-            text="People"
-            {...props}
-        />
-        <NavItem 
-            link="#" 
-            text="Business" 
-            {...props}
-        />
-      </NavItem>
-    </Nav>
-  );
-};
-
-export default  CollapsibleNavDisabledItem

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_label.jsx

@@ -1,44 +0,0 @@
-import React from 'react'
-import RichTextEditor from '../../pb_rich_text_editor/_rich_text_editor'
-import { useEditor, EditorContent } from "@tiptap/react"
-import StarterKit from "@tiptap/starter-kit"
-import Link from '@tiptap/extension-link'
-
-
-const RichTextEditorAdvancedLabel = (props) => {
-
-    const editor = useEditor({
-      extensions: [StarterKit, Link],
-      content: "Add your text here. You can format your text, add links, quotes, and bullets.",
-    })
-
-    const editorNoLabel = useEditor({
-      extensions: [StarterKit, Link],
-      content: "Add your text here. You can format your text, add links, quotes, and bullets.",
-    })
-
-    if (!editor || !editorNoLabel) return null
-
-  return (
-    <div>
-      <RichTextEditor
-          advancedEditor={editor}
-          id={"advanced-example"}
-          label="Advanced Example Label"
-          {...props}
-      >
-        <EditorContent editor={editor}/>
-      </RichTextEditor>
-      <br/>
-      <RichTextEditor
-          advancedEditor={editorNoLabel}
-          label="Advanced Example Label No ID"
-          {...props}
-      >
-        <EditorContent editor={editorNoLabel}/>
-      </RichTextEditor>
-    </div>
-  )
-}
-
-export default RichTextEditorAdvancedLabel

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_advanced_label.md

@@ -1 +0,0 @@
-The optional `label` prop adds a visible label to the advanced editor. Passing in the `id` prop associates the `label` with the editor for accessibility, enabling screen reader support and label-based focus behavior.

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_label.jsx

@@ -1,28 +0,0 @@
-import React, { useState } from 'react'
-import RichTextEditor from '../../pb_rich_text_editor/_rich_text_editor'
-
-const RichTextEditorLabel = (props) => {
-  const [value, setValue] = useState(''),
-  handleOnChange = (html) => setValue(html)
-
-  return (
-    <div>
-      <RichTextEditor
-          id="example"
-          label="Example Label"
-          onChange={handleOnChange}
-          value={value}
-          {...props}
-      />
-      <br/>
-      <RichTextEditor
-          label="Example Label No ID"
-          onChange={handleOnChange}
-          value={value}
-          {...props}
-      />
-    </div>
-  )
-}
-
-export default RichTextEditorLabel

data/app/pb_kits/playbook/pb_rich_text_editor/docs/_rich_text_editor_label.md

@@ -1 +0,0 @@
-The optional `label` prop adds a visible label to the editor. Passing in the `id` prop associates the `label` with the editor for accessibility, enabling screen reader support and label-based focus behavior.

data/app/pb_kits/playbook/pb_textarea/docs/_textarea_default.md

@@ -1 +0,0 @@
-Add an `id` to your Textarea so that clicking the label will move focus directly to the input.

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_required_indicator.html.erb

@@ -1,16 +0,0 @@
-<% 
-  options = [
-    { label: 'Orange', value: '#FFA500' },
-    { label: 'Red', value: '#FF0000' },
-    { label: 'Green', value: '#00FF00' },
-    { label: 'Blue', value: '#0000FF' },
-  ]
-%>
-
-<%= pb_rails("typeahead", props: {
-    id: "typeahead-required-indicator",
-    is_multi: false,
-    label: "Colors",
-    options: options,
-    required_indicator: true,
-}) %>

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_required_indicator.jsx

@@ -1,23 +0,0 @@
-import React from "react"
-import Typeahead from "../../pb_typeahead/_typeahead"
-
-const options = [
-  {label: "Orange", value: "#FFA500"},
-  {label: "Red", value: "#FF0000"},
-  {label: "Green", value: "#00FF00"},
-  {label: "Blue", value: "#0000FF"},
-]
-
-const TypeaheadRequiredIndicator = (props) => {
-  return (
-    <Typeahead
-        id="typeahead_required_indicator"
-        label="Colors"
-        options={options}
-        requiredIndicator
-        {...props}
-    />
-  )
-}
-
-export default TypeaheadRequiredIndicator

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_required_indicator.md

@@ -1,3 +0,0 @@
-The `requiredIndicator`/`required_indicator` prop displays a red asterisk (*) next to the label, visually indicating that the field is required. This is purely visual and does not enforce validation. 
-
-You can use `requiredIndicator`/`required_indicator` with any validation approach: HTML5 validation via the `required` prop, client-side validation, or backend validation. For this reason, it works independently and doesn't need to be paired with the `required` prop.