playbook_ui 13.32.0.pre.alpha.play1416movealiaslogic3266 → 13.32.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 6d1aed3316880a926a79a26bfcd3d52de79643bf5d3eae32fb83361cc7100910
-  data.tar.gz: b4a9a1ac34bb88bcd0832459ceaf0cb9b6e69b977b77b692dd6e8a10fd87a909
+  metadata.gz: 15c98ab4c24f31f753052d92ce96169c82221a5a1b94a6d73f26f39605507324
+  data.tar.gz: a132e4e59aafc142e919af50b3ced4622e9073e39c1e8d5183a4484a91a72e51
 SHA512:
-  metadata.gz: 963631c67377d7a3e384fd000cc6d70cf31f614a9d7899b36d897b0bb1556ad96462ccb2a0d1545292fc79701ab98f245f9626d954c0a7564a0775637448c632
-  data.tar.gz: 25f0696a7caae4ad9e1cc22103b976b9c1498badb5b065ffc71c9f32cd0bd177c22679fbbb398a405ee776bcdb64c4ebcb014b0dc0e3d506981fa90d4b9175f0
+  metadata.gz: 51ae3a858325d45b791b217debbff7ac11d9304ced1606a1f037af3329345d293582583ef31c9298143f5e5befa1ff203a90e6a751f127f5ab600eb363c54146
+  data.tar.gz: c154c881d29dcccecdcfd90638eb619b48747fd2f172f3b136c9ba30686e8bd7e726e6265b06e65e4348df5a9f8d1f6e1d98d79fcfcac334721fd2d9703c6fb9

data/app/pb_kits/playbook/pb_icon/_icon.tsx

@@ -3,6 +3,7 @@ import classnames from 'classnames'
 import { buildAriaProps, buildDataProps, buildHtmlProps } from '../utilities/props'
 import { GlobalProps, globalProps } from '../utilities/globalProps'
 import { isValidEmoji } from '../utilities/validEmojiChecker'
+import aliasesJson from './icon_aliases.json'
 
 export type IconSizes = "lg"
 | "xs"
@@ -40,6 +41,19 @@ type IconProps = {
   spin?: boolean,
 } & GlobalProps
 
