@indice/ng-components 0.5.0-beta.10 → 0.5.0

package/src/assets/styles/stepper.css

@@ -1,169 +1,169 @@
-/* Bullets */
-.stepper-bullets-container {
-    @apply flex items-center justify-center;
-}
-.stepper-bullets-counter {
-    @apply text-sm font-medium;
-}
-.stepper-bullets-ol {
-    @apply ml-8 flex items-center space-x-5;
-}
-.stepper-bullets-completed-step {
-    @apply block w-2.5 h-2.5 bg-blue-600 rounded-full hover:bg-blue-900;
-}
-.stepper-bullets-active-step {
-    @apply relative flex items-center justify-center;
-}
-.stepper-bullets-active-step-level1 {
-    @apply absolute w-5 h-5 p-px flex;
-}
-.stepper-bullets-active-step-level11 {
-    @apply w-full h-full rounded-full bg-blue-200;
-}
-.stepper-bullets-active-step-bullet {
-    @apply relative block w-2.5 h-2.5 bg-blue-600 rounded-full;
-}
-.stepper-bullets-upcoming-step {
-    @apply block w-2.5 h-2.5 bg-gray-200 rounded-full hover:bg-gray-400;
-}
-
-/* Bullets & Text */
-.stepper-bullets-and-text-container {
-    @apply flex items-center justify-center;
-}
-.stepper-bullets-and-text-ol {
-    @apply space-y-6;
-}
-.stepper-bullets-and-text-completed-step {
-    @apply flex items-start;
-}
-.stepper-bullets-and-text-completed-step-level1 {
-    @apply flex-shrink-0 relative h-5 w-5 flex items-center justify-center;
-}
-.stepper-bullets-and-text-completed-step-container {
-    @apply ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900;
-}
-.stepper-bullets-and-text-active-step {
-    @apply flex items-start;
-}
-.stepper-bullets-and-text-active-step-level1 {
-    @apply flex-shrink-0 h-5 w-5 relative flex items-center justify-center;
-}
-.stepper-bullets-and-text-active-step-level11 {
-    @apply absolute h-4 w-4 rounded-full bg-blue-200;
-}
-.stepper-bullets-and-text-active-step-level12 {
-    @apply relative block w-2 h-2 bg-blue-600 rounded-full;
-}
-.stepper-bullets-and-text-active-step-container {
-    @apply ml-3 text-sm font-medium text-blue-600;
-}
-.stepper-bullets-and-text-upcoming-step {
-    @apply flex items-start;
-}
-.stepper-bullets-and-text-upcoming-step-level1 {
-    @apply flex-shrink-0 h-5 w-5 relative flex items-center justify-center;
-}
-.stepper-bullets-and-text-upcoming-step-level2 {
-    @apply h-2 w-2 bg-gray-300 rounded-full group-hover:bg-gray-400;
-}
-.stepper-bullets-and-text-upcoming-step-container {
-    @apply ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900;
-}
-
-/* Circles */
-
-/* Panels With Border */
-.panels-with-border-container {
-    @apply border-t border-b border-gray-200;
-}
-.panels-with-border-nav {
-    @apply mx-auto max-w-7xl px-4 sm:px-6 lg:px-8;
-}
-.panels-with-border-ol {
-    @apply rounded-md overflow-hidden lg:flex lg:border-l lg:border-r lg:border-gray-200 lg:rounded-none;
-}
-.panels-with-border-li {
-    @apply relative overflow-hidden lg:flex-1 cursor-pointer;
-}
-.panels-with-border-completed-step {
-    @apply border border-gray-200 overflow-hidden border-b-0 rounded-t-md lg:border-0;
-}
-.panels-with-border-completed-step-level1 {
-    @apply absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto;
-}
-.panels-with-border-completed-step-level2 {
-    @apply px-6 py-5 flex items-start text-sm font-medium;
-}
-.panels-with-border-completed-step-level21 {
-    @apply flex-shrink-0;
-}
-.panels-with-border-completed-step-level211 {
-    @apply w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full;
-}
-.panels-with-border-completed-step-level22 {
-    @apply mt-0.5 ml-4 min-w-0 flex flex-col;
-}
-.panels-with-border-completed-step-level221 {
-    @apply text-xs font-semibold tracking-wide uppercase;
-}
-.panels-with-border-completed-step-level222 {
-    @apply text-sm font-medium text-gray-500;
-}
-.panels-with-border-active-step {
-    @apply border border-gray-200 overflow-hidden lg:border-0;
-}
-.panels-with-border-active-step-level1 {
-    @apply absolute top-0 left-0 w-1 h-full bg-blue-600 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto;
-}
-.panels-with-border-active-step-level2 {
-    @apply px-6 py-5 flex items-start text-sm font-medium lg:pl-9;
-}
-.panels-with-border-active-step-level21 {
-    @apply flex-shrink-0;
-}
-.panels-with-border-active-step-level211 {
-    @apply w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full;
-}
-.panels-with-border-active-step-level211-text {
-    @apply text-blue-600;
-}
-.panels-with-border-active-step-level22 {
-    @apply mt-0.5 ml-4 min-w-0 flex flex-col;
-}
-.panels-with-border-active-step-level221 {
-    @apply text-xs font-semibold text-blue-600 tracking-wide uppercase;
-}
-.panels-with-border-active-step-level222 {
-    @apply text-sm font-medium text-gray-500;
-}
-.panels-with-border-step-separator {
-    @apply hidden absolute top-0 left-0 w-3 inset-0 lg:block;
-}
-.panels-with-border-upcoming-step {
-    @apply border border-gray-200 overflow-hidden border-t-0 rounded-b-md lg:border-0;
-}
-.panels-with-border-upcoming-step-level1 {
-    @apply absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto;
-}
-.panels-with-border-upcoming-step-level2 {
-    @apply px-6 py-5 flex items-start text-sm font-medium lg:pl-9;
-}
-.panels-with-border-upcoming-step-level21 {
-    @apply flex-shrink-0;
-}
-.panels-with-border-upcoming-step-level211 {
-    @apply w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full;
-}
-.panels-with-border-upcoming-step-level211-text {
-    @apply text-gray-500;
-}
-.panels-with-border-upcoming-step-level22 {
-    @apply mt-0.5 ml-4 min-w-0 flex flex-col;
-}
-.panels-with-border-upcoming-step-level221 {
-    @apply text-xs font-semibold text-gray-500 tracking-wide uppercase;
-}
-.panels-with-border-upcoming-step-level222 {
-    @apply text-sm font-medium text-gray-500;
-}
+/* Bullets */
+.stepper-bullets-container {
+    @apply flex items-center justify-center;
+}
+.stepper-bullets-counter {
+    @apply text-sm font-medium;
+}
+.stepper-bullets-ol {
+    @apply ml-8 flex items-center space-x-5;
+}
+.stepper-bullets-completed-step {
+    @apply block w-2.5 h-2.5 bg-blue-600 rounded-full hover:bg-blue-900;
+}
+.stepper-bullets-active-step {
+    @apply relative flex items-center justify-center;
+}
+.stepper-bullets-active-step-level1 {
+    @apply absolute w-5 h-5 p-px flex;
+}
+.stepper-bullets-active-step-level11 {
+    @apply w-full h-full rounded-full bg-blue-200;
+}
+.stepper-bullets-active-step-bullet {
+    @apply relative block w-2.5 h-2.5 bg-blue-600 rounded-full;
+}
+.stepper-bullets-upcoming-step {
+    @apply block w-2.5 h-2.5 bg-gray-200 rounded-full hover:bg-gray-400;
+}
+
+/* Bullets & Text */
+.stepper-bullets-and-text-container {
+    @apply flex items-center justify-center;
+}
+.stepper-bullets-and-text-ol {
+    @apply space-y-6;
+}
+.stepper-bullets-and-text-completed-step {
+    @apply flex items-start;
+}
+.stepper-bullets-and-text-completed-step-level1 {
+    @apply flex-shrink-0 relative h-5 w-5 flex items-center justify-center;
+}
+.stepper-bullets-and-text-completed-step-container {
+    @apply ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900;
+}
+.stepper-bullets-and-text-active-step {
+    @apply flex items-start;
+}
+.stepper-bullets-and-text-active-step-level1 {
+    @apply flex-shrink-0 h-5 w-5 relative flex items-center justify-center;
+}
+.stepper-bullets-and-text-active-step-level11 {
+    @apply absolute h-4 w-4 rounded-full bg-blue-200;
+}
+.stepper-bullets-and-text-active-step-level12 {
+    @apply relative block w-2 h-2 bg-blue-600 rounded-full;
+}
+.stepper-bullets-and-text-active-step-container {
+    @apply ml-3 text-sm font-medium text-blue-600;
+}
+.stepper-bullets-and-text-upcoming-step {
+    @apply flex items-start;
+}
+.stepper-bullets-and-text-upcoming-step-level1 {
+    @apply flex-shrink-0 h-5 w-5 relative flex items-center justify-center;
+}
+.stepper-bullets-and-text-upcoming-step-level2 {
+    @apply h-2 w-2 bg-gray-300 rounded-full group-hover:bg-gray-400;
+}
+.stepper-bullets-and-text-upcoming-step-container {
+    @apply ml-3 text-sm font-medium text-gray-500 group-hover:text-gray-900;
+}
+
+/* Circles */
+
+/* Panels With Border */
+.panels-with-border-container {
+    @apply border-t border-b border-gray-200;
+}
+.panels-with-border-nav {
+    @apply mx-auto max-w-7xl px-4 sm:px-6 lg:px-8;
+}
+.panels-with-border-ol {
+    @apply rounded-md overflow-hidden lg:flex lg:border-l lg:border-r lg:border-gray-200 lg:rounded-none;
+}
+.panels-with-border-li {
+    @apply relative overflow-hidden lg:flex-1 cursor-pointer;
+}
+.panels-with-border-completed-step {
+    @apply border border-gray-200 overflow-hidden border-b-0 rounded-t-md lg:border-0;
+}
+.panels-with-border-completed-step-level1 {
+    @apply absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto;
+}
+.panels-with-border-completed-step-level2 {
+    @apply px-6 py-5 flex items-start text-sm font-medium;
+}
+.panels-with-border-completed-step-level21 {
+    @apply flex-shrink-0;
+}
+.panels-with-border-completed-step-level211 {
+    @apply w-10 h-10 flex items-center justify-center bg-blue-600 rounded-full;
+}
+.panels-with-border-completed-step-level22 {
+    @apply mt-0.5 ml-4 min-w-0 flex flex-col;
+}
+.panels-with-border-completed-step-level221 {
+    @apply text-xs font-semibold tracking-wide uppercase;
+}
+.panels-with-border-completed-step-level222 {
+    @apply text-sm font-medium text-gray-500;
+}
+.panels-with-border-active-step {
+    @apply border border-gray-200 overflow-hidden lg:border-0;
+}
+.panels-with-border-active-step-level1 {
+    @apply absolute top-0 left-0 w-1 h-full bg-blue-600 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto;
+}
+.panels-with-border-active-step-level2 {
+    @apply px-6 py-5 flex items-start text-sm font-medium lg:pl-9;
+}
+.panels-with-border-active-step-level21 {
+    @apply flex-shrink-0;
+}
+.panels-with-border-active-step-level211 {
+    @apply w-10 h-10 flex items-center justify-center border-2 border-blue-600 rounded-full;
+}
+.panels-with-border-active-step-level211-text {
+    @apply text-blue-600;
+}
+.panels-with-border-active-step-level22 {
+    @apply mt-0.5 ml-4 min-w-0 flex flex-col;
+}
+.panels-with-border-active-step-level221 {
+    @apply text-xs font-semibold text-blue-600 tracking-wide uppercase;
+}
+.panels-with-border-active-step-level222 {
+    @apply text-sm font-medium text-gray-500;
+}
+.panels-with-border-step-separator {
+    @apply hidden absolute top-0 left-0 w-3 inset-0 lg:block;
+}
+.panels-with-border-upcoming-step {
+    @apply border border-gray-200 overflow-hidden border-t-0 rounded-b-md lg:border-0;
+}
+.panels-with-border-upcoming-step-level1 {
+    @apply absolute top-0 left-0 w-1 h-full bg-transparent group-hover:bg-gray-200 lg:w-full lg:h-1 lg:bottom-0 lg:top-auto;
+}
+.panels-with-border-upcoming-step-level2 {
+    @apply px-6 py-5 flex items-start text-sm font-medium lg:pl-9;
+}
+.panels-with-border-upcoming-step-level21 {
+    @apply flex-shrink-0;
+}
+.panels-with-border-upcoming-step-level211 {
+    @apply w-10 h-10 flex items-center justify-center border-2 border-gray-300 rounded-full;
+}
+.panels-with-border-upcoming-step-level211-text {
+    @apply text-gray-500;
+}
+.panels-with-border-upcoming-step-level22 {
+    @apply mt-0.5 ml-4 min-w-0 flex flex-col;
+}
+.panels-with-border-upcoming-step-level221 {
+    @apply text-xs font-semibold text-gray-500 tracking-wide uppercase;
+}
+.panels-with-border-upcoming-step-level222 {
+    @apply text-sm font-medium text-gray-500;
+}

