@macive/ui 0.0.10 → 0.0.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@macive/ui",
-  "version": "0.0.10",
+  "version": "0.0.11",
   "description": "",
   "author": "",
   "private": false,
@@ -23,7 +23,7 @@
     "build": "tsc --build && npm run build:style",
     "build:css": "node scripts/combine-css.js",
     "watch:css": "npm run build:css -- --watch",
-    "build:scss": "node scripts/build-scss.js",
+    "build:scss": "ts-node scripts/build-scss.ts",
     "watch:scss": "npm run build:scss -- --watch",
     "build:style": "npm run build:css && npm run build:scss",
     "watch:style": "npm run watch:css && npm run watch:scss",

package/dist/css/Action.css

@@ -1,12 +0,0 @@
-.Action-Action {
-  display: flex;
-  flex: 1;
-}
-
-.Action-ActionDivider {
-  margin-bottom: var(--p-space-1);
-}
-
-.Action-Icon {
-  padding-right: var(--p-space-2);
-}

package/dist/css/ActionList.css

@@ -1,133 +0,0 @@
-.ActionList-Item {
-  --pc-action-list-image-size: 20px;
-  --pc-action-list-item-min-height: var(--p-space-10);
-  --pc-action-list-item-vertical-padding: calc((var(--pc-action-list-item-min-height) - var(--p-font-line-height-2)) / 2);
-  appearance: none;
-  margin: 0;
-  padding: 0;
-  background: none;
-  border: none;
-  font-size: inherit;
-  line-height: inherit;
-  color: inherit;
-  cursor: pointer;
-  position: relative;
-  display: block;
-  width: 100%;
-  min-height: var(--pc-action-list-item-min-height);
-  text-align: left;
-  text-decoration: none;
-  cursor: pointer;
-  padding: var(--pc-action-list-item-vertical-padding) var(--p-space-2);
-  border-radius: var(--p-border-radius-1);
-  border-top: var(--p-border-width-1) solid transparent;
-  color: inherit;
-}
-.ActionList-Item:focus {
-  outline: none;
-}
-.ActionList-Item::after {
-  content: "";
-  position: absolute;
-  z-index: 1;
-  top: calc(-1 * 1px);
-  right: calc(-1 * 1px);
-  bottom: calc(-1 * 1px);
-  left: calc(-1 * 1px);
-  display: block;
-  pointer-events: none;
-  box-shadow: 0 0 0 calc(-1 * 1px) var(--p-color-border-interactive-focus);
-  transition: box-shadow var(--p-motion-duration-100) var(--p-motion-ease);
-  border-radius: var(--p-border-radius-1);
-}
-@media (forced-colors: active) {
-  .ActionList-Item {
-    border: var(--p-border-width-1) solid transparent;
-  }
-}
-.ActionList-Item:hover {
-  background-color: var(--p-color-bg-hover);
-  text-decoration: none;
-  outline: var(--p-border-width-3) solid transparent;
-}
-.ActionList-Item:active {
-  background-color: var(--p-color-bg-active);
-}
-.ActionList-Item:active svg {
-  fill: var(--p-color-icon-interactive);
-}
-.ActionList-Item:focus-visible:not(:active) {
-  outline: var(--p-border-width-3) solid transparent;
-}
-.ActionList-Item:focus-visible:not(:active)::after {
-  box-shadow: 0 0 0 2px var(--p-color-border-interactive-focus);
-  outline: var(--p-border-width-1) solid transparent;
-}
-.ActionList-Item:visited {
-  color: inherit;
-}
-.ActionList-Item.ActionList-active {
-  background-color: var(--p-color-bg-interactive-selected);
-}
-.ActionList-Item.ActionList-active svg {
-  fill: var(--p-color-icon-interactive);
-}
-.ActionList-Item.ActionList-active::before {
-  content: "";
-  background-color: var(--p-color-bg-interactive);
-  position: absolute;
-  top: 0;
-  left: calc(-1 * var(--p-space-2));
-  height: 100%;
-  display: block;
-  width: var(--p-border-width-3);
-  border-top-right-radius: var(--p-border-radius-1);
-  border-bottom-right-radius: var(--p-border-radius-1);
-}
-.ActionList-Item.ActionList-destructive {
-  color: var(--p-color-text-critical);
-}
-.ActionList-Item.ActionList-destructive svg {
-  fill: var(--p-color-icon-critical);
-}
-.ActionList-Item.ActionList-destructive:hover {
-  background-color: var(--p-color-bg-critical-subdued-hover);
-}
-.ActionList-Item.ActionList-destructive:active, .ActionList-Item.ActionList-destructive.ActionList-active {
-  background-color: var(--p-color-bg-critical-subdued-active);
-}
-.ActionList-Item.ActionList-disabled {
-  background-image: none;
-  cursor: not-allowed;
-  color: var(--p-color-text-disabled);
-}
-.ActionList-Item.ActionList-disabled .ActionList-Prefix svg,
-.ActionList-Item.ActionList-disabled .ActionList-Suffix svg {
-  fill: var(--p-color-icon-disabled);
-}
-
-.ActionList-Prefix {
-  display: flex;
-  flex: 0 0 auto;
-  justify-content: center;
-  align-items: center;
-  height: var(--pc-action-list-image-size);
-  width: var(--pc-action-list-image-size);
-  border-radius: var(--p-border-radius-1);
-  margin: calc(-0.5 * var(--pc-action-list-image-size)) 0 calc(-0.5 * var(--pc-action-list-image-size)) 0;
-  background-size: cover;
-  background-position: center center;
-}
-.ActionList-Prefix svg {
-  fill: var(--p-color-icon);
-}
-
-.ActionList-Suffix svg {
-  fill: var(--p-color-icon);
-}
-
-.ActionList-Text {
-  min-width: 0;
-  max-width: 100%;
-  flex: 1 1 auto;
-}

