RubyGems - playbook_ui - Versions diffs - 14.20.0.pre.alpha.revert4637revert4621PLAY2033atactionbarrails7855 → 14.20.0.pre.rc.0 - Mend

playbook_ui 14.20.0.pre.alpha.revert4637revert4621PLAY2033atactionbarrails7855 → 14.20.0.pre.rc.0

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.

Files changed (115) hide show

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_custom_options.html.erb DELETED Viewed

@@ -1,50 +0,0 @@
-<%
-  options = [
-    {
-      label: "United States",
-      value: "United States",
-      areaCode: "+1",
-      icon: "🇺🇸",
-      id: "us"
-    },
-    {
-      label: "Canada",
-      value: "Canada",
-      areaCode: "+1",
-      icon: "🇨🇦",
-      id: "ca"
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-      areaCode: "+92",
-      icon: "🇵🇰",
-      id: "pk"
-    }
-  ]
-%>
-<%= pb_rails("dropdown", props: { options: options, multi_select: true }) do %>
-    <%= pb_rails("dropdown/dropdown_trigger", props:{ multi_select: true }) %>
-    <%= pb_rails("dropdown/dropdown_container") do %>
-        <% options.each do |option| %>
-            <%= pb_rails("dropdown/dropdown_option", props: {option: option}) do %>
-              <%= pb_rails("flex", props: {
-                align: "center",
-                justify: "between",
-                }) do %>
-                  <%= pb_rails("flex/flex_item") do %>
-                      <%= pb_rails("flex") do %>
-                          <%= pb_rails("icon", props: {icon: option[:icon]}) %>
-                          <%= pb_rails("body", props: {text: option[:label], padding_left:"xs"}) %>
-                      <% end %>
-                  <% end %>
-                  <%= pb_rails("flex/flex_item") do %>
-                      <%= pb_rails("body", props: {color:"light", text: option[:areaCode]}) %>
-                  <% end %>
-                <% end %>
-            <% end %>
-        <% end %>
-    <% end %>
-<% end %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_custom_options.jsx DELETED Viewed

@@ -1,105 +0,0 @@
-import React from 'react'
-import Dropdown from '../../pb_dropdown/_dropdown'
-import Body from '../../pb_body/_body'
-import Flex from '../../pb_flex/_flex'
-import FlexItem from '../../pb_flex/_flex_item'
-import Icon from '../../pb_icon/_icon'
-const DropdownMultiSelectWithCustomOptions = (props) => {
- const options = [
-    {
-      label: "United States",
-      value: "United States",
-      areaCode: "+1",
-      icon: "🇺🇸",
-      id: "United-states"
-    },
-    {
-      label: "Canada",
-      value: "Canada",
-      areaCode: "+1",
-      icon: "🇨🇦",
-      id: "canada"
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-      areaCode: "+92",
-      icon: "🇵🇰",
-      id: "pakistan"
-    },
-    {
-      label: "India",
-      value: "India",
-      areaCode: "+91",
-      icon: "🇮🇳",
-      id: "india"
-    },
-    {
-      label: "Australia",
-      value: "Australia",
-      areaCode: "+61",
-      icon: "🇦🇺",
-      id: "australia"
-    },
-    {
-      label: "New Zealand",
-      value: "New Zealand",
-      areaCode: "+64",
-      icon: "🇳🇿",
-      id: "new-zealand"
-    },
-    {
-      label: "Italy",
-      value: "Italy",
-      areaCode: "+39",
-      icon: "🇮🇹",
-      id: "italy"
-    },
-    {
-      label: "Spain",
-      value: "Spain",
-      areaCode: "+34",
-      icon: "🇪🇸",
-      id: "spain"
-    }
-  ];
-  return (
-  <div>
-    <Dropdown
-        multiSelect
-        options={options}
-        {...props}
-    >
-    {options.map((option) => (
-          <Dropdown.Option key={option.id}
-              option={option}
-          >
-            <Flex
-                align="center"
-                justify="between"
-            >
-              <FlexItem>
-                <Flex>
-                  <Icon icon={option.icon}
-                      paddingRight="xs"
-                  />
-                  <Body text={option.label} />
-                </Flex>
-              </FlexItem>
-              <FlexItem>
-                <Body color="light"
-                    text={option.areaCode}
-                />
-              </FlexItem>
-            </Flex>
-          </Dropdown.Option>
-        ))}
-    </Dropdown>
-  </div>
-  )
-}
-export default DropdownMultiSelectWithCustomOptions

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_default.html.erb DELETED Viewed

