cetec-design-system 0.0.20 → 0.0.21

package/styled-system/debug/src__components__Button__Button.stories.ast.json

@@ -1,244 +0,0 @@
-{
-  "css": [],
-  "cva": [],
-  "sva": [],
-  "jsx": [
-    {
-      "type": "jsx",
-      "name": "Icon",
-      "box": {
-        "type": "map",
-        "value": {},
-        "node": "JsxSelfClosingElement",
-        "line": 112,
-        "column": 11
-      },
-      "data": [
-        {}
-      ]
-    },
-    {
-      "type": "jsx",
-      "name": "Icon",
-      "box": {
-        "type": "map",
-        "value": {},
-        "node": "JsxSelfClosingElement",
-        "line": 115,
-        "column": 11
-      },
-      "data": [
-        {}
-      ]
-    },
-    {
-      "type": "jsx",
-      "name": "Icon",
-      "box": {
-        "type": "map",
-        "value": {},
-        "node": "JsxSelfClosingElement",
-        "line": 118,
-        "column": 11
-      },
-      "data": [
-        {}
-      ]
-    },
-    {
-      "type": "jsx",
-      "name": "Icon",
-      "box": {
-        "type": "map",
-        "value": {},
-        "node": "JsxSelfClosingElement",
-        "line": 121,
-        "column": 11
-      },
-      "data": [
-        {}
-      ]
-    },
-    {
-      "type": "jsx",
-      "name": "Icon",
-      "box": {
-        "type": "map",
-        "value": {},
-        "node": "JsxSelfClosingElement",
-        "line": 124,
-        "column": 11
-      },
-      "data": [
-        {}
-      ]
-    }
-  ],
-  "recipe": {
-    "button": [
-      {
-        "type": "jsx-recipe",
-        "name": "Button",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 104,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "default"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "Button",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 105,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "primary"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "Button",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 106,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "danger"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "Button",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 107,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "hollow"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "Button",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 108,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "utility"
-          }
-        ]
-      }
-    ],
-    "iconButton": [
-      {
-        "type": "jsx-recipe",
-        "name": "IconButton",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 111,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "default"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "IconButton",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 114,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "primary"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "IconButton",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 117,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "danger"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "IconButton",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 120,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "hollow"
-          }
-        ]
-      },
-      {
-        "type": "jsx-recipe",
-        "name": "IconButton",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 123,
-          "column": 9
-        },
-        "data": [
-          {
-            "variant": "utility"
-          }
-        ]
-      }
-    ]
-  },
-  "pattern": {}
-}

package/styled-system/debug/src__components__Button__Button.stories.css