package/dist/css/AlphaFilters.css

@@ -1,221 +0,0 @@
-.AlphaFilters-Container {
-  position: relative;
-  z-index: var(--p-z-index-1);
-  border-bottom: var(--p-border-width-1) solid var(--p-color-border-subdued);
-  border-top-left-radius: var(--p-border-radius-2);
-  border-top-right-radius: var(--p-border-radius-2);
-  background: var(--p-color-bg);
-}
-
-@media (max-width: 31em) {
-  .AlphaFilters-Container {
-    border-top-left-radius: 0;
-    border-top-right-radius: 0;
-    height: 57px;
-  }
-}
-.AlphaFilters-SearchField {
-  flex: 1;
-}
-
-.AlphaFilters-Spinner {
-  width: var(--p-space-5);
-  transform: translateX(var(--p-space-1));
-}
-.AlphaFilters-Spinner svg {
-  display: block;
-}
-
-.AlphaFilters-FiltersWrapper {
-  border-bottom: var(--p-border-width-1) solid var(--p-color-border-subdued);
-  height: 53px;
-  overflow: hidden;
-}
-@media (max-width: 31em) {
-  .AlphaFilters-FiltersWrapper {
-    background: var(--p-color-bg);
-  }
-}
-@media (min-width: 48em) {
-  .AlphaFilters-FiltersWrapper {
-    height: auto;
-    overflow: visible;
-  }
-}
-
-.AlphaFilters-hideQueryField .AlphaFilters-FiltersWrapper {
-  display: flex;
-  align-items: center;
-}
-
-.AlphaFilters-FiltersInner {
-  overflow: auto;
-  white-space: nowrap;
-  padding: var(--p-space-3) var(--p-space-4) var(--p-space-5);
-}
-
-.AlphaFilters-hideQueryField .AlphaFilters-FiltersInner {
-  flex: 1;
-}
-
-@media (min-width: 48em) {
-  .AlphaFilters-FiltersInner {
-    overflow: visible;
-    flex-wrap: wrap;
-    gap: var(--p-space-2);
-    padding: calc(var(--p-space-2) - var(--p-space-05)) var(--p-space-2);
-  }
-}
-.AlphaFilters-AddFilter {
-  background: var(--p-color-bg-subdued);
-  border-radius: var(--p-border-radius-6);
-  border: var(--p-color-border-subdued) dashed var(--p-border-width-1);
-  padding: 0 var(--p-space-2) 0 var(--p-space-3);
-  height: 28px;
-  cursor: pointer;
-  color: var(--p-color-text);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: var(--p-font-size-100);
-  font-family: var(--p-font-family-sans);
-  line-height: var(--p-font-line-height-2);
-  outline: inherit;
-  position: relative;
-}
-.AlphaFilters-AddFilter::after {
-  content: "";
-  position: absolute;
-  z-index: 1;
-  top: calc(-1 * calc(var(--p-border-width-1) + 1px));
-  right: calc(-1 * calc(var(--p-border-width-1) + 1px));
-  bottom: calc(-1 * calc(var(--p-border-width-1) + 1px));
-  left: calc(-1 * calc(var(--p-border-width-1) + 1px));
-  display: block;
-  pointer-events: none;
-  box-shadow: 0 0 0 calc(-1 * calc(var(--p-border-width-1) + 1px)) var(--p-color-border-interactive-focus);
-  transition: box-shadow var(--p-motion-duration-100) var(--p-motion-ease);
-  border-radius: var(--p-border-radius-1);
-}
-.AlphaFilters-AddFilter path {
-  fill: var(--p-color-icon);
-}
-@media (min-width: 48em) {
-  .AlphaFilters-AddFilter {
-    font-size: var(--p-font-size-75);
-    line-height: var(--p-font-line-height-1);
-    height: 24px;
-    padding: 0 6px 0 var(--p-space-2);
-  }
-}
-.AlphaFilters-AddFilter:hover, .AlphaFilters-AddFilter:focus {
-  background: var(--p-color-bg-hover);
-  border-color: var(--p-color-border-hover);
-}
-.AlphaFilters-AddFilter:hover path, .AlphaFilters-AddFilter:focus path {
-  fill: var(--p-color-icon-hover);
-}
-.AlphaFilters-AddFilter:active {
-  background: var(--p-color-bg-active);
-  border-color: var(--p-color-border-hover);
-}
-.AlphaFilters-AddFilter[aria-disabled=true] {
-  background: var(--p-color-bg-disabled);
-  border-color: var(--p-color-border-disabled);
-  color: var(--p-color-text-disabled);
-  cursor: default;
-}
-.AlphaFilters-AddFilter[aria-disabled=true] path {
-  fill: var(--p-color-icon-disabled);
-}
-.AlphaFilters-AddFilter:focus-visible:not(:active)::after {
-  box-shadow: 0 0 0 2px var(--p-color-border-interactive-focus);
-  outline: var(--p-border-width-1) solid transparent;
-}
-.AlphaFilters-AddFilter::after {
-  border-radius: var(--p-border-radius-6);
-}
-.AlphaFilters-AddFilter span {
-  margin-right: var(--p-space-05);
-}
-@media (min-width: 48em) {
-  .AlphaFilters-AddFilter span {
-    margin-right: var(--p-space-025);
-  }
-}
-.AlphaFilters-AddFilter svg {
-  width: var(--p-space-5);
-}
-@media (min-width: 48em) {
-  .AlphaFilters-AddFilter svg {
-    width: var(--p-space-4);
-  }
-}
-
-@media (max-width: 48em) {
-  .AlphaFilters-FiltersWrapperWithAddButton {
-    position: relative;
-  }
-  .AlphaFilters-FiltersWrapperWithAddButton .AlphaFilters-FiltersInner {
-    padding-top: var(--p-space-2);
-    padding-bottom: var(--p-space-5);
-    padding-right: 0;
-  }
-  .AlphaFilters-AddFilterActivatorMultiple {
-    position: sticky;
-    z-index: var(--p-z-index-1);
-    top: 0;
-    right: 0;
-    display: flex;
-    padding: var(--p-space-1) var(--p-space-4) var(--p-space-1) 0;
-    background: var(--p-color-bg);
-    margin-left: var(--p-space-2);
-  }
-  .AlphaFilters-AddFilterActivatorMultiple::before {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: -12px;
-    width: 12px;
-    height: 100%;
-    pointer-events: none;
-    background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, var(--p-color-bg) 70%, var(--p-color-bg) 100%);
-  }
-  .AlphaFilters-AddFilterActivatorMultiple .AlphaFilters-AddFilter {
-    padding: 0.75rem var(--p-space-2);
-  }
-  .AlphaFilters-AddFilterActivatorMultiple .AlphaFilters-AddFilter span {
-    display: none;
-  }
-}
-.AlphaFilters-FiltersStickyArea {
-  position: relative;
-  display: flex;
-  gap: var(--p-space-1);
-  flex-wrap: nowrap;
-  align-items: center;
-  justify-content: flex-start;
-}
-@media (min-width: 48em) {
-  .AlphaFilters-FiltersStickyArea {
-    flex-wrap: wrap;
-  }
-}
-
-.AlphaFilters-ClearAll {
-  margin-left: var(--p-space-1);
-}
-
-@media (max-width: 48em) {
-  .AlphaFilters-ClearAll {
-    margin-left: var(--p-space-2);
-    padding-right: var(--p-space-4);
-  }
-  .AlphaFilters-MultiplePinnedFilterClearAll {
-    transform: translateX(-8px);
-    position: relative;
-    z-index: var(--p-z-index-1);
-    margin-left: 0;
-    padding-right: var(--p-space-4);
-  }
-}

