@everchron/ec-shards 7.5.26 → 7.5.28

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@everchron/ec-shards",
-  "version": "7.5.26",
+  "version": "7.5.28",
   "private": false,
   "description": "Everchron Shards UI Library",
   "repository": "https://github.com/everchron/ec-shards.git",

package/src/components/checkbox/checkbox.vue

@@ -131,10 +131,10 @@
     },
 
     methods: {
-      handleClick(e) {
+      handleClick() {
         this.indeterminateState = false
         this.checked = !this.checked
-        this.$emit('input', this.checked ? this.valueWhenTrue : this.valueWhenFalse, this.id, e)
+        this.$emit('input', this.checked ? this.valueWhenTrue : this.valueWhenFalse, this.id)
       }
     }
   }

package/src/components/entry-link/entry-link.vue

@@ -49,7 +49,7 @@
       /** The text content of the link. */
       label: {
         type: String,
-        required: true
+        required: false
       },
       /** Determines if the (...) more button will be shown. */
       moreButton: {

package/src/components/formatted/formatted.vue

@@ -1,5 +1,6 @@
 <template>
-  <div class="ecs-formatted" :class="small ? `ecs-formatted-sml` : ''" :id="formattedId">
+  <div class="ecs-formatted" :class="[small ? 'ecs-formatted-sml' : '', aiGenerated ? 'ai-generated' : '']" :id="formattedId">
+    <ecs-icon v-if="!loading && aiGenerated" type="sparkle-ai" :size="small ? '16' : '20'" color="#A940AE" class="ai-indicator" />
     <slot v-if="!loading" ref="slot"></slot>
     <ecs-skeleton-loader v-else type="multi" :line-height="small ? 1 : 2" :count="skeletonCount" />
   </div>
@@ -7,10 +8,11 @@
 
 <script>
   import EcsSkeletonLoader from '../skeleton-loader/skeleton-loader'
+  import EcsIcon from '../icon/icon'
   import { uniqueIdMixin } from '../mixins/unique-id'
 
   export default {
-    components: { EcsSkeletonLoader },
+    components: { EcsSkeletonLoader, EcsIcon },
     mixins: [uniqueIdMixin],
 
     data() {
@@ -34,6 +36,11 @@
       skeletonCount: {
         type: Number,
         default: 4
+      },
+      /** Shows a small AI indicator icon at the beginning of the formatted text. */
+      aiGenerated: {
+        type: Boolean,
+        default: false
       }
     },
 
@@ -232,5 +239,21 @@
   > div > :last-child{
     margin-bottom: 0;
   }
+
+  &.ai-generated{
+    > :nth-child(2),
+    > div > :nth-child(2){
+      margin-top: 0;
+    }
+  }
+
+  .ai-indicator{
+    float: left;
+    margin-right: 4px;
+
+    + ul{
+      margin-left: 24px;
+    }
+  }
 }
 </style>

package/src/components/text/text.vue

@@ -163,6 +163,15 @@ h1, h2, h3, h4, h5, h6, label{
   line-height: $type-scale-2-line-height;
   color: $color-gray-9;
 
+  :deep(a){
+    color: $color-blue-10;
+
+    &:hover{
+      color: $color-blue-11;
+      text-decoration: underline;
+    }
+  }
+
   &.emphasized{
     font-weight: $font-weight-medium;
   }

package/src/stories/formatted/formatted.stories.js

@@ -7,7 +7,7 @@ export default {
 
 export const formattedText = () => ({
   components: { EcsFormatted },
-  template: `<ecs-formatted>
+  template: `<ecs-formatted ai-generated>
                   <p>Non-euclidean
                   <b>tentacles</b>
                   cat

package/src/stories/text/text.stories.js

@@ -37,7 +37,7 @@ export const sublines = () => ({
 export const formText = () => ({
   components: { EcsText },
   template: `<div>
-              <ecs-text type="form">Default Form Text</ecs-text>
+              <ecs-text type="form">Default Form Text <a href="#">Test</a></ecs-text>
               <ecs-text type="form" color="negative">Error Form Text</ecs-text>
             </div>`,
 });