eidotter 0.3.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.
Files changed (61) hide show
  1. package/LICENSE.md +67 -0
  2. package/README.md +234 -0
  3. package/dist/components/Accordion/components/AccordionFill.d.ts +10 -0
  4. package/dist/components/Accordion/components/Section.d.ts +29 -0
  5. package/dist/components/Accordion/components/index.d.ts +2 -0
  6. package/dist/components/Accordion/index.d.ts +1 -0
  7. package/dist/components/Alert/components/Alert.d.ts +33 -0
  8. package/dist/components/Alert/components/index.d.ts +1 -0
  9. package/dist/components/Alert/index.d.ts +1 -0
  10. package/dist/components/Badge/components/Badge.d.ts +39 -0
  11. package/dist/components/Badge/components/index.d.ts +2 -0
  12. package/dist/components/Badge/index.d.ts +2 -0
  13. package/dist/components/Breadcrumb/components/Breadcrumb.d.ts +55 -0
  14. package/dist/components/Breadcrumb/components/index.d.ts +2 -0
  15. package/dist/components/Breadcrumb/index.d.ts +2 -0
  16. package/dist/components/Button/components/Button.d.ts +56 -0
  17. package/dist/components/Button/components/index.d.ts +2 -0
  18. package/dist/components/Button/index.d.ts +2 -0
  19. package/dist/components/Card/components/Card.d.ts +25 -0
  20. package/dist/components/Card/components/index.d.ts +2 -0
  21. package/dist/components/Card/index.d.ts +2 -0
  22. package/dist/components/Checkbox/components/Checkbox.d.ts +41 -0
  23. package/dist/components/Checkbox/components/index.d.ts +2 -0
  24. package/dist/components/Checkbox/index.d.ts +2 -0
  25. package/dist/components/CommandPrompt/components/CommandPrompt.d.ts +40 -0
  26. package/dist/components/CommandPrompt/components/index.d.ts +1 -0
  27. package/dist/components/CommandPrompt/index.d.ts +1 -0
  28. package/dist/components/Icon/components/Icon.d.ts +41 -0
  29. package/dist/components/Icon/components/index.d.ts +1 -0
  30. package/dist/components/Icon/index.d.ts +1 -0
  31. package/dist/components/Input/components/Input.d.ts +22 -0
  32. package/dist/components/Input/components/index.d.ts +1 -0
  33. package/dist/components/Input/index.d.ts +1 -0
  34. package/dist/components/Modal/components/Modal.d.ts +29 -0
  35. package/dist/components/Modal/components/index.d.ts +2 -0
  36. package/dist/components/Modal/index.d.ts +2 -0
  37. package/dist/components/Progress/components/Progress.d.ts +33 -0
  38. package/dist/components/Progress/components/index.d.ts +2 -0
  39. package/dist/components/Progress/index.d.ts +2 -0
  40. package/dist/components/RetroEffects/components/RetroEffects.d.ts +35 -0
  41. package/dist/components/RetroEffects/components/index.d.ts +2 -0
  42. package/dist/components/RetroEffects/index.d.ts +2 -0
  43. package/dist/components/Switch/components/Switch.d.ts +51 -0
  44. package/dist/components/Switch/components/index.d.ts +2 -0
  45. package/dist/components/Switch/index.d.ts +2 -0
  46. package/dist/components/Tabs/components/Tabs.d.ts +62 -0
  47. package/dist/components/Tabs/components/index.d.ts +2 -0
  48. package/dist/components/Tabs/index.d.ts +2 -0
  49. package/dist/components/Terminal/components/Terminal.d.ts +61 -0
  50. package/dist/components/Terminal/components/index.d.ts +1 -0
  51. package/dist/components/Terminal/index.d.ts +1 -0
  52. package/dist/components/TimelineNode/components/TimelineNode.d.ts +52 -0
  53. package/dist/components/TimelineNode/components/index.d.ts +2 -0
  54. package/dist/components/TimelineNode/index.d.ts +2 -0
  55. package/dist/index.d.ts +34 -0
  56. package/dist/index.es.js +1395 -0
  57. package/dist/index.umd.js +37 -0
  58. package/dist/style.css +1 -0
  59. package/package.json +106 -0
  60. package/src/styles/tokens.css +92 -0
  61. package/tailwind.preset.cjs +124 -0