package/src/assets/styles/tab-group.css

@@ -1,27 +1,27 @@
-.tab-group-select-hidden {
-    @apply sm:hidden;
-}
-
-.tab-group-select {
-    @apply block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md;
-}
-
-.tab-active {
-    @apply border-gray-500 text-gray-900 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
-}
-
-.tab {
-    @apply border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
-}
-
-.tab-group-container-nav {
-    @apply -mb-px flex space-x-8;
-}
-
-.tab-group-container-hidden {
-    @apply hidden sm:block;
-}
-
-.tab-group-container {
-    @apply border-b border-gray-200;
-}
+.tab-group-select-hidden {
+    @apply sm:hidden;
+}
+
+.tab-group-select {
+    @apply block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md;
+}
+
+.tab-active {
+    @apply border-gray-500 text-gray-900 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
+}
+
+.tab {
+    @apply border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm;
+}
+
+.tab-group-container-nav {
+    @apply -mb-px flex space-x-8;
+}
+
+.tab-group-container-hidden {
+    @apply hidden sm:block;
+}
+
+.tab-group-container {
+    @apply border-b border-gray-200;
+}

package/src/assets/styles/toast.css

@@ -1,70 +1,70 @@
-.toast {
-  @apply fixed inset-0 flex items-end px-4 py-6 pointer-events-none sm:p-6 sm:items-start z-50;
-  animation: move 400ms ease-in;
-}
-
-.toast-closed {
-  @apply fixed inset-0 flex items-end px-4 py-6 pointer-events-none sm:p-6 sm:items-start;
-  animation: close 100ms ease-out;
-}
-
-.toast-container {
-  @apply w-full flex flex-col items-center space-y-4 sm:items-end z-50;
-}
-
-.toast-pill {
-  @apply max-w-sm w-full bg-white shadow-lg rounded-xl pointer-events-auto ring-1 ring-black ring-black/5 overflow-hidden;
-}
-
-.toast-context-padding {
-  @apply p-4;
-}
-
-.toast-context {
-  @apply flex items-start;
-}
-
-.toast-icon {
-  @apply flex-shrink-0;
-}
-
-.toast-close-icon {
-  @apply ml-4 flex-shrink-0 flex;
-}
-
-.toast-close-button {
-  @apply bg-white rounded-sm inline-flex text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500;
-}
-
-.toast-title {
-  @apply mb-1 text-sm font-medium text-gray-900;
-}
-
-.toast-body {
-  @apply text-sm text-gray-500 whitespace-normal;
-  word-break: break-word;
-}
-
-@keyframes move {
-  from {
-    opacity: 0;
-    --tw-translate-y: 0.5rem;
-    transform: translateY(0.5rem);
-  }
-
-  to {
-    --tw-translate-y: 0;
-    transform: translateY(0);
-    opacity: 100;
-  }
-}
-
-@keyframes close {
-  from {
-    opacity: 100;
-  }
-
-  to {
-    opacity: 0;
-  }
-}
+.toast {
+  @apply fixed inset-0 flex items-end px-4 py-6 pointer-events-none sm:p-6 sm:items-start z-50;
+  animation: move 400ms ease-in;
+}
+
+.toast-closed {
+  @apply fixed inset-0 flex items-end px-4 py-6 pointer-events-none sm:p-6 sm:items-start;
+  animation: close 100ms ease-out;
+}
+
+.toast-container {
+  @apply w-full flex flex-col items-center space-y-4 sm:items-end z-50;
+}
+
+.toast-pill {
+  @apply max-w-sm w-full bg-white shadow-lg rounded-xl pointer-events-auto ring-1 ring-black ring-black/5 overflow-hidden;
+}
+
+.toast-context-padding {
+  @apply p-4;
+}
+
+.toast-context {
+  @apply flex items-start;
+}
+
+.toast-icon {
+  @apply flex-shrink-0;
+}
+
+.toast-close-icon {
+  @apply ml-4 flex-shrink-0 flex;
+}
+
+.toast-close-button {
+  @apply bg-white rounded-sm inline-flex text-gray-400 hover:text-gray-500 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500;
+}
+
+.toast-title {
+  @apply mb-1 text-sm font-medium text-gray-900;
+}
+
+.toast-body {
+  @apply text-sm text-gray-500 whitespace-normal;
+  word-break: break-word;
+}
+
+@keyframes move {
+  from {
+    opacity: 0;
+    --tw-translate-y: 0.5rem;
+    transform: translateY(0.5rem);
+  }
+
+  to {
+    --tw-translate-y: 0;
+    transform: translateY(0);
+    opacity: 100;
+  }
+}
+
+@keyframes close {
+  from {
+    opacity: 100;
+  }
+
+  to {
+    opacity: 0;
+  }
+}