@@ -1,372 +0,0 @@
-@layer recipes {
-  @layer _base {
-    .button {
-      appearance: none;
-      -webkit-appearance: none;
-      min-width: var(--sizes-0);
-      -webkit-user-select: none;
-      user-select: none;
-      vertical-align: middle;
-      display: flex;
-      gap: var(--spacing-4);
-      border-radius: var(--radii-4);
-      outline-offset: var(--spacing-1);
-      text-decoration: none;
-      white-space: nowrap;
-      cursor: pointer;
-      --transition-duration: var(--durations-fast);
-      transition-duration: var(--durations-fast);
-      --transition-prop: background, border-color, color, box-shadow;
-      transition-property: background, border-color, color, box-shadow;
-      --transition-easing: var(--easings-default);
-      transition-timing-function: var(--easings-default);
-      align-items: center;
-      font-family: var(--fonts-sans);
-      font-size: var(--font-sizes-16);
-      font-weight: var(--font-weights-medium);
-      line-height: var(--line-heights-default);
-      border-width: 1px;
-      border-style: solid;
-      border-color: var(--colors-transparent);
-      outline-width: 2px;
-      outline-style: solid;
-      outline-color: var(--colors-transparent);
-}
-
-    .button:is(:disabled, [disabled], [data-disabled]) {
-      opacity: 0.4;
-      cursor: not-allowed;
-}
-
-    .button svg {
-      fill: var(--colors-current);
-      width: var(--sizes-24);
-      height: var(--sizes-24);
-}
-
-    .button:is(:focus-visible, [data-focus-visible]) {
-      outline-color: var(--colors-slate-80);
-}
-
-    [data-color-mode=dark] .button:is(:focus-visible, [data-focus-visible]) {
-      outline-color: var(--colors-slate-5);
-}
-
-    .icon-button {
-      appearance: none;
-      -webkit-appearance: none;
-      min-width: var(--sizes-0);
-      -webkit-user-select: none;
-      user-select: none;
-      vertical-align: middle;
-      display: flex;
-      gap: var(--spacing-4);
-      border-radius: var(--radii-4);
-      outline-offset: var(--spacing-1);
-      text-decoration: none;
-      white-space: nowrap;
-      cursor: pointer;
-      --transition-duration: var(--durations-fast);
-      transition-duration: var(--durations-fast);
-      --transition-prop: background, border-color, color, box-shadow;
-      transition-property: background, border-color, color, box-shadow;
-      --transition-easing: var(--easings-default);
-      transition-timing-function: var(--easings-default);
-      align-items: center;
-      font-family: var(--fonts-sans);
-      font-size: var(--font-sizes-16);
-      font-weight: var(--font-weights-medium);
-      line-height: var(--line-heights-default);
-      border-width: 1px;
-      border-style: solid;
-      border-color: var(--colors-transparent);
-      outline-width: 2px;
-      outline-style: solid;
-      outline-color: var(--colors-transparent);
-}
-
-    .icon-button:is(:disabled, [disabled], [data-disabled]) {
-      opacity: 0.4;
-      cursor: not-allowed;
-}
-
-    .icon-button svg {
-      fill: var(--colors-current);
-      width: var(--sizes-24);
-      height: var(--sizes-24);
-}
-
-    .icon-button:is(:focus-visible, [data-focus-visible]) {
-      outline-color: var(--colors-slate-80);
-}
-
-    [data-color-mode=dark] .icon-button:is(:focus-visible, [data-focus-visible]) {
-      outline-color: var(--colors-slate-5);
-}
-}
-
-  .button--size_standard {
-    padding-block: var(--spacing-3);
-    padding-inline: var(--spacing-12);
-    font-size: var(--font-sizes-16);
-}
-
-  .button--variant_primary {
-    background: var(--colors-slate-90);
-    color: var(--colors-slate-5);
-}
-
-  [data-color-mode=dark] .button--variant_primary {
-    background: var(--colors-slate-5);
-    color: var(--colors-slate-90);
-}
-
-  .button--variant_primary:is([data-selected]) {
-    background: var(--colors-slate-5);
-    color: var(--colors-slate-90);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .button--variant_primary:is([data-selected]) {
-    background: var(--colors-slate-90);
-    color: var(--colors-slate-5);
-}
-
-  .button--variant_primary:is(:hover, [data-hover]) {
-    background: var(--colors-slate-70);
-}
-
-  [data-color-mode=dark] .button--variant_primary:is(:hover, [data-hover]) {
-    background: var(--colors-slate-20);
-}
-
-  .button--variant_primary:is(:active, [data-active]) {
-    background: var(--colors-slate-100);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .button--variant_primary:is(:active, [data-active]) {
-    background: var(--colors-slate-30);
-}
-
-  .button--variant_primary:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-slate-90);
-}
-
-  [data-color-mode=dark] .button--variant_primary:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-slate-5);
-}
-
-  .button--variant_danger {
-    background: var(--colors-red-50);
-    color: var(--colors-slate-0);
-}
-
-  [data-color-mode=dark] .button--variant_danger {
-    background: var(--colors-red-40);
-    color: var(--colors-slate-0);
-}
-
-  .button--variant_danger:is(:hover, [data-hover]) {
-    background: var(--colors-red-40);
-}
-
-  [data-color-mode=dark] .button--variant_danger:is(:hover, [data-hover]) {
-    background: var(--colors-red-30);
-}
-
-  .button--variant_danger:is(:active, [data-active]) {
-    background: var(--colors-red-60);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .button--variant_danger:is(:active, [data-active]) {
-    background: var(--colors-red-50);
-}
-
-  .button--variant_danger:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-red-50);
-}
-
-  [data-color-mode=dark] .button--variant_danger:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-red-40);
-}
-
-  .button--variant_hollow {
-    background: var(--colors-transparent);
-    color: var(--colors-slate-80);
-    border-color: var(--colors-slate-30);
-}
-
-  [data-color-mode=dark] .button--variant_hollow {
-    color: var(--colors-slate-5);
-    border-color: var(--colors-slate-60);
-}
-
-  .button--variant_hollow:is([data-selected]) {
-    background: var(--colors-slate-90);
-    color: var(--colors-slate-5);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .button--variant_hollow:is([data-selected]) {
-    background: var(--colors-slate-5);
-    color: var(--colors-slate-90);
-}
-
-  .button--variant_hollow:is(:hover, [data-hover]) {
-    background: var(--colors-slate-10);
-    border-color: var(--colors-slate-10);
-}
-
-  [data-color-mode=dark] .button--variant_hollow:is(:hover, [data-hover]) {
-    background: var(--colors-slate-60);
-    border-color: var(--colors-slate-60);
-}
-
-  .button--variant_hollow:is(:active, [data-active]) {
-    background: var(--colors-slate-20);
-    border-color: var(--colors-slate-20);
-}
-
-  [data-color-mode=dark] .button--variant_hollow:is(:active, [data-active]) {
-    background: var(--colors-slate-70);
-    border-color: var(--colors-slate-70);
-}
-
-  .button--variant_hollow:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-transparent);
-}
-
-  .icon-button--size_standard {
-    padding: var(--spacing-3);
-    font-size: var(--font-sizes-16);
-}
-
-  .icon-button--variant_primary {
-    background: var(--colors-slate-90);
-    color: var(--colors-slate-5);
-}
-
-  [data-color-mode=dark] .icon-button--variant_primary {
-    background: var(--colors-slate-5);
-    color: var(--colors-slate-90);
-}
-
-  .icon-button--variant_primary:is([data-selected]) {
-    background: var(--colors-slate-5);
-    color: var(--colors-slate-90);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .icon-button--variant_primary:is([data-selected]) {
-    background: var(--colors-slate-90);
-    color: var(--colors-slate-5);
-}
-
-  .icon-button--variant_primary:is(:hover, [data-hover]) {
-    background: var(--colors-slate-70);
-}
-
-  [data-color-mode=dark] .icon-button--variant_primary:is(:hover, [data-hover]) {
-    background: var(--colors-slate-20);
-}
-
-  .icon-button--variant_primary:is(:active, [data-active]) {
-    background: var(--colors-slate-100);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .icon-button--variant_primary:is(:active, [data-active]) {
-    background: var(--colors-slate-30);
-}
-
-  .icon-button--variant_primary:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-slate-90);
-}
-
-  [data-color-mode=dark] .icon-button--variant_primary:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-slate-5);
-}
-
-  .icon-button--variant_danger {
-    background: var(--colors-red-50);
-    color: var(--colors-slate-0);
-}
-
-  [data-color-mode=dark] .icon-button--variant_danger {
-    background: var(--colors-red-40);
-    color: var(--colors-slate-0);
-}
-
-  .icon-button--variant_danger:is(:hover, [data-hover]) {
-    background: var(--colors-red-40);
-}
-
-  [data-color-mode=dark] .icon-button--variant_danger:is(:hover, [data-hover]) {
-    background: var(--colors-red-30);
-}
-
-  .icon-button--variant_danger:is(:active, [data-active]) {
-    background: var(--colors-red-60);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .icon-button--variant_danger:is(:active, [data-active]) {
-    background: var(--colors-red-50);
-}
-
-  .icon-button--variant_danger:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-red-50);
-}
-
-  [data-color-mode=dark] .icon-button--variant_danger:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-red-40);
-}
-
-  .icon-button--variant_hollow {
-    background: var(--colors-transparent);
-    color: var(--colors-slate-80);
-    border-color: var(--colors-slate-30);
-}
-
-  [data-color-mode=dark] .icon-button--variant_hollow {
-    color: var(--colors-slate-5);
-    border-color: var(--colors-slate-60);
-}
-
-  .icon-button--variant_hollow:is([data-selected]) {
-    background: var(--colors-slate-90);
-    color: var(--colors-slate-5);
-    border-color: var(--colors-transparent);
-}
-
-  [data-color-mode=dark] .icon-button--variant_hollow:is([data-selected]) {
-    background: var(--colors-slate-5);
-    color: var(--colors-slate-90);
-}
-
-  .icon-button--variant_hollow:is(:hover, [data-hover]) {
-    background: var(--colors-slate-10);
-    border-color: var(--colors-slate-10);
-}
-
-  [data-color-mode=dark] .icon-button--variant_hollow:is(:hover, [data-hover]) {
-    background: var(--colors-slate-60);
-    border-color: var(--colors-slate-60);
-}
-
-  .icon-button--variant_hollow:is(:active, [data-active]) {
-    background: var(--colors-slate-20);
-    border-color: var(--colors-slate-20);
-}
-
-  [data-color-mode=dark] .icon-button--variant_hollow:is(:active, [data-active]) {
-    background: var(--colors-slate-70);
-    border-color: var(--colors-slate-70);
-}
-
-  .icon-button--variant_hollow:is(:disabled, [disabled], [data-disabled]):is(:hover, [data-hover]) {
-    background: var(--colors-transparent);
-}
-}

