luna-one 3.1.596 → 3.1.598

package/dist/luna/components/ComparisonTable/ComparisonTableDocumentation.mdx

@@ -1,159 +1,159 @@
-#### Comparison Table
-
-###### Props -
-- `data` **(required)** - object containing comparison table data, with following props
-  - `showImages` - (boolean) for display of images, defaults to 
-  - `comparisonColumnGroups` - fields for comparison in the table, including any tooltip text. Product fields must match these in order to function properly.
-    - `columnName` - (text) field for column name in table
-    - `tooltipText` (optional) - (text) text to display in tooltip for this field
-  - `productDetails` - (object) product data object for fields in the table
-    - `productName` - (text) name of product for comparison
-    - `image` (optional) - (object) product image for display
-      - `url` - (text) product image URL
-    - `subheading` - (text) product subheading
-    - `productLink` - (text) link to product page
-    - `productAttributes` - product attributes for comparison in table - these must match the comparison columns in the `comparisonColumnGroups` data.
-      - `name` - (text) name of the attribute
-      - `value` - (text) value of the attribute
-
-###### Example -
-
-```
-const content = {
-  comparisonColumnGroups: [
-    {
-      categoryName: "ISO",
-      comparisonColumns: [
-        {
-          columnName: "Universal Terminal",
-          tooltipText: "Universal terminal is a lorem ipsum dolor sit amet. Universal terminal is a lorem ipsum dolor sit amet. Universal terminal is a lorem ipsum dolor sit amet.",
-        },
-        {
-          columnName: "Task Controller",
-        },
-        {
-          columnName: "ISO TC Section Control",
-        },
-      ]
-    },
-    {
-      categoryName: "Field IQ",
-      comparisonColumns: [
-        {
-          columnName: "Controlled Channels",
-        },
-        {
-          columnName: "Field IQ Section Control",
-          tooltipText: "Universal terminal is a lorem ipsum dolor sit amet.",
-        },
-        {
-          columnName: "FIQ Controlled Product Drives",
-        },
-      ]
-    },
-    {
-      categoryName: "Serial Rate/TUVR",
-      comparisonColumns: [
-        {
-          columnName: "Population/Blockage Monitoring",
-        },
-        {
-          columnName: "Controlled Channels",
-        },
-      ]
-    }
-  ],
-  productDetails: [
-    {
-      productName: "Product Name",
-      image: {
-        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
-      },
-      subheading: "Subheading Lorem Ipsum",
-      productLink: {
-        url: "/products/product-name"
-      },
-      productAttributes: [
-        { value: true },
-        { value: "Up to 96 Sections", columnWidth: "medium" },
-        { value: "Attribute 3" },
-        { value: "Columns can get wider if the content within them needs more room Lorem ipsum dolor sit amet.", columnWidth: "long" },
-        { value: "Attribute 1" },
-        { value: "" },
-        { value: "Attribute 3" },
-        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet.", columnWidth: "long" },
-      ]
-    },
-    {
-      productName: "Product Name",
-      productTag: "Best Performance",
-      image: {
-        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
-      },
-      subheading: "Subheading Lorem Ipsum",
-      productLink: {
-        url: "/products/product-name"
-      },
-      bodyText: "Body text if necessary",
-      productAttributes: [
-        { value: false },
-        { value: "Up to 96 Sections" },
-        { value: "Attribute 3" },
-        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
-        { value: "Attribute 1" },
-        { value: "" },
-        { value: "Attribute 3" },
-        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
-      ]
-    },
-    {
-      productName: "Product Name",
-      image: {
-        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
-      },
-      subheading: "Subheading Lorem Ipsum",
-      productLink: {
-        url: "/products/product-name"
-      },
-      bodyText: "Body text if necessary",
-      productAttributes: [
-        { value: true },
-        { value: "Up to 96 Sections" },
-        { value: "Attribute 3" },
-        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
-        { value: "Attribute 1" },
-        { value: "Up to 96 Sections" },
-        { value: "Attribute 3" },
-        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
-      ]
-    },
-    {
-      productName: "Product Name",
-      image: {
-        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
-      },
-      subheading: "Subheading Lorem Ipsum",
-      productLink: {
-        url: "/products/product-name"
-      },
-      bodyText: "Body text if necessary",
-      productAttributes: [
-        { value: false },
-        { value: "Up to 96 Sections" },
-        { value: "Attribute 3" },
-        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
-        { value: "Attribute 1" },
-        { value: "" },
-        { value: "Attribute 3" },
-        { value: "" },
-      ]
-    },
-  ],
-};
-
-export const Default = () => (
-  <div style={{ maxWidth: "1200px", margin: "auto", padding: "0 32px" }}>
-    <ComparisonTable data={content} />
-  </div>
-);
-```
+#### Comparison Table
+
+###### Props -
+- `data` **(required)** - object containing comparison table data, with following props
+  - `showImages` - (boolean) for display of images, defaults to 
+  - `comparisonColumnGroups` - fields for comparison in the table, including any tooltip text. Product fields must match these in order to function properly.
+    - `columnName` - (text) field for column name in table
+    - `tooltipText` (optional) - (text) text to display in tooltip for this field
+  - `productDetails` - (object) product data object for fields in the table
+    - `productName` - (text) name of product for comparison
+    - `image` (optional) - (object) product image for display
+      - `url` - (text) product image URL
+    - `subheading` - (text) product subheading
+    - `productLink` - (text) link to product page
+    - `productAttributes` - product attributes for comparison in table - these must match the comparison columns in the `comparisonColumnGroups` data.
+      - `name` - (text) name of the attribute
+      - `value` - (text) value of the attribute
+
+###### Example -
+
+```
+const content = {
+  comparisonColumnGroups: [
+    {
+      categoryName: "ISO",
+      comparisonColumns: [
+        {
+          columnName: "Universal Terminal",
+          tooltipText: "Universal terminal is a lorem ipsum dolor sit amet. Universal terminal is a lorem ipsum dolor sit amet. Universal terminal is a lorem ipsum dolor sit amet.",
+        },
+        {
+          columnName: "Task Controller",
+        },
+        {
+          columnName: "ISO TC Section Control",
+        },
+      ]
+    },
+    {
+      categoryName: "Field IQ",
+      comparisonColumns: [
+        {
+          columnName: "Controlled Channels",
+        },
+        {
+          columnName: "Field IQ Section Control",
+          tooltipText: "Universal terminal is a lorem ipsum dolor sit amet.",
+        },
+        {
+          columnName: "FIQ Controlled Product Drives",
+        },
+      ]
+    },
+    {
+      categoryName: "Serial Rate/TUVR",
+      comparisonColumns: [
+        {
+          columnName: "Population/Blockage Monitoring",
+        },
+        {
+          columnName: "Controlled Channels",
+        },
+      ]
+    }
+  ],
+  productDetails: [
+    {
+      productName: "Product Name",
+      image: {
+        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
+      },
+      subheading: "Subheading Lorem Ipsum",
+      productLink: {
+        url: "/products/product-name"
+      },
+      productAttributes: [
+        { value: true },
+        { value: "Up to 96 Sections", columnWidth: "medium" },
+        { value: "Attribute 3" },
+        { value: "Columns can get wider if the content within them needs more room Lorem ipsum dolor sit amet.", columnWidth: "long" },
+        { value: "Attribute 1" },
+        { value: "" },
+        { value: "Attribute 3" },
+        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet.", columnWidth: "long" },
+      ]
+    },
+    {
+      productName: "Product Name",
+      productTag: "Best Performance",
+      image: {
+        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
+      },
+      subheading: "Subheading Lorem Ipsum",
+      productLink: {
+        url: "/products/product-name"
+      },
+      bodyText: "Body text if necessary",
+      productAttributes: [
+        { value: false },
+        { value: "Up to 96 Sections" },
+        { value: "Attribute 3" },
+        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
+        { value: "Attribute 1" },
+        { value: "" },
+        { value: "Attribute 3" },
+        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
+      ]
+    },
+    {
+      productName: "Product Name",
+      image: {
+        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
+      },
+      subheading: "Subheading Lorem Ipsum",
+      productLink: {
+        url: "/products/product-name"
+      },
+      bodyText: "Body text if necessary",
+      productAttributes: [
+        { value: true },
+        { value: "Up to 96 Sections" },
+        { value: "Attribute 3" },
+        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
+        { value: "Attribute 1" },
+        { value: "Up to 96 Sections" },
+        { value: "Attribute 3" },
+        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
+      ]
+    },
+    {
+      productName: "Product Name",
+      image: {
+        url: "//images.ctfassets.net/citn2sn5tdjr/7wBhLKP8AN67gmNO0MJzsP/151f11bbe5130466fbe942aa63fd42fa/dog.jpg",
+      },
+      subheading: "Subheading Lorem Ipsum",
+      productLink: {
+        url: "/products/product-name"
+      },
+      bodyText: "Body text if necessary",
+      productAttributes: [
+        { value: false },
+        { value: "Up to 96 Sections" },
+        { value: "Attribute 3" },
+        { value: "Columns can get wider if the content within them needs more room. Lorem ipsum dolor sit amet." },
+        { value: "Attribute 1" },
+        { value: "" },
+        { value: "Attribute 3" },
+        { value: "" },
+      ]
+    },
+  ],
+};
+
+export const Default = () => (
+  <div style={{ maxWidth: "1200px", margin: "auto", padding: "0 32px" }}>
+    <ComparisonTable data={content} />
+  </div>
+);
+```