@@ -0,0 +1,37 @@
1
+ (function(E,R){typeof exports=="object"&&typeof module<"u"?R(exports,require("react"),require("react-dom")):typeof define=="function"&&define.amd?define(["exports","react","react-dom"],R):(E=typeof globalThis<"u"?globalThis:E||self,R(E.eidotter={},E.React,E.ReactDOM))})(this,function(E,R,We){"use strict";var re={exports:{}},U={};/**
2
+ * @license React
3
+ * react-jsx-runtime.production.min.js
4
+ *
5
+ * Copyright (c) Facebook, Inc. and its affiliates.
6
+ *
7
+ * This source code is licensed under the MIT license found in the
8
+ * LICENSE file in the root directory of this source tree.
9
+ */var fe;function Le(){if(fe)return U;fe=1;var l=R,u=Symbol.for("react.element"),d=Symbol.for("react.fragment"),n=Object.prototype.hasOwnProperty,s=l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,i={key:!0,ref:!0,__self:!0,__source:!0};function o(h,c,p){var m,_={},w=null,A=null;p!==void 0&&(w=""+p),c.key!==void 0&&(w=""+c.key),c.ref!==void 0&&(A=c.ref);for(m in c)n.call(c,m)&&!i.hasOwnProperty(m)&&(_[m]=c[m]);if(h&&h.defaultProps)for(m in c=h.defaultProps,c)_[m]===void 0&&(_[m]=c[m]);return{$$typeof:u,type:h,key:w,ref:A,props:_,_owner:s.current}}return U.Fragment=d,U.jsx=o,U.jsxs=o,U}var J={};/**
10
+ * @license React
11
+ * react-jsx-runtime.development.js
12
+ *
13
+ * Copyright (c) Facebook, Inc. and its affiliates.
14
+ *
15
+ * This source code is licensed under the MIT license found in the
16
+ * LICENSE file in the root directory of this source tree.
17
+ */var me;function Ye(){return me||(me=1,process.env.NODE_ENV!=="production"&&function(){var l=R,u=Symbol.for("react.element"),d=Symbol.for("react.portal"),n=Symbol.for("react.fragment"),s=Symbol.for("react.strict_mode"),i=Symbol.for("react.profiler"),o=Symbol.for("react.provider"),h=Symbol.for("react.context"),c=Symbol.for("react.forward_ref"),p=Symbol.for("react.suspense"),m=Symbol.for("react.suspense_list"),_=Symbol.for("react.memo"),w=Symbol.for("react.lazy"),A=Symbol.for("react.offscreen"),B=Symbol.iterator,x="@@iterator";function O(e){if(e===null||typeof e!="object")return null;var t=B&&e[B]||e[x];return typeof t=="function"?t:null}var k=l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;function y(e){{for(var t=arguments.length,a=new Array(t>1?t-1:0),f=1;f<t;f++)a[f-1]=arguments[f];P("error",e,a)}}function P(e,t,a){{var f=k.ReactDebugCurrentFrame,j=f.getStackAddendum();j!==""&&(t+="%s",a=a.concat([j]));var g=a.map(function(b){return String(b)});g.unshift("Warning: "+t),Function.prototype.apply.call(console[e],console,g)}}var Y=!1,I=!1,z=!1,te=!1,M=!1,ve;ve=Symbol.for("react.module.reference");function ir(e){return!!(typeof e=="string"||typeof e=="function"||e===n||e===i||M||e===s||e===p||e===m||te||e===A||Y||I||z||typeof e=="object"&&e!==null&&(e.$$typeof===w||e.$$typeof===_||e.$$typeof===o||e.$$typeof===h||e.$$typeof===c||e.$$typeof===ve||e.getModuleId!==void 0))}function or(e,t,a){var f=e.displayName;if(f)return f;var j=t.displayName||t.name||"";return j!==""?a+"("+j+")":a}function pe(e){return e.displayName||"Context"}function F(e){if(e==null)return null;if(typeof e.tag=="number"&&y("Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."),typeof e=="function")return e.displayName||e.name||null;if(typeof e=="string")return e;switch(e){case n:return"Fragment";case d:return"Portal";case i:return"Profiler";case s:return"StrictMode";case p:return"Suspense";case m:return"SuspenseList"}if(typeof e=="object")switch(e.$$typeof){case h:var t=e;return pe(t)+".Consumer";case o:var a=e;return pe(a._context)+".Provider";case c:return or(e,e.render,"ForwardRef");case _:var f=e.displayName||null;return f!==null?f:F(e.type)||"Memo";case w:{var j=e,g=j._payload,b=j._init;try{return F(b(g))}catch{return null}}}return null}var W=Object.assign,G=0,be,je,xe,ye,ge,Ee,Re;function we(){}we.__reactDisabledLog=!0;function lr(){{if(G===0){be=console.log,je=console.info,xe=console.warn,ye=console.error,ge=console.group,Ee=console.groupCollapsed,Re=console.groupEnd;var e={configurable:!0,enumerable:!0,value:we,writable:!0};Object.defineProperties(console,{info:e,log:e,warn:e,error:e,group:e,groupCollapsed:e,groupEnd:e})}G++}}function cr(){{if(G--,G===0){var e={configurable:!0,enumerable:!0,writable:!0};Object.defineProperties(console,{log:W({},e,{value:be}),info:W({},e,{value:je}),warn:W({},e,{value:xe}),error:W({},e,{value:ye}),group:W({},e,{value:ge}),groupCollapsed:W({},e,{value:Ee}),groupEnd:W({},e,{value:Re})})}G<0&&y("disabledDepth fell below zero. This is a bug in React. Please file an issue.")}}var ae=k.ReactCurrentDispatcher,ne;function Q(e,t,a){{if(ne===void 0)try{throw Error()}catch(j){var f=j.stack.trim().match(/\n( *(at )?)/);ne=f&&f[1]||""}return`
18
+ `+ne+e}}var se=!1,Z;{var ur=typeof WeakMap=="function"?WeakMap:Map;Z=new ur}function Ne(e,t){if(!e||se)return"";{var a=Z.get(e);if(a!==void 0)return a}var f;se=!0;var j=Error.prepareStackTrace;Error.prepareStackTrace=void 0;var g;g=ae.current,ae.current=null,lr();try{if(t){var b=function(){throw Error()};if(Object.defineProperty(b.prototype,"props",{set:function(){throw Error()}}),typeof Reflect=="object"&&Reflect.construct){try{Reflect.construct(b,[])}catch(T){f=T}Reflect.construct(e,[],b)}else{try{b.call()}catch(T){f=T}e.call(b.prototype)}}else{try{throw Error()}catch(T){f=T}e()}}catch(T){if(T&&f&&typeof T.stack=="string"){for(var v=T.stack.split(`
19
+ `),S=f.stack.split(`
20
+ `),N=v.length-1,C=S.length-1;N>=1&&C>=0&&v[N]!==S[C];)C--;for(;N>=1&&C>=0;N--,C--)if(v[N]!==S[C]){if(N!==1||C!==1)do if(N--,C--,C<0||v[N]!==S[C]){var D=`
21
+ `+v[N].replace(" at new "," at ");return e.displayName&&D.includes("<anonymous>")&&(D=D.replace("<anonymous>",e.displayName)),typeof e=="function"&&Z.set(e,D),D}while(N>=1&&C>=0);break}}}finally{se=!1,ae.current=g,cr(),Error.prepareStackTrace=j}var V=e?e.displayName||e.name:"",L=V?Q(V):"";return typeof e=="function"&&Z.set(e,L),L}function dr(e,t,a){return Ne(e,!1)}function fr(e){var t=e.prototype;return!!(t&&t.isReactComponent)}function q(e,t,a){if(e==null)return"";if(typeof e=="function")return Ne(e,fr(e));if(typeof e=="string")return Q(e);switch(e){case p:return Q("Suspense");case m:return Q("SuspenseList")}if(typeof e=="object")switch(e.$$typeof){case c:return dr(e.render);case _:return q(e.type,t,a);case w:{var f=e,j=f._payload,g=f._init;try{return q(g(j),t,a)}catch{}}}return""}var X=Object.prototype.hasOwnProperty,Ce={},ke=k.ReactDebugCurrentFrame;function ee(e){if(e){var t=e._owner,a=q(e.type,e._source,t?t.type:null);ke.setExtraStackFrame(a)}else ke.setExtraStackFrame(null)}function mr(e,t,a,f,j){{var g=Function.call.bind(X);for(var b in e)if(g(e,b)){var v=void 0;try{if(typeof e[b]!="function"){var S=Error((f||"React class")+": "+a+" type `"+b+"` is invalid; it must be a function, usually from the `prop-types` package, but received `"+typeof e[b]+"`.This often happens because of typos such as `PropTypes.function` instead of `PropTypes.func`.");throw S.name="Invariant Violation",S}v=e[b](t,b,f,a,null,"SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED")}catch(N){v=N}v&&!(v instanceof Error)&&(ee(j),y("%s: type specification of %s `%s` is invalid; the type checker function must return `null` or an `Error` but returned a %s. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).",f||"React class",a,b,typeof v),ee(null)),v instanceof Error&&!(v.message in Ce)&&(Ce[v.message]=!0,ee(j),y("Failed %s type: %s",a,v.message),ee(null))}}}var hr=Array.isArray;function ie(e){return hr(e)}function _r(e){{var t=typeof Symbol=="function"&&Symbol.toStringTag,a=t&&e[Symbol.toStringTag]||e.constructor.name||"Object";return a}}function vr(e){try{return Se(e),!1}catch{return!0}}function Se(e){return""+e}function Te(e){if(vr(e))return y("The provided key is an unsupported type %s. This value must be coerced to a string before before using it here.",_r(e)),Se(e)}var H=k.ReactCurrentOwner,pr={key:!0,ref:!0,__self:!0,__source:!0},Oe,Pe,oe;oe={};function br(e){if(X.call(e,"ref")){var t=Object.getOwnPropertyDescriptor(e,"ref").get;if(t&&t.isReactWarning)return!1}return e.ref!==void 0}function jr(e){if(X.call(e,"key")){var t=Object.getOwnPropertyDescriptor(e,"key").get;if(t&&t.isReactWarning)return!1}return e.key!==void 0}function xr(e,t){if(typeof e.ref=="string"&&H.current&&t&&H.current.stateNode!==t){var a=F(H.current.type);oe[a]||(y('Component "%s" contains the string ref "%s". Support for string refs will be removed in a future major release. This case cannot be automatically converted to an arrow function. We ask you to manually fix this case by using useRef() or createRef() instead. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-string-ref',F(H.current.type),e.ref),oe[a]=!0)}}function yr(e,t){{var a=function(){Oe||(Oe=!0,y("%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",t))};a.isReactWarning=!0,Object.defineProperty(e,"key",{get:a,configurable:!0})}}function gr(e,t){{var a=function(){Pe||(Pe=!0,y("%s: `ref` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://reactjs.org/link/special-props)",t))};a.isReactWarning=!0,Object.defineProperty(e,"ref",{get:a,configurable:!0})}}var Er=function(e,t,a,f,j,g,b){var v={$$typeof:u,type:e,key:t,ref:a,props:b,_owner:g};return v._store={},Object.defineProperty(v._store,"validated",{configurable:!1,enumerable:!1,writable:!0,value:!1}),Object.defineProperty(v,"_self",{configurable:!1,enumerable:!1,writable:!1,value:f}),Object.defineProperty(v,"_source",{configurable:!1,enumerable:!1,writable:!1,value:j}),Object.freeze&&(Object.freeze(v.props),Object.freeze(v)),v};function Rr(e,t,a,f,j){{var g,b={},v=null,S=null;a!==void 0&&(Te(a),v=""+a),jr(t)&&(Te(t.key),v=""+t.key),br(t)&&(S=t.ref,xr(t,j));for(g in t)X.call(t,g)&&!pr.hasOwnProperty(g)&&(b[g]=t[g]);if(e&&e.defaultProps){var N=e.defaultProps;for(g in N)b[g]===void 0&&(b[g]=N[g])}if(v||S){var C=typeof e=="function"?e.displayName||e.name||"Unknown":e;v&&yr(b,C),S&&gr(b,C)}return Er(e,v,S,j,f,H.current,b)}}var le=k.ReactCurrentOwner,De=k.ReactDebugCurrentFrame;function K(e){if(e){var t=e._owner,a=q(e.type,e._source,t?t.type:null);De.setExtraStackFrame(a)}else De.setExtraStackFrame(null)}var ce;ce=!1;function ue(e){return typeof e=="object"&&e!==null&&e.$$typeof===u}function Ae(){{if(le.current){var e=F(le.current.type);if(e)return`
22
+
23
+ Check the render method of \``+e+"`."}return""}}function wr(e){{if(e!==void 0){var t=e.fileName.replace(/^.*[\\\/]/,""),a=e.lineNumber;return`
24
+
25
+ Check your code at `+t+":"+a+"."}return""}}var Ie={};function Nr(e){{var t=Ae();if(!t){var a=typeof e=="string"?e:e.displayName||e.name;a&&(t=`
26
+
27
+ Check the top-level render call using <`+a+">.")}return t}}function $e(e,t){{if(!e._store||e._store.validated||e.key!=null)return;e._store.validated=!0;var a=Nr(t);if(Ie[a])return;Ie[a]=!0;var f="";e&&e._owner&&e._owner!==le.current&&(f=" It was passed a child from "+F(e._owner.type)+"."),K(e),y('Each child in a list should have a unique "key" prop.%s%s See https://reactjs.org/link/warning-keys for more information.',a,f),K(null)}}function Be(e,t){{if(typeof e!="object")return;if(ie(e))for(var a=0;a<e.length;a++){var f=e[a];ue(f)&&$e(f,t)}else if(ue(e))e._store&&(e._store.validated=!0);else if(e){var j=O(e);if(typeof j=="function"&&j!==e.entries)for(var g=j.call(e),b;!(b=g.next()).done;)ue(b.value)&&$e(b.value,t)}}}function Cr(e){{var t=e.type;if(t==null||typeof t=="string")return;var a;if(typeof t=="function")a=t.propTypes;else if(typeof t=="object"&&(t.$$typeof===c||t.$$typeof===_))a=t.propTypes;else return;if(a){var f=F(t);mr(a,e.props,"prop",f,e)}else if(t.PropTypes!==void 0&&!ce){ce=!0;var j=F(t);y("Component %s declared `PropTypes` instead of `propTypes`. Did you misspell the property assignment?",j||"Unknown")}typeof t.getDefaultProps=="function"&&!t.getDefaultProps.isReactClassApproved&&y("getDefaultProps is only used on classic React.createClass definitions. Use a static property named `defaultProps` instead.")}}function kr(e){{for(var t=Object.keys(e.props),a=0;a<t.length;a++){var f=t[a];if(f!=="children"&&f!=="key"){K(e),y("Invalid prop `%s` supplied to `React.Fragment`. React.Fragment can only have `key` and `children` props.",f),K(null);break}}e.ref!==null&&(K(e),y("Invalid attribute `ref` supplied to `React.Fragment`."),K(null))}}var Fe={};function Me(e,t,a,f,j,g){{var b=ir(e);if(!b){var v="";(e===void 0||typeof e=="object"&&e!==null&&Object.keys(e).length===0)&&(v+=" You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.");var S=wr(j);S?v+=S:v+=Ae();var N;e===null?N="null":ie(e)?N="array":e!==void 0&&e.$$typeof===u?(N="<"+(F(e.type)||"Unknown")+" />",v=" Did you accidentally export a JSX literal instead of a component?"):N=typeof e,y("React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: %s.%s",N,v)}var C=Rr(e,t,a,j,g);if(C==null)return C;if(b){var D=t.children;if(D!==void 0)if(f)if(ie(D)){for(var V=0;V<D.length;V++)Be(D[V],e);Object.freeze&&Object.freeze(D)}else y("React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead.");else Be(D,e)}if(X.call(t,"key")){var L=F(e),T=Object.keys(t).filter(function(Ar){return Ar!=="key"}),de=T.length>0?"{key: someKey, "+T.join(": ..., ")+": ...}":"{key: someKey}";if(!Fe[L+de]){var Dr=T.length>0?"{"+T.join(": ..., ")+": ...}":"{}";y(`A props object containing a "key" prop is being spread into JSX:
28
+ let props = %s;
29
+ <%s {...props} />
30
+ React keys must be passed directly to JSX without using spread:
31
+ let props = %s;
32
+ <%s key={someKey} {...props} />`,de,L,Dr,L),Fe[L+de]=!0}}return e===n?kr(C):Cr(C),C}}function Sr(e,t,a){return Me(e,t,a,!0)}function Tr(e,t,a){return Me(e,t,a,!1)}var Or=Tr,Pr=Sr;J.Fragment=n,J.jsx=Or,J.jsxs=Pr}()),J}process.env.NODE_ENV==="production"?re.exports=Le():re.exports=Ye();var r=re.exports;const Ir="",$r="",$=({name:l,size:u="L",className:d="",onClick:n,color:s,role:i})=>{const o=process.env.NODE_ENV==="production"?"/eiDotter":"";return r.jsx("svg",{className:`icon ${u==="L"?"icon--l":"icon--s"} ${d} ${i?`icon--${i}`:""}`.trim(),onClick:n,role:i,"aria-label":`${l} icon`,style:s?{color:s}:void 0,children:r.jsx("use",{href:`${o}/icons/sprites.svg#${l}`})})},ze={info:"Info",success:"Done",warning:"Warning",error:"Error"},Ke=({size:l="L",type:u="info",title:d="Notification Title",children:n="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Blandit amet diam neque bibendum. Quisque in praesent sit erat...",onClose:s,onClickHere:i,className:o=""})=>r.jsxs("div",{className:`alert alert--${l.toLowerCase()} alert--${u} ${o}`.trim(),children:[r.jsxs("div",{className:"alert__header",children:[r.jsx("div",{className:"alert__icon",children:r.jsx($,{name:ze[u],size:"L","aria-label":`${u} alert`})}),r.jsx("div",{className:"alert__title",children:d}),s&&r.jsx("button",{className:"alert__close",onClick:s,"aria-label":"Close alert",children:r.jsx($,{name:"Close",size:"S"})})]}),r.jsx("div",{className:"alert__content",children:r.jsxs("div",{className:"alert__message",children:[r.jsx("span",{children:n}),i&&r.jsx("button",{className:"alert__link",onClick:i,"aria-label":"Click for more information",children:"Click here"})]})})]}),Br="",he=({title:l,children:u,defaultExpanded:d=!1,isHovered:n=!1,isActive:s=!1,onToggle:i})=>{const[o,h]=R.useState(d);R.useEffect(()=>{h(d)},[d]);const c=()=>{const p=!o;h(p),i==null||i(p)};return r.jsxs("div",{className:`
33
+ section
34
+ ${o?"section--expanded":""}
35
+ ${n?"section--hover":""}
36
+ ${s?"section--active":""}
37
+ `.trim(),children:[r.jsxs("button",{className:"section__header",onClick:c,"aria-expanded":o,children:[r.jsx("div",{className:"section__title",children:l}),r.jsx("div",{className:"section__icon",children:r.jsx($,{name:o?"Chevron Up":"Chevron Down",size:"S"})})]}),o&&r.jsx("div",{className:"section__content",children:u})]})},Fr="",Ve=({sections:l,defaultExpandedIndex:u=-1})=>{const[d,n]=R.useState(u),s=(i,o)=>{n(o?i:-1)};return r.jsx("div",{className:"accordion-fill",children:l.map((i,o)=>r.jsx(he,{title:i.title,defaultExpanded:o===u,onToggle:h=>s(o,h),children:i.content},o))})},Mr="",Ue=({variant:l="primary",size:u="medium",type:d="button",disabled:n=!1,loading:s=!1,children:i,onClick:o,className:h="",fullWidth:c=!1,...p})=>{const m=w=>{n||s||o==null||o(w)},_=["button",`button--${l}`,`button--${u}`,n&&"button--disabled",s&&"button--loading",c&&"button--full-width",h].filter(Boolean).join(" ");return r.jsxs("button",{type:d,className:_,onClick:m,disabled:n||s,"aria-disabled":n||s,...p,children:[s&&r.jsx("span",{className:"button__loading-indicator","aria-hidden":"true",children:"█"}),r.jsx("span",{className:`button__content ${s?"button__content--loading":""}`,children:i})]})},Wr="",Je=({title:l,children:u,footer:d,variant:n="default",className:s="",...i})=>{const o=["card",`card--${n}`,s].filter(Boolean).join(" ");return r.jsxs("div",{className:o,...i,children:[l&&r.jsx("div",{className:"card__header",children:r.jsx("span",{className:"card__title",children:l})}),r.jsx("div",{className:"card__body",children:u}),d&&r.jsx("div",{className:"card__footer",children:d})]})},Lr="",Ge=({checked:l,defaultChecked:u,onChange:d,label:n,disabled:s=!1,name:i,value:o,className:h="","aria-label":c,...p})=>{const m=w=>{s||d==null||d(w.target.checked)},_=["checkbox",s&&"checkbox--disabled",h].filter(Boolean).join(" ");return r.jsxs("label",{className:_,children:[r.jsx("input",{type:"checkbox",className:"checkbox__input",checked:l,defaultChecked:u,onChange:m,disabled:s,name:i,value:o,"aria-label":c||n,...p}),r.jsx("span",{className:"checkbox__box","aria-hidden":"true"}),n&&r.jsx("span",{className:"checkbox__label",children:n})]})},Yr="",Xe=({prompt:l="C:\\>",onCommand:u,autoFocus:d=!1,className:n="",placeholder:s,disabled:i=!1})=>{const[o,h]=R.useState(""),c=R.useRef(null);R.useEffect(()=>{d&&c.current&&c.current.focus()},[d]);const p=_=>{_.key==="Enter"&&o.trim()&&!i&&(u(o.trim()),h(""))},m=()=>{!i&&c.current&&c.current.focus()};return r.jsxs("div",{className:`command-prompt ${i?"command-prompt--disabled":""} ${n}`.trim(),onClick:m,role:"textbox","aria-label":"Command prompt",children:[r.jsx("span",{className:"command-prompt__prompt","aria-hidden":"true",children:l}),r.jsx("input",{ref:c,className:"command-prompt__input",value:o,onChange:_=>h(_.target.value),onKeyDown:p,autoFocus:d,spellCheck:!1,autoComplete:"off",autoCapitalize:"off",autoCorrect:"off",placeholder:s,disabled:i,"aria-label":"Command input"}),r.jsx("span",{className:"command-prompt__cursor","aria-hidden":"true",children:"█"})]})},zr="",He=({value:l,max:u=100,variant:d="default",size:n="medium",showLabel:s=!1,className:i="","aria-label":o,...h})=>{const c=Math.min(100,Math.max(0,l/u*100)),p=Math.round(c/5),m=20-p,_=["progress",`progress--${d}`,`progress--${n}`,i].filter(Boolean).join(" ");return r.jsxs("div",{className:_,role:"progressbar","aria-valuenow":l,"aria-valuemin":0,"aria-valuemax":u,"aria-label":o||`Progress: ${Math.round(c)}%`,...h,children:[r.jsxs("span",{className:"progress__bar",children:[r.jsx("span",{className:"progress__fill",children:"█".repeat(p)}),r.jsx("span",{className:"progress__empty",children:"░".repeat(m)})]}),s&&r.jsxs("span",{className:"progress__label",children:[Math.round(c),"%"]})]})},Kr="",_e=R.forwardRef(({variant:l="default",className:u="",disabled:d,...n},s)=>{const i=["input",`input--${l}`,d&&"input--disabled",u].filter(Boolean).join(" ");return r.jsx("input",{ref:s,className:i,disabled:d,"aria-invalid":l==="error",...n})});_e.displayName="Input";const Vr="",Qe=({size:l="medium",title:u="MS-DOS Terminal",state:d="active",resizable:n=!0,minimizable:s=!0,maximizable:i=!0,closeable:o=!0,children:h,onMinimize:c,onMaximize:p,onClose:m,onFocus:_,className:w="",autoFocus:A=!1})=>{const[B,x]=R.useState(d),[O,k]=R.useState(!1),y=R.useRef(null);R.useEffect(()=>{A&&y.current&&y.current.focus()},[A]);const P=()=>{x("minimized"),c==null||c()},Y=()=>{k(!O),p==null||p()},I=()=>{m==null||m()},z=()=>{x("active"),_==null||_()},te=M=>{M.altKey&&M.key==="F4"&&o&&(M.preventDefault(),I())};return B==="minimized"?r.jsx("div",{className:`terminal terminal--minimized ${w}`.trim(),onClick:z,role:"button",tabIndex:0,"aria-label":`Restore ${u} window`,onKeyDown:M=>M.key==="Enter"&&z(),children:r.jsxs("div",{className:"terminal__taskbar-item",children:[r.jsx($,{name:"App",size:"S"}),r.jsx("span",{className:"terminal__taskbar-title",children:u})]})}):r.jsxs("div",{ref:y,className:`terminal terminal--${l} terminal--${B} ${O?"terminal--maximized":""} ${w}`.trim(),tabIndex:0,role:"dialog","aria-label":`${u} terminal window`,onFocus:z,onKeyDown:te,children:[r.jsxs("div",{className:"terminal__title-bar",children:[r.jsxs("div",{className:"terminal__title",children:[r.jsx($,{name:"App",size:"S","aria-hidden":"true"}),r.jsx("span",{className:"terminal__title-text",children:u})]}),r.jsxs("div",{className:"terminal__controls",children:[s&&r.jsx("button",{className:"terminal__control terminal__control--minimize",onClick:P,"aria-label":"Minimize window",title:"Minimize",children:r.jsx($,{name:"Cancel",size:"S"})}),i&&r.jsx("button",{className:"terminal__control terminal__control--maximize",onClick:Y,"aria-label":O?"Restore window":"Maximize window",title:O?"Restore":"Maximize",children:r.jsx($,{name:O?"Fullscreen":"Add",size:"S"})}),o&&r.jsx("button",{className:"terminal__control terminal__control--close",onClick:I,"aria-label":"Close window",title:"Close",children:r.jsx($,{name:"Close",size:"S"})})]})]}),r.jsx("div",{className:"terminal__content",role:"main",children:h||r.jsx("div",{className:"terminal__default-content",children:r.jsxs("div",{className:"terminal__prompt",children:[r.jsx("span",{className:"terminal__path",children:"C:\\\\>"}),r.jsx("span",{className:"terminal__cursor",children:"█"})]})})}),n&&r.jsx("div",{className:"terminal__resize-handle","aria-hidden":"true"})]})},Ur="",Ze=({tabs:l,variant:u="underline",size:d="medium",activeTab:n,defaultActiveTab:s,onTabChange:i,className:o="",...h})=>{var B;const[c,p]=R.useState(s||((B=l[0])==null?void 0:B.id)||""),m=n!==void 0?n:c,_=R.useCallback((x,O)=>{O||(n===void 0&&p(x),i==null||i(x))},[n,i]),w=R.useCallback((x,O)=>{var Y;const k=l.filter(I=>!I.disabled),y=k.findIndex(I=>I.id===l[O].id);let P=null;switch(x.key){case"ArrowLeft":case"ArrowUp":x.preventDefault(),P=y>0?y-1:k.length-1;break;case"ArrowRight":case"ArrowDown":x.preventDefault(),P=y<k.length-1?y+1:0;break;case"Home":x.preventDefault(),P=0;break;case"End":x.preventDefault(),P=k.length-1;break}if(P!==null){const I=k[P];_(I.id,I.disabled),(Y=document.querySelectorAll('[role="tab"]:not([disabled])')[P])==null||Y.focus()}},[l,_]),A=["tabs",`tabs--${u}`,`tabs--${d}`,o].filter(Boolean).join(" ");return r.jsx("div",{className:A,role:"tablist",...h,children:l.map((x,O)=>{const k=m===x.id,y=["tabs__tab",k&&"tabs__tab--active",x.disabled&&"tabs__tab--disabled"].filter(Boolean).join(" ");return r.jsx("button",{role:"tab",id:`tab-${x.id}`,"aria-selected":k,tabIndex:k?0:-1,disabled:x.disabled,className:y,onClick:()=>_(x.id,x.disabled),onKeyDown:P=>w(P,O),children:x.label},x.id)})})},Jr="",qe=({variant:l="default",size:u="medium",dot:d=!1,children:n,className:s="",...i})=>{const o=["badge",`badge--${l}`,`badge--${u}`,d&&"badge--with-dot",s].filter(Boolean).join(" ");return r.jsxs("span",{className:o,...i,children:[d&&r.jsx("span",{className:"badge__dot","aria-hidden":"true"}),r.jsx("span",{className:"badge__content",children:n})]})},Gr="",er=({checked:l,defaultChecked:u=!1,onCheckedChange:d,disabled:n=!1,name:s,value:i,className:o="",...h})=>{const[c,p]=R.useState(u),m=l!==void 0,_=m?l:c,w=()=>{if(n)return;const x=!_;m||p(x),d==null||d(x)},A=x=>{(x.key===" "||x.key==="Enter")&&(x.preventDefault(),w())},B=["switch",_&&"switch--checked",n&&"switch--disabled",o].filter(Boolean).join(" ");return r.jsxs("button",{type:"button",role:"switch","aria-checked":_,"aria-disabled":n,className:B,onClick:w,onKeyDown:A,disabled:n,...h,children:[r.jsx("span",{className:"switch__track",children:r.jsx("span",{className:"switch__thumb"})}),s&&r.jsx("input",{type:"hidden",name:s,value:_?i||"on":""})]})},Xr="",rr=({trail:l=[],currentLabel:u,showBackArrow:d=!0,separator:n="/",linkComponent:s,className:i=""})=>{const o=["breadcrumb",i].filter(Boolean).join(" "),h=(c,p)=>{const m=r.jsxs(r.Fragment,{children:[d&&p&&r.jsx("span",{className:"breadcrumb__back-arrow","aria-hidden":"true",children:"<"}),r.jsx("span",{children:c.label})]});return s?r.jsx(s,{href:c.href,className:"breadcrumb__link",children:m}):r.jsx("a",{href:c.href,className:"breadcrumb__link",children:m})};return r.jsx("nav",{"aria-label":"Breadcrumb",className:o,children:r.jsxs("ol",{className:"breadcrumb__list",children:[l.map((c,p)=>{const m=p===l.length-1,_=p<l.length-1;return r.jsxs("li",{className:"breadcrumb__item",children:[h(c,m),_&&r.jsx("span",{className:"breadcrumb__separator","aria-hidden":"true",children:n})]},`${c.href}-${c.label}`)}),l.length>0&&r.jsx("li",{className:"breadcrumb__item",children:r.jsx("span",{className:"breadcrumb__separator","aria-hidden":"true",children:n})}),r.jsx("li",{className:"breadcrumb__item breadcrumb__item--current","aria-current":"page",children:r.jsx("span",{className:"breadcrumb__current",children:u})})]})})},Hr="",tr=({scanlines:l=!0,glow:u=!0,flicker:d=!0,intensity:n=1,className:s=""})=>{const i=["retro-effects",s].filter(Boolean).join(" "),o={"--retro-intensity":n};return r.jsxs("div",{className:i,style:o,"aria-hidden":"true",children:[l&&r.jsx("div",{className:"retro-effects__scanlines"}),u&&r.jsx("div",{className:"retro-effects__glow"}),d&&r.jsx("div",{className:"retro-effects__flicker"})]})},Qr="",ar=({shape:l="circle",variant:u="default",isActive:d=!1,label:n,labelPosition:s="left",size:i="medium",className:o="",onClick:h,...c})=>{const p=["timeline-node",`timeline-node--${l}`,`timeline-node--${u}`,`timeline-node--${i}`,`timeline-node--label-${s}`,d&&"timeline-node--active",h&&"timeline-node--interactive",o].filter(Boolean).join(" "),m=()=>{h&&h()},_=w=>{h&&(w.key==="Enter"||w.key===" ")&&(w.preventDefault(),h())};return r.jsxs("div",{className:p,onClick:m,onKeyDown:_,role:h?"button":void 0,tabIndex:h?0:void 0,"aria-pressed":h?d:void 0,...c,children:[n&&s==="left"&&r.jsx("span",{className:"timeline-node__label timeline-node__label--left",children:n}),n&&s==="top"&&r.jsx("span",{className:"timeline-node__label timeline-node__label--top",children:n}),r.jsx("span",{className:"timeline-node__marker","aria-hidden":"true"}),n&&s==="right"&&r.jsx("span",{className:"timeline-node__label timeline-node__label--right",children:n}),n&&s==="bottom"&&r.jsx("span",{className:"timeline-node__label timeline-node__label--bottom",children:n})]})},Zr="",nr=({isOpen:l,onClose:u,title:d,children:n,footer:s,className:i=""})=>{const o=R.useRef(null),h=R.useId();R.useEffect(()=>{const m=o.current;m&&(l&&!m.open?m.showModal():!l&&m.open&&m.close())},[l]);const c=()=>{u()},p=m=>{m.target===o.current&&u()};return We.createPortal(r.jsx("dialog",{ref:o,className:`modal ${i}`.trim(),"aria-labelledby":h,onClose:c,onClick:p,children:r.jsxs("div",{className:"modal__container",children:[r.jsxs("header",{className:"modal__header",children:[r.jsx("h2",{id:h,className:"modal__title",children:d}),r.jsx("button",{type:"button",className:"modal__close",onClick:u,"aria-label":"Close modal",children:r.jsx($,{name:"Close",size:"S"})})]}),r.jsx("div",{className:"modal__body",children:n}),s&&r.jsx("footer",{className:"modal__footer",children:s})]})}),document.body)},sr="0.3.0";E.AccordionFill=Ve,E.Alert=Ke,E.Badge=qe,E.Breadcrumb=rr,E.Button=Ue,E.Card=Je,E.Checkbox=Ge,E.CommandPrompt=Xe,E.Icon=$,E.Input=_e,E.Modal=nr,E.Progress=He,E.RetroEffects=tr,E.Section=he,E.Switch=er,E.Tabs=Ze,E.Terminal=Qe,E.TimelineNode=ar,E.version=sr,Object.defineProperty(E,Symbol.toStringTag,{value:"Module"})});
package/dist/style.css ADDED
@@ -0,0 +1 @@
1
+ .alert{width:100%;position:relative;overflow:hidden;text-align:left;font-size:16px;font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);border:none}.alert--info{background-color:var(--color-semantic-alert-info);color:var(--color-cga-amber)}.alert--success{background-color:var(--color-semantic-alert-success);color:var(--color-cga-brightGreen)}.alert--warning{background-color:var(--color-semantic-alert-warning);color:var(--color-cga-amber)}.alert--error{background-color:var(--color-semantic-alert-error);color:var(--color-cga-brightRed)}.alert--l{width:1020px;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:16px;box-sizing:border-box;gap:4px}.alert--s{width:350px;height:40px;overflow:hidden;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;padding:0 8px;box-sizing:border-box;gap:8px}.alert__header{align-self:stretch;display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;width:100%}.alert__icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0}.alert--s .alert__icon{width:20px;height:20px}.alert--s .alert__icon svg{width:20px!important;height:20px!important}.alert__title{flex:1;position:relative;line-height:140%}.alert__close{display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;background:none;border:none;padding:0;cursor:pointer;color:inherit}.alert__close svg{width:20px!important;height:20px!important}.alert--s .alert__content{display:none}.alert__content{align-self:stretch;display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;padding:0 0 0 32px;font-size:14px}.alert__message{flex:1;position:relative;line-height:140%;color:var(--color-cga-amberDim)}.alert__link{background:none;border:none;padding:0;cursor:pointer;font-family:inherit;font-size:inherit;color:inherit;text-decoration:none}.icon{display:inline-block;vertical-align:middle;fill:currentColor;color:var(--color-system-foreground)}.icon--l{width:56px;height:56px}.icon--s{width:24px;height:24px}.icon[role=button]{cursor:pointer}.icon[role=button]:hover{color:var(--color-system-link-hover)}.section{width:100%;border:1px solid var(--color-semantic-border-default);background-color:var(--color-semantic-background-primary);color:var(--color-semantic-text-primary);font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback)}.section__header{width:100%;display:flex;justify-content:space-between;align-items:center;padding:8px 16px;background:none;border:none;color:inherit;font-family:inherit;cursor:pointer;text-align:left}.section__title{flex:1;font-size:16px;line-height:24px}.section__icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;margin-left:8px;color:inherit}.section__content{padding:16px;border-top:1px solid var(--color-semantic-border-default);font-size:14px;line-height:20px;color:var(--color-semantic-text-secondary)}.section--hover .section__header,.section__header:hover{background-color:var(--color-semantic-background-accent);color:var(--color-semantic-text-secondary)}.section--active .section__header,.section__header:active{background-color:var(--color-semantic-background-secondary);color:var(--color-cga-amber);text-shadow:0 0 8px var(--color-cga-amberGlow)}.section--expanded{border-color:var(--color-semantic-text-secondary)}.section--expanded .section__header{background-color:var(--color-semantic-background-accent);color:var(--color-semantic-text-secondary)}.section__header:focus{outline:none;box-shadow:0 0 0 2px var(--color-semantic-border-focus)}.section__icon{transition:transform .2s ease-in-out}.section--expanded .section__icon{transform:rotate(180deg)}.accordion-fill{width:100%;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:var(--spacing-2);text-align:left;font-size:var(--typography-font-size-base);font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);color:var(--color-semantic-text-secondary)}.accordion-fill>.section{margin-bottom:4px}.accordion-fill>.section:last-child{margin-bottom:0}.button{display:inline-flex;align-items:center;justify-content:center;position:relative;border:none;outline:none;cursor:pointer;text-decoration:none;font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);font-weight:var(--typography-font-weight-regular);line-height:1;white-space:nowrap;-webkit-user-select:none;user-select:none;transition:all .1s ease;box-sizing:border-box;border:2px solid;background-clip:padding-box}.button--primary{background-color:var(--color-semantic-background-accent);color:var(--color-semantic-text-secondary);border-color:var(--color-semantic-border-default)}.button--primary:hover:not(:disabled){background-color:var(--color-semantic-border-focus);border-color:var(--color-semantic-text-secondary);box-shadow:var(--shadow-glow-sm)}.button--primary:active:not(:disabled){background-color:var(--color-semantic-background-accent);border-color:var(--color-semantic-text-disabled)}.button--secondary{background-color:var(--color-semantic-background-secondary);color:var(--color-semantic-text-primary);border-color:var(--color-semantic-border-default)}.button--secondary:hover:not(:disabled){background-color:var(--color-semantic-text-primary);color:var(--color-semantic-background-primary);border-color:var(--color-semantic-text-secondary);box-shadow:var(--shadow-glow-sm)}.button--secondary:active:not(:disabled){background-color:var(--color-semantic-background-secondary);border-color:var(--color-semantic-text-disabled)}.button--ghost{background-color:transparent;color:var(--color-semantic-text-primary);border-color:var(--color-semantic-border-default)}.button--ghost:hover:not(:disabled){background-color:var(--color-semantic-text-primary);color:var(--color-semantic-background-primary);border-color:var(--color-semantic-text-secondary);box-shadow:var(--shadow-glow-sm)}.button--ghost:active:not(:disabled){background-color:var(--color-semantic-background-secondary);color:var(--color-semantic-text-primary)}.button--link{background-color:transparent;color:var(--color-semantic-text-accent);border-color:transparent;text-decoration:underline}.button--link:hover:not(:disabled){color:var(--color-cga-amber-bright);background-color:transparent;border-color:transparent}.button--link:active:not(:disabled){color:var(--color-semantic-text-disabled)}.button--small{font-size:12px;padding:4px 8px;min-height:24px;gap:4px}.button--medium{font-size:14px;padding:8px 16px;min-height:32px;gap:6px}.button--large{font-size:16px;padding:12px 20px;min-height:40px;gap:8px}.button--disabled,.button:disabled{cursor:not-allowed;opacity:.6;background-color:var(--color-semantic-background-secondary)!important;color:var(--color-semantic-text-disabled)!important;border-color:var(--color-semantic-text-disabled)!important}.button--loading{cursor:wait}.button--full-width{width:100%;justify-content:center}.button__loading-indicator{animation:blink 1s infinite;margin-right:4px}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.button__content{display:inline-flex;align-items:center;justify-content:center}.button__content--loading{opacity:.7}.button:focus-visible{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}@media (prefers-contrast: high){.button{border-width:3px}}@media (prefers-reduced-motion: reduce){.button{transition:none}.button__loading-indicator{animation:none}}.card{background-color:var(--color-semantic-background-primary);border:var(--border-width-medium) solid var(--color-semantic-border-default);font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);color:var(--color-semantic-text-primary)}.card--default{border-color:var(--color-semantic-border-default)}.card--elevated{border-color:var(--color-semantic-text-secondary);box-shadow:4px 4px 0 0 var(--color-semantic-text-disabled)}.card--glow{border-color:var(--color-cga-amber);box-shadow:var(--shadow-glow-md)}.card--bordered{border-color:var(--color-semantic-text-accent);border-width:var(--border-width-medium)}.card__header{padding:var(--spacing-2) var(--spacing-3);border-bottom:var(--border-width-thin) solid var(--color-semantic-text-disabled);background-color:var(--color-cga-amber-dim)}.card__title{color:var(--color-semantic-text-secondary);font-size:var(--typography-font-size-base);font-weight:var(--typography-font-weight-bold);text-transform:uppercase}.card__body{padding:var(--spacing-3)}.card__footer{padding:var(--spacing-2) var(--spacing-3);border-top:var(--border-width-thin) solid var(--color-semantic-text-disabled);background-color:var(--color-semantic-background-secondary)}.card:focus-visible{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}@media (prefers-reduced-motion: reduce){.card{transition:none}}.checkbox{display:inline-flex;align-items:center;gap:var(--spacing-2);font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);font-size:var(--typography-font-size-base);color:var(--color-semantic-text-primary);cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox--disabled{cursor:not-allowed;opacity:.6}.checkbox__input{position:absolute;opacity:0;width:0;height:0}.checkbox__box{display:inline-block;white-space:nowrap;text-align:center;color:var(--color-semantic-text-primary)}.checkbox__box:before{content:"[ ]"}.checkbox__input:checked+.checkbox__box:before{content:"[X]";color:var(--color-semantic-text-accent)}.checkbox__input:focus-visible+.checkbox__box{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}.checkbox:hover:not(.checkbox--disabled) .checkbox__box{color:var(--color-semantic-text-secondary)}.checkbox:hover:not(.checkbox--disabled) .checkbox__input:checked+.checkbox__box:before{color:var(--color-semantic-text-secondary)}.checkbox--disabled .checkbox__box{color:var(--color-semantic-text-disabled)}.checkbox--disabled .checkbox__input:checked+.checkbox__box:before{color:var(--color-semantic-text-disabled)}.checkbox__label{color:inherit}@media (prefers-reduced-motion: reduce){.checkbox{transition:none}}.command-prompt{display:flex;align-items:center;font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-base);background:var(--color-semantic-background-primary);color:var(--color-semantic-text-accent);padding:var(--spacing-2);cursor:text}.command-prompt__prompt{color:var(--color-semantic-text-primary);margin-right:var(--spacing-2);white-space:nowrap;-webkit-user-select:none;user-select:none}.command-prompt__input{flex:1;background:transparent;border:none;color:var(--color-semantic-text-primary);font-family:inherit;font-size:inherit;outline:none;padding:0;margin:0;min-width:0}.command-prompt__input::placeholder{color:var(--color-semantic-text-disabled)}.command-prompt__cursor{color:var(--color-semantic-text-primary);animation:blink 1s step-end infinite;-webkit-user-select:none;user-select:none}.command-prompt--disabled{opacity:.5;cursor:not-allowed}.command-prompt--disabled .command-prompt__cursor{animation:none}.command-prompt__input:focus+.command-prompt__cursor{display:none}.progress{display:inline-flex;align-items:center;gap:var(--spacing-2);font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback)}.progress--small{font-size:var(--typography-font-size-xs)}.progress--medium{font-size:var(--typography-font-size-base)}.progress--large{font-size:var(--typography-font-size-lg)}.progress__bar{display:inline-block;letter-spacing:0;line-height:1}.progress__fill{color:var(--color-semantic-text-primary)}.progress--success .progress__fill{color:var(--color-semantic-status-success)}.progress--warning .progress__fill{color:var(--color-semantic-status-warning)}.progress--error .progress__fill{color:var(--color-semantic-status-error)}.progress__empty{color:var(--color-semantic-text-disabled)}.progress__label{color:var(--color-semantic-text-primary);min-width:4ch;text-align:right}@media (prefers-reduced-motion: reduce){.progress{transition:none}}.input{background:var(--color-semantic-background-primary);color:var(--color-semantic-text-primary);border:var(--border-width-medium) solid var(--color-semantic-border-default);font-family:var(--typography-font-family-primary);font-size:var(--typography-font-size-base);padding:var(--spacing-2);outline:none;width:100%;box-sizing:border-box}.input::placeholder{color:var(--color-semantic-text-disabled)}.input:focus{border-color:var(--color-semantic-border-focus);box-shadow:var(--shadow-glow-sm)}.input--error{border-color:var(--color-semantic-status-error)}.input--error:focus{border-color:var(--color-semantic-status-error)}.input--disabled,.input:disabled{opacity:.5;cursor:not-allowed;background:var(--color-semantic-background-primary)}:root{--terminal-bg: var(--color-semantic-background-primary);--terminal-border: var(--color-semantic-text-disabled);--terminal-border-active: var(--color-semantic-text-secondary);--terminal-title-bg: var(--color-semantic-background-secondary);--terminal-title-text: var(--color-semantic-text-secondary);--terminal-title-bg-inactive: var(--color-semantic-background-secondary);--terminal-title-text-inactive: var(--color-semantic-text-primary);--terminal-text: var(--color-semantic-text-primary);--terminal-control-bg: var(--color-semantic-text-primary);--terminal-control-symbol: var(--color-semantic-background-primary)}.terminal{background-color:var(--terminal-bg);border:2px solid var(--terminal-border);color:var(--terminal-text);font-family:Perfect DOS VGA,monospace;display:flex;flex-direction:column;box-shadow:5px 5px #00000080;min-width:320px;min-height:200px}.terminal:focus,.terminal--active{border-color:var(--terminal-border-active);outline:none}.terminal--active .terminal__title-bar{background-color:var(--color-semantic-background-accent)}.terminal--inactive{border-color:var(--terminal-border)}.terminal--inactive .terminal__title-bar{background-color:var(--terminal-title-bg-inactive);color:var(--terminal-title-text-inactive)}.terminal--small{width:480px;height:320px}.terminal--medium{width:640px;height:480px}.terminal--large{width:800px;height:600px}.terminal--maximized{width:100vw;height:100vh;position:fixed;top:0;left:0;border:none;box-shadow:none;z-index:1000}.terminal__title-bar{background-color:var(--terminal-title-bg);color:var(--terminal-title-text);padding:2px 4px;display:flex;justify-content:space-between;align-items:center;-webkit-user-select:none;user-select:none;cursor:default;height:24px}.terminal__title{display:flex;align-items:center;gap:4px}.terminal__controls{display:flex}.terminal__control{background-color:var(--terminal-control-bg);border:1px solid var(--terminal-control-symbol);width:20px;height:20px;margin-left:2px;cursor:default;display:flex;align-items:center;justify-content:center;color:var(--terminal-control-symbol)}.terminal__control:active{filter:invert(1)}.terminal__content{flex-grow:1;padding:8px;overflow-y:auto}.terminal__default-content{display:flex;flex-direction:column}.terminal__prompt{display:flex}.terminal__path{margin-right:4px}.terminal__cursor{background-color:var(--terminal-text);width:8px;height:16px;animation:blink 1s step-end infinite}@keyframes blink{50%{opacity:0}}.terminal__resize-handle{position:absolute;bottom:0;right:0;width:16px;height:16px;cursor:nwse-resize}.terminal--minimized{display:none}.terminal__taskbar-item{display:inline-flex;align-items:center;background-color:var(--terminal-control-bg);border:1px solid var(--color-semantic-background-primary);padding:2px 8px;cursor:default;-webkit-user-select:none;user-select:none}.terminal__taskbar-title{margin-left:4px;color:var(--color-semantic-background-primary)}.tabs{display:inline-flex;align-items:center;gap:0;font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);box-sizing:border-box}.tabs__tab{position:relative;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:none;cursor:pointer;font-family:inherit;font-weight:var(--typography-font-weight-regular);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;transition:all .15s ease;color:var(--color-semantic-text-primary);opacity:.7}.tabs__tab:hover:not(:disabled){opacity:1}.tabs__tab--active{opacity:1}.tabs__tab--disabled{cursor:not-allowed;opacity:.3}.tabs--underline{gap:4px}.tabs--underline .tabs__tab{padding:8px 16px;border-bottom:2px solid transparent}.tabs--underline .tabs__tab--active{border-bottom-color:var(--color-semantic-text-accent);color:var(--color-semantic-text-accent)}.tabs--underline .tabs__tab:hover:not(:disabled):not(.tabs__tab--active){border-bottom-color:var(--color-semantic-border-default)}.tabs--pills{gap:4px;padding:4px;background-color:var(--color-semantic-background-secondary);border:1px solid var(--color-semantic-border-default);border-radius:2px}.tabs--pills .tabs__tab{padding:6px 12px;border-radius:2px}.tabs--pills .tabs__tab--active{background-color:var(--color-semantic-background-accent);color:var(--color-semantic-text-secondary)}.tabs--pills .tabs__tab:hover:not(:disabled):not(.tabs__tab--active){background-color:var(--color-semantic-background-primary)}.tabs--small .tabs__tab{font-size:10px;padding:4px 8px}.tabs--small.tabs--underline .tabs__tab{padding:4px 10px}.tabs--medium .tabs__tab{font-size:12px}.tabs--large .tabs__tab{font-size:14px;padding:10px 20px}.tabs--large.tabs--underline .tabs__tab{padding:10px 20px}.tabs--large.tabs--pills .tabs__tab{padding:8px 16px}.tabs__tab:focus-visible{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}@media (prefers-contrast: high){.tabs--underline .tabs__tab{border-bottom-width:3px}.tabs--pills{border-width:2px}}@media (prefers-reduced-motion: reduce){.tabs__tab{transition:none}}.badge{display:inline-flex;align-items:center;justify-content:center;gap:6px;font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);font-weight:var(--typography-font-weight-regular);line-height:1;white-space:nowrap;-webkit-user-select:none;user-select:none;border-radius:2px;text-transform:uppercase;letter-spacing:.05em;box-sizing:border-box}.badge--small{font-size:10px;padding:2px 6px;min-height:18px;gap:4px}.badge--medium{font-size:12px;padding:4px 8px;min-height:22px;gap:6px}.badge--default{background-color:var(--color-semantic-background-secondary);color:var(--color-semantic-text-primary);border:1px solid var(--color-semantic-border-default)}.badge--success{background-color:transparent;color:var(--color-cga-brightGreen);border:1px solid var(--color-cga-brightGreen)}.badge--warning{background-color:transparent;color:var(--color-cga-yellow);border:1px solid var(--color-cga-yellow)}.badge--error{background-color:transparent;color:var(--color-cga-brightRed);border:1px solid var(--color-cga-brightRed)}.badge--info{background-color:transparent;color:var(--color-cga-brightCyan);border:1px solid var(--color-cga-brightCyan)}.badge--accent{background-color:var(--color-semantic-background-accent);color:var(--color-semantic-text-secondary);border:1px solid var(--color-semantic-border-default)}.badge__dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.badge--default .badge__dot{background-color:var(--color-semantic-text-primary)}.badge--success .badge__dot{background-color:var(--color-cga-brightGreen)}.badge--warning .badge__dot{background-color:var(--color-cga-yellow)}.badge--error .badge__dot{background-color:var(--color-cga-brightRed)}.badge--info .badge__dot{background-color:var(--color-cga-brightCyan)}.badge--accent .badge__dot{background-color:var(--color-semantic-text-secondary)}.badge__content{display:inline-flex;align-items:center}@media (prefers-contrast: high){.badge{border-width:2px}}@media (prefers-reduced-motion: reduce){.badge{transition:none}}.switch{display:inline-flex;align-items:center;justify-content:flex-start;padding:0;border:none;background:transparent;cursor:pointer;outline:none;font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback)}.switch__track{position:relative;display:inline-flex;align-items:center;width:40px;height:20px;background-color:var(--color-semantic-background-secondary);border:2px solid var(--color-semantic-border-default);border-radius:2px;transition:all .15s ease}.switch__thumb{position:absolute;left:2px;width:12px;height:12px;background-color:var(--color-semantic-text-primary);border-radius:1px;transition:transform .15s ease,background-color .15s ease}.switch--checked .switch__track{background-color:var(--color-semantic-background-accent);border-color:var(--color-semantic-border-focus)}.switch--checked .switch__thumb{transform:translate(20px);background-color:var(--color-semantic-text-secondary)}.switch:hover:not(.switch--disabled) .switch__track{border-color:var(--color-semantic-border-hover)}.switch:hover:not(.switch--disabled):not(.switch--checked) .switch__thumb{background-color:var(--color-semantic-text-accent)}.switch:focus-visible .switch__track{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}.switch--disabled{cursor:not-allowed;opacity:.5}.switch--disabled .switch__track{background-color:var(--color-semantic-background-secondary);border-color:var(--color-semantic-border-disabled)}.switch--disabled .switch__thumb{background-color:var(--color-semantic-text-disabled)}@media (prefers-contrast: high){.switch__track{border-width:3px}}@media (prefers-reduced-motion: reduce){.switch__track,.switch__thumb{transition:none}}.breadcrumb{font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback);font-size:var(--typography-font-size-xs);text-transform:uppercase;letter-spacing:.35em}.breadcrumb__list{display:flex;flex-wrap:wrap;align-items:center;gap:8px;list-style:none;margin:0;padding:0}.breadcrumb__item{display:flex;align-items:center;gap:8px}.breadcrumb__link{display:inline-flex;align-items:center;gap:4px;color:var(--color-semantic-text-disabled);text-decoration:none;transition:color .15s ease}.breadcrumb__link:hover{color:var(--color-semantic-text-primary)}.breadcrumb__link:focus-visible{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}.breadcrumb__back-arrow{font-size:1em;line-height:1}.breadcrumb__separator{color:var(--color-semantic-text-disabled);opacity:.6;-webkit-user-select:none;user-select:none}.breadcrumb__current{color:var(--color-semantic-text-primary)}@media (min-width: 768px){.breadcrumb{font-size:var(--typography-font-size-sm)}}@media (prefers-contrast: high){.breadcrumb__link:focus-visible{outline-width:3px}}@media (prefers-reduced-motion: reduce){.breadcrumb__link{transition:none}}.retro-effects{--retro-intensity: 1;pointer-events:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999}.retro-effects__scanlines{position:absolute;top:0;right:0;bottom:0;left:0;opacity:calc(.6 * var(--retro-intensity));mix-blend-mode:screen;background:repeating-linear-gradient(to bottom,rgba(255,176,0,.05) 0px,rgba(255,176,0,.02) 1px,transparent 2px,transparent 4px);animation:retro-scanline 9s linear infinite}.retro-effects__glow{position:absolute;top:0;right:0;bottom:0;left:0;opacity:var(--retro-intensity);box-shadow:inset 0 0 200px #ffb0001f;background:radial-gradient(ellipse 120% 100% at center,transparent 0%,transparent 50%,rgba(0,0,0,.3) 80%,rgba(0,0,0,.5) 100%)}.retro-effects__flicker{position:absolute;top:0;right:0;bottom:0;left:0;opacity:calc(.04 * var(--retro-intensity));background-color:#ffb0001a;animation:retro-flicker .18s steps(2) infinite}@keyframes retro-scanline{0%{transform:translateY(0)}to{transform:translateY(12px)}}@keyframes retro-flicker{0%{opacity:calc(.02 * var(--retro-intensity))}50%{opacity:calc(.06 * var(--retro-intensity))}to{opacity:calc(.02 * var(--retro-intensity))}}@media (prefers-reduced-motion: reduce){.retro-effects__scanlines,.retro-effects__flicker{animation:none}}.timeline-node{display:inline-flex;align-items:center;gap:var(--spacing-2);font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback)}.timeline-node__marker{display:block;background:var(--color-cga-amber-dim);border:2px solid var(--color-cga-amber-dim);transition:all .15s ease;flex-shrink:0}.timeline-node--small .timeline-node__marker{width:8px;height:8px}.timeline-node--medium .timeline-node__marker{width:12px;height:12px}.timeline-node--large .timeline-node__marker{width:16px;height:16px}.timeline-node--circle .timeline-node__marker{border-radius:50%}.timeline-node--square .timeline-node__marker{border-radius:2px}.timeline-node--diamond .timeline-node__marker{transform:rotate(45deg)}.timeline-node--diamond.timeline-node--small .timeline-node__marker{width:7px;height:7px}.timeline-node--diamond.timeline-node--medium .timeline-node__marker{width:10px;height:10px}.timeline-node--diamond.timeline-node--large .timeline-node__marker{width:14px;height:14px}.timeline-node--default .timeline-node__marker{background:var(--color-cga-amber-dim);border-color:var(--color-cga-amber-dim)}.timeline-node--primary .timeline-node__marker{background:var(--color-cga-amber);border-color:var(--color-cga-amber)}.timeline-node--secondary .timeline-node__marker{background:var(--color-semantic-text-primary);border-color:var(--color-semantic-text-primary)}.timeline-node--accent .timeline-node__marker{background:var(--color-semantic-text-accent);border-color:var(--color-semantic-text-accent)}.timeline-node--interactive{cursor:pointer}.timeline-node--interactive:hover .timeline-node__marker{background:var(--color-cga-amber);border-color:var(--color-cga-amber);box-shadow:var(--shadow-glow-sm)}.timeline-node--active .timeline-node__marker{background:var(--color-cga-amber-bright);border-color:var(--color-cga-amber-bright);box-shadow:var(--shadow-glow-sm)}.timeline-node--active.timeline-node--interactive:hover .timeline-node__marker{box-shadow:var(--shadow-glow-md)}.timeline-node--interactive:focus-visible{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}.timeline-node__label{color:var(--color-cga-amber);font-size:var(--typography-font-size-xs);white-space:nowrap}.timeline-node--small .timeline-node__label{font-size:10px}.timeline-node--large .timeline-node__label{font-size:var(--typography-font-size-sm)}.timeline-node--label-left,.timeline-node--label-right{flex-direction:row}.timeline-node--label-top,.timeline-node--label-bottom{flex-direction:column}.timeline-node__label--left,.timeline-node__label--top{order:-1}@media (prefers-reduced-motion: reduce){.timeline-node__marker{transition:none}}@media (prefers-contrast: high){.timeline-node__marker{border-width:3px}.timeline-node--interactive:focus-visible{outline-width:3px}}.modal{padding:0;border:none;background:transparent;max-width:100vw;max-height:100vh}.modal::backdrop{background-color:#000c}.modal__container{background-color:var(--color-semantic-background-primary);border:2px solid var(--color-cga-yellow);box-shadow:var(--shadow-drop);width:480px;max-width:calc(100vw - 32px);max-height:calc(100vh - 32px);display:flex;flex-direction:column;font-family:var(--typography-font-family-primary),var(--typography-font-family-fallback)}.modal__header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-4);border-bottom:1px solid var(--color-cga-darkGray)}.modal__title{margin:0;font-size:16px;font-weight:400;color:var(--color-cga-yellow);line-height:1.4}.modal__close{display:flex;align-items:center;justify-content:center;background:none;border:none;padding:4px;cursor:pointer;color:var(--color-cga-lightGray)}.modal__close:hover{color:var(--color-cga-yellow)}.modal__close:focus-visible{outline:2px solid var(--color-semantic-border-focus);outline-offset:2px}.modal__body{padding:var(--spacing-4);color:var(--color-cga-lightGray);font-size:14px;line-height:1.5;overflow-y:auto;flex:1}.modal__footer{display:flex;gap:var(--spacing-2);justify-content:flex-end;padding:var(--spacing-4);border-top:1px solid var(--color-cga-darkGray)}.modal[open]{animation:modal-open .15s ease-out}.modal[open]::backdrop{animation:backdrop-open .15s ease-out}@keyframes modal-open{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes backdrop-open{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion: reduce){.modal[open],.modal[open]::backdrop{animation:none}}@media (prefers-contrast: high){.modal__container{border-width:3px}}
package/package.json ADDED
@@ -0,0 +1,106 @@
1
+ {
2
+ "name": "eidotter",
3
+ "version": "0.3.0",
4
+ "type": "module",
5
+ "description": "A DOS Themed Design System",
6
+ "main": "./dist/index.umd.js",
7
+ "module": "./dist/index.es.js",
8
+ "types": "./dist/index.d.ts",
9
+ "exports": {
10
+ ".": {
11
+ "types": "./dist/index.d.ts",
12
+ "import": "./dist/index.es.js",
13
+ "require": "./dist/index.umd.js"
14
+ },
15
+ "./styles": "./dist/style.css",
16
+ "./tailwind.preset": "./tailwind.preset.cjs",
17
+ "./tokens.css": "./src/styles/tokens.css"
18
+ },
19
+ "files": [
20
+ "dist/index.d.ts",
21
+ "dist/index.es.js",
22
+ "dist/index.umd.js",
23
+ "dist/style.css",
24
+ "dist/components",
25
+ "tailwind.preset.cjs",
26
+ "src/styles/tokens.css"
27
+ ],
28
+ "scripts": {
29
+ "dev": "vite",
30
+ "build": "vite build && tsc -p tsconfig.build.json",
31
+ "prepublishOnly": "npm run build",
32
+ "build-tokens": "node style-dictionary.config.mjs",
33
+ "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
34
+ "preview": "vite preview",
35
+ "storybook": "storybook dev -p 6006",
36
+ "build-storybook": "storybook build -o docs",
37
+ "test": "jest",
38
+ "create-component": "ts-node scripts/create-component.ts",
39
+ "sync-to-figma": "ts-node scripts/sync-to-figma.ts"
40
+ },
41
+ "repository": {
42
+ "type": "git",
43
+ "url": "git+https://github.com/CinimoDY/eiDotter.git"
44
+ },
45
+ "keywords": [
46
+ "design-system",
47
+ "react",
48
+ "dos",
49
+ "retro",
50
+ "ui"
51
+ ],
52
+ "author": "CinimoDY",
53
+ "license": "CC-BY-NC-4.0",
54
+ "bugs": {
55
+ "url": "https://github.com/CinimoDY/eiDotter/issues"
56
+ },
57
+ "homepage": "https://cinimody.github.io/eiDotter",
58
+ "peerDependencies": {
59
+ "react": "^18.0.0",
60
+ "react-dom": "^18.0.0",
61
+ "tailwindcss": "^3.0.0"
62
+ },
63
+ "peerDependenciesMeta": {
64
+ "tailwindcss": {
65
+ "optional": true
66
+ }
67
+ },
68
+ "devDependencies": {
69
+ "@figma/plugin-typings": "^1.107.0-beta.2",
70
+ "@figma/rest-api-spec": "^0.23.0",
71
+ "@storybook/addon-a11y": "^8.6.14",
72
+ "@storybook/addon-designs": "^8.0.4",
73
+ "@storybook/addon-essentials": "^8.5.2",
74
+ "@storybook/addon-interactions": "^8.5.2",
75
+ "@storybook/addon-links": "^8.5.2",
76
+ "@storybook/blocks": "^8.5.2",
77
+ "@storybook/react": "^8.5.2",
78
+ "@storybook/react-vite": "^8.5.2",
79
+ "@storybook/test": "^8.5.2",
80
+ "@storybook/testing-library": "^0.2.0",
81
+ "@testing-library/jest-dom": "^6.6.3",
82
+ "@testing-library/react": "^16.3.0",
83
+ "@testing-library/user-event": "^14.6.1",
84
+ "@types/glob": "^8.1.0",
85
+ "@types/jest": "^30.0.0",
86
+ "@types/node": "^22.10.10",
87
+ "@types/react": "^18.0.0",
88
+ "@types/react-dom": "^18.0.0",
89
+ "@vitejs/plugin-react": "^4.3.4",
90
+ "chromatic": "^11.25.1",
91
+ "cross-env": "^7.0.3",
92
+ "dotenv": "^16.4.7",
93
+ "figma-js": "^1.16.1-0",
94
+ "gh-pages": "^6.3.0",
95
+ "glob": "^10.3.10",
96
+ "identity-obj-proxy": "^3.0.0",
97
+ "jest": "^29.7.0",
98
+ "jest-environment-jsdom": "^30.0.2",
99
+ "storybook": "^8.5.2",
100
+ "style-dictionary": "^4.4.0",
101
+ "ts-jest": "^29.4.0",
102
+ "ts-node": "^10.9.2",
103
+ "typescript": "^5.7.3",
104
+ "vite": "^4.0.0"
105
+ }
106
+ }
@@ -0,0 +1,92 @@
1
+ /**
2
+ * Do not edit directly, this file was auto-generated.
3
+ */
4
+
5
+ :root {
6
+ --color-cga-black: #020003; /** Amber monochrome - darkest */
7
+ --color-cga-blue: #2c1203; /** Amber monochrome */
8
+ --color-cga-green: #411f06; /** Amber monochrome */
9
+ --color-cga-cyan: #552d0a; /** Amber monochrome */
10
+ --color-cga-red: #65360c; /** Amber monochrome */
11
+ --color-cga-magenta: #713e0d; /** Amber monochrome */
12
+ --color-cga-brown: #5f340e; /** Amber monochrome */
13
+ --color-cga-light-gray: #b87c1a; /** Amber monochrome */
14
+ --color-cga-dark-gray: #010103; /** Amber monochrome - near black */
15
+ --color-cga-bright-blue: #c38a23; /** Amber monochrome */
16
+ --color-cga-bright-green: #cb9529; /** Amber monochrome */
17
+ --color-cga-bright-cyan: #d4a030; /** Amber monochrome */
18
+ --color-cga-bright-red: #dca934; /** Amber monochrome */
19
+ --color-cga-bright-magenta: #ddb030; /** Amber monochrome */
20
+ --color-cga-yellow: #e5b936; /** Amber monochrome - accent */
21
+ --color-cga-white: #ba8225; /** Amber monochrome */
22
+ --color-cga-amber: #ffb000; /** P3 phosphor amber (602nm) */
23
+ --color-cga-amber-bright: #fdca9f; /** P3 phosphor amber bright */
24
+ --color-cga-amber-dim: #9a5700; /** P3 phosphor amber dim */
25
+ --color-cga-amber-glow: rgba(255, 176, 0, 0.5); /** Amber glow at 50% opacity */
26
+ --color-semantic-alert-info: #351201; /** Warm brown for info alerts */
27
+ --color-semantic-alert-success: #0a2015; /** Dark green for success alerts */
28
+ --color-semantic-alert-warning: #351201; /** Warm brown for warning alerts */
29
+ --color-semantic-alert-error: #430000; /** Dark red for error alerts */
30
+ --typography-font-family-primary: 'JetBrains Mono', 'JetBrainsMono Nerd Font', Consolas, Monaco, monospace; /** JetBrains Mono with Nerd Font fallback */
31
+ --typography-font-family-fallback: Consolas, Monaco, 'Courier New', monospace; /** System monospace fallback */
32
+ --typography-font-size-xs: 12px;
33
+ --typography-font-size-sm: 14px;
34
+ --typography-font-size-base: 16px;
35
+ --typography-font-size-lg: 18px;
36
+ --typography-font-size-xl: 20px;
37
+ --typography-font-size-2xl: 24px;
38
+ --typography-font-size-3xl: 30px;
39
+ --typography-font-size-4xl: 36px;
40
+ --typography-font-weight-regular: 400;
41
+ --typography-font-weight-semibold: 600;
42
+ --typography-font-weight-bold: 700;
43
+ --typography-line-height-tight: 1.2;
44
+ --typography-line-height-normal: 1.5;
45
+ --typography-line-height-loose: 1.8;
46
+ --spacing-0: 0px;
47
+ --spacing-1: 4px;
48
+ --spacing-2: 8px;
49
+ --spacing-3: 12px;
50
+ --spacing-4: 16px;
51
+ --spacing-5: 20px;
52
+ --spacing-6: 24px;
53
+ --spacing-8: 32px;
54
+ --spacing-10: 40px;
55
+ --spacing-12: 48px;
56
+ --spacing-16: 64px;
57
+ --border-radius-none: 0px;
58
+ --border-radius-sm: 2px;
59
+ --border-radius-base: 4px;
60
+ --border-width-thin: 1px;
61
+ --border-width-medium: 2px;
62
+ --border-width-thick: 4px;
63
+ --shadow-none: none;
64
+ --shadow-drop: 2px 2px 0px 0px #000000; /** Hard drop shadow, DOS window style */
65
+ --shadow-glow: 0px 0px 8px 0px #FFB00080; /** P3 phosphor amber CRT glow effect */
66
+ --shadow-glow-sm: 0px 0px 10px 0px #FFB00080; /** Small phosphor glow (button hover) */
67
+ --shadow-glow-md: 0px 0px 20px 0px #FFB00080; /** Medium phosphor glow (container/card) */
68
+ --shadow-glow-lg: 0px 0px 30px 0px #FFB00080; /** Large phosphor glow (emphasis) */
69
+ --duration-instant: 0ms;
70
+ --duration-fast: 100ms;
71
+ --duration-normal: 200ms;
72
+ --duration-slow: 400ms;
73
+ --color-semantic-background-primary: var(--color-cga-black);
74
+ --color-semantic-background-secondary: var(--color-cga-dark-gray);
75
+ --color-semantic-background-accent: var(--color-cga-amber);
76
+ --color-semantic-text-primary: var(--color-cga-light-gray);
77
+ --color-semantic-text-secondary: var(--color-cga-black);
78
+ --color-semantic-text-accent: var(--color-cga-yellow);
79
+ --color-semantic-text-disabled: var(--color-cga-dark-gray);
80
+ --color-semantic-border-default: var(--color-cga-light-gray);
81
+ --color-semantic-border-focus: var(--color-cga-yellow);
82
+ --color-semantic-border-hover: var(--color-cga-white);
83
+ --color-semantic-border-disabled: var(--color-cga-dark-gray);
84
+ --color-semantic-link-default: var(--color-cga-bright-cyan);
85
+ --color-semantic-link-hover: var(--color-cga-white);
86
+ --color-semantic-link-active: var(--color-cga-cyan);
87
+ --color-semantic-link-visited: var(--color-cga-magenta);
88
+ --color-semantic-status-success: var(--color-cga-bright-green);
89
+ --color-semantic-status-warning: var(--color-cga-yellow);
90
+ --color-semantic-status-error: var(--color-cga-bright-red);
91
+ --color-semantic-status-info: var(--color-cga-bright-cyan);
92
+ }
@@ -0,0 +1,124 @@
1
+ /**
2
+ * Eidotter Tailwind CSS Preset
3
+ * AUTO-GENERATED - Do not edit manually
4
+ *
5
+ * Generated from: src/tokens/base.tokens.json
6
+ * Run: npm run build-tokens
7
+ *
8
+ * Usage:
9
+ * // tailwind.config.js
10
+ * module.exports = {
11
+ * presets: [require('eidotter/tailwind.preset')],
12
+ * }
13
+ */
14
+
15
+ module.exports = {
16
+ "theme": {
17
+ "extend": {
18
+ "colors": {
19
+ "cga-black": "#020003",
20
+ "cga-blue": "#2c1203",
21
+ "cga-green": "#411f06",
22
+ "cga-cyan": "#552d0a",
23
+ "cga-red": "#65360c",
24
+ "cga-magenta": "#713e0d",
25
+ "cga-brown": "#5f340e",
26
+ "cga-light-gray": "#b87c1a",
27
+ "cga-dark-gray": "#010103",
28
+ "cga-bright-blue": "#c38a23",
29
+ "cga-bright-green": "#cb9529",
30
+ "cga-bright-cyan": "#d4a030",
31
+ "cga-bright-red": "#dca934",
32
+ "cga-bright-magenta": "#ddb030",
33
+ "cga-yellow": "#e5b936",
34
+ "cga-white": "#ba8225",
35
+ "cga-amber": "#ffb000",
36
+ "cga-amber-bright": "#fdca9f",
37
+ "cga-amber-dim": "#9a5700",
38
+ "cga-amber-glow": "#ffb00080",
39
+ "dos-bg-primary": "#020003",
40
+ "dos-bg-secondary": "#010103",
41
+ "dos-bg-accent": "#ffb000",
42
+ "dos-text-primary": "#b87c1a",
43
+ "dos-text-secondary": "#020003",
44
+ "dos-text-accent": "#e5b936",
45
+ "dos-text-disabled": "#010103",
46
+ "dos-border-default": "#b87c1a",
47
+ "dos-border-focus": "#e5b936",
48
+ "dos-border-hover": "#ba8225",
49
+ "dos-border-disabled": "#010103",
50
+ "dos-link": "#d4a030",
51
+ "dos-link-hover": "#ba8225",
52
+ "dos-success": "#cb9529",
53
+ "dos-warning": "#e5b936",
54
+ "dos-error": "#dca934",
55
+ "dos-info": "#d4a030",
56
+ "dos-alert-info": "#351201",
57
+ "dos-alert-success": "#0a2015",
58
+ "dos-alert-warning": "#351201",
59
+ "dos-alert-error": "#430000"
60
+ },
61
+ "fontFamily": {
62
+ "dos": [
63
+ "\"JetBrains Mono\"",
64
+ "\"JetBrainsMono Nerd Font\"",
65
+ "Consolas",
66
+ "Monaco",
67
+ "monospace"
68
+ ],
69
+ "dos-fallback": [
70
+ "Consolas",
71
+ "Monaco",
72
+ "\"Courier New\"",
73
+ "monospace"
74
+ ]
75
+ },
76
+ "fontSize": {
77
+ "dos-xs": "12px",
78
+ "dos-sm": "14px",
79
+ "dos-base": "16px",
80
+ "dos-lg": "18px",
81
+ "dos-xl": "20px",
82
+ "dos-2xl": "24px",
83
+ "dos-3xl": "30px",
84
+ "dos-4xl": "36px"
85
+ },
86
+ "lineHeight": {
87
+ "dos-tight": "1.2",
88
+ "dos-normal": "1.5",
89
+ "dos-loose": "1.8"
90
+ },
91
+ "fontWeight": {
92
+ "dos-regular": "400",
93
+ "dos-semibold": "600",
94
+ "dos-bold": "700"
95
+ },
96
+ "spacing": {
97
+ "dos-0": "0px",
98
+ "dos-1": "4px",
99
+ "dos-2": "8px",
100
+ "dos-3": "12px",
101
+ "dos-4": "16px",
102
+ "dos-5": "20px",
103
+ "dos-6": "24px",
104
+ "dos-8": "32px",
105
+ "dos-10": "40px",
106
+ "dos-12": "48px",
107
+ "dos-16": "64px"
108
+ },
109
+ "borderRadius": {
110
+ "dos-none": "0px",
111
+ "dos-sm": "2px",
112
+ "dos-base": "4px"
113
+ },
114
+ "boxShadow": {
115
+ "dos-none": "none",
116
+ "dos-drop": "2px 2px 0px 0px #000000",
117
+ "dos-glow": "0px 0px 8px 0px #FFB00080",
118
+ "dos-glowSm": "0px 0px 10px 0px #FFB00080",
119
+ "dos-glowMd": "0px 0px 20px 0px #FFB00080",
120
+ "dos-glowLg": "0px 0px 30px 0px #FFB00080"
121
+ }
122
+ }
123
+ }
124
+ };