@madgex/design-system 6.3.8 → 6.3.10

package/src/components/inputs/input-number/input-number.njk

@@ -1,68 +0,0 @@
-{# VUE VERSION #}
-<h2>Vue</h2>
-
-
-<div id="vue-app">
-  {% raw %}
-    <mds-form-item v-for="(item, index) in examples" 
-        :input-id="`${index}-vue-version`" 
-        :optional="item.optional"
-        :error="item.value ? !!item.error : null" 
-        class="mds-form-element--input" 
-        style="margin-bottom: 50px; width: 230px;" 
-      >
-        <template v-if="item.label" #label>{{item.label}}</template>
-        <template v-if="item.tooltip" #tooltip>{{item.tooltip}}</template>
-        <template v-if="item.value && item.help" #help>{{item.help}}</template>
-        <template v-if="item.value && item.error" #error>{{item.error}}</template>
-      <mds-input-number
-        :id="`${index}-vue-version`"
-        v-model="item.value"
-        :name="item.name"
-        :placeholder="item.placeholder"
-        :error="item.value ? !!item.error : null"
-        :step="item.step" 
-        :min="item.min"
-        :max="item.max"
-        :i18n="item.i18n"
-      />
-    </mds-form-item>
-  {% endraw %}
-</div>
-
-<script type="module" async>
-  {% include '_import-MdsLibrary.njk' %}
-  const { MdsFormItem, MdsInput, MdsInputNumber } = MdsLibrary;
-
-  const app = vue.createApp({
-    components: { MdsFormItem, MdsInput, MdsInputNumber },
-    data() {
-      return {
-        examples: [
-            {label: 'How many JS FE frameworks exist?', name: 'default input', value: null},
-            {label: 'When did time begin?', name: 'stars input', value: 1970, optional: true, min:0, max:2000},
-            {
-              label: 'Expected salary per year',
-              name: 'salary input error',
-              error: 'Sorry, your expected salary is too high',
-              help: "This number is out of our budget",
-              tooltip: "Try working for free",
-              min: 80000,
-              value: null,
-              placeholder: 'e.g. $15000', 
-              step: 100
-            },
-            {
-              label: '¿Cuántos idiomas hablas?',
-              optional: true,
-              name: 'i18n example',
-              min: 1,
-              max: 50,
-              value: null,
-              i18n: {increaseAriaLabel: 'Aumentar', decreaseAriaLabel: 'Reducir'}
-            }
-        ]
-      };
-    },
-  }).mount('#vue-app');
-</script>

package/src/components/inputs/input-number/input-number.scss

@@ -1,60 +0,0 @@
-.mds-input-number {
-  position: relative;
-  display: flex;
-  border: $regular-border;
-  border-radius: $border-radius;
-  background: #fff;
-  padding: 0;
-  color: var(--mds-color-text-base);
-  width: 100%;
-  min-width: var(--mds-size-container-min-width);
-}
-
-.mds-form-element--error .mds-form-control.mds-input-number {
-  padding: 0;
-}
-
-.mds-input-number input {
-  flex: 1;
-  padding: $constant-size-baseline * 3;
-  line-height: inherit;
-  font-size: inherit;
-  color: inherit;
-  border: $regular-border;
-  border-top: none;
-  border-bottom: none;
-  background: none;
-  outline: none;
-  appearance: none;
-  min-width: 0;
-  -webkit-appearance: none;
-  -moz-appearance: textfield;
-
-  &::-webkit-outer-spin-button,
-  &::-webkit-inner-spin-button {
-    appearance: none;
-    -webkit-appearance: none;
-    -moz-appearance: none;
-    margin: 0;
-  }
-}
-
-.mds-input-number button {
-  padding: ($constant-size-baseline * 2) ($constant-size-baseline * 3);
-  border: none;
-  cursor: pointer;
-  background: none;
-  color: inherit;
-  outline: none;
-
-  &:hover,
-  &:focus-within {
-    background: $constant-color-neutral-lightest;
-    color: $link-hover-color;
-  }
-
-  &[aria-disabled='true'] {
-    cursor: not-allowed;
-    opacity: 20%;
-  }
-}

package/tasks/design-system-vue.js

@@ -1,14 +0,0 @@
-const path = require('path');
-const util = require('util');
-const exec = util.promisify(require('child_process').exec);
-
-async function buildDesignSystemVue() {
-  const { stdout, stderr } = await exec('npm run -w @madgex/design-system-vue build', {
-    cwd: path.resolve(__dirname, '../../'),
-  });
-
-  console.log('build:design-system-vue stdout:', stdout);
-  console.log('build:design-system-vue stderr:', stderr);
-}
-
-exports.buildDesignSystemVue = buildDesignSystemVue;