added (literal) indicator to documented props that are literals

src/base/__docs__/generic.docs.mdx

@@ -85,7 +85,7 @@ Here is an example of rendering as a `<Notification>` component, and passing thr
     },
     pull: {
       description: "moves an element to the left or right",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(DEFAULTS.floatPulledAlignments),
     },
   }}
@@ -119,7 +119,7 @@ Here is an example of rendering as a `<Notification>` component, and passing thr
   props={{
     backgroundColor: {
       description: "sets the background color",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable([...DEFAULTS.colors, ...DEFAULTS.shades]),
     },
     italic: {
@@ -128,27 +128,27 @@ Here is an example of rendering as a `<Notification>` component, and passing thr
     },
     textAlign: {
       description: "sets the alignment of the text",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(DEFAULTS.textAlignments),
     },
     textColor: {
       description: "sets the text color",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable([...DEFAULTS.colors, ...DEFAULTS.shades]),
     },
     textSize: {
       description: "sets the text size",
-      typeName: "string",
+      typeName: "number (literal)",
       typeTip: mapEnumerable(DEFAULTS.textSizes),
     },
     textTransform: {
       description: "alters the text capitalization",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(DEFAULTS.textSizes),
     },
     textWeight: {
       description: "sets the text weight",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(DEFAULTS.textWeights),
     },
   }}

src/components/breadcrumb/__docs__/breadcrumb.docs.mdx

@@ -8,15 +8,15 @@ import {
   faBook,
   faHome,
   faPuzzlePiece,
-  faThumbsUp
+  faThumbsUp,
 } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { Playground } from "docz";
 
 import {
   ForwardRefAsExoticComponentDoc,
   OptionBlock,
-  mapEnumerable
+  mapEnumerable,
 } from "src/__docs__/components";
 import { DEFAULTS } from "src/base/helpers/variables";
 import { Block, Title, Icon } from "src/elements";
@@ -154,19 +154,19 @@ Use the `size` prop on `<Breadcrumb>` to specify the size of the breadcrumbs.
   props={{
     align: {
       description: "set the breadcrumb group's alignment",
-      typeName: "string",
-      typeTip: mapEnumerable(BREADCRUMB_DEFAULTS.alignments)
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(BREADCRUMB_DEFAULTS.alignments),
     },
     separator: {
       description: "set the breadcrumb group's separator",
-      typeName: "string",
-      typeTip: mapEnumerable(BREADCRUMB_DEFAULTS.separators)
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(BREADCRUMB_DEFAULTS.separators),
     },
     size: {
       description: "set the breadcrumb group's size",
-      typeName: "string",
-      typeTip: mapEnumerable(BREADCRUMB_DEFAULTS.sizes)
-    }
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(BREADCRUMB_DEFAULTS.sizes),
+    },
   }}
 />
 
@@ -176,7 +176,7 @@ Use the `size` prop on `<Breadcrumb>` to specify the size of the breadcrumbs.
   props={{
     active: {
       description: "marks the breadcrumb as active",
-      typeName: "boolean"
-    }
+      typeName: "boolean",
+    },
   }}
 />

src/components/card/__docs__/card.docs.mdx

@@ -10,7 +10,7 @@ import { Playground } from "docz";
 
 import {
   ForwardRefAsExoticComponentDoc,
-  mapEnumerable
+  mapEnumerable,
 } from "src/__docs__/components";
 import { DEFAULTS } from "src/base/helpers/variables";
 import { Media } from "src/components";
@@ -198,9 +198,9 @@ An all-around flexible and composable component.
   props={{
     align: {
       description: "set the alignment of the title",
-      typeName: "string",
-      typeTip: mapEnumerable(CARD_HEADER_TITLE_DEFAULTS.alignments)
-    }
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(CARD_HEADER_TITLE_DEFAULTS.alignments),
+    },
   }}
 />
 

src/components/dropdown/__docs__/dropdown.docs.mdx

@@ -10,7 +10,7 @@ import { Playground } from "docz";
 
 import {
   ForwardRefAsExoticComponentDoc,
-  mapEnumerable
+  mapEnumerable,
 } from "src/__docs__/components";
 import { DEFAULTS } from "src/base/helpers/variables";
 import { Level } from "src/components";
@@ -276,26 +276,26 @@ Use the `up` prop on `<Dropdown>` for the menu to appear **above** the `<Dropdow
     active: {
       description:
         "set the dropdown as active (useful with the `managed` prop)",
-      typeName: "boolean"
+      typeName: "boolean",
     },
     align: {
       description: "set the dropdown menu's alignment",
-      typeName: "string",
-      typeTip: mapEnumerable(DROPDOWN_DEFAULTS.alignments)
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(DROPDOWN_DEFAULTS.alignments),
     },
     hoverable: {
       description: "open the dropdown on mouse-over",
-      typeName: "boolean"
+      typeName: "boolean",
     },
     managed: {
       description:
         "enable the usage of the `active` prop to open and close the dropdown menu",
-      typeName: "boolean"
+      typeName: "boolean",
     },
     up: {
       description: "open the menu above the dropdown",
-      typeName: "boolean"
-    }
+      typeName: "boolean",
+    },
   }}
 />
 
@@ -315,12 +315,12 @@ Use the `up` prop on `<Dropdown>` for the menu to appear **above** the `<Dropdow
   props={{
     active: {
       description: "set the item as active",
-      typeName: "boolean"
+      typeName: "boolean",
     },
     onClick: {
       description: "callback when the component is clicked",
-      typeName: "(event: React.MouseEvent) => void"
-    }
+      typeName: "(event: React.MouseEvent) => void",
+    },
   }}
 />
 
