opus-react 0.6.8 → 0.6.10

package/dist/index.css

@@ -1190,6 +1190,508 @@
   position: fixed;
 }
 
+/* components/fields/DatePickerPanel/OpusDateTimeInput.module.css */
+.opus_ccnMhZ_timeRow {
+  grid-template-columns: 1fr 1fr;
+  gap: 10px;
+  display: grid;
+}
+
+.opus_ccnMhZ_timeField {
+  color: var(--opus-text-muted);
+  gap: 5px;
+  font-size: .78rem;
+  font-weight: 650;
+  display: grid;
+}
+
+.opus_ccnMhZ_timeSelect {
+  border: 1px solid var(--opus-border-strong);
+  border-radius: var(--opus-input-radius, 10px);
+  background: var(--opus-input-bg);
+  width: 100%;
+  min-height: 36px;
+  color: var(--opus-text);
+  font: inherit;
+  padding: 0 10px;
+}
+
+.opus_ccnMhZ_timeSelect:focus {
+  border-color: var(--opus-accent);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  outline: none;
+}
+
+.opus_ccnMhZ_footer {
+  border-top: 1px solid color-mix(in srgb, var(--opus-border) 70%, transparent);
+  justify-content: space-between;
+  align-items: center;
+  gap: 8px;
+  padding-top: 2px;
+  display: flex;
+}
+
+.opus_ccnMhZ_footerAction, .opus_ccnMhZ_footerActionPrimary {
+  color: var(--opus-accent);
+  font: inherit;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  padding: 4px 2px;
+  font-size: .8rem;
+  font-weight: 700;
+}
+
+.opus_ccnMhZ_footerActionPrimary {
+  margin-left: auto;
+}
+
+.opus_ccnMhZ_footerAction:hover, .opus_ccnMhZ_footerActionPrimary:hover {
+  text-decoration: underline;
+}
+
+.opus_ccnMhZ_footerAction:focus-visible, .opus_ccnMhZ_footerActionPrimary:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  border-radius: 4px;
+  outline: none;
+}
+
+.opus_ccnMhZ_timeOnlyShell {
+  border: 1px solid var(--opus-border);
+  border-radius: var(--opus-input-radius-large);
+  background: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--opus-accent) 12%, transparent), transparent 36%),
+    var(--opus-panel);
+  width: min(240px, 100vw - 32px);
+  box-shadow: 0 18px 40px #0000005c,
+    0 0 0 1px color-mix(in srgb, var(--opus-accent) 8%, transparent);
+  gap: 12px;
+  padding: 12px;
+  display: grid;
+}
+
+.opus_ccnMhZ_timePanel {
+  min-width: 220px;
+}
+
+/* components/fields/DatePickerPanel/OpusMonthInput.module.css */
+.opus_RtV775_panel {
+  border: 1px solid var(--opus-border);
+  border-radius: var(--opus-input-radius-large);
+  background: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--opus-accent) 12%, transparent), transparent 36%),
+    var(--opus-panel);
+  width: min(288px, 100vw - 32px);
+  box-shadow: 0 18px 40px #0000005c,
+    0 0 0 1px color-mix(in srgb, var(--opus-accent) 8%, transparent);
+  color: var(--opus-text);
+  gap: 10px;
+  padding: 12px;
+  display: grid;
+}
+
+.opus_RtV775_toolbar {
+  grid-template-columns: auto 1fr auto;
+  align-items: center;
+  gap: 6px;
+  display: grid;
+}
+
+.opus_RtV775_nav {
+  border: 1px solid color-mix(in srgb, var(--opus-border) 88%, transparent);
+  background: var(--opus-input-bg);
+  width: 30px;
+  height: 30px;
+  color: var(--opus-text);
+  cursor: pointer;
+  border-radius: 8px;
+  place-items: center;
+  font-size: 1.1rem;
+  line-height: 1;
+  display: grid;
+}
+
+.opus_RtV775_nav:hover {
+  border-color: color-mix(in srgb, var(--opus-accent) 40%, var(--opus-border));
+  color: var(--opus-accent);
+}
+
+.opus_RtV775_nav:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  outline: none;
+}
+
+.opus_RtV775_year {
+  text-align: center;
+  font-size: .95rem;
+  font-weight: 700;
+}
+
+.opus_RtV775_grid {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 6px;
+  display: grid;
+}
+
+.opus_RtV775_month {
+  background: color-mix(in srgb, var(--opus-input-bg) 88%, transparent);
+  min-height: 40px;
+  color: var(--opus-text);
+  font: inherit;
+  cursor: pointer;
+  border: 1px solid #0000;
+  border-radius: 10px;
+  font-size: .85rem;
+  font-weight: 650;
+}
+
+.opus_RtV775_month:hover:not(:disabled) {
+  border-color: color-mix(in srgb, var(--opus-accent) 40%, var(--opus-border));
+  color: var(--opus-accent);
+}
+
+.opus_RtV775_month:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  outline: none;
+}
+
+.opus_RtV775_month:disabled {
+  opacity: .4;
+  cursor: not-allowed;
+}
+
+.opus_RtV775_current {
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--opus-accent) 45%, transparent);
+}
+
+.opus_RtV775_selected {
+  background: var(--opus-accent);
+  color: #fff;
+  border-color: #0000;
+}
+
+.opus_RtV775_selected:hover:not(:disabled) {
+  color: #fff;
+  border-color: #0000;
+}
+
+.opus_RtV775_footer {
+  border-top: 1px solid color-mix(in srgb, var(--opus-border) 70%, transparent);
+  justify-content: space-between;
+  align-items: center;
+  gap: 8px;
+  padding-top: 2px;
+  display: flex;
+}
+
+.opus_RtV775_footerAction {
+  color: var(--opus-accent);
+  font: inherit;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  padding: 4px 2px;
+  font-size: .8rem;
+  font-weight: 700;
+}
+
+.opus_RtV775_footerAction:hover:not(:disabled) {
+  text-decoration: underline;
+}
+
+.opus_RtV775_footerAction:disabled {
+  opacity: .4;
+  cursor: not-allowed;
+}
+
+.opus_RtV775_footerAction:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  border-radius: 4px;
+  outline: none;
+}
+
+/* components/fields/DatePickerPanel/OpusTimeInput.module.css */
+.opus_5GCnK5_panel {
+  border: 1px solid var(--opus-border);
+  border-radius: var(--opus-input-radius-large);
+  background: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--opus-accent) 12%, transparent), transparent 36%),
+    var(--opus-panel);
+  width: min(240px, 100vw - 32px);
+  box-shadow: 0 18px 40px #0000005c,
+    0 0 0 1px color-mix(in srgb, var(--opus-accent) 8%, transparent);
+  color: var(--opus-text);
+  gap: 10px;
+  padding: 12px;
+  display: grid;
+}
+
+.opus_5GCnK5_preview {
+  text-align: center;
+  letter-spacing: .04em;
+  font-variant-numeric: tabular-nums;
+  margin: 0;
+  font-size: 1.35rem;
+  font-weight: 750;
+}
+
+.opus_5GCnK5_columns {
+  grid-template-columns: 1fr 1fr;
+  gap: 8px;
+  display: grid;
+}
+
+.opus_5GCnK5_column {
+  gap: 6px;
+  min-width: 0;
+  display: grid;
+}
+
+.opus_5GCnK5_columnLabel {
+  color: var(--opus-text-muted);
+  letter-spacing: .04em;
+  text-align: center;
+  text-transform: uppercase;
+  font-size: .72rem;
+  font-weight: 700;
+}
+
+.opus_5GCnK5_columnList {
+  border: 1px solid color-mix(in srgb, var(--opus-border) 80%, transparent);
+  background: color-mix(in srgb, var(--opus-input-bg) 88%, transparent);
+  scrollbar-width: thin;
+  border-radius: 10px;
+  gap: 2px;
+  max-height: 220px;
+  padding: 4px;
+  display: grid;
+  overflow: auto;
+}
+
+.opus_5GCnK5_option {
+  min-height: 34px;
+  color: var(--opus-text);
+  font: inherit;
+  font-variant-numeric: tabular-nums;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  border-radius: 8px;
+  place-items: center;
+  font-size: .92rem;
+  display: grid;
+}
+
+.opus_5GCnK5_option:hover {
+  background: color-mix(in srgb, var(--opus-accent) 12%, transparent);
+  color: var(--opus-accent);
+}
+
+.opus_5GCnK5_option:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  outline: none;
+}
+
+.opus_5GCnK5_optionSelected {
+  background: var(--opus-accent);
+  color: #fff;
+  font-weight: 700;
+}
+
+.opus_5GCnK5_optionSelected:hover {
+  background: var(--opus-accent);
+  color: #fff;
+}
+
+.opus_5GCnK5_footer {
+  border-top: 1px solid color-mix(in srgb, var(--opus-border) 70%, transparent);
+  justify-content: space-between;
+  align-items: center;
+  gap: 8px;
+  padding-top: 2px;
+  display: flex;
+}
+
+.opus_5GCnK5_footerAction, .opus_5GCnK5_footerActionPrimary {
+  color: var(--opus-accent);
+  font: inherit;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  padding: 4px 2px;
+  font-size: .8rem;
+  font-weight: 700;
+}
+
+.opus_5GCnK5_footerActionPrimary {
+  margin-left: auto;
+}
+
+.opus_5GCnK5_footerAction:hover, .opus_5GCnK5_footerActionPrimary:hover {
+  text-decoration: underline;
+}
+
+.opus_5GCnK5_footerAction:focus-visible, .opus_5GCnK5_footerActionPrimary:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  border-radius: 4px;
+  outline: none;
+}
+
+/* components/fields/DatePickerPanel/OpusWeekInput.module.css */
+.opus_Oe8kca_panel {
+  border: 1px solid var(--opus-border);
+  border-radius: var(--opus-input-radius-large);
+  background: radial-gradient(circle at 12% 0%, color-mix(in srgb, var(--opus-accent) 12%, transparent), transparent 36%),
+    var(--opus-panel);
+  width: min(300px, 100vw - 32px);
+  box-shadow: 0 18px 40px #0000005c,
+    0 0 0 1px color-mix(in srgb, var(--opus-accent) 8%, transparent);
+  color: var(--opus-text);
+  gap: 10px;
+  padding: 12px;
+  display: grid;
+}
+
+.opus_Oe8kca_toolbar {
+  grid-template-columns: auto 1fr auto;
+  align-items: center;
+  gap: 6px;
+  display: grid;
+}
+
+.opus_Oe8kca_nav {
+  border: 1px solid color-mix(in srgb, var(--opus-border) 88%, transparent);
+  background: var(--opus-input-bg);
+  width: 30px;
+  height: 30px;
+  color: var(--opus-text);
+  cursor: pointer;
+  border-radius: 8px;
+  place-items: center;
+  font-size: 1.1rem;
+  line-height: 1;
+  display: grid;
+}
+
+.opus_Oe8kca_nav:hover {
+  border-color: color-mix(in srgb, var(--opus-accent) 40%, var(--opus-border));
+  color: var(--opus-accent);
+}
+
+.opus_Oe8kca_nav:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  outline: none;
+}
+
+.opus_Oe8kca_year {
+  text-align: center;
+  font-size: .95rem;
+  font-weight: 700;
+}
+
+.opus_Oe8kca_list {
+  scrollbar-width: thin;
+  gap: 4px;
+  max-height: 280px;
+  padding: 2px;
+  display: grid;
+  overflow: auto;
+}
+
+.opus_Oe8kca_week {
+  background: color-mix(in srgb, var(--opus-input-bg) 88%, transparent);
+  min-height: 40px;
+  color: var(--opus-text);
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+  border: 1px solid #0000;
+  border-radius: 10px;
+  grid-template-columns: auto 1fr;
+  align-items: center;
+  gap: 10px;
+  padding: 0 12px;
+  display: grid;
+}
+
+.opus_Oe8kca_week:hover:not(:disabled) {
+  border-color: color-mix(in srgb, var(--opus-accent) 40%, var(--opus-border));
+  color: var(--opus-accent);
+}
+
+.opus_Oe8kca_week:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  outline: none;
+}
+
+.opus_Oe8kca_week:disabled {
+  opacity: .4;
+  cursor: not-allowed;
+}
+
+.opus_Oe8kca_weekNumber {
+  font-variant-numeric: tabular-nums;
+  font-size: .82rem;
+  font-weight: 750;
+}
+
+.opus_Oe8kca_weekRange {
+  color: var(--opus-text-muted);
+  font-size: .8rem;
+  font-weight: 600;
+}
+
+.opus_Oe8kca_week:hover:not(:disabled) .opus_Oe8kca_weekRange, .opus_Oe8kca_selected .opus_Oe8kca_weekRange {
+  color: inherit;
+}
+
+.opus_Oe8kca_current {
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--opus-accent) 45%, transparent);
+}
+
+.opus_Oe8kca_selected {
+  background: var(--opus-accent);
+  color: #fff;
+  border-color: #0000;
+}
+
+.opus_Oe8kca_selected:hover:not(:disabled) {
+  color: #fff;
+  border-color: #0000;
+}
+
+.opus_Oe8kca_footer {
+  border-top: 1px solid color-mix(in srgb, var(--opus-border) 70%, transparent);
+  justify-content: space-between;
+  align-items: center;
+  gap: 8px;
+  padding-top: 2px;
+  display: flex;
+}
+
+.opus_Oe8kca_footerAction {
+  color: var(--opus-accent);
+  font: inherit;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  padding: 4px 2px;
+  font-size: .8rem;
+  font-weight: 700;
+}
+
+.opus_Oe8kca_footerAction:hover:not(:disabled) {
+  text-decoration: underline;
+}
+
+.opus_Oe8kca_footerAction:disabled {
+  opacity: .4;
+  cursor: not-allowed;
+}
+
+.opus_Oe8kca_footerAction:focus-visible {
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--opus-accent) 22%, transparent);
+  border-radius: 4px;
+  outline: none;
+}
+
 /* components/fields/HiddenField/HiddenField.module.css */
 .opus_kL1YXS_preview {
   padding: var(--opus-control-padding-y, 8px) var(--opus-control-padding-x, 10px);
@@ -9633,6 +10135,65 @@ button.opus_7Zs_d5_docCard:hover, .opus_7Zs_d5_docCard[data-kind="folder"]:hover
   }
 }
 