@@ -1,22 +0,0 @@
-<%
-  options = [
-    { label: 'United States', value: 'United States', id: 'us' },
-    { label: 'Canada', value: 'Canada', id: 'ca' },
-    { label: 'Pakistan', value: 'Pakistan', id: 'pk' },
-    { label: 'India', value: 'India', id: 'in' },
-    { label: 'United Kingdom', value: 'United Kingdom', id: 'uk' },
-    { label: 'Australia', value: 'Australia', id: 'au' },
-    { label: 'New Zealand', value: 'New Zealand', id: 'nz' },
-    { label: 'Germany', value: 'Germany', id: 'de' },
-    { label: 'France', value: 'France', id: 'fr' },
-    { label: 'Italy', value: 'Italy', id: 'it' },
-  ]
-%>
-<%
-default_value = [
-  { label: 'United States', value: 'United States', id: 'us' },
-  { label: 'Canada', value: 'Canada', id: 'ca' },
-]
- %>
-<%= pb_rails("dropdown", props: {options: options, multi_select: true, default_value: default_value}) %>

data/app/pb_kits/playbook/pb_dropdown/docs/_dropdown_multi_select_with_default.jsx DELETED Viewed

@@ -1,67 +0,0 @@
-import React from "react";
-import Dropdown from "../../pb_dropdown/_dropdown";
-const DropdownMultiSelectWithDefault = (props) => {
-  const options = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-      label: "United Kingdom",
-      value: "United Kingdom",
-    },
-    {
-      label: "Canada",
-      value: "Canada",
-    },
-    {
-      label: "Pakistan",
-      value: "Pakistan",
-    },
-    {
-      label: "India",
-      value: "India",
-    },
-    {
-      label: "Australia",
-      value: "Australia",
-    },
-    {
-      label: "New Zealand",
-      value: "New Zealand",
-    },
-    {
-      label: "Italy",
-      value: "Italy",
-    },
-    {
-      label: "Spain",
-      value: "Spain",
-    },
-  ];
-  const defaultSelectedOptions = [
-    {
-      label: "United States",
-      value: "United States",
-    },
-    {
-      label: "Italy",
-      value: "Italy",
-    },
-  ];
-  return (
-    <div>
-      <Dropdown
-          defaultValue={defaultSelectedOptions}
-          multiSelect
-          options={options}
-          {...props}
-      />
-    </div>
-  );
-};
-export default DropdownMultiSelectWithDefault;

data/app/pb_kits/playbook/pb_dropdown/subcomponents/MultiSelectTriggerDisplay.tsx DELETED Viewed

@@ -1,58 +0,0 @@
-import React, { useContext } from "react";
-import FormPill from "../../pb_form_pill/_form_pill";
-import Flex from "../../pb_flex/_flex";
-import Body from "../../pb_body/_body";
-import { GenericObject } from "../../types";
-import DropdownContext
- from "../context";
-type MultiSelectTriggerDisplayProps = {
-  autocomplete?: boolean;
-  selected: GenericObject[];
-  placeholder?: string;
-  dark?: boolean;
-};
-const MultiSelectTriggerDisplay = ({
-  autocomplete,
-  selected,
-  placeholder,
-  dark = false,
-}: MultiSelectTriggerDisplayProps) => {
-  const { setSelected, onSelect, formPillProps } = useContext(DropdownContext);
-  if (selected.length === 0) {
-    if (autocomplete) return null;
-    return (
-    <Body dark={dark}
-        text={placeholder ? placeholder : "Select..."}
-    />
-    )
-  }
- const handleRemoveIconClick = (option: GenericObject) => {
-  setSelected((prev: GenericObject[]) => {
-      const next = prev.filter((item) => item.label !== option.label);
-      onSelect && onSelect(next);
-      return next;
-    });
- }
-  return (
-    <Flex wrap>
-      {selected.map((option, i) => (
-          <FormPill
-              dark={dark}
-              key={i}
-              marginRight="xs"
-              onClick={(e)=>{e.stopPropagation();handleRemoveIconClick(option)}}
-              tabIndex={0}
-              text={option.label}
-              {...formPillProps}
-          />
-      ))}
-    </Flex>
-  );
-};
-export default MultiSelectTriggerDisplay;

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input.jsx DELETED Viewed

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

data/app/pb_kits/playbook/pb_typeahead/docs/_typeahead_preserve_input.md DELETED Viewed

	@@ -1 +0,0 @@
1	- By default, text is not preserved in the typeahead kit when you click off of the input field. You can utilize the `preserveSearchInput` prop in order to prevent text from being cleared when the field loses focus