package/dist/luna/components/CtaWithHeader/CTAHeaderTextDocumentation.mdx

@@ -1,45 +1,45 @@
-#### CTA with Text and Header
-
-###### Props -
-
-- `variant` - string that determines the CTA appearance (either light or dark)
-- `alignment` - string that sets the CTA text alignment (either left or center)
-- `eyebrow` - string that sets the eyebrow (small text above the headline)
-- `headline` - string that sets the headline
-- `subhead` - string that sets the subhead (secondary text below the headline)
-- `content` - HTML DOM string containing the main CTA content text (example: "<p>This is the CTA content.</p>")
-- `buttons` - object array containing information for the buttons displayed below the CTA content
-  - `text` - string that sets the button text
-  - `url` - string that sets the button url
-- `textLinks` - boolean that determines if the links will be displayed as text instead of buttons
-- `paddingClass` - string containing the container padding class name
-
-###### Example -
-
-```
-const content = "<p>Anim aliquip aliqua aliqua id qui aute anim reprehenderit tempor velit est sint laborum. Cillum et laboris aliquip consequat. Consectetur commodo nisi laborum voluptate. Commodo est ullamco pariatur ut nostrud pariatur. Anim aliquip aliqua aliqua id qui aute anim reprehenderit tempor velit est sint laborum. Cillum et laboris aliquip consequat.</p>\n<ul>\n<li>Cillum et laboris aliquip consequat. El nu consectetur commodo nisi laborum voluptate.</li>\n<li>Cillum et laboris aliquip consequat. El nu consectetur commodo nisi laborum voluptate.</li>\n</ul>"
-
-const buttons = [
-  {
-    "text": "Button 1",
-    "url": "/"
-  },
-  {
-    "text": "Button 2",
-    "url": "/"
-  }
-]
-
-return (
-  <CTA
-    variant="dark"
-    alignment="center"
-    eyebrow="Eyebrow option"
-    headline="Header title"
-    subhead="Subhead can go here."
-    content={content}
-    buttons={buttons}
-    textLinks={true}
-  />
-);
-```
+#### CTA with Text and Header
+
+###### Props -
+
+- `variant` - string that determines the CTA appearance (either light or dark)
+- `alignment` - string that sets the CTA text alignment (either left or center)
+- `eyebrow` - string that sets the eyebrow (small text above the headline)
+- `headline` - string that sets the headline
+- `subhead` - string that sets the subhead (secondary text below the headline)
+- `content` - HTML DOM string containing the main CTA content text (example: "<p>This is the CTA content.</p>")
+- `buttons` - object array containing information for the buttons displayed below the CTA content
+  - `text` - string that sets the button text
+  - `url` - string that sets the button url
+- `textLinks` - boolean that determines if the links will be displayed as text instead of buttons
+- `paddingClass` - string containing the container padding class name
+
+###### Example -
+
+```
+const content = "<p>Anim aliquip aliqua aliqua id qui aute anim reprehenderit tempor velit est sint laborum. Cillum et laboris aliquip consequat. Consectetur commodo nisi laborum voluptate. Commodo est ullamco pariatur ut nostrud pariatur. Anim aliquip aliqua aliqua id qui aute anim reprehenderit tempor velit est sint laborum. Cillum et laboris aliquip consequat.</p>\n<ul>\n<li>Cillum et laboris aliquip consequat. El nu consectetur commodo nisi laborum voluptate.</li>\n<li>Cillum et laboris aliquip consequat. El nu consectetur commodo nisi laborum voluptate.</li>\n</ul>"
+
+const buttons = [
+  {
+    "text": "Button 1",
+    "url": "/"
+  },
+  {
+    "text": "Button 2",
+    "url": "/"
+  }
+]
+
+return (
+  <CTA
+    variant="dark"
+    alignment="center"
+    eyebrow="Eyebrow option"
+    headline="Header title"
+    subhead="Subhead can go here."
+    content={content}
+    buttons={buttons}
+    textLinks={true}
+  />
+);
+```