@koobiq/react-components 0.21.1 → 0.23.0

package/dist/style.css

@@ -3032,6 +3032,11 @@
   overflow: auto;
 }
 
+.kbq-dialog-content-8f3b2a:focus-visible {
+  outline: 2px solid var(--kbq-states-line-focus-theme);
+  outline-offset: -2px;
+}
+
 .kbq-dialog-content-8f3b2a:first-child {
   padding-block-start: var(--kbq-size-xxl);
 }
@@ -5083,6 +5088,189 @@
   letter-spacing: var(--kbq-typography-subheading-letter-spacing);
   text-underline-offset: calc(( var(--kbq-typography-subheading-line-height)  - var(--kbq-typography-subheading-font-size)) / 2);
 }
+.kbq-accordion-3163a3 {
+  --accordion-outline-width: var(--kbq-size-3xs);
+  --accordion-outline-color: transparent;
+  transition: outline-color var(--kbq-transition-default);
+  outline-offset: calc(-1 * var(--accordion-outline-width));
+  outline: var(--accordion-outline-width) solid var(--accordion-outline-color);
+  flex-direction: column;
+  display: flex;
+}
+
+.kbq-accordion-3163a3:has([data-slot="trigger"][data-focus-visible="true"]) {
+  --accordion-outline-color: var(--kbq-states-line-focus-theme);
+}
+.kbq-accordionsummary-17bfb5 {
+  --accordion-summary-block-size: 36px;
+  --accordion-summary-color: var(--kbq-foreground-contrast);
+  --accordion-summary-expand-icon-color: var(--kbq-icon-contrast-fade);
+  margin: unset;
+  min-block-size: var(--accordion-summary-block-size);
+}
+
+.kbq-accordionsummary-17bfb5 > * {
+  cursor: pointer;
+}
+
+.kbq-accordionsummary-17bfb5:has(:disabled) > * {
+  cursor: not-allowed;
+}
+
+.kbq-accordionsummary-trigger-8096e7 {
+  inline-size: 100%;
+  font: inherit;
+  text-align: start;
+  gap: var(--kbq-size-xxs);
+  padding: var(--kbq-size-s);
+  color: var(--accordion-summary-color);
+  background: none;
+  border: none;
+  outline: none;
+  display: flex;
+}
+
+.kbq-accordionsummary-hovered-3a99cb {
+  --accordion-summary-expand-icon-color: var(--kbq-icon-contrast);
+}
+
+.kbq-accordionsummary-disabled-5a76af {
+  --accordion-summary-color: var(--kbq-foreground-contrast-secondary);
+  --accordion-summary-expand-icon-color: var(--kbq-states-icon-disabled);
+}
+
+.kbq-accordionsummary-after-content-58ad40, .kbq-accordionsummary-separately-f6c597 {
+  padding: var(--kbq-size-s) var(--kbq-size-m);
+}
+
+.kbq-accordionsummary-separately-f6c597 .kbq-accordionsummary-expandIcon-54a6fc {
+  margin-inline-start: auto;
+}
+
+.kbq-accordionsummary-expandIcon-54a6fc {
+  block-size: var(--kbq-size-xxl);
+  inline-size: var(--kbq-size-xxl);
+  color: var(--accordion-summary-expand-icon-color);
+  transition: color var(--kbq-transition-default);
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+.kbq-accordiondetails-639d82 {
+  --accordion-details-duration: .3s;
+  --accordion-details-block-size: 0;
+  --accordion-details-padding: 0 var(--kbq-size-m) var(--kbq-size-s) var(--kbq-size-m);
+  opacity: 1;
+  will-change: block-size;
+  transition: block-size var(--kbq-transition-slow), opacity var(--kbq-transition-slow);
+  transition-duration: var(--accordion-details-duration);
+  overflow: hidden;
+}
+
+.kbq-accordiondetails-639d82 > * {
+  padding: var(--accordion-details-padding);
+  margin: unset;
+}
+
+.kbq-accordiondetails-639d82[data-transition="entering"], .kbq-accordiondetails-639d82[data-transition="entered"] {
+  opacity: 1;
+  block-size: var(--accordion-details-block-size);
+}
+
+.kbq-accordiondetails-639d82[data-transition="exiting"], .kbq-accordiondetails-639d82[data-transition="exited"] {
+  opacity: 0;
+  block-size: 0;
+}
+.kbq-accordiongroup-35d80f {
+  flex-direction: column;
+  display: flex;
+}
+.kbq-contentpanel-3541ee {
+  --content-panel-transition-duration: .3s;
+  --content-panel-start-position: 100%;
+  --content-panel-resizer-width: var(--kbq-size-l);
+  box-sizing: border-box;
+  block-size: 100%;
+  inline-size: 50%;
+  transition: transform var(--kbq-transition-slow), inline-size var(--kbq-transition-slow);
+  transition-duration: var(--content-panel-transition-duration);
+  margin-inline-start: var(--kbq-size-l);
+}
+
+.kbq-contentpanel-resizable-71e8a7 {
+  inline-size: unset;
+}
+
+body[data-resizing="true"] .kbq-contentpanel-3541ee {
+  transition: none;
+}
+
+.kbq-contentpanel-3541ee[data-transition="entering"], .kbq-contentpanel-3541ee[data-transition="entered"] {
+  transform: translate(0);
+}
+
+.kbq-contentpanel-3541ee[data-transition="exiting"], .kbq-contentpanel-3541ee[data-transition="exited"] {
+  transform: translate(var(--content-panel-start-position), 0);
+}
+
+.kbq-contentpanel-dialog-872768 {
+  border-radius: var(--kbq-size-l);
+  background-color: var(--kbq-background-card);
+  border: 1px solid var(--kbq-line-contrast-less);
+  overflow: unset;
+  block-size: inherit;
+}
+
+.kbq-contentpanel-resizer-a708c1 {
+  cursor: ew-resize;
+  block-size: 100%;
+  inline-size: var(--content-panel-resizer-width);
+  position: absolute;
+  inset-block-start: 0;
+  inset-inline-start: calc(var(--content-panel-resizer-width) / -2);
+}
+.kbq-contentpanelcontainer-476965 {
+  --content-body-transition-duration: .3s;
+  outline: none;
+  display: flex;
+  position: relative;
+  overflow: hidden;
+}
+
+.kbq-contentpanelcontainer-body-b7b172 {
+  --content-panel-inline-size: ;
+  will-change: inline-size;
+  inline-size: 100%;
+  overflow: auto;
+}
+
+.kbq-contentpanelcontainer-476965:has(.kbq-contentpanelcontainer-panel-03cf65[data-transition="entering"]) .kbq-contentpanelcontainer-body-b7b172 {
+  inline-size: calc(100% - var(--content-panel-inline-size));
+  transition: inline-size var(--kbq-transition-slow);
+  transition-duration: var(--content-body-transition-duration);
+}
+
+.kbq-contentpanelcontainer-476965:has(.kbq-contentpanelcontainer-panel-03cf65[data-transition="entered"]) .kbq-contentpanelcontainer-body-b7b172 {
+  inline-size: calc(100% - var(--content-panel-inline-size));
+}
+
+.kbq-contentpanelcontainer-476965:has(.kbq-contentpanelcontainer-panel-03cf65[data-transition="exiting"]) .kbq-contentpanelcontainer-body-b7b172 {
+  inline-size: 100%;
+  transition: inline-size var(--kbq-transition-slow);
+  transition-duration: var(--content-body-transition-duration);
+}
+
+.kbq-contentpanelcontainer-476965:has(.kbq-contentpanelcontainer-panel-03cf65[data-transition="exited"]) .kbq-contentpanelcontainer-body-b7b172 {
+  inline-size: 100%;
+}
+
+.kbq-contentpanelcontainer-panel-03cf65 {
+  z-index: var(--kbq-layer-absolute);
+  position: absolute;
+  inset-block-start: 0;
+  inset-inline-end: 0;
+}
 .kbq-spacing-mbs_0-be7021 {
   margin-block-start: 0;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@koobiq/react-components",
-  "version": "0.21.1",
+  "version": "0.23.0",
   "license": "MIT",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -28,10 +28,10 @@
     "@koobiq/design-tokens": "^3.15.0",
     "@types/react-transition-group": "^4.4.12",
     "react-transition-group": "^4.4.5",
-    "@koobiq/logger": "0.21.1",
-    "@koobiq/react-core": "0.21.1",
-    "@koobiq/react-primitives": "0.21.1",
-    "@koobiq/react-icons": "0.21.1"
+    "@koobiq/logger": "0.23.0",
+    "@koobiq/react-icons": "0.23.0",
+    "@koobiq/react-primitives": "0.23.0",
+    "@koobiq/react-core": "0.23.0"
   },
   "peerDependencies": {
     "@koobiq/design-tokens": "^3.15.0",