+/* components/fields/ComboboxField/ComboboxField.module.css */
+.opus_tXYPoZ_root {
+  width: 100%;
+  position: relative;
+}
+
+.opus_tXYPoZ_input {
+  width: 100%;
+  min-height: var(--opus-control-height);
+  border: 1px solid var(--opus-border);
+  background: var(--opus-input-bg);
+  color: var(--opus-text);
+  box-sizing: border-box;
+  font: inherit;
+  border-radius: 10px;
+  padding: 0 12px;
+}
+
+.opus_tXYPoZ_input:focus {
+  border-color: var(--opus-accent);
+  outline: 2px solid color-mix(in srgb, var(--opus-accent) 30%, transparent);
+  outline-offset: 1px;
+}
+
+.opus_tXYPoZ_inputError {
+  border-color: color-mix(in srgb, var(--opus-error, #dc2626) 75%, transparent);
+}
+
+.opus_tXYPoZ_portal {
+  z-index: 1000;
+  margin: 0;
+  position: fixed;
+}
+
+.opus_tXYPoZ_list {
+  border: 1px solid var(--opus-border-strong);
+  border-radius: var(--opus-input-radius-large, 12px);
+  background: var(--opus-panel);
+  max-height: min(280px, 50vh);
+  box-shadow: var(--opus-shadow);
+  overflow: auto;
+}
+
+.opus_tXYPoZ_option {
+  width: 100%;
+  color: var(--opus-text);
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+  background: none;
+  border: 0;
+  padding: 10px 12px;
+  display: block;
+}
+
+.opus_tXYPoZ_option:hover, .opus_tXYPoZ_optionActive {
+  background: color-mix(in srgb, var(--opus-accent) 14%, var(--opus-panel));
+}
+
 /* components/fields/AdvancedFields/AdvancedFields.module.css */
 .opus_ymQ4nN_input, .opus_ymQ4nN_rangeGrid input, .opus_ymQ4nN_affixed {
   width: 100%;