@4alldigital/foundation-ui--gamma 1.21.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.
package/LICENSE.txt ADDED
@@ -0,0 +1,21 @@
1
+ The MIT License
2
+
3
+ Copyright (c) 2021-2022 Joe Mewes, 4 All Digital ltd. All rights reserved.
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in
13
+ all copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21
+ THE SOFTWARE.
@@ -0,0 +1,2 @@
1
+ /*! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid;box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-variation-settings:normal;line-height:1.5;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{color:#9ca3af;opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]{display:none}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],input:where(:not([type])),select,textarea{--tw-shadow:0 0 #0000;-webkit-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-radius:0;border-width:1px;font-size:1rem;line-height:1.5rem;padding:.5rem .75rem}[multiple]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=email]:focus,[type=month]:focus,[type=number]:focus,[type=password]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus,[type=time]:focus,[type=url]:focus,[type=week]:focus,input:where(:not([type])):focus,select:focus,textarea:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);border-color:#2563eb;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-bottom:0;padding-top:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{--tw-shadow:0 0 #0000;-webkit-appearance:none;appearance:none;background-color:#fff;background-origin:border-box;border-color:#6b7280;border-width:1px;color:#2563eb;display:inline-block;flex-shrink:0;height:1rem;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;-webkit-user-select:none;user-select:none;vertical-align:middle;width:1rem}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);outline:2px solid #0000;outline-offset:2px}[type=checkbox]:checked,[type=radio]:checked{background-color:currentColor;background-position:50%;background-repeat:no-repeat;background-size:100% 100%;border-color:#0000}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E")}@media (forced-colors:active) {[type=checkbox]:checked{-webkit-appearance:auto;appearance:auto}}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}@media (forced-colors:active) {[type=radio]:checked{-webkit-appearance:auto;appearance:auto}}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=checkbox]:indeterminate,[type=radio]:checked:focus,[type=radio]:checked:hover{background-color:currentColor;border-color:#0000}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:100% 100%}@media (forced-colors:active) {[type=checkbox]:indeterminate{-webkit-appearance:auto;appearance:auto}}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{background-color:currentColor;border-color:#0000}[type=file]{background:unset;border-color:inherit;border-radius:0;border-width:0;font-size:unset;line-height:inherit;padding:0}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}body{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity));color:rgb(33 33 33/var(--tw-text-opacity));font-family:ProximaNova-Regular,serif}:is(.dark body){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(31 26 27/var(--tw-bg-opacity));color:rgb(238 238 238/var(--tw-text-opacity))}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.container{width:100%}@media (min-width:480px){.container{max-width:480px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:976px){.container{max-width:976px}}@media (min-width:1440px){.container{max-width:1440px}}.m-0{margin:0}.mb-3{margin-bottom:.75rem}.mt-6{margin-top:1.5rem}.inline{display:inline}.flex{display:flex}.list-item{display:list-item}.h-10{height:2.5rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-auto{height:auto}.w-10{width:2.5rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-full{width:100%}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.auto-cols-auto{grid-auto-columns:auto}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-row-reverse{flex-direction:row-reverse}.items-center{align-items:center}.justify-around{justify-content:space-around}.gap-2{gap:.5rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(.5rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(.5rem*var(--tw-space-x-reverse))}.space-x-3>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(.75rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(.75rem*var(--tw-space-x-reverse))}.space-x-4>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-left:calc(1rem*(1 - var(--tw-space-x-reverse)));margin-right:calc(1rem*var(--tw-space-x-reverse))}.divide-x-2>:not([hidden])~:not([hidden]){--tw-divide-x-reverse:0;border-left-width:calc(2px*(1 - var(--tw-divide-x-reverse)));border-right-width:calc(2px*var(--tw-divide-x-reverse))}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.border{border-width:1px}.border-0{border-width:0}.border-b{border-bottom-width:1px}.border-solid{border-style:solid}.border-dark-body-background{--tw-border-opacity:1;border-color:rgb(31 26 27/var(--tw-border-opacity))}.border-primary{--tw-border-opacity:1;border-color:rgb(0 47 108/var(--tw-border-opacity))}.border-primary-darker{--tw-border-opacity:1;border-color:rgb(0 42 97/var(--tw-border-opacity))}.border-secondary{--tw-border-opacity:1;border-color:rgb(252 183 0/var(--tw-border-opacity))}.border-secondary-darker{--tw-border-opacity:1;border-color:rgb(227 165 0/var(--tw-border-opacity))}.border-tertiary{--tw-border-opacity:1;border-color:rgb(42 61 130/var(--tw-border-opacity))}.border-tertiary-darker{--tw-border-opacity:1;border-color:rgb(38 55 117/var(--tw-border-opacity))}.bg-primary{--tw-bg-opacity:1;background-color:rgb(0 47 108/var(--tw-bg-opacity))}.bg-secondary{--tw-bg-opacity:1;background-color:rgb(252 183 0/var(--tw-bg-opacity))}.bg-tertiary{--tw-bg-opacity:1;background-color:rgb(42 61 130/var(--tw-bg-opacity))}.bg-transparent{background-color:initial}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-8{padding-left:2rem;padding-right:2rem}.py-1{padding-bottom:.25rem;padding-top:.25rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-3{padding-bottom:.75rem;padding-top:.75rem}.pl-3{padding-left:.75rem}.pr-3{padding-right:.75rem}.font-heading{font-family:ProximaNova-Bold,serif}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-5xl{font-size:3rem;line-height:1}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.font-light{font-weight:300}.font-medium{font-weight:500}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.normal-case{text-transform:none}.italic{font-style:italic}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.shadow{--tw-shadow:0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a;--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.\!outline{outline-style:solid!important}.outline{outline-style:solid}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.hover\:border-primary-darker:hover{--tw-border-opacity:1;border-color:rgb(0 42 97/var(--tw-border-opacity))}.hover\:border-secondary-darker:hover{--tw-border-opacity:1;border-color:rgb(227 165 0/var(--tw-border-opacity))}.hover\:border-tertiary-darker:hover{--tw-border-opacity:1;border-color:rgb(38 55 117/var(--tw-border-opacity))}.hover\:bg-primary-darker:hover{--tw-bg-opacity:1;background-color:rgb(0 42 97/var(--tw-bg-opacity))}.hover\:bg-secondary-darker:hover{--tw-bg-opacity:1;background-color:rgb(227 165 0/var(--tw-bg-opacity))}.hover\:bg-tertiary-darker:hover{--tw-bg-opacity:1;background-color:rgb(38 55 117/var(--tw-bg-opacity))}.active\:scale-95:active{--tw-scale-x:.95;--tw-scale-y:.95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}:is(.dark .dark\:border-body-background){--tw-border-opacity:1;border-color:rgb(255 255 255/var(--tw-border-opacity))}:is(.dark .dark\:text-white){--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}
2
+ @font-face{font-display:swap;font-family:ProximaNova-Regular;font-style:normal;font-weight:400;src:url(https://cdn.tools.4alldigital.io/fonts/ProximaNovaReg.woff2) format("woff2"),url(https://cdn.tools.4alldigital.io/fonts/ProximaNovaReg.woff) format("woff")}@font-face{font-display:swap;font-family:ProximaNova-Bold;font-style:normal;font-weight:700;src:url(https://cdn.tools.4alldigital.io/fonts/ProximaNovaBold.woff2) format("woff2"),url(https://cdn.tools.4alldigital.io/fonts/ProximaNovaBold.woff) format("woff")}
@@ -0,0 +1,132 @@
1
+ import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
2
+ import cx from 'classnames';
3
+ import { Icon } from '@iconify/react';
4
+
5
+ var Blockquote = function (_a) {
6
+ var text = _a.text, citation = _a.citation, className = _a.className, citationAttribute = _a.citationAttribute, showIcon = _a.showIcon;
7
+ var classes = cx('text-xl italic font-bold', className);
8
+ return (jsxs("blockquote", { "data-testid": "Blockquote", className: classes, children: [showIcon && jsx("svg", { "aria-hidden": "true", className: "w-10 h-10 text-gray-400 dark:text-gray-600", viewBox: "0 0 24 27", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M14.017 18L14.017 10.609C14.017 4.905 17.748 1.039 23 0L23.995 2.151C21.563 3.068 20 5.789 20 8H24V18H14.017ZM0 18V10.609C0 4.905 3.748 1.038 9 0L9.996 2.151C7.563 3.068 6 5.789 6 8H9.983L9.983 18L0 18Z", fill: "currentColor" }) }), jsx("div", { children: text }), citation && (jsx("figcaption", { className: "flex flex-start items-center mt-6 space-x-3", children: jsxs("div", { className: "flex items-center divide-x-2 divide-gray-500 dark:divide-gray-700", children: [jsx("cite", { className: "pr-3 font-medium text-gray-900 dark:text-white", children: citation }), citationAttribute && jsx("cite", { className: "pl-3 text-sm font-light text-gray-500 dark:text-gray-400", children: citationAttribute })] }) }))] }));
9
+ };
10
+ Blockquote.defaultProps = {
11
+ showIcon: true,
12
+ };
13
+
14
+ var Button = function (_a) {
15
+ var variant = _a.variant, size = _a.size, uppercase = _a.uppercase, children = _a.children, id = _a.id, type = _a.type, disabled = _a.disabled, ariaLabel = _a.ariaLabel, onClick = _a.onClick, icon = _a.icon, external = _a.external, iconFirst = _a.iconFirst, raised = _a.raised, outline = _a.outline, wide = _a.wide, rounded = _a.rounded, testID = _a.testID;
16
+ var smallX = wide ? 'px-5' : 'px-3';
17
+ var mediumX = wide ? 'px-8' : 'px-4';
18
+ var largeX = wide ? 'px-11' : 'px-5';
19
+ var sizes = {
20
+ small: {
21
+ x: children ? smallX : 'px-1',
22
+ y: 'py-1',
23
+ space: 'space-x-2',
24
+ text: 'text-sm',
25
+ icon: 'w-4 h-4',
26
+ },
27
+ medium: {
28
+ x: children ? mediumX : 'px-2',
29
+ y: 'py-2',
30
+ space: 'space-x-3',
31
+ text: 'text-base',
32
+ icon: 'w-5 h-5',
33
+ },
34
+ large: {
35
+ x: children ? largeX : 'px-3',
36
+ y: 'py-3',
37
+ space: 'space-x-4',
38
+ text: 'text-lg',
39
+ icon: 'w-6 h-6'
40
+ },
41
+ };
42
+ var classes = cx('font-bold flex items-center transition-all duration-200 transform active:scale-95 justify-around border-solid border rounded', { 'text-white border-primary hover:bg-primary-darker hover:border-primary-darker': variant === 'primary' }, { 'text-white border-secondary hover:bg-secondary-darker hover:border-secondary-darker': variant === 'secondary' }, { 'text-black border-tertiary hover:bg-tertiary-darker hover:border-tertiary-darker': variant === 'tertiary' }, { 'bg-primary': variant === 'primary' && !outline }, { 'bg-secondary': variant === 'secondary' && !outline }, { 'bg-tertiary': variant === 'tertiary' && !outline }, { 'bg-transparent': outline }, { shadow: raised }, { uppercase: uppercase }, { 'auto-cols-auto grid-cols-2 gap-2': icon || external }, { 'rounded-full': rounded }, { 'flex-row-reverse': iconFirst }, "".concat(sizes[size].y, " ").concat(sizes[size].x, " ").concat(sizes[size].text));
43
+ var iconClasses = cx(sizes[size].icon);
44
+ return (jsx("button", { id: id, "data-testid": testID || id || "Button", onClick: onClick, className: classes, type: type, disabled: disabled, "aria-label": ariaLabel, role: "button", children: jsxs(Fragment, { children: [children, icon && !external && (jsx("span", { className: "flex items-center", children: jsx(Icon, { icon: icon, className: iconClasses }) })), external && (jsx("span", { className: "flex items-center", children: jsx(Icon, { icon: "carbon:launch", className: iconClasses }) }))] }) }));
45
+ };
46
+ Button.defaultProps = {
47
+ variant: 'primary',
48
+ size: 'medium',
49
+ type: 'button',
50
+ raised: true,
51
+ wide: true,
52
+ rounded: true,
53
+ };
54
+
55
+ var Align;
56
+ (function (Align) {
57
+ Align["LEFT"] = "left";
58
+ Align["CENTER"] = "center";
59
+ Align["RIGHT"] = "right";
60
+ Align["JUSTIFY"] = "justify";
61
+ Align["NOWRAP"] = "nowrap";
62
+ })(Align || (Align = {}));
63
+ var Transform;
64
+ (function (Transform) {
65
+ Transform["LOWERCASE"] = "lowercase";
66
+ Transform["UPPERCASE"] = "uppercase";
67
+ Transform["CAPITALIZE"] = "capitalize";
68
+ Transform["NORMALCASE"] = "normal-case";
69
+ })(Transform || (Transform = {}));
70
+ var Contextual;
71
+ (function (Contextual) {
72
+ Contextual["INVERTED"] = "inverted";
73
+ Contextual["MUTED"] = "muted";
74
+ })(Contextual || (Contextual = {}));
75
+ var Size;
76
+ (function (Size) {
77
+ Size["SMALL"] = "small";
78
+ Size["LARGE"] = "large";
79
+ Size["INTRO"] = "intro";
80
+ })(Size || (Size = {}));
81
+ var Tag;
82
+ (function (Tag) {
83
+ Tag["P"] = "p";
84
+ Tag["DIV"] = "div";
85
+ })(Tag || (Tag = {}));
86
+
87
+ var Copy = function (_a) {
88
+ var _b;
89
+ var children = _a.children, Tag = _a.tag, size = _a.size, align = _a.align, transform = _a.transform, id = _a.id, testID = _a.testID;
90
+ if (!children)
91
+ return null;
92
+ var classes = cx((_b = {}, _b["text-".concat(align)] = align, _b), { 'text-sm': size === 'small' }, { 'text-lg': size === 'large' }, { 'text-2xl': size === 'intro' }, { 'mb-3': Tag === 'p' }, transform);
93
+ return jsx(Tag, { "data-testid": testID || id || "Copy", className: classes, children: children });
94
+ };
95
+ Copy.defaultProps = {
96
+ inverted: false,
97
+ maxLength: false,
98
+ tag: Tag.DIV,
99
+ align: Align.LEFT,
100
+ };
101
+
102
+ var Link = function (_a) {
103
+ var href = _a.href, children = _a.children, onClick = _a.onClick, history = _a.history, target = _a.target, id = _a.id, testID = _a.testID;
104
+ var handleClick = function (event) {
105
+ if (onClick) {
106
+ onClick(event);
107
+ return;
108
+ }
109
+ if (event.defaultPrevented === true) {
110
+ return;
111
+ }
112
+ if (history && href) {
113
+ event.preventDefault();
114
+ history.push(href);
115
+ }
116
+ };
117
+ var classes = cx('link');
118
+ return (jsx("a", { "data-testid": testID || id || "Link", className: classes, href: href, onClick: handleClick, target: target, children: children }));
119
+ };
120
+ Link.defaultProps = {
121
+ href: undefined,
122
+ onClick: function () { return console.log('Link clicked'); },
123
+ history: undefined,
124
+ target: undefined,
125
+ };
126
+
127
+ var Hr = function () {
128
+ var classes = cx('border-0 border-b border-dark-body-background dark:border-body-background');
129
+ return jsx("hr", { className: classes });
130
+ };
131
+
132
+ export { Blockquote, Button, Copy, Hr, Link };
package/dist/index.js ADDED
@@ -0,0 +1,138 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var cx = require('classnames');
5
+ var react = require('@iconify/react');
6
+
7
+ var Blockquote = function (_a) {
8
+ var text = _a.text, citation = _a.citation, className = _a.className, citationAttribute = _a.citationAttribute, showIcon = _a.showIcon;
9
+ var classes = cx('text-xl italic font-bold', className);
10
+ return (jsxRuntime.jsxs("blockquote", { "data-testid": "Blockquote", className: classes, children: [showIcon && jsxRuntime.jsx("svg", { "aria-hidden": "true", className: "w-10 h-10 text-gray-400 dark:text-gray-600", viewBox: "0 0 24 27", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { d: "M14.017 18L14.017 10.609C14.017 4.905 17.748 1.039 23 0L23.995 2.151C21.563 3.068 20 5.789 20 8H24V18H14.017ZM0 18V10.609C0 4.905 3.748 1.038 9 0L9.996 2.151C7.563 3.068 6 5.789 6 8H9.983L9.983 18L0 18Z", fill: "currentColor" }) }), jsxRuntime.jsx("div", { children: text }), citation && (jsxRuntime.jsx("figcaption", { className: "flex flex-start items-center mt-6 space-x-3", children: jsxRuntime.jsxs("div", { className: "flex items-center divide-x-2 divide-gray-500 dark:divide-gray-700", children: [jsxRuntime.jsx("cite", { className: "pr-3 font-medium text-gray-900 dark:text-white", children: citation }), citationAttribute && jsxRuntime.jsx("cite", { className: "pl-3 text-sm font-light text-gray-500 dark:text-gray-400", children: citationAttribute })] }) }))] }));
11
+ };
12
+ Blockquote.defaultProps = {
13
+ showIcon: true,
14
+ };
15
+
16
+ var Button = function (_a) {
17
+ var variant = _a.variant, size = _a.size, uppercase = _a.uppercase, children = _a.children, id = _a.id, type = _a.type, disabled = _a.disabled, ariaLabel = _a.ariaLabel, onClick = _a.onClick, icon = _a.icon, external = _a.external, iconFirst = _a.iconFirst, raised = _a.raised, outline = _a.outline, wide = _a.wide, rounded = _a.rounded, testID = _a.testID;
18
+ var smallX = wide ? 'px-5' : 'px-3';
19
+ var mediumX = wide ? 'px-8' : 'px-4';
20
+ var largeX = wide ? 'px-11' : 'px-5';
21
+ var sizes = {
22
+ small: {
23
+ x: children ? smallX : 'px-1',
24
+ y: 'py-1',
25
+ space: 'space-x-2',
26
+ text: 'text-sm',
27
+ icon: 'w-4 h-4',
28
+ },
29
+ medium: {
30
+ x: children ? mediumX : 'px-2',
31
+ y: 'py-2',
32
+ space: 'space-x-3',
33
+ text: 'text-base',
34
+ icon: 'w-5 h-5',
35
+ },
36
+ large: {
37
+ x: children ? largeX : 'px-3',
38
+ y: 'py-3',
39
+ space: 'space-x-4',
40
+ text: 'text-lg',
41
+ icon: 'w-6 h-6'
42
+ },
43
+ };
44
+ var classes = cx('font-bold flex items-center transition-all duration-200 transform active:scale-95 justify-around border-solid border rounded', { 'text-white border-primary hover:bg-primary-darker hover:border-primary-darker': variant === 'primary' }, { 'text-white border-secondary hover:bg-secondary-darker hover:border-secondary-darker': variant === 'secondary' }, { 'text-black border-tertiary hover:bg-tertiary-darker hover:border-tertiary-darker': variant === 'tertiary' }, { 'bg-primary': variant === 'primary' && !outline }, { 'bg-secondary': variant === 'secondary' && !outline }, { 'bg-tertiary': variant === 'tertiary' && !outline }, { 'bg-transparent': outline }, { shadow: raised }, { uppercase: uppercase }, { 'auto-cols-auto grid-cols-2 gap-2': icon || external }, { 'rounded-full': rounded }, { 'flex-row-reverse': iconFirst }, "".concat(sizes[size].y, " ").concat(sizes[size].x, " ").concat(sizes[size].text));
45
+ var iconClasses = cx(sizes[size].icon);
46
+ return (jsxRuntime.jsx("button", { id: id, "data-testid": testID || id || "Button", onClick: onClick, className: classes, type: type, disabled: disabled, "aria-label": ariaLabel, role: "button", children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [children, icon && !external && (jsxRuntime.jsx("span", { className: "flex items-center", children: jsxRuntime.jsx(react.Icon, { icon: icon, className: iconClasses }) })), external && (jsxRuntime.jsx("span", { className: "flex items-center", children: jsxRuntime.jsx(react.Icon, { icon: "carbon:launch", className: iconClasses }) }))] }) }));
47
+ };
48
+ Button.defaultProps = {
49
+ variant: 'primary',
50
+ size: 'medium',
51
+ type: 'button',
52
+ raised: true,
53
+ wide: true,
54
+ rounded: true,
55
+ };
56
+
57
+ var Align;
58
+ (function (Align) {
59
+ Align["LEFT"] = "left";
60
+ Align["CENTER"] = "center";
61
+ Align["RIGHT"] = "right";
62
+ Align["JUSTIFY"] = "justify";
63
+ Align["NOWRAP"] = "nowrap";
64
+ })(Align || (Align = {}));
65
+ var Transform;
66
+ (function (Transform) {
67
+ Transform["LOWERCASE"] = "lowercase";
68
+ Transform["UPPERCASE"] = "uppercase";
69
+ Transform["CAPITALIZE"] = "capitalize";
70
+ Transform["NORMALCASE"] = "normal-case";
71
+ })(Transform || (Transform = {}));
72
+ var Contextual;
73
+ (function (Contextual) {
74
+ Contextual["INVERTED"] = "inverted";
75
+ Contextual["MUTED"] = "muted";
76
+ })(Contextual || (Contextual = {}));
77
+ var Size;
78
+ (function (Size) {
79
+ Size["SMALL"] = "small";
80
+ Size["LARGE"] = "large";
81
+ Size["INTRO"] = "intro";
82
+ })(Size || (Size = {}));
83
+ var Tag;
84
+ (function (Tag) {
85
+ Tag["P"] = "p";
86
+ Tag["DIV"] = "div";
87
+ })(Tag || (Tag = {}));
88
+
89
+ var Copy = function (_a) {
90
+ var _b;
91
+ var children = _a.children, Tag = _a.tag, size = _a.size, align = _a.align, transform = _a.transform, id = _a.id, testID = _a.testID;
92
+ if (!children)
93
+ return null;
94
+ var classes = cx((_b = {}, _b["text-".concat(align)] = align, _b), { 'text-sm': size === 'small' }, { 'text-lg': size === 'large' }, { 'text-2xl': size === 'intro' }, { 'mb-3': Tag === 'p' }, transform);
95
+ return jsxRuntime.jsx(Tag, { "data-testid": testID || id || "Copy", className: classes, children: children });
96
+ };
97
+ Copy.defaultProps = {
98
+ inverted: false,
99
+ maxLength: false,
100
+ tag: Tag.DIV,
101
+ align: Align.LEFT,
102
+ };
103
+
104
+ var Link = function (_a) {
105
+ var href = _a.href, children = _a.children, onClick = _a.onClick, history = _a.history, target = _a.target, id = _a.id, testID = _a.testID;
106
+ var handleClick = function (event) {
107
+ if (onClick) {
108
+ onClick(event);
109
+ return;
110
+ }
111
+ if (event.defaultPrevented === true) {
112
+ return;
113
+ }
114
+ if (history && href) {
115
+ event.preventDefault();
116
+ history.push(href);
117
+ }
118
+ };
119
+ var classes = cx('link');
120
+ return (jsxRuntime.jsx("a", { "data-testid": testID || id || "Link", className: classes, href: href, onClick: handleClick, target: target, children: children }));
121
+ };
122
+ Link.defaultProps = {
123
+ href: undefined,
124
+ onClick: function () { return console.log('Link clicked'); },
125
+ history: undefined,
126
+ target: undefined,
127
+ };
128
+
129
+ var Hr = function () {
130
+ var classes = cx('border-0 border-b border-dark-body-background dark:border-body-background');
131
+ return jsxRuntime.jsx("hr", { className: classes });
132
+ };
133
+
134
+ exports.Blockquote = Blockquote;
135
+ exports.Button = Button;
136
+ exports.Copy = Copy;
137
+ exports.Hr = Hr;
138
+ exports.Link = Link;
package/package.json ADDED
@@ -0,0 +1,74 @@
1
+ {
2
+ "name": "@4alldigital/foundation-ui--gamma",
3
+ "version": "1.21.0",
4
+ "description": "Foundation UI Component library with GAMMA theme. ",
5
+ "main": "dist/index.js",
6
+ "module": "dist/index.esm.js",
7
+ "jsnext:main": "dist/index.es.js",
8
+ "repository": {
9
+ "type": "git",
10
+ "url": "git+https://github.com/4AllDigital/foundation-ui.git",
11
+ "directory": "packages/gamma"
12
+ },
13
+ "author": "Joe Mewes",
14
+ "license": "MIT",
15
+ "files": [
16
+ "dist"
17
+ ],
18
+ "scripts": {
19
+ "build": "npx rollup -c ../../rollup.config.js --bundleConfigAsCjs"
20
+ },
21
+ "config": {
22
+ "loglevel": "silent"
23
+ },
24
+ "publishConfig": {
25
+ "access": "public"
26
+ },
27
+ "gitHead": "9a5071a4ce1004161573ab92877b3a28eeae242f",
28
+ "dependencies": {
29
+ "@headlessui/react": "^1.7.8",
30
+ "@heroicons/react": "^2.0.14",
31
+ "@iconify/react": "^4.1.0",
32
+ "@radix-ui/react-accordion": "^1.1.0",
33
+ "@radix-ui/react-alert-dialog": "^1.0.0",
34
+ "@radix-ui/react-aspect-ratio": "^1.0.0",
35
+ "@radix-ui/react-avatar": "^1.0.0",
36
+ "@radix-ui/react-checkbox": "^1.0.0",
37
+ "@radix-ui/react-collapsible": "^1.0.0",
38
+ "@radix-ui/react-context-menu": "^2.1.0",
39
+ "@radix-ui/react-dialog": "^1.0.0",
40
+ "@radix-ui/react-dropdown-menu": "^2.0.1",
41
+ "@radix-ui/react-hover-card": "^1.0.0",
42
+ "@radix-ui/react-icons": "^1.0.0",
43
+ "@radix-ui/react-label": "^2.0.0",
44
+ "@radix-ui/react-navigation-menu": "^1.0.0",
45
+ "@radix-ui/react-popover": "^1.0.0",
46
+ "@radix-ui/react-progress": "^1.0.0",
47
+ "@radix-ui/react-radio-group": "^1.0.0",
48
+ "@radix-ui/react-scroll-area": "^1.0.0",
49
+ "@radix-ui/react-select": "^2.0.0",
50
+ "@radix-ui/react-separator": "^1.0.0",
51
+ "@radix-ui/react-slider": "^1.0.0",
52
+ "@radix-ui/react-switch": "^1.0.0",
53
+ "@radix-ui/react-tabs": "^1.0.0",
54
+ "@radix-ui/react-toast": "^1.0.0",
55
+ "@radix-ui/react-toggle": "^1.0.0",
56
+ "@radix-ui/react-toggle-group": "^1.0.0",
57
+ "@radix-ui/react-toolbar": "^1.0.0",
58
+ "@radix-ui/react-tooltip": "^1.0.0",
59
+ "@tailwindcss/forms": "^0.5.2",
60
+ "classnames": "^2.5.1",
61
+ "final-form": "^4.20.10",
62
+ "history": "^5.3.0",
63
+ "react": "^18.2.0",
64
+ "react-content-loader": "^6.2.1",
65
+ "react-device-detect": "^2.2.3",
66
+ "react-dom": "^18.2.0",
67
+ "react-final-form": "^6.5.9",
68
+ "react-scripts": "^5.0.1",
69
+ "tailwindcss": "^3.4.1",
70
+ "tailwindcss-radix": "^2.8.0",
71
+ "typescript": "^5.3.3",
72
+ "web-vitals": "^3.5.1"
73
+ }
74
+ }