@@ -335,11 +335,11 @@ Use the `up` prop on `<Dropdown>` for the menu to appear **above** the `<Dropdow
   props={{
     active: {
       description: "set the item as active",
-      typeName: "boolean"
+      typeName: "boolean",
     },
     onClick: {
       description: "callback when the component is clicked",
-      typeName: "(event: React.MouseEvent) => void"
-    }
+      typeName: "(event: React.MouseEvent) => void",
+    },
   }}
 />

src/components/level/__docs__/level.docs.mdx

@@ -8,7 +8,7 @@ import { Playground } from "docz";
 
 import {
   ForwardRefAsExoticComponentDoc,
-  mapEnumerable
+  mapEnumerable,
 } from "src/__docs__/components";
 import { DEFAULTS } from "src/base/helpers/variables";
 import { Generic } from "src/base";
@@ -19,7 +19,7 @@ import {
   Field,
   Heading,
   Input,
-  Title
+  Title,
 } from "src/elements";
 import { Level } from "../level";
 import { LEVEL_ITEM_DEFAULTS } from "../level-item";
@@ -223,9 +223,9 @@ For example, for a responsive size greater than **mobile** (up to 768px), these
     breakpoint: {
       description:
         'the responsive size at which the level is vertical (without overriding Bulma SASS, only "mobile" is supported)',
-      typeName: "string",
-      typeTip: mapEnumerable(DEFAULTS.breakpoints)
-    }
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(DEFAULTS.breakpoints),
+    },
   }}
 />
 
@@ -236,8 +236,8 @@ For example, for a responsive size greater than **mobile** (up to 768px), these
   props={{
     align: {
       description: "the side of the level is placed",
-      typeName: "string",
-      typeTip: mapEnumerable(LEVEL_ITEM_DEFAULTS.alignments)
-    }
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(LEVEL_ITEM_DEFAULTS.alignments),
+    },
   }}
 />

src/components/media/__docs__/media.docs.mdx

@@ -10,7 +10,7 @@ import { Playground } from "docz";
 
 import {
   ForwardRefAsExoticComponentDoc,
-  mapEnumerable
+  mapEnumerable,
 } from "src/__docs__/components";
 import { DEFAULTS } from "src/base/helpers/variables";
 import { Level } from "src/components";
@@ -24,7 +24,7 @@ import {
   Icon,
   Image,
   Label,
-  Textarea
+  Textarea,
 } from "src/elements";
 import { Media } from "../media";
 import { MEDIA_ITEM_DEFAULTS } from "../media-item";
@@ -256,8 +256,8 @@ You can nest `<Media>` objects up to 3 levels deep (without extending Bulma's SA
   props={{
     align: {
       description: "change the position of the item inside the media container",
-      typeName: "string",
-      typeTip: mapEnumerable(MEDIA_ITEM_DEFAULTS.alignments)
-    }
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(MEDIA_ITEM_DEFAULTS.alignments),
+    },
   }}
 />

src/components/message/__docs__/message.docs.mdx

@@ -9,7 +9,7 @@ import { Playground } from "docz";
 import {
   ForwardRefAsExoticComponentDoc,
   mapEnumerable,
-  OptionBlock
+  OptionBlock,
 } from "src/__docs__/components";
 import { DEFAULTS } from "src/base/helpers/variables";
 import { Delete } from "src/elements";
@@ -134,14 +134,14 @@ Use the `size` prop on `<Message>` to set the size.
   props={{
     color: {
       description: "set the message's color",
-      typeName: "string",
-      typeTip: mapEnumerable(DEFAULTS.colors)
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(DEFAULTS.colors),
     },
     size: {
       description: "set the message's size",
-      typeName: "string",
-      typeTip: mapEnumerable(MESSAGE_DEFAULTS.sizes)
-    }
+      typeName: "string (literal)",
+      typeTip: mapEnumerable(MESSAGE_DEFAULTS.sizes),
+    },
   }}
 />
 

src/components/navbar/__docs__/navbar.docs.mdx

@@ -848,7 +848,7 @@ Use the `color` prop of the `<Navbar>` to change the color.
     },
     color: {
       description: "set the navbar's color",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(DEFAULTS.colors),
     },
     document: {
@@ -858,7 +858,7 @@ Use the `color` prop of the `<Navbar>` to change the color.
     },
     fixed: {
       description: "fix the position to the top or bottom",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(NAVBAR_DEFAULTS.fixedAlignments),
     },
     managed: {
@@ -902,7 +902,7 @@ Use the `color` prop of the `<Navbar>` to change the color.
   props={{
     align: {
       description: "align the menu to the left or right",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(NAVBAR_DROPDOWN_DEFAULTS.alignments),
     },
     boxed: {
@@ -990,7 +990,7 @@ Use the `color` prop of the `<Navbar>` to change the color.
       description:
         "set the content in the left or right side of the dropdown menu",
       required: true,
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(NAVBAR_SEGMENT_DEFAULTS.alignments),
     },
   }}

src/components/pagination/__docs__/pagination.docs.mdx

@@ -174,7 +174,7 @@ Use the `size` prop on `<Pagination>` to change the size.
   props={{
     align: {
       description: "change the pagination's alignment of pagination items",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(PAGINATION_DEFAULTS.alignments),
     },
     rounded: {
@@ -183,7 +183,7 @@ Use the `size` prop on `<Pagination>` to change the size.
     },
     size: {
       description: "change the pagination's size",
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(PAGINATION_DEFAULTS.sizes),
     },
   }}
@@ -226,7 +226,7 @@ Use the `size` prop on `<Pagination>` to change the size.
       description:
         "set the step as next or previous (positioning changes with pagination's align prop",
       required: true,
-      typeName: "string",
+      typeName: "string (literal)",
       typeTip: mapEnumerable(PAGINATION_STEP_DEFAULTS.alignments),
     },
   }}