Skip to content

Commit

Permalink
adds icon
Browse files Browse the repository at this point in the history
  • Loading branch information
@juanfriss
juanfriss committed Oct 25, 2023
1 parent f31f6e1 commit 172d1f8
Show file tree
Hide file tree
Showing 4 changed files with 49 additions and 1 deletion.
4 changes: 4 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
# CHANGELOG

## v2.0.0-beta.55

Adds the external link icon

## v2.0.0-beta.54

Style changes for `Input` and `Label`
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@lob/ui-components",
"version": "2.0.0-beta.54",
"version": "2.0.0-beta.55",
"engines": {
"node": ">=14.18.2",
"npm": ">=8.3.0"
Expand Down
43 changes: 43 additions & 0 deletions src/components/Icons/ExternalLink.vue
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
<template>
<svg
:width="currentSize"
:height="currentSize"
:viewBox="`0 0 ${currentSize} ${currentSize}`"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path
:d="path"
fill="currentColor"
/>
</svg>
</template>

<script>
const iconInfo = {
xxl: { size: 24, path: 'M 19.199219 10.585938 C 18.882812 10.585938 18.578125 10.710938 18.351562 10.933594 C 18.125 11.160156 18 11.464844 18 11.785156 L 18 20.398438 C 18 20.71875 17.875 21.023438 17.648438 21.25 C 17.421875 21.472656 17.117188 21.601562 16.800781 21.601562 L 3.601562 21.601562 C 3.28125 21.601562 2.976562 21.472656 2.75 21.25 C 2.527344 21.023438 2.398438 20.71875 2.398438 20.398438 L 2.398438 7.199219 C 2.398438 6.882812 2.527344 6.578125 2.75 6.351562 C 2.976562 6.125 3.28125 6 3.601562 6 L 12.214844 6 C 12.535156 6 12.839844 5.875 13.066406 5.648438 C 13.289062 5.421875 13.414062 5.117188 13.414062 4.800781 C 13.414062 4.480469 13.289062 4.175781 13.066406 3.953125 C 12.839844 3.726562 12.535156 3.601562 12.214844 3.601562 L 3.601562 3.601562 C 2.644531 3.601562 1.730469 3.980469 1.054688 4.65625 C 0.378906 5.328125 0 6.246094 0 7.199219 L 0 20.398438 C 0 21.355469 0.378906 22.269531 1.054688 22.945312 C 1.730469 23.621094 2.644531 24 3.601562 24 L 16.800781 24 C 17.753906 24 18.671875 23.621094 19.34375 22.945312 C 20.019531 22.269531 20.398438 21.355469 20.398438 20.398438 L 20.398438 11.785156 C 20.398438 11.464844 20.273438 11.160156 20.046875 10.933594 C 19.824219 10.710938 19.519531 10.585938 19.199219 10.585938 Z M 23.902344 0.742188 C 23.78125 0.449219 23.550781 0.21875 23.257812 0.0976562 C 23.113281 0.0351562 22.957031 0 22.800781 0 L 15.601562 0 C 15.28125 0 14.976562 0.125 14.75 0.351562 C 14.527344 0.578125 14.398438 0.882812 14.398438 1.199219 C 14.398438 1.519531 14.527344 1.824219 14.75 2.046875 C 14.976562 2.273438 15.28125 2.398438 15.601562 2.398438 L 19.90625 2.398438 L 7.546875 14.746094 C 7.433594 14.859375 7.347656 14.992188 7.285156 15.136719 C 7.222656 15.285156 7.191406 15.441406 7.191406 15.601562 C 7.191406 15.757812 7.222656 15.914062 7.285156 16.0625 C 7.347656 16.207031 7.433594 16.339844 7.546875 16.453125 C 7.660156 16.5625 7.792969 16.652344 7.9375 16.714844 C 8.085938 16.777344 8.242188 16.808594 8.398438 16.808594 C 8.558594 16.808594 8.714844 16.777344 8.863281 16.714844 C 9.007812 16.652344 9.140625 16.5625 9.253906 16.453125 L 21.601562 4.09375 L 21.601562 8.398438 C 21.601562 8.71875 21.726562 9.023438 21.953125 9.25 C 22.175781 9.472656 22.480469 9.601562 22.800781 9.601562 C 23.117188 9.601562 23.421875 9.472656 23.648438 9.25 C 23.875 9.023438 24 8.71875 24 8.398438 L 24 1.199219 C 24 1.042969 23.964844 0.886719 23.902344 0.742188 Z M 23.902344 0.742188' },
xl: { size: 20, path: 'M16 8.82C15.7348 8.82 15.4804 8.92536 15.2929 9.11289C15.1054 9.30043 15 9.55478 15 9.82V17C15 17.2652 14.8946 17.5196 14.7071 17.7071C14.5196 17.8946 14.2652 18 14 18H3C2.73478 18 2.48043 17.8946 2.29289 17.7071C2.10536 17.5196 2 17.2652 2 17V6C2 5.73478 2.10536 5.48043 2.29289 5.29289C2.48043 5.10536 2.73478 5 3 5H10.18C10.4452 5 10.6996 4.89464 10.8871 4.70711C11.0746 4.51957 11.18 4.26522 11.18 4C11.18 3.73478 11.0746 3.48043 10.8871 3.29289C10.6996 3.10536 10.4452 3 10.18 3H3C2.20435 3 1.44129 3.31607 0.87868 3.87868C0.316071 4.44129 0 5.20435 0 6V17C0 17.7956 0.316071 18.5587 0.87868 19.1213C1.44129 19.6839 2.20435 20 3 20H14C14.7956 20 15.5587 19.6839 16.1213 19.1213C16.6839 18.5587 17 17.7956 17 17V9.82C17 9.55478 16.8946 9.30043 16.7071 9.11289C16.5196 8.92536 16.2652 8.82 16 8.82ZM19.92 0.62C19.8185 0.375651 19.6243 0.181475 19.38 0.0799999C19.2598 0.028759 19.1307 0.00157999 19 0H13C12.7348 0 12.4804 0.105357 12.2929 0.292893C12.1054 0.48043 12 0.734784 12 1C12 1.26522 12.1054 1.51957 12.2929 1.70711C12.4804 1.89464 12.7348 2 13 2H16.59L6.29 12.29C6.19627 12.383 6.12188 12.4936 6.07111 12.6154C6.02034 12.7373 5.9942 12.868 5.9942 13C5.9942 13.132 6.02034 13.2627 6.07111 13.3846C6.12188 13.5064 6.19627 13.617 6.29 13.71C6.38296 13.8037 6.49356 13.8781 6.61542 13.9289C6.73728 13.9797 6.86799 14.0058 7 14.0058C7.13201 14.0058 7.26272 13.9797 7.38458 13.9289C7.50644 13.8781 7.61704 13.8037 7.71 13.71L18 3.41V7C18 7.26522 18.1054 7.51957 18.2929 7.70711C18.4804 7.89464 18.7348 8 19 8C19.2652 8 19.5196 7.89464 19.7071 7.70711C19.8946 7.51957 20 7.26522 20 7V1C19.9984 0.869323 19.9712 0.740222 19.92 0.62Z' },
l: { size: 18, path: 'M 14.398438 7.9375 C 14.160156 7.9375 13.933594 8.03125 13.761719 8.203125 C 13.59375 8.371094 13.5 8.597656 13.5 8.839844 L 13.5 15.300781 C 13.5 15.539062 13.40625 15.769531 13.238281 15.9375 C 13.066406 16.105469 12.839844 16.199219 12.601562 16.199219 L 2.699219 16.199219 C 2.460938 16.199219 2.230469 16.105469 2.0625 15.9375 C 1.894531 15.769531 1.800781 15.539062 1.800781 15.300781 L 1.800781 5.398438 C 1.800781 5.160156 1.894531 4.933594 2.0625 4.761719 C 2.230469 4.59375 2.460938 4.5 2.699219 4.5 L 9.160156 4.5 C 9.402344 4.5 9.628906 4.40625 9.796875 4.238281 C 9.96875 4.066406 10.0625 3.839844 10.0625 3.601562 C 10.0625 3.359375 9.96875 3.132812 9.796875 2.964844 C 9.628906 2.792969 9.402344 2.699219 9.160156 2.699219 L 2.699219 2.699219 C 1.984375 2.699219 1.296875 2.984375 0.789062 3.492188 C 0.285156 3.996094 0 4.683594 0 5.398438 L 0 15.300781 C 0 16.015625 0.285156 16.703125 0.789062 17.210938 C 1.296875 17.714844 1.984375 18 2.699219 18 L 12.601562 18 C 13.316406 18 14.003906 17.714844 14.507812 17.210938 C 15.015625 16.703125 15.300781 16.015625 15.300781 15.300781 L 15.300781 8.839844 C 15.300781 8.597656 15.207031 8.371094 15.035156 8.203125 C 14.867188 8.03125 14.640625 7.9375 14.398438 7.9375 Z M 17.929688 0.558594 C 17.835938 0.339844 17.660156 0.164062 17.441406 0.0703125 C 17.332031 0.0273438 17.21875 0 17.101562 0 L 11.699219 0 C 11.460938 0 11.230469 0.09375 11.0625 0.261719 C 10.894531 0.433594 10.800781 0.660156 10.800781 0.898438 C 10.800781 1.140625 10.894531 1.367188 11.0625 1.535156 C 11.230469 1.707031 11.460938 1.800781 11.699219 1.800781 L 14.929688 1.800781 L 5.660156 11.0625 C 5.578125 11.144531 5.507812 11.246094 5.464844 11.355469 C 5.417969 11.464844 5.394531 11.582031 5.394531 11.699219 C 5.394531 11.820312 5.417969 11.9375 5.464844 12.046875 C 5.507812 12.15625 5.578125 12.253906 5.660156 12.339844 C 5.746094 12.421875 5.84375 12.492188 5.953125 12.535156 C 6.0625 12.582031 6.179688 12.605469 6.300781 12.605469 C 6.417969 12.605469 6.535156 12.582031 6.644531 12.535156 C 6.753906 12.492188 6.855469 12.421875 6.9375 12.339844 L 16.199219 3.070312 L 16.199219 6.300781 C 16.199219 6.539062 16.292969 6.769531 16.464844 6.9375 C 16.632812 7.105469 16.859375 7.199219 17.101562 7.199219 C 17.339844 7.199219 17.566406 7.105469 17.738281 6.9375 C 17.90625 6.769531 18 6.539062 18 6.300781 L 18 0.898438 C 18 0.78125 17.972656 0.667969 17.929688 0.558594 Z M 17.929688 0.558594' },
m: { size: 16, path: 'M 12.796875 7.054688 C 12.585938 7.054688 12.386719 7.140625 12.234375 7.292969 C 12.082031 7.441406 12 7.640625 12 7.859375 L 12 13.601562 C 12 13.8125 11.917969 14.015625 11.765625 14.167969 C 11.613281 14.316406 11.414062 14.398438 11.203125 14.398438 L 2.398438 14.398438 C 2.1875 14.398438 1.984375 14.316406 1.832031 14.167969 C 1.683594 14.015625 1.601562 13.8125 1.601562 13.601562 L 1.601562 4.796875 C 1.601562 4.585938 1.683594 4.386719 1.832031 4.234375 C 1.984375 4.082031 2.1875 4 2.398438 4 L 8.140625 4 C 8.359375 4 8.558594 3.917969 8.707031 3.765625 C 8.859375 3.613281 8.945312 3.414062 8.945312 3.203125 C 8.945312 2.984375 8.859375 2.785156 8.707031 2.636719 C 8.558594 2.484375 8.359375 2.398438 8.140625 2.398438 L 2.398438 2.398438 C 1.765625 2.398438 1.152344 2.652344 0.703125 3.105469 C 0.253906 3.550781 0 4.164062 0 4.796875 L 0 13.601562 C 0 14.234375 0.253906 14.847656 0.703125 15.296875 C 1.152344 15.746094 1.765625 16 2.398438 16 L 11.203125 16 C 11.835938 16 12.449219 15.746094 12.894531 15.296875 C 13.347656 14.847656 13.601562 14.234375 13.601562 13.601562 L 13.601562 7.859375 C 13.601562 7.640625 13.515625 7.441406 13.363281 7.292969 C 13.214844 7.140625 13.015625 7.054688 12.796875 7.054688 Z M 15.9375 0.496094 C 15.855469 0.300781 15.699219 0.144531 15.503906 0.0625 C 15.40625 0.0234375 15.304688 0 15.203125 0 L 10.398438 0 C 10.1875 0 9.984375 0.0820312 9.832031 0.234375 C 9.683594 0.386719 9.601562 0.585938 9.601562 0.796875 C 9.601562 1.015625 9.683594 1.214844 9.832031 1.363281 C 9.984375 1.515625 10.1875 1.601562 10.398438 1.601562 L 13.269531 1.601562 L 5.03125 9.832031 C 4.957031 9.90625 4.894531 9.996094 4.859375 10.09375 C 4.816406 10.191406 4.796875 10.296875 4.796875 10.398438 C 4.796875 10.507812 4.816406 10.609375 4.859375 10.707031 C 4.894531 10.804688 4.957031 10.890625 5.03125 10.96875 C 5.109375 11.042969 5.195312 11.105469 5.292969 11.140625 C 5.390625 11.183594 5.492188 11.203125 5.601562 11.203125 C 5.703125 11.203125 5.808594 11.183594 5.90625 11.140625 C 6.003906 11.105469 6.09375 11.042969 6.167969 10.96875 L 14.398438 2.730469 L 14.398438 5.601562 C 14.398438 5.8125 14.484375 6.015625 14.636719 6.167969 C 14.785156 6.316406 14.984375 6.398438 15.203125 6.398438 C 15.414062 6.398438 15.613281 6.316406 15.765625 6.167969 C 15.917969 6.015625 16 5.8125 16 5.601562 L 16 0.796875 C 16 0.695312 15.976562 0.59375 15.9375 0.496094 Z M 15.9375 0.496094' },
s: { size: 14, path: 'M 11.199219 6.175781 C 11.015625 6.175781 10.835938 6.246094 10.703125 6.378906 C 10.574219 6.511719 10.5 6.6875 10.5 6.875 L 10.5 11.898438 C 10.5 12.085938 10.425781 12.265625 10.296875 12.394531 C 10.164062 12.527344 9.984375 12.601562 9.800781 12.601562 L 2.101562 12.601562 C 1.914062 12.601562 1.734375 12.527344 1.605469 12.394531 C 1.472656 12.265625 1.398438 12.085938 1.398438 11.898438 L 1.398438 4.199219 C 1.398438 4.015625 1.472656 3.835938 1.605469 3.703125 C 1.734375 3.574219 1.914062 3.5 2.101562 3.5 L 7.125 3.5 C 7.3125 3.5 7.488281 3.425781 7.621094 3.296875 C 7.753906 3.164062 7.824219 2.984375 7.824219 2.800781 C 7.824219 2.613281 7.753906 2.4375 7.621094 2.304688 C 7.488281 2.171875 7.3125 2.101562 7.125 2.101562 L 2.101562 2.101562 C 1.542969 2.101562 1.007812 2.320312 0.613281 2.714844 C 0.222656 3.109375 0 3.644531 0 4.199219 L 0 11.898438 C 0 12.457031 0.222656 12.992188 0.613281 13.386719 C 1.007812 13.777344 1.542969 14 2.101562 14 L 9.800781 14 C 10.355469 14 10.890625 13.777344 11.285156 13.386719 C 11.679688 12.992188 11.898438 12.457031 11.898438 11.898438 L 11.898438 6.875 C 11.898438 6.6875 11.828125 6.511719 11.695312 6.378906 C 11.5625 6.246094 11.386719 6.175781 11.199219 6.175781 Z M 13.945312 0.433594 C 13.871094 0.261719 13.738281 0.128906 13.566406 0.0546875 C 13.480469 0.0195312 13.390625 0 13.300781 0 L 9.101562 0 C 8.914062 0 8.734375 0.0742188 8.605469 0.203125 C 8.472656 0.335938 8.398438 0.515625 8.398438 0.699219 C 8.398438 0.886719 8.472656 1.0625 8.605469 1.195312 C 8.734375 1.328125 8.914062 1.398438 9.101562 1.398438 L 11.613281 1.398438 L 4.402344 8.601562 C 4.335938 8.667969 4.285156 8.746094 4.25 8.832031 C 4.214844 8.917969 4.195312 9.007812 4.195312 9.101562 C 4.195312 9.191406 4.214844 9.285156 4.25 9.371094 C 4.285156 9.453125 4.335938 9.53125 4.402344 9.597656 C 4.46875 9.664062 4.546875 9.714844 4.628906 9.75 C 4.714844 9.785156 4.808594 9.804688 4.898438 9.804688 C 4.992188 9.804688 5.082031 9.785156 5.167969 9.75 C 5.253906 9.714844 5.332031 9.664062 5.398438 9.597656 L 12.601562 2.386719 L 12.601562 4.898438 C 12.601562 5.085938 12.671875 5.265625 12.804688 5.394531 C 12.9375 5.527344 13.113281 5.601562 13.300781 5.601562 C 13.484375 5.601562 13.664062 5.527344 13.796875 5.394531 C 13.925781 5.265625 14 5.085938 14 4.898438 L 14 0.699219 C 14 0.609375 13.980469 0.519531 13.945312 0.433594 Z M 13.945312 0.433594' }
};
export default {
name: 'ExternalLink',
props: {
size: {
type: String,
default: 'm',
validator: (value) => ['xxl', 'xl', 'l', 'm', 's'].includes(value)
}
},
computed: {
currentSize () {
return iconInfo[this.size].size;
},
path () {
return iconInfo[this.size].path;
}
}
};
</script>
1 change: 1 addition & 0 deletions src/components/Icons/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,7 @@ export { default as Envelope } from './Envelope';
export { default as EnvelopesBulk } from './EnvelopesBulk';
export { default as Exclamation } from './Exclamation';
export { default as Export } from './Export';
export { default as ExternalLink } from './ExternalLink';
export { default as Eye } from './Eye';
export { default as EyeSlash } from './EyeSlash';
export { default as File } from './File';
Expand Down

0 comments on commit 172d1f8

Please sign in to comment.