+type AliasType = string | string[];
+
+interface Aliases {
+  [key: string]: AliasType;
+}
+
+interface AliasesJson {
+  aliases: Aliases;
+}
+
+const aliases: AliasesJson = aliasesJson;
+
+
 const flipMap = {
   horizontal: 'fa-flip-horizontal',
   vertical: 'fa-flip-vertical',
@@ -52,6 +66,22 @@ declare global {
   var PB_ICONS: {[key: string]: React.FunctionComponent<any>}
 }
 
+// Resolve alias function
+const resolveAlias = (icon: string): string => {
+  const alias = aliases.aliases[icon];
+
+  if (alias) {
+    if (Array.isArray(alias)) {
+      return alias[0];
+    } else {
+      return alias;
+    }
+  }
+
+  return icon;
+};
+
+
 const Icon = (props: IconProps) => {
   const {
     aria = {},
@@ -74,7 +104,8 @@ const Icon = (props: IconProps) => {
     spin = false,
   } = props
 
-  let iconElement: ReactSVGElement | null = typeof(icon) === "object" ? icon : null
+  const resolvedIcon = resolveAlias(icon as string)
+  let iconElement: ReactSVGElement | null = typeof(resolvedIcon) === "object" ? resolvedIcon : null
 
   const faClasses = {
     'fa-border': border,
@@ -90,12 +121,12 @@ const Icon = (props: IconProps) => {
 
   if (!customIcon && !iconElement) {
     const PowerIcon: React.FunctionComponent<any> | undefined =
-      window.PB_ICONS ? window.PB_ICONS[icon as string] : null
+      window.PB_ICONS ? window.PB_ICONS[resolvedIcon as string] : null
 
     if (PowerIcon) {
       iconElement = <PowerIcon /> as ReactSVGElement
     } else {
-      faClasses[`fa-${icon}`] = icon as string
+      faClasses[`fa-${resolvedIcon}`] = resolvedIcon as string
     }
   }
 
@@ -115,7 +146,7 @@ const Icon = (props: IconProps) => {
     className
   )
 
-  aria.label ? null : aria.label = `${icon} icon`
+  aria.label ? null : aria.label = `${resolvedIcon} icon`
   const ariaProps: {[key: string]: any} = buildAriaProps(aria)
   const dataProps: {[key: string]: any} = buildDataProps(data)
   const htmlProps = buildHtmlProps(htmlOptions)
@@ -137,7 +168,7 @@ const Icon = (props: IconProps) => {
           }
         </>
       )
-    else if (isValidEmoji(icon as string))
+    else if (isValidEmoji(resolvedIcon as string))
       return (
         <>
           <span
@@ -146,7 +177,7 @@ const Icon = (props: IconProps) => {
               className={classesEmoji}
               id={id}
           >
-            {icon}
+            {resolvedIcon}
           </span>
         </>
       )

data/app/pb_kits/playbook/pb_icon/icon.rb

@@ -39,6 +39,8 @@ module Playbook
       prop :spin, type: Playbook::Props::Boolean,
                   default: false
 
+      ALIASES = JSON.parse(File.read(Playbook::Engine.root.join("app/pb_kits/playbook/pb_icon/icon_aliases.json")))["aliases"].freeze
+
       def valid_emoji?
         emoji_regex = /\p{Emoji}/
         emoji_regex.match?(icon)
@@ -80,14 +82,6 @@ module Playbook
         )
       end
 
-      def icon_alias_map
-        return unless Rails.application.config.respond_to?(:icon_alias_path)
-
-        base_path = Rails.application.config.icon_alias_path
-        json = File.read(Rails.root.join(base_path))
-        JSON.parse(json)["aliases"].freeze
-      end
-
       def asset_path
         return unless Rails.application.config.respond_to?(:icon_path)
 
@@ -117,9 +111,7 @@ module Playbook
     private
 
       def resolve_alias(icon)
-        return icon unless icon_alias_map
-
-        aliases = icon_alias_map[icon]
+        aliases = ALIASES[icon]
         return icon unless aliases
 
         if aliases.is_a?(Array)

data/app/pb_kits/playbook/pb_icon/icon_aliases.json

@@ -0,0 +1,39 @@
+{
+    "aliases": {
+      "arrow-alt-circle-right": "circle-right",
+      "angles-down": "angle-double-down",
+      "arrow-alt-down": "down",
+      "arrow-alt-up": "up",
+      "arrow-right-long": "long-arrow-right",
+      "arrow-to-bottom": "arrow-down-to-line",
+      "arrows-h": "arrows-left-right",
+      "calendar-days": "calendar-alt",
+      "circle-arrow-right": "arrow-circle-right",
+      "clock-rotate-left": "history",
+      "close": [
+        "times",
+        "xmark"
+      ],
+      "ellipsis-h": "ellipsis",
+      "exclamation-circle": "circle-exclamation",
+      "external-link": "arrow-up-right-from-square",
+      "file-lines": "file-alt",
+      "gear": "cog",
+      "home": "house",
+      "info-circle": "circle-info",
+      "map-o": "map",
+      "message": "comment-alt",
+      "minus-circle": "circle-minus",
+      "money": "money-bill",
+      "mouse-pointer": "arrow-pointer",
+      "nitro": "nitro-n",
+      "play-circle": "circle-play",
+      "plus-circle": "circle-plus",
+      "plus-square": "square-plus",
+      "powergon": "powergon-p",
+      "question-circle": "circle-question",
+      "roofing": "product-roofing",
+      "shelves": "inventory",
+      "th-list": "table-list"
+    }
+  }

data/dist/menu.yml

@@ -427,7 +427,7 @@ kits:
   - name: draggable
     platforms: *2
     description:
-    status: stable
+    status: beta
 - category: message_text_patterns
   description:
   components: