@ingamigo/ui 1.0.3 → 1.0.8
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/dist/index.js +1 -1
- package/package.json +9 -1
- package/dist/test/setup.d.ts +0 -1
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
/*! For license information please see index.js.LICENSE.txt */
|
|
2
|
-
!function(n,r){if("object"==typeof exports&&"object"==typeof module)module.exports=r();else if("function"==typeof define&&define.amd)define([],r);else{var o=r();for(var t in o)("object"==typeof exports?exports:n)[t]=o[t]}}(self,()=>(()=>{"use strict";var n={784(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,".button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n border: 1px solid transparent;\n border-radius: var(--radius-control);\n\n font-family: var(--font-family-base);\n font-size: var(--font-size-body);\n font-weight: var(--font-weight-label);\n line-height: 1;\n\n cursor: pointer;\n user-select: none;\n\n transition:\n background-color var(--motion-interaction) var(--motion-transition),\n color var(--motion-interaction) var(--motion-transition),\n border-color var(--motion-interaction) var(--motion-transition),\n box-shadow var(--motion-interaction) var(--motion-transition),\n transform var(--motion-interaction) var(--motion-transition);\n}\n\n/* =========================\n VARIANTS\n ========================= */\n\n.button-primary {\n background: var(--color-action-primary);\n color: var(--color-text-inverse);\n box-shadow: var(--shadow-sm);\n}\n\n.button-primary:hover:not(:disabled) {\n background: var(--color-action-primary-hover);\n box-shadow: var(--shadow-md);\n}\n\n.button-primary:active:not(:disabled) {\n transform: translateY(1px);\n box-shadow: var(--shadow-sm);\n}\n\n.button-secondary {\n background: var(--color-surface-secondary);\n color: var(--color-text-primary);\n border-color: var(--color-border-default);\n}\n\n.button-secondary:hover:not(:disabled) {\n background: var(--color-surface-tertiary);\n border-color: var(--color-border-strong);\n}\n\n.button-secondary:active:not(:disabled) {\n transform: translateY(1px);\n}\n\n/* =========================\n FOCUS\n ========================= */\n\n.button:focus-visible {\n outline: 2px solid var(--color-border-focus);\n outline-offset: 2px;\n}\n\n/* =========================\n DISABLED\n ========================= */\n\n.button:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n box-shadow: none;\n}\n\n/* =========================\n SIZES\n ========================= */\n\n.button-small {\n min-height: 32px;\n padding: 0 var(--space-3);\n\n font-size: var(--font-size-sm);\n}\n\n.button-medium {\n min-height: 40px;\n padding: 0 var(--space-4);\n\n font-size: var(--font-size-md);\n}\n\n.button-large {\n min-height: 48px;\n padding: 0 var(--space-6);\n\n font-size: var(--font-size-lg);\n}",""]);const l=i;o.d(r,["A",0,l])},666(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,".input {\n display: block;\n width: 100%;\n\n border: 1px solid var(--color-border-default);\n border-radius: var(--radius-control);\n\n background: var(--color-surface-primary);\n color: var(--color-text-primary);\n\n font-family: var(--font-family-base);\n font-weight: var(--font-weight-body);\n line-height: 1;\n\n outline: none;\n\n transition:\n background-color var(--motion-interaction) var(--motion-transition),\n border-color var(--motion-interaction) var(--motion-transition),\n box-shadow var(--motion-interaction) var(--motion-transition),\n color var(--motion-interaction) var(--motion-transition);\n}\n\n.input::placeholder {\n color: var(--color-text-tertiary);\n}\n\n.input:hover:not(:disabled) {\n border-color: var(--color-border-strong);\n}\n\n.input:focus {\n border-color: var(--color-border-focus);\n box-shadow: 0 0 0 3px\n color-mix(in srgb, var(--color-border-focus) 18%, transparent);\n}\n\n.input:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n background: var(--color-surface-secondary);\n}\n\n/* SIZES */\n\n.input-small {\n min-height: 32px;\n padding: 0 var(--space-3);\n\n font-size: var(--font-size-sm);\n}\n\n.input-medium {\n min-height: 40px;\n padding: 0 var(--space-4);\n\n font-size: var(--font-size-md);\n}\n\n.input-large {\n min-height: 48px;\n padding: 0 var(--space-4);\n\n font-size: var(--font-size-lg);\n}",""]);const l=i;o.d(r,["A",0,l])},954(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,".typography {\n margin: 0;\n font-family: var(--font-family-base);\n color: var(--color-text-primary);\n}\n\n/* HEADINGS */\n\n.typography-heading-1 {\n font-size: var(--font-size-heading-1);\n font-weight: var(--font-weight-heading);\n line-height: var(--line-height-tight);\n letter-spacing: -0.02em;\n}\n\n.typography-heading-2 {\n font-size: var(--font-size-heading-2);\n font-weight: var(--font-weight-heading);\n line-height: var(--line-height-tight);\n letter-spacing: -0.02em;\n}\n\n.typography-heading-3 {\n font-size: var(--font-size-heading-3);\n font-weight: var(--font-weight-heading);\n line-height: var(--line-height-tight);\n letter-spacing: -0.015em;\n}\n\n/* BODY */\n\n.typography-body-lg {\n font-size: var(--font-size-body-lg);\n font-weight: var(--font-weight-body);\n line-height: var(--line-height-normal);\n}\n\n.typography-body {\n font-size: var(--font-size-body);\n font-weight: var(--font-weight-body);\n line-height: var(--line-height-normal);\n}\n\n.typography-body-sm {\n font-size: var(--font-size-body-sm);\n font-weight: var(--font-weight-body);\n line-height: var(--line-height-normal);\n}\n\n/* LABEL */\n\n.typography-label {\n font-size: var(--font-size-label);\n font-weight: var(--font-weight-label);\n line-height: var(--line-height-normal);\n}",""]);const l=i;o.d(r,["A",0,l])},208(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a),l=o(591),c=o(982),s=o(913),d=o(497),u=i()(e());u.i(l.A),u.i(c.A),u.i(s.A),u.i(d.A),u.push([n.id,"",""]);const f=u;o.d(r,["A",0,f])},497(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,'[data-theme="dark"] {\n color-scheme: dark;\n\n --color-background-primary: var(--color-neutral-950);\n --color-background-secondary: var(--color-neutral-900);\n\n --color-surface-primary: var(--color-neutral-900);\n --color-surface-secondary: var(--color-neutral-800);\n --color-surface-tertiary: var(--color-neutral-700);\n\n --color-text-primary: var(--color-white);\n --color-text-secondary: var(--color-neutral-300);\n --color-text-tertiary: var(--color-neutral-400);\n --color-text-disabled: var(--color-neutral-500);\n --color-text-inverse: var(--color-neutral-950);\n\n --color-border-default: var(--color-neutral-800);\n --color-border-strong: var(--color-neutral-700);\n --color-border-focus: var(--color-brand-400);\n\n --color-action-primary: var(--color-brand-500);\n --color-action-primary-hover: var(--color-brand-600);\n}',""]);const l=i;o.d(r,["A",0,l])},913(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,":root {\n color-scheme: light;\n\n --color-background-primary: var(--color-neutral-50);\n --color-background-secondary: var(--color-white);\n\n --color-surface-primary: var(--color-white);\n --color-surface-secondary: var(--color-neutral-50);\n --color-surface-tertiary: var(--color-neutral-100);\n\n --color-text-primary: var(--color-neutral-950);\n --color-text-secondary: var(--color-neutral-600);\n --color-text-tertiary: var(--color-neutral-500);\n --color-text-disabled: var(--color-neutral-400);\n --color-text-inverse: var(--color-white);\n\n --color-border-default: var(--color-neutral-200);\n --color-border-strong: var(--color-neutral-300);\n --color-border-focus: var(--color-brand-500);\n}",""]);const l=i;o.d(r,["A",0,l])},591(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,':root {\n /* =========================\n COLORS\n ========================= */\n\n --color-white: #ffffff;\n --color-black: #000000;\n\n /* =========================\n NEUTRAL\n ========================= */\n\n --color-neutral-50: #f5f5f5;\n --color-neutral-100: #e9e9ea;\n --color-neutral-200: #d5d5d7;\n --color-neutral-300: #b9b9bd;\n --color-neutral-400: #97979d;\n --color-neutral-500: #7b7b82;\n --color-neutral-600: #5f6066;\n --color-neutral-700: #45464b;\n --color-neutral-800: #2e3035;\n --color-neutral-900: #1d1e20;\n --color-neutral-950: #141414;\n\n /* =========================\n BRAND\n ========================= */\n\n --color-brand-400: #63c69d;\n --color-brand-500: #4db288;\n --color-brand-600: #3d9873;\n\n /* =========================\n STATUS\n ========================= */\n\n --color-success-500: #4db288;\n --color-warning-500: #e7b94c;\n --color-danger-500: #cc5c6f;\n\n /* =========================\n SPACING\n ========================= */\n\n --space-1: 4px;\n --space-2: 8px;\n --space-3: 12px;\n --space-4: 16px;\n --space-5: 20px;\n --space-6: 24px;\n --space-7: 28px;\n --space-8: 32px;\n --space-10: 40px;\n --space-12: 48px;\n --space-16: 64px;\n --space-20: 80px;\n\n /* =========================\n RADIUS\n ========================= */\n\n --radius-none: 0px;\n --radius-xs: 8px;\n --radius-sm: 12px;\n --radius-md: 16px;\n --radius-lg: 20px;\n --radius-xl: 24px;\n --radius-2xl: 28px;\n --radius-full: 9999px;\n\n /* =========================\n TYPOGRAPHY\n ========================= */\n\n --font-family-base:\n Inter,\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n Helvetica,\n Arial,\n sans-serif;\n\n --font-size-xs: 12px;\n --font-size-sm: 14px;\n --font-size-md: 16px;\n --font-size-lg: 18px;\n --font-size-xl: 20px;\n --font-size-2xl: 24px;\n --font-size-3xl: 32px;\n --font-size-4xl: 36px;\n --font-size-5xl: 40px;\n\n --font-weight-regular: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n\n --line-height-tight: 1.15;\n --line-height-normal: 1.4;\n --line-height-relaxed: 1.6;\n\n /* =========================\n SHADOWS\n ========================= */\n\n --shadow-sm:\n 0 2px 8px rgb(0 0 0 / 18%);\n\n --shadow-md:\n 0 6px 16px rgb(0 0 0 / 24%);\n\n --shadow-lg:\n 0 12px 32px rgb(0 0 0 / 30%);\n\n --shadow-xl:\n 0 20px 48px rgb(0 0 0 / 36%);\n\n /* =========================\n MOTION\n ========================= */\n\n --motion-duration-fast: 150ms;\n --motion-duration-normal: 200ms;\n --motion-duration-slow: 300ms;\n\n --motion-ease-standard: ease;\n}',""]);const l=i;o.d(r,["A",0,l])},982(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,":root {\n /* =========================\n BACKGROUND\n ========================= */\n\n --color-background-primary: var(--color-neutral-950);\n --color-background-secondary: var(--color-neutral-900);\n\n /* =========================\n SURFACE\n ========================= */\n\n --color-surface-primary: var(--color-neutral-900);\n --color-surface-secondary: var(--color-neutral-800);\n --color-surface-tertiary: var(--color-neutral-700);\n\n /* =========================\n TEXT\n ========================= */\n\n --color-text-primary: var(--color-white);\n --color-text-secondary: var(--color-neutral-400);\n --color-text-tertiary: var(--color-neutral-500);\n --color-text-disabled: var(--color-neutral-600);\n --color-text-inverse: var(--color-neutral-950);\n\n /* =========================\n BORDER\n ========================= */\n\n --color-border-default: var(--color-neutral-800);\n --color-border-strong: var(--color-neutral-700);\n --color-border-focus: var(--color-brand-500);\n\n /* =========================\n ACTION\n ========================= */\n\n --color-action-primary: var(--color-brand-500);\n --color-action-primary-hover: var(--color-brand-600);\n\n /* =========================\n STATUS\n ========================= */\n\n --color-status-success: var(--color-success-500);\n --color-status-warning: var(--color-warning-500);\n --color-status-danger: var(--color-danger-500);\n\n /* =========================\n TYPOGRAPHY\n ========================= */\n\n --font-size-body: var(--font-size-md);\n --font-size-body-sm: var(--font-size-sm);\n --font-size-body-lg: var(--font-size-lg);\n\n --font-size-label: var(--font-size-sm);\n\n --font-size-heading-1: var(--font-size-4xl);\n --font-size-heading-2: var(--font-size-3xl);\n --font-size-heading-3: var(--font-size-2xl);\n\n --font-weight-heading: var(--font-weight-bold);\n --font-weight-body: var(--font-weight-regular);\n --font-weight-label: var(--font-weight-medium);\n\n /* =========================\n RADIUS\n ========================= */\n\n --radius-control: var(--radius-md);\n --radius-card: var(--radius-xl);\n --radius-container: var(--radius-xl);\n\n /* =========================\n ELEVATION\n ========================= */\n\n --shadow-surface: var(--shadow-sm);\n --shadow-floating: var(--shadow-md);\n --shadow-overlay: var(--shadow-lg);\n\n /* =========================\n MOTION\n ========================= */\n\n --motion-interaction: var(--motion-duration-normal);\n --motion-transition: var(--motion-ease-standard);\n}",""]);const l=i;o.d(r,["A",0,l])},314(n){n.exports=function(n){var r=[];return r.toString=function(){return this.map(function(r){var o="",t=void 0!==r[5];return r[4]&&(o+="@supports (".concat(r[4],") {")),r[2]&&(o+="@media ".concat(r[2]," {")),t&&(o+="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {")),o+=n(r),t&&(o+="}"),r[2]&&(o+="}"),r[4]&&(o+="}"),o}).join("")},r.i=function(n,o,t,e,a){"string"==typeof n&&(n=[[null,n,void 0]]);var i={};if(t)for(var l=0;l<this.length;l++){var c=this[l][0];null!=c&&(i[c]=!0)}for(var s=0;s<n.length;s++){var d=[].concat(n[s]);t&&i[d[0]]||(void 0!==a&&(void 0===d[5]||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=a),o&&(d[2]?(d[1]="@media ".concat(d[2]," {").concat(d[1],"}"),d[2]=o):d[2]=o),e&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=e):d[4]="".concat(e)),r.push(d))}},r}},601(n){n.exports=function(n){return n[1]}}};const r={};function o(t){const e=r[t];if(void 0!==e)return e.exports;const a=r[t]={id:t,exports:{}};return n[t](a,a.exports,o),a.exports}o.n=n=>{const r=n&&n.__esModule?()=>n.default:()=>n;return o.d(r,{a:r}),r},o.cw=n=>{var r;return()=>{if(n){var o=n;n=0,r={exports:{}},o.call(r.exports,r,r.exports)}return r.exports}},o.d=(n,r)=>{if(Array.isArray(r))for(var t=0;t<r.length;){var e=r[t++],a=r[t++],i=0===a?{enumerable:!0,value:r[t++]}:{enumerable:!0,get:a};o.o(n,e)||Object.defineProperty(n,e,i)}else for(var e in r)o.o(r,e)&&!o.o(n,e)&&Object.defineProperty(n,e,{enumerable:!0,get:r[e]})},o.o=(n,r)=>Object.prototype.hasOwnProperty.call(n,r),o.r=n=>{Object.defineProperty(n,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(n,"__esModule",{value:!0})},o.nc=void 0;let t={};o.r(t),o.d(t,{Button:()=>A,Input:()=>T,Typography:()=>E});var e=o.cw(function(n,r){var o=Symbol.for("react.transitional.element");Symbol.for("react.fragment"),r.jsx=function(n,r,t){var e=null;if(void 0!==t&&(e=""+t),void 0!==r.key&&(e=""+r.key),"key"in r)for(var a in t={},r)"key"!==a&&(t[a]=r[a]);else t=r;return r=t.ref,{$$typeof:o,type:n,key:e,ref:void 0!==r?r:null,props:t}}}),a=o.cw(function(n,r){n.exports=e()}),i=o.cw(function(n,r){var o=[];function t(n){for(var r=-1,t=0;t<o.length;t++)if(o[t].identifier===n){r=t;break}return r}function e(n,r){for(var e={},i=[],l=0;l<n.length;l++){var c=n[l],s=r.base?c[0]+r.base:c[0],d=e[s]||0,u="".concat(s," ").concat(d);e[s]=d+1;var f=t(u),p={css:c[1],media:c[2],sourceMap:c[3],supports:c[4],layer:c[5]};if(-1!==f)o[f].references++,o[f].updater(p);else{var v=a(p,r);r.byIndex=l,o.splice(l,0,{identifier:u,updater:v,references:1})}i.push(u)}return i}function a(n,r){var o=r.domAPI(r);return o.update(n),function(r){if(r){if(r.css===n.css&&r.media===n.media&&r.sourceMap===n.sourceMap&&r.supports===n.supports&&r.layer===n.layer)return;o.update(n=r)}else o.remove()}}n.exports=function(n,r){var a=e(n=n||[],r=r||{});return function(n){n=n||[];for(var i=0;i<a.length;i++){var l=t(a[i]);o[l].references--}for(var c=e(n,r),s=0;s<a.length;s++){var d=t(a[s]);0===o[d].references&&(o[d].updater(),o.splice(d,1))}a=c}}}),l=o.cw(function(n,r){var o={};n.exports=function(n,r){var t=function(n){if(void 0===o[n]){var r=document.querySelector(n);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(n){r=null}o[n]=r}return o[n]}(n);if(!t)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");t.appendChild(r)}}),c=o.cw(function(n,r){n.exports=function(n){var r=document.createElement("style");return n.setAttributes(r,n.attributes),n.insert(r,n.options),r}}),s=o.cw(function(n,r){n.exports=function(n){var r=o.nc;r&&n.setAttribute("nonce",r)}}),d=o.cw(function(n,r){n.exports=function(n){if("undefined"==typeof document)return{update:function(){},remove:function(){}};var r=n.insertStyleElement(n);return{update:function(o){!function(n,r,o){var t="";o.supports&&(t+="@supports (".concat(o.supports,") {")),o.media&&(t+="@media ".concat(o.media," {"));var e=void 0!==o.layer;e&&(t+="@layer".concat(o.layer.length>0?" ".concat(o.layer):""," {")),t+=o.css,e&&(t+="}"),o.media&&(t+="}"),o.supports&&(t+="}");var a=o.sourceMap;a&&"undefined"!=typeof btoa&&(t+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(a))))," */")),r.styleTagTransform(t,n,r.options)}(r,n,o)},remove:function(){!function(n){if(null===n.parentNode)return!1;n.parentNode.removeChild(n)}(r)}}}}),u=o.cw(function(n,r){n.exports=function(n,r){if(r.styleSheet)r.styleSheet.cssText=n;else{for(;r.firstChild;)r.removeChild(r.firstChild);r.appendChild(document.createTextNode(n))}}});function f(){return f.c||(f.c=o.n(i()))}function p(){return p.c||(p.c=o.n(d()))}function v(){return v.c||(v.c=o.n(l()))}function h(){return h.c||(h.c=o.n(s()))}function m(){return m.c||(m.c=o.n(c()))}function b(){return b.c||(b.c=o.n(u()))}i(),d(),l(),s(),c(),u();var g=o(208),y={};y.styleTagTransform=b()(),y.setAttributes=h()(),y.insert=v()().bind(null,"head"),y.domAPI=p()(),y.insertStyleElement=m()(),f()()(g.A,y),g.A&&g.A.locals&&g.A.locals,a();var x=o(784),w={};w.styleTagTransform=b()(),w.setAttributes=h()(),w.insert=v()().bind(null,"head"),w.domAPI=p()(),w.insertStyleElement=m()(),f()()(x.A,w),x.A&&x.A.locals&&x.A.locals;const A=({variant:n="primary",size:r="medium",className:o,children:t,...a})=>{const i=["button",`button-${n}`,`button-${r}`,o].filter(Boolean).join(" ");return(0,e().jsx)("button",{...a,className:i,children:t})};var z=o(666),S={};S.styleTagTransform=b()(),S.setAttributes=h()(),S.insert=v()().bind(null,"head"),S.domAPI=p()(),S.insertStyleElement=m()(),f()()(z.A,S),z.A&&z.A.locals&&z.A.locals;const T=({inputSize:n="medium",className:r,...o})=>{const t=["input",`input-${n}`,r].filter(Boolean).join(" ");return(0,e().jsx)("input",{...o,className:t})};var k=o(954),I={};I.styleTagTransform=b()(),I.setAttributes=h()(),I.insert=v()().bind(null,"head"),I.domAPI=p()(),I.insertStyleElement=m()(),f()()(k.A,I),k.A&&k.A.locals&&k.A.locals;const O={"heading-1":"h1","heading-2":"h2","heading-3":"h3","body-lg":"p",body:"p","body-sm":"p",label:"span"},E=({variant:n="body",className:r,children:o,...t})=>{const a=["typography",`typography-${n}`,r].filter(Boolean).join(" "),i=O[n];return(0,e().jsx)(i,{...t,className:a,children:o})};return t})());
|
|
2
|
+
var n={784(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,".button {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n\n border: 1px solid transparent;\n border-radius: var(--radius-control);\n\n font-family: var(--font-family-base);\n font-size: var(--font-size-body);\n font-weight: var(--font-weight-label);\n line-height: 1;\n\n cursor: pointer;\n user-select: none;\n\n transition:\n background-color var(--motion-interaction) var(--motion-transition),\n color var(--motion-interaction) var(--motion-transition),\n border-color var(--motion-interaction) var(--motion-transition),\n box-shadow var(--motion-interaction) var(--motion-transition),\n transform var(--motion-interaction) var(--motion-transition);\n}\n\n/* =========================\n VARIANTS\n ========================= */\n\n.button-primary {\n background: var(--color-action-primary);\n color: var(--color-text-inverse);\n box-shadow: var(--shadow-sm);\n}\n\n.button-primary:hover:not(:disabled) {\n background: var(--color-action-primary-hover);\n box-shadow: var(--shadow-md);\n}\n\n.button-primary:active:not(:disabled) {\n transform: translateY(1px);\n box-shadow: var(--shadow-sm);\n}\n\n.button-secondary {\n background: var(--color-surface-secondary);\n color: var(--color-text-primary);\n border-color: var(--color-border-default);\n}\n\n.button-secondary:hover:not(:disabled) {\n background: var(--color-surface-tertiary);\n border-color: var(--color-border-strong);\n}\n\n.button-secondary:active:not(:disabled) {\n transform: translateY(1px);\n}\n\n/* =========================\n FOCUS\n ========================= */\n\n.button:focus-visible {\n outline: 2px solid var(--color-border-focus);\n outline-offset: 2px;\n}\n\n/* =========================\n DISABLED\n ========================= */\n\n.button:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n box-shadow: none;\n}\n\n/* =========================\n SIZES\n ========================= */\n\n.button-small {\n min-height: 32px;\n padding: 0 var(--space-3);\n\n font-size: var(--font-size-sm);\n}\n\n.button-medium {\n min-height: 40px;\n padding: 0 var(--space-4);\n\n font-size: var(--font-size-md);\n}\n\n.button-large {\n min-height: 48px;\n padding: 0 var(--space-6);\n\n font-size: var(--font-size-lg);\n}",""]);const l=i;o.d(r,["A",0,l])},666(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,".input {\n display: block;\n width: 100%;\n\n border: 1px solid var(--color-border-default);\n border-radius: var(--radius-control);\n\n background: var(--color-surface-primary);\n color: var(--color-text-primary);\n\n font-family: var(--font-family-base);\n font-weight: var(--font-weight-body);\n line-height: 1;\n\n outline: none;\n\n transition:\n background-color var(--motion-interaction) var(--motion-transition),\n border-color var(--motion-interaction) var(--motion-transition),\n box-shadow var(--motion-interaction) var(--motion-transition),\n color var(--motion-interaction) var(--motion-transition);\n}\n\n.input::placeholder {\n color: var(--color-text-tertiary);\n}\n\n.input:hover:not(:disabled) {\n border-color: var(--color-border-strong);\n}\n\n.input:focus {\n border-color: var(--color-border-focus);\n box-shadow: 0 0 0 3px\n color-mix(in srgb, var(--color-border-focus) 18%, transparent);\n}\n\n.input:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n background: var(--color-surface-secondary);\n}\n\n/* SIZES */\n\n.input-small {\n min-height: 32px;\n padding: 0 var(--space-3);\n\n font-size: var(--font-size-sm);\n}\n\n.input-medium {\n min-height: 40px;\n padding: 0 var(--space-4);\n\n font-size: var(--font-size-md);\n}\n\n.input-large {\n min-height: 48px;\n padding: 0 var(--space-4);\n\n font-size: var(--font-size-lg);\n}",""]);const l=i;o.d(r,["A",0,l])},954(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,".typography {\n margin: 0;\n font-family: var(--font-family-base);\n color: var(--color-text-primary);\n}\n\n/* HEADINGS */\n\n.typography-heading-1 {\n font-size: var(--font-size-heading-1);\n font-weight: var(--font-weight-heading);\n line-height: var(--line-height-tight);\n letter-spacing: -0.02em;\n}\n\n.typography-heading-2 {\n font-size: var(--font-size-heading-2);\n font-weight: var(--font-weight-heading);\n line-height: var(--line-height-tight);\n letter-spacing: -0.02em;\n}\n\n.typography-heading-3 {\n font-size: var(--font-size-heading-3);\n font-weight: var(--font-weight-heading);\n line-height: var(--line-height-tight);\n letter-spacing: -0.015em;\n}\n\n/* BODY */\n\n.typography-body-lg {\n font-size: var(--font-size-body-lg);\n font-weight: var(--font-weight-body);\n line-height: var(--line-height-normal);\n}\n\n.typography-body {\n font-size: var(--font-size-body);\n font-weight: var(--font-weight-body);\n line-height: var(--line-height-normal);\n}\n\n.typography-body-sm {\n font-size: var(--font-size-body-sm);\n font-weight: var(--font-weight-body);\n line-height: var(--line-height-normal);\n}\n\n/* LABEL */\n\n.typography-label {\n font-size: var(--font-size-label);\n font-weight: var(--font-weight-label);\n line-height: var(--line-height-normal);\n}",""]);const l=i;o.d(r,["A",0,l])},208(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a),l=o(591),c=o(982),s=o(913),d=o(497),u=i()(e());u.i(l.A),u.i(c.A),u.i(s.A),u.i(d.A),u.push([n.id,"",""]);const f=u;o.d(r,["A",0,f])},497(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,'[data-theme="dark"] {\n color-scheme: dark;\n\n --color-background-primary: var(--color-neutral-950);\n --color-background-secondary: var(--color-neutral-900);\n\n --color-surface-primary: var(--color-neutral-900);\n --color-surface-secondary: var(--color-neutral-800);\n --color-surface-tertiary: var(--color-neutral-700);\n\n --color-text-primary: var(--color-white);\n --color-text-secondary: var(--color-neutral-300);\n --color-text-tertiary: var(--color-neutral-400);\n --color-text-disabled: var(--color-neutral-500);\n --color-text-inverse: var(--color-neutral-950);\n\n --color-border-default: var(--color-neutral-800);\n --color-border-strong: var(--color-neutral-700);\n --color-border-focus: var(--color-brand-400);\n\n --color-action-primary: var(--color-brand-500);\n --color-action-primary-hover: var(--color-brand-600);\n}',""]);const l=i;o.d(r,["A",0,l])},913(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,":root {\n color-scheme: light;\n\n --color-background-primary: var(--color-neutral-50);\n --color-background-secondary: var(--color-white);\n\n --color-surface-primary: var(--color-white);\n --color-surface-secondary: var(--color-neutral-50);\n --color-surface-tertiary: var(--color-neutral-100);\n\n --color-text-primary: var(--color-neutral-950);\n --color-text-secondary: var(--color-neutral-600);\n --color-text-tertiary: var(--color-neutral-500);\n --color-text-disabled: var(--color-neutral-400);\n --color-text-inverse: var(--color-white);\n\n --color-border-default: var(--color-neutral-200);\n --color-border-strong: var(--color-neutral-300);\n --color-border-focus: var(--color-brand-500);\n}",""]);const l=i;o.d(r,["A",0,l])},591(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,':root {\n /* =========================\n COLORS\n ========================= */\n\n --color-white: #ffffff;\n --color-black: #000000;\n\n /* =========================\n NEUTRAL\n ========================= */\n\n --color-neutral-50: #f5f5f5;\n --color-neutral-100: #e9e9ea;\n --color-neutral-200: #d5d5d7;\n --color-neutral-300: #b9b9bd;\n --color-neutral-400: #97979d;\n --color-neutral-500: #7b7b82;\n --color-neutral-600: #5f6066;\n --color-neutral-700: #45464b;\n --color-neutral-800: #2e3035;\n --color-neutral-900: #1d1e20;\n --color-neutral-950: #141414;\n\n /* =========================\n BRAND\n ========================= */\n\n --color-brand-400: #63c69d;\n --color-brand-500: #4db288;\n --color-brand-600: #3d9873;\n\n /* =========================\n STATUS\n ========================= */\n\n --color-success-500: #4db288;\n --color-warning-500: #e7b94c;\n --color-danger-500: #cc5c6f;\n\n /* =========================\n SPACING\n ========================= */\n\n --space-1: 4px;\n --space-2: 8px;\n --space-3: 12px;\n --space-4: 16px;\n --space-5: 20px;\n --space-6: 24px;\n --space-7: 28px;\n --space-8: 32px;\n --space-10: 40px;\n --space-12: 48px;\n --space-16: 64px;\n --space-20: 80px;\n\n /* =========================\n RADIUS\n ========================= */\n\n --radius-none: 0px;\n --radius-xs: 8px;\n --radius-sm: 12px;\n --radius-md: 16px;\n --radius-lg: 20px;\n --radius-xl: 24px;\n --radius-2xl: 28px;\n --radius-full: 9999px;\n\n /* =========================\n TYPOGRAPHY\n ========================= */\n\n --font-family-base:\n Inter,\n system-ui,\n -apple-system,\n BlinkMacSystemFont,\n "Segoe UI",\n Roboto,\n Helvetica,\n Arial,\n sans-serif;\n\n --font-size-xs: 12px;\n --font-size-sm: 14px;\n --font-size-md: 16px;\n --font-size-lg: 18px;\n --font-size-xl: 20px;\n --font-size-2xl: 24px;\n --font-size-3xl: 32px;\n --font-size-4xl: 36px;\n --font-size-5xl: 40px;\n\n --font-weight-regular: 400;\n --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n\n --line-height-tight: 1.15;\n --line-height-normal: 1.4;\n --line-height-relaxed: 1.6;\n\n /* =========================\n SHADOWS\n ========================= */\n\n --shadow-sm:\n 0 2px 8px rgb(0 0 0 / 18%);\n\n --shadow-md:\n 0 6px 16px rgb(0 0 0 / 24%);\n\n --shadow-lg:\n 0 12px 32px rgb(0 0 0 / 30%);\n\n --shadow-xl:\n 0 20px 48px rgb(0 0 0 / 36%);\n\n /* =========================\n MOTION\n ========================= */\n\n --motion-duration-fast: 150ms;\n --motion-duration-normal: 200ms;\n --motion-duration-slow: 300ms;\n\n --motion-ease-standard: ease;\n}',""]);const l=i;o.d(r,["A",0,l])},982(n,r,o){var t=o(601),e=o.n(t),a=o(314),i=o.n(a)()(e());i.push([n.id,":root {\n /* =========================\n BACKGROUND\n ========================= */\n\n --color-background-primary: var(--color-neutral-950);\n --color-background-secondary: var(--color-neutral-900);\n\n /* =========================\n SURFACE\n ========================= */\n\n --color-surface-primary: var(--color-neutral-900);\n --color-surface-secondary: var(--color-neutral-800);\n --color-surface-tertiary: var(--color-neutral-700);\n\n /* =========================\n TEXT\n ========================= */\n\n --color-text-primary: var(--color-white);\n --color-text-secondary: var(--color-neutral-400);\n --color-text-tertiary: var(--color-neutral-500);\n --color-text-disabled: var(--color-neutral-600);\n --color-text-inverse: var(--color-neutral-950);\n\n /* =========================\n BORDER\n ========================= */\n\n --color-border-default: var(--color-neutral-800);\n --color-border-strong: var(--color-neutral-700);\n --color-border-focus: var(--color-brand-500);\n\n /* =========================\n ACTION\n ========================= */\n\n --color-action-primary: var(--color-brand-500);\n --color-action-primary-hover: var(--color-brand-600);\n\n /* =========================\n STATUS\n ========================= */\n\n --color-status-success: var(--color-success-500);\n --color-status-warning: var(--color-warning-500);\n --color-status-danger: var(--color-danger-500);\n\n /* =========================\n TYPOGRAPHY\n ========================= */\n\n --font-size-body: var(--font-size-md);\n --font-size-body-sm: var(--font-size-sm);\n --font-size-body-lg: var(--font-size-lg);\n\n --font-size-label: var(--font-size-sm);\n\n --font-size-heading-1: var(--font-size-4xl);\n --font-size-heading-2: var(--font-size-3xl);\n --font-size-heading-3: var(--font-size-2xl);\n\n --font-weight-heading: var(--font-weight-bold);\n --font-weight-body: var(--font-weight-regular);\n --font-weight-label: var(--font-weight-medium);\n\n /* =========================\n RADIUS\n ========================= */\n\n --radius-control: var(--radius-md);\n --radius-card: var(--radius-xl);\n --radius-container: var(--radius-xl);\n\n /* =========================\n ELEVATION\n ========================= */\n\n --shadow-surface: var(--shadow-sm);\n --shadow-floating: var(--shadow-md);\n --shadow-overlay: var(--shadow-lg);\n\n /* =========================\n MOTION\n ========================= */\n\n --motion-interaction: var(--motion-duration-normal);\n --motion-transition: var(--motion-ease-standard);\n}",""]);const l=i;o.d(r,["A",0,l])},314(n){n.exports=function(n){var r=[];return r.toString=function(){return this.map(function(r){var o="",t=void 0!==r[5];return r[4]&&(o+="@supports (".concat(r[4],") {")),r[2]&&(o+="@media ".concat(r[2]," {")),t&&(o+="@layer".concat(r[5].length>0?" ".concat(r[5]):""," {")),o+=n(r),t&&(o+="}"),r[2]&&(o+="}"),r[4]&&(o+="}"),o}).join("")},r.i=function(n,o,t,e,a){"string"==typeof n&&(n=[[null,n,void 0]]);var i={};if(t)for(var l=0;l<this.length;l++){var c=this[l][0];null!=c&&(i[c]=!0)}for(var s=0;s<n.length;s++){var d=[].concat(n[s]);t&&i[d[0]]||(void 0!==a&&(void 0===d[5]||(d[1]="@layer".concat(d[5].length>0?" ".concat(d[5]):""," {").concat(d[1],"}")),d[5]=a),o&&(d[2]?(d[1]="@media ".concat(d[2]," {").concat(d[1],"}"),d[2]=o):d[2]=o),e&&(d[4]?(d[1]="@supports (".concat(d[4],") {").concat(d[1],"}"),d[4]=e):d[4]="".concat(e)),r.push(d))}},r}},601(n){n.exports=function(n){return n[1]}}};const r={};function o(t){const e=r[t];if(void 0!==e)return e.exports;const a=r[t]={id:t,exports:{}};return n[t](a,a.exports,o),a.exports}o.n=n=>{const r=n&&n.__esModule?()=>n.default:()=>n;return o.d(r,{a:r}),r},o.cw=n=>{var r;return()=>{if(n){var o=n;n=0,r={exports:{}},o.call(r.exports,r,r.exports)}return r.exports}},o.d=(n,r)=>{if(Array.isArray(r))for(var t=0;t<r.length;){var e=r[t++],a=r[t++],i=0===a?{enumerable:!0,value:r[t++]}:{enumerable:!0,get:a};o.o(n,e)||Object.defineProperty(n,e,i)}else for(var e in r)o.o(r,e)&&!o.o(n,e)&&Object.defineProperty(n,e,{enumerable:!0,get:r[e]})},o.o=(n,r)=>Object.prototype.hasOwnProperty.call(n,r),o.nc=void 0;var t=o.cw(function(n,r){var o=Symbol.for("react.transitional.element");Symbol.for("react.fragment"),r.jsx=function(n,r,t){var e=null;if(void 0!==t&&(e=""+t),void 0!==r.key&&(e=""+r.key),"key"in r)for(var a in t={},r)"key"!==a&&(t[a]=r[a]);else t=r;return r=t.ref,{$$typeof:o,type:n,key:e,ref:void 0!==r?r:null,props:t}}}),e=o.cw(function(n,r){n.exports=t()}),a=o.cw(function(n,r){var o=[];function t(n){for(var r=-1,t=0;t<o.length;t++)if(o[t].identifier===n){r=t;break}return r}function e(n,r){for(var e={},i=[],l=0;l<n.length;l++){var c=n[l],s=r.base?c[0]+r.base:c[0],d=e[s]||0,u="".concat(s," ").concat(d);e[s]=d+1;var f=t(u),p={css:c[1],media:c[2],sourceMap:c[3],supports:c[4],layer:c[5]};if(-1!==f)o[f].references++,o[f].updater(p);else{var v=a(p,r);r.byIndex=l,o.splice(l,0,{identifier:u,updater:v,references:1})}i.push(u)}return i}function a(n,r){var o=r.domAPI(r);return o.update(n),function(r){if(r){if(r.css===n.css&&r.media===n.media&&r.sourceMap===n.sourceMap&&r.supports===n.supports&&r.layer===n.layer)return;o.update(n=r)}else o.remove()}}n.exports=function(n,r){var a=e(n=n||[],r=r||{});return function(n){n=n||[];for(var i=0;i<a.length;i++){var l=t(a[i]);o[l].references--}for(var c=e(n,r),s=0;s<a.length;s++){var d=t(a[s]);0===o[d].references&&(o[d].updater(),o.splice(d,1))}a=c}}}),i=o.cw(function(n,r){var o={};n.exports=function(n,r){var t=function(n){if(void 0===o[n]){var r=document.querySelector(n);if(window.HTMLIFrameElement&&r instanceof window.HTMLIFrameElement)try{r=r.contentDocument.head}catch(n){r=null}o[n]=r}return o[n]}(n);if(!t)throw new Error("Couldn't find a style target. This probably means that the value for the 'insert' parameter is invalid.");t.appendChild(r)}}),l=o.cw(function(n,r){n.exports=function(n){var r=document.createElement("style");return n.setAttributes(r,n.attributes),n.insert(r,n.options),r}}),c=o.cw(function(n,r){n.exports=function(n){var r=o.nc;r&&n.setAttribute("nonce",r)}}),s=o.cw(function(n,r){n.exports=function(n){if("undefined"==typeof document)return{update:function(){},remove:function(){}};var r=n.insertStyleElement(n);return{update:function(o){!function(n,r,o){var t="";o.supports&&(t+="@supports (".concat(o.supports,") {")),o.media&&(t+="@media ".concat(o.media," {"));var e=void 0!==o.layer;e&&(t+="@layer".concat(o.layer.length>0?" ".concat(o.layer):""," {")),t+=o.css,e&&(t+="}"),o.media&&(t+="}"),o.supports&&(t+="}");var a=o.sourceMap;a&&"undefined"!=typeof btoa&&(t+="\n/*# sourceMappingURL=data:application/json;base64,".concat(btoa(unescape(encodeURIComponent(JSON.stringify(a))))," */")),r.styleTagTransform(t,n,r.options)}(r,n,o)},remove:function(){!function(n){if(null===n.parentNode)return!1;n.parentNode.removeChild(n)}(r)}}}}),d=o.cw(function(n,r){n.exports=function(n,r){if(r.styleSheet)r.styleSheet.cssText=n;else{for(;r.firstChild;)r.removeChild(r.firstChild);r.appendChild(document.createTextNode(n))}}});function u(){return u.c||(u.c=o.n(a()))}function f(){return f.c||(f.c=o.n(s()))}function p(){return p.c||(p.c=o.n(i()))}function v(){return v.c||(v.c=o.n(c()))}function h(){return h.c||(h.c=o.n(l()))}function m(){return m.c||(m.c=o.n(d()))}a(),s(),i(),c(),l(),d();var g=o(208),b={};b.styleTagTransform=m()(),b.setAttributes=v()(),b.insert=p()().bind(null,"head"),b.domAPI=f()(),b.insertStyleElement=h()(),u()()(g.A,b),g.A&&g.A.locals&&g.A.locals,e();var y=o(784),x={};x.styleTagTransform=m()(),x.setAttributes=v()(),x.insert=p()().bind(null,"head"),x.domAPI=f()(),x.insertStyleElement=h()(),u()()(y.A,x),y.A&&y.A.locals&&y.A.locals;const w=({variant:n="primary",size:r="medium",className:o,children:e,...a})=>{const i=["button",`button-${n}`,`button-${r}`,o].filter(Boolean).join(" ");return(0,t().jsx)("button",{...a,className:i,children:e})};var A=o(666),z={};z.styleTagTransform=m()(),z.setAttributes=v()(),z.insert=p()().bind(null,"head"),z.domAPI=f()(),z.insertStyleElement=h()(),u()()(A.A,z),A.A&&A.A.locals&&A.A.locals;const S=({inputSize:n="medium",className:r,...o})=>{const e=["input",`input-${n}`,r].filter(Boolean).join(" ");return(0,t().jsx)("input",{...o,className:e})};var T=o(954),k={};k.styleTagTransform=m()(),k.setAttributes=v()(),k.insert=p()().bind(null,"head"),k.domAPI=f()(),k.insertStyleElement=h()(),u()()(T.A,k),T.A&&T.A.locals&&T.A.locals;const I={"heading-1":"h1","heading-2":"h2","heading-3":"h3","body-lg":"p",body:"p","body-sm":"p",label:"span"},E=({variant:n="body",className:r,children:o,...e})=>{const a=["typography",`typography-${n}`,r].filter(Boolean).join(" "),i=I[n];return(0,t().jsx)(i,{...e,className:a,children:o})};export{w as Button,S as Input,E as Typography};
|
package/package.json
CHANGED
|
@@ -1,8 +1,16 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ingamigo/ui",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.8",
|
|
4
4
|
"description": "UI component library and design system for IngAmigo",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
|
+
"module": "./dist/index.js",
|
|
7
|
+
"types": "./dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"types": "./dist/index.d.ts",
|
|
11
|
+
"import": "./dist/index.js"
|
|
12
|
+
}
|
|
13
|
+
},
|
|
6
14
|
"repository": {
|
|
7
15
|
"type": "git",
|
|
8
16
|
"url": "git+https://github.com/workshop-ideas/ingamigo-ui.git"
|
package/dist/test/setup.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
import "@testing-library/jest-dom/vitest";
|