package/styled-system/debug/src__components__Code__Code.ast.json

@@ -1,32 +0,0 @@
-{
-  "css": [],
-  "cva": [],
-  "sva": [],
-  "jsx": [],
-  "recipe": {},
-  "pattern": {
-    "Box": [
-      {
-        "type": "jsx-pattern",
-        "name": "Box",
-        "box": {
-          "type": "map",
-          "value": {},
-          "node": "JsxOpeningElement",
-          "line": 13,
-          "column": 5
-        },
-        "data": [
-          {
-            "bg": "slate.80",
-            "position": "relative",
-            "overflow": "auto",
-            "p": "4",
-            "whiteSpace": "pre",
-            "fontSize": "14"
-          }
-        ]
-      }
-    ]
-  }
-}

package/styled-system/debug/src__components__Code__Code.css

@@ -1,25 +0,0 @@
-@layer utilities {
-  .bg_slate\.80 {
-    background: var(--colors-slate-80);
-}
-
-  .pos_relative {
-    position: relative;
-}
-
-  .ov_auto {
-    overflow: auto;
-}
-
-  .p_4 {
-    padding: var(--spacing-4);
-}
-
-  .white-space_pre {
-    white-space: pre;
-}
-
-  .fs_14 {
-    font-size: var(--font-sizes-14);
-}
-}