package/src/assets/styles/toggle-button.component.css

@@ -1,51 +1,51 @@
-.toggle-button-button {
-    @apply relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-1 focus:ring-gray-500 focus:ring-offset-1;
-}
-
-.toggle-button-button-disabled {
-    @apply opacity-75;
-}
-
-.toggle-button-bg-false {
-    @apply bg-gray-200;
-}
-
-.toggle-button-bg-true {
-    @apply bg-gray-600;
-}
-
-.toggle-button-icon-container {
-    @apply pointer-events-none relative inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out;
-}
-
-.toggle-button-icon-container-true {
-    @apply translate-x-5;
-}
-
-.toggle-button-icon-container-false {
-    @apply translate-x-0;
-}
-
-.toggle-button-icon-container-inner {
-    @apply opacity-100 ease-in duration-200 absolute inset-0 flex h-full w-full items-center justify-center transition-opacity;
-}
-
-.toggle-button-container-inner-true {
-    @apply opacity-0 ease-out duration-100;
-}
-
-.toggle-button-container-inner-false {
-    @apply opacity-100 ease-in duration-200;
-}
-
-.toggle-button-icon {
-    @apply h-3 w-3 text-gray-600;
-}
-
-.toggle-button-text {
-    @apply text-sm font-medium text-gray-900;
-}
-
-.toggle-button-description {
-    @apply text-xs mt-1 text-gray-500;
-}
+.toggle-button-button {
+    @apply relative inline-flex h-6 w-11 flex-shrink-0 cursor-pointer rounded-full border-2 border-transparent transition-colors duration-200 ease-in-out focus:outline-none focus:ring-1 focus:ring-gray-500 focus:ring-offset-1;
+}
+
+.toggle-button-button-disabled {
+    @apply opacity-75;
+}
+
+.toggle-button-bg-false {
+    @apply bg-gray-200;
+}
+
+.toggle-button-bg-true {
+    @apply bg-gray-600;
+}
+
+.toggle-button-icon-container {
+    @apply pointer-events-none relative inline-block h-5 w-5 transform rounded-full bg-white shadow ring-0 transition duration-200 ease-in-out;
+}
+
+.toggle-button-icon-container-true {
+    @apply translate-x-5;
+}
+
+.toggle-button-icon-container-false {
+    @apply translate-x-0;
+}
+
+.toggle-button-icon-container-inner {
+    @apply opacity-100 ease-in duration-200 absolute inset-0 flex h-full w-full items-center justify-center transition-opacity;
+}
+
+.toggle-button-container-inner-true {
+    @apply opacity-0 ease-out duration-100;
+}
+
+.toggle-button-container-inner-false {
+    @apply opacity-100 ease-in duration-200;
+}
+
+.toggle-button-icon {
+    @apply h-3 w-3 text-gray-600;
+}
+
+.toggle-button-text {
+    @apply text-sm font-medium text-gray-900;
+}
+
+.toggle-button-description {
+    @apply text-xs mt-1 text-gray-500;
+}