package/dist/css/AlphaTabs.css

@@ -1,339 +0,0 @@
-:root {
-  --item-min-height: var(--p-space-4);
-  --item-min-width: 50px;
-  --item-vertical-padding: var(--p-space-2);
-}
-
-@media (max-width: 48em) {
-  .AlphaTabs-Outer {
-    max-width: 100%;
-    overflow: hidden;
-    height: 56px;
-    padding: 0;
-  }
-}
-
-@media (max-width: 48em) {
-  .AlphaTabs-Wrapper {
-    overflow: auto;
-    -webkit-overflow-scrolling: touch;
-    padding: var(--p-space-3) var(--p-space-3) var(--p-space-5) var(--p-space-4);
-  }
-}
-
-@media (min-width: 48em) {
-  .AlphaTabs-WrapperWithNewButton {
-    position: relative;
-    display: inline-flex;
-    padding-right: var(--p-space-8);
-  }
-}
-
-@media (max-width: 48em) {
-  .AlphaTabs-ButtonWrapper {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-  }
-}
-
-.AlphaTabs-AlphaTabs {
-  display: flex;
-  align-items: center;
-  justify-content: flex-start;
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  gap: var(--p-space-1);
-}
-@media (min-width: 48em) {
-  .AlphaTabs-AlphaTabs {
-    padding: 0 var(--p-space-1);
-    flex-wrap: wrap;
-    align-items: stretch;
-  }
-}
-
-.AlphaTabs-Tab {
-  position: relative;
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-  position: relative;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  height: var(--p-space-8);
-  padding: 0 var(--p-space-3);
-  border: 0;
-  border-radius: var(--p-border-radius-1);
-  background: var(--p-color-bg);
-  color: var(--p-color-text-subdued);
-  cursor: pointer;
-  text-decoration: none;
-  width: 100%;
-  min-width: 100%;
-  margin-top: var(--p-space-025);
-  margin-bottom: calc(-1 * var(--p-space-025));
-  outline: none;
-  text-align: center;
-  white-space: nowrap;
-}
-.AlphaTabs-Tab::after {
-  content: "";
-  position: absolute;
-  z-index: 1;
-  top: calc(-1 * 1px);
-  right: calc(-1 * 1px);
-  bottom: calc(-1 * 1px);
-  left: calc(-1 * 1px);
-  display: block;
-  pointer-events: none;
-  box-shadow: 0 0 0 calc(-1 * 1px) var(--p-color-border-interactive-focus);
-  transition: box-shadow var(--p-motion-duration-100) var(--p-motion-ease);
-  border-radius: var(--p-border-radius-1);
-}
-.AlphaTabs-Tab[aria-disabled=true] {
-  cursor: default;
-  color: var(--p-color-text-disabled);
-}
-.AlphaTabs-Tab:not([aria-disabled=true]):hover, .AlphaTabs-Tab:not([aria-disabled=true]):focus {
-  background-color: var(--p-color-bg-hover);
-  color: var(--p-color-text);
-}
-.AlphaTabs-Tab:not([aria-disabled=true]):focus-visible:not(:active) {
-  outline: 0;
-}
-.AlphaTabs-Tab:not([aria-disabled=true]):focus-visible:not(:active)::after {
-  box-shadow: 0 0 0 2px var(--p-color-border-interactive-focus);
-  outline: var(--p-border-width-1) solid transparent;
-}
-.AlphaTabs-Tab:not([aria-disabled=true]):active {
-  background-color: var(--p-color-bg-active);
-  color: var(--p-color-text);
-  z-index: var(--p-z-index-1);
-}
-.AlphaTabs-Tab path {
-  fill: currentColor;
-}
-.AlphaTabs-Tab[aria-disabled=true] path {
-  fill: var(--p-color-icon-disabled);
-}
-
-.AlphaTabs-Tab-active {
-  background: var(--p-color-bg-primary-subdued-hover);
-  color: var(--p-color-text-primary);
-}
-.AlphaTabs-Tab-active[aria-disabled=true] {
-  background: var(--p-color-bg-disabled);
-  color: var(--p-color-text-disabled);
-}
-.AlphaTabs-Tab-active:not([aria-disabled=true]):hover, .AlphaTabs-Tab-active:not([aria-disabled=true]):focus {
-  background-color: var(--p-color-bg-primary-subdued-hover);
-  color: var(--p-color-text-primary-hover);
-}
-.AlphaTabs-Tab-active:not([aria-disabled=true]):active {
-  background-color: var(--p-color-bg-success-subdued-active);
-  color: var(--p-color-text-primary);
-}
-
-.AlphaTabs-Tab-hasActions {
-  padding-right: var(--p-space-2);
-}
-
-.AlphaTabs-Tab-iconOnly {
-  padding-left: var(--p-space-1);
-  padding-right: var(--p-space-1);
-  width: var(--p-space-8);
-}
-
-.AlphaTabs-fillSpace .AlphaTabs-TabContainer {
-  flex: 1 1 auto;
-}
-
-.AlphaTabs-fitted {
-  flex-wrap: nowrap;
-}
-.AlphaTabs-fitted .AlphaTabs-TabContainer {
-  flex: 1 1 100%;
-}
-
-.AlphaTabs-TabContainer {
-  display: flex;
-  margin: 0;
-  padding: 0;
-}
-
-.AlphaTabs-titleWithIcon {
-  display: flex;
-}
-
-.AlphaTabs-List {
-  list-style: none;
-  margin: 0;
-  padding: var(--p-space-2);
-}
-
-.AlphaTabs-Item {
-  appearance: none;
-  margin: 0;
-  padding: 0;
-  background: none;
-  border: none;
-  font-size: inherit;
-  line-height: inherit;
-  color: inherit;
-  cursor: pointer;
-  position: relative;
-  display: block;
-  width: 100%;
-  min-height: var(--item-min-height);
-  padding: var(--item-vertical-padding) var(--p-space-4);
-  text-align: left;
-  text-decoration: none;
-  cursor: pointer;
-  border-radius: var(--p-border-radius-1);
-  color: inherit;
-}
-.AlphaTabs-Item:focus {
-  outline: none;
-}
-.AlphaTabs-Item::after {
-  content: "";
-  position: absolute;
-  z-index: 1;
-  top: calc(-1 * 1px);
-  right: calc(-1 * 1px);
-  bottom: calc(-1 * 1px);
-  left: calc(-1 * 1px);
-  display: block;
-  pointer-events: none;
-  box-shadow: 0 0 0 calc(-1 * 1px) var(--p-color-border-interactive-focus);
-  transition: box-shadow var(--p-motion-duration-100) var(--p-motion-ease);
-  border-radius: var(--p-border-radius-1);
-}
-.AlphaTabs-Item::-moz-focus-inner {
-  border: none;
-}
-.AlphaTabs-Item:hover {
-  background-color: var(--p-color-bg-hover);
-  color: var(--p-color-text);
-}
-.AlphaTabs-Item:active {
-  background-color: var(--p-color-bg-active);
-  color: var(--p-color-text);
-}
-.AlphaTabs-Item:focus-visible:not(:active)::after {
-  box-shadow: 0 0 0 2px var(--p-color-border-interactive-focus);
-  outline: var(--p-border-width-1) solid transparent;
-}
-.AlphaTabs-Item:visited {
-  color: inherit;
-}
-
-.AlphaTabs-DisclosureTab {
-  display: none;
-}
-
-.AlphaTabs-DisclosureTab-visible {
-  display: flex;
-}
-
-.AlphaTabs-DisclosureActivator {
-  position: relative;
-  appearance: none;
-  margin: 0;
-  padding: 0;
-  background: none;
-  border: none;
-  font-size: inherit;
-  line-height: inherit;
-  color: inherit;
-  cursor: pointer;
-  height: 100%;
-  background-color: transparent;
-  color: var(--p-color-text-subdued);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  border-radius: var(--p-border-radius-1);
-  padding: 0 var(--p-space-2) 0 var(--p-space-3);
-  margin-top: var(--p-space-025);
-  border: none;
-  outline: none;
-}
-.AlphaTabs-DisclosureActivator::after {
-  content: "";
-  position: absolute;
-  z-index: 1;
-  top: calc(-1 * 1px);
-  right: calc(-1 * 1px);
-  bottom: calc(-1 * 1px);
-  left: calc(-1 * 1px);
-  display: block;
-  pointer-events: none;
-  box-shadow: 0 0 0 calc(-1 * 1px) var(--p-color-border-interactive-focus);
-  transition: box-shadow var(--p-motion-duration-100) var(--p-motion-ease);
-  border-radius: var(--p-border-radius-1);
-}
-.AlphaTabs-DisclosureActivator:focus {
-  outline: none;
-}
-.AlphaTabs-DisclosureActivator:hover svg, .AlphaTabs-DisclosureActivator:focus svg {
-  fill: var(--p-color-icon);
-}
-.AlphaTabs-DisclosureActivator:not([aria-disabled=true]):hover, .AlphaTabs-DisclosureActivator:not([aria-disabled=true]):focus {
-  background-color: var(--p-color-bg-hover);
-}
-.AlphaTabs-DisclosureActivator:not([aria-disabled=true]):focus-visible {
-  outline: 0;
-}
-.AlphaTabs-DisclosureActivator:not([aria-disabled=true]):focus-visible::after {
-  box-shadow: 0 0 0 2px var(--p-color-border-interactive-focus);
-  outline: var(--p-border-width-1) solid transparent;
-}
-.AlphaTabs-DisclosureActivator:not([aria-disabled=true]):active {
-  background-color: var(--p-color-bg-active);
-  z-index: var(--p-z-index-1);
-}
-.AlphaTabs-DisclosureActivator[aria-disabled=true] {
-  cursor: default;
-  color: var(--p-color-text-disabled);
-}
-.AlphaTabs-DisclosureActivator[aria-disabled=true] path {
-  fill: var(--p-color-icon-disabled);
-}
-
-.AlphaTabs-TabsMeasurer {
-  display: flex;
-  gap: 0;
-  padding: 0;
-  visibility: hidden;
-  height: 0;
-}
-
-.AlphaTabs-NewTab {
-  padding: 0 var(--p-space-2) 0 var(--p-space-1);
-}
-@media (min-width: 48em) {
-  .AlphaTabs-NewTab {
-    position: absolute;
-    right: 0;
-    top: 0;
-    padding: 0;
-  }
-}
-
-.AlphaTabs-ActionListWrap {
-  display: block;
-}
-
-.AlphaTabs-Panel {
-  display: block;
-}
-.AlphaTabs-Panel:focus {
-  outline: none;
-}
-
-.AlphaTabs-Panel-hidden {
-  